]> git.openstreetmap.org Git - rails.git/blob - app/assets/javascripts/richtext.js
Convert richtext edit/preview buttons into tabs
[rails.git] / app / assets / javascripts / richtext.js
1 $(document).ready(function () {
2   /* Hide the preview panes */
3   $(".richtext_preview").hide();
4
5   /*
6    * When the text in an edit pane is changed, clear the contents of
7    * the associated preview pne so that it will be regenerated when
8    * the user next switches to it.
9    */
10   $(".richtext_content textarea").change(function () {
11     $(this).parents(".richtext_container").find(".richtext_preview").empty();
12   });
13
14   /* Disable all the edit buttons */
15   $(".richtext_doedit").prop("disabled", true);
16
17   /*
18    * Install a click handler to switch to edit mode when the
19    * edit button is pressed.
20    */
21   $(".richtext_doedit").click(function () {
22     var editor = $(this).parents(".richtext_container").find("textarea");
23     var preview = $(this).parents(".richtext_container").find(".richtext_preview");
24
25     preview.hide();
26     editor.show();
27
28     $(this).parents(".richtext_container").find(".richtext_dopreview").prop("disabled", false).removeClass("active");
29     $(this).prop("disabled", true).addClass("active");
30   });
31
32   /*
33    * Install a click handler to switch to preview mode when the
34    * preview button is pressed.
35    */
36   $(".richtext_dopreview").click(function () {
37     var editor = $(this).parents(".richtext_container").find("textarea");
38     var preview = $(this).parents(".richtext_container").find(".richtext_preview");
39     var minHeight = editor.outerHeight() - preview.outerHeight() + preview.height();
40
41     if (preview.contents().length === 0) {
42       preview.oneTime(500, "loading", function () {
43         preview.addClass("loading");
44       });
45
46       preview.load(editor.data("previewUrl"), { text: editor.val() }, function () {
47         preview.stopTime("loading");
48         preview.removeClass("loading");
49       });
50     }
51
52     editor.hide();
53     preview.css("min-height", minHeight + "px");
54     preview.show();
55
56     $(this).parents(".richtext_container").find(".richtext_doedit").prop("disabled", false).removeClass("active");
57     $(this).prop("disabled", true).addClass("active");
58   });
59 });