X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/ef5352332e02c2f3a9c9d5cc7594ec8da02cb64e..95e1aff23493b3725d5259bcca7bcc79d7d3bc26:/app/assets/javascripts/richtext.js diff --git a/app/assets/javascripts/richtext.js b/app/assets/javascripts/richtext.js index cfba5c923..56aad8c73 100644 --- a/app/assets/javascripts/richtext.js +++ b/app/assets/javascripts/richtext.js @@ -1,42 +1,35 @@ -$(document).ready(function () { - /* Hide the preview panes */ - $(".richtext_preview").hide(); - +(function () { /* * When the text in an edit pane is changed, clear the contents of * the associated preview pne so that it will be regenerated when * the user next switches to it. */ - $(".richtext_content textarea").change(function () { - $(this).parents(".richtext_container").find(".richtext_preview").empty(); - }); + $(document).on("change", ".richtext_container textarea", function () { + var container = $(this).closest(".richtext_container"); - /* Disable all the edit buttons */ - $(".richtext_doedit").prop("disabled", true); + container.find(".tab-pane[id$='_preview']").empty(); + }); /* - * Install a click handler to switch to edit mode when the - * edit button is pressed. + * Install a handler to set the minimum preview pane height + * when switching away from an edit pane */ - $(".richtext_doedit").click(function () { - var editor = $(this).parents(".richtext_container").find("textarea"); - var preview = $(this).parents(".richtext_container").find(".richtext_preview"); - - preview.hide(); - editor.show(); + $(document).on("hide.bs.tab", ".richtext_container button[data-bs-target$='_edit']", function () { + var container = $(this).closest(".richtext_container"); + var editor = container.find("textarea"); + var preview = container.find(".tab-pane[id$='_preview']"); + var minHeight = editor.outerHeight() - preview.outerHeight() + preview.height(); - $(this).parents(".richtext_container").find(".richtext_dopreview").prop("disabled", false).removeClass("active"); - $(this).prop("disabled", true).addClass("active"); + preview.css("min-height", minHeight + "px"); }); /* - * Install a click handler to switch to preview mode when the - * preview button is pressed. + * Install a handler to switch to preview mode */ - $(".richtext_dopreview").click(function () { - var editor = $(this).parents(".richtext_container").find("textarea"); - var preview = $(this).parents(".richtext_container").find(".richtext_preview"); - var minHeight = editor.outerHeight() - preview.outerHeight() + preview.height(); + $(document).on("show.bs.tab", ".richtext_container button[data-bs-target$='_preview']", function () { + var container = $(this).closest(".richtext_container"); + var editor = container.find("textarea"); + var preview = container.find(".tab-pane[id$='_preview']"); if (preview.contents().length === 0) { preview.oneTime(500, "loading", function () { @@ -48,12 +41,32 @@ $(document).ready(function () { preview.removeClass("loading"); }); } + }); - editor.hide(); - preview.css("min-height", minHeight + "px"); - preview.show(); + $(window).on("resize", updateHelp); - $(this).parents(".richtext_container").find(".richtext_doedit").prop("disabled", false).removeClass("active"); - $(this).prop("disabled", true).addClass("active"); + $(document).on("turbo:load", function () { + $(".richtext_container textarea").on("invalid", invalidTextareaListener); + updateHelp(); }); -}); + + function invalidTextareaListener() { + var container = $(this).closest(".richtext_container"); + + container.find("button[data-bs-target$='_edit']").tab("show"); + } + + function updateHelp() { + $(".richtext_container .richtext_help_sidebar:not(:visible):not(:empty)").each(function () { + var container = $(this).closest(".richtext_container"); + $(this).children().appendTo(container.find(".tab-pane[id$='_help']")); + }); + $(".richtext_container .richtext_help_sidebar:visible:empty").each(function () { + var container = $(this).closest(".richtext_container"); + container.find(".tab-pane[id$='_help']").children().appendTo($(this)); + if (container.find("button[data-bs-target$='_help'].active").length) { + container.find("button[data-bs-target$='_edit']").tab("show"); + } + }); + } +}());