cst1/openstreetmap-website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Convert richtext edit/preview buttons into tabs

Browse source
This commit is contained in:
Anton Khorev 2024-06-07 17:38:03 +03:00
parent 2ba7eab67d
commit ef5352332e
2 changed files with 12 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

11
app/assets/javascripts/richtext.js
View file

@ -14,9 +14,6 @@ $(document).ready(function () {
/* Disable all the edit buttons */ /* Disable all the edit buttons */
$(".richtext_doedit").prop("disabled", true); $(".richtext_doedit").prop("disabled", true);
/* Enable the preview buttons */
$(".richtext_dopreview").prop("disabled", false);
/* /*
* Install a click handler to switch to edit mode when the * Install a click handler to switch to edit mode when the
* edit button is pressed. * edit button is pressed.
@ -28,8 +25,8 @@ $(document).ready(function () {
preview.hide(); preview.hide();
editor.show(); editor.show();
$(this).siblings(".richtext_dopreview").prop("disabled", false); $(this).parents(".richtext_container").find(".richtext_dopreview").prop("disabled", false).removeClass("active");
$(this).prop("disabled", true); $(this).prop("disabled", true).addClass("active");
}); });
/* /*
@ -56,7 +53,7 @@ $(document).ready(function () {
preview.css("min-height", minHeight + "px"); preview.css("min-height", minHeight + "px");
preview.show(); preview.show();
$(this).siblings(".richtext_doedit").prop("disabled", false); $(this).parents(".richtext_container").find(".richtext_doedit").prop("disabled", false).removeClass("active");
$(this).prop("disabled", true); $(this).prop("disabled", true).addClass("active");
}); });
}); });

10
app/views/shared/_richtext_field.html.erb
View file

@ -1,5 +1,13 @@
<div id="<%= id %>_container" class="row richtext_container"> <div id="<%= id %>_container" class="row richtext_container">
<div id="<%= id %>_content" class="col-sm-8 mb-3 mb-sm-0 richtext_content"> <div id="<%= id %>_content" class="col-sm-8 mb-3 mb-sm-0 richtext_content">
<ul class="nav nav-tabs mb-3" role="tablist">
<li class="nav-item">
<button type="button" class="nav-link active richtext_doedit"><%= t(".edit") %></button>
</li>
<li class="nav-item">
<button type="button" class="nav-link richtext_dopreview"><%= t(".preview") %></button>
</li>
</ul>
<%= builder.text_area(attribute, options.merge(:wrapper => false, "data-preview-url" => preview_url(:type => type))) %> <%= builder.text_area(attribute, options.merge(:wrapper => false, "data-preview-url" => preview_url(:type => type))) %>
<div id="<%= id %>_preview" class="richtext_preview richtext text-break"></div> <div id="<%= id %>_preview" class="richtext_preview richtext text-break"></div>
</div> </div>
@ -7,8 +15,6 @@
<div class="card bg-body-tertiary h-100"> <div class="card bg-body-tertiary h-100">
<div class="card-body"> <div class="card-body">
<%= render :partial => "shared/#{type}_help" %> <%= render :partial => "shared/#{type}_help" %>
<%= button_tag t(".edit"), :type => "button", :id => "#{id}_doedit", :class => "richtext_doedit btn btn-primary", :disabled => true %>
<%= button_tag t(".preview"), :type => "button", :id => "#{id}_dopreview", :class => "richtext_dopreview btn btn-primary" %>
</div> </div>
</div> </div>
</div> </div>