X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/cb87f02642d0097ebc067ca1f9371dde274a41e3..a05692a3f6f0be293ff73aec04b32fcaf76f97ce:/app/assets/javascripts/richtext.js diff --git a/app/assets/javascripts/richtext.js b/app/assets/javascripts/richtext.js index a5323bc07..0c0a69923 100644 --- a/app/assets/javascripts/richtext.js +++ b/app/assets/javascripts/richtext.js @@ -1,68 +1,74 @@ -$(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(); - }); - - /* Disable all the edit buttons */ - $(".richtext_doedit").prop("disabled", true); + $(document).on("change", ".richtext_container textarea", function () { + var container = $(this).closest(".richtext_container"); + var preview = container.find(".tab-pane[id$='_preview']"); - /* Enable the preview buttons */ - $(".richtext_dopreview").prop("disabled", false); + preview.children(".richtext_placeholder").attr("hidden", true); + preview.children(".richtext").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 (event) { - var editor = $(this).parents(".richtext_container").find("textarea"); - var preview = $(this).parents(".richtext_container").find(".richtext_preview"); - - preview.hide(); - editor.show(); - - $(this).siblings(".richtext_dopreview").prop("disabled", false); - $(this).prop("disabled", true); + $(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(); - event.preventDefault(); + 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 (event) { - var editor = $(this).parents(".richtext_container").find("textarea"); - var preview = $(this).parents(".richtext_container").find(".richtext_preview"); - var width = editor.outerWidth() - preview.outerWidth() + preview.width(); - 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 () { - preview.addClass("loading"); + if (preview.children(".richtext").contents().length === 0) { + preview.oneTime(200, "loading", function () { + preview.children(".richtext_placeholder").removeAttr("hidden"); }); - preview.load(editor.data("previewUrl"), { text: editor.val() }, function () { + preview.children(".richtext").load(editor.data("previewUrl"), { text: editor.val() }, function () { preview.stopTime("loading"); - preview.removeClass("loading"); + preview.children(".richtext_placeholder").attr("hidden", true); }); } + }); - editor.hide(); - preview.width(width); - preview.css("min-height", minHeight + "px"); - preview.show(); - - $(this).siblings(".richtext_doedit").prop("disabled", false); - $(this).prop("disabled", true); + $(window).on("resize", updateHelp); - event.preventDefault(); + $(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"); + } + }); + } +}());