Koha/koha-tmpl/intranet-tmpl/prog/en/modules/admin/preferences.tt
Owen Leonard 698efcc0aa Bug 21582: Use CodeMirror for *UserJS & *UserCSS
This patch adds CodeMirror syntax highlighting by default to JS and CSS
system preferences. HTML preferences will use CodeMirror editors if
UseWYSIWYGinSystemPreferences is disabled.

Three new CodeMirror files are added to support three new syntax
highlighting modes: XML (for HTML), CSS, and JS.

A new option is added to *.pref file configurations for textareas which
are intended for HTML, JS, or CSS: syntax. This option is passed to the
CodeMirror configuration to control syntax highlighting mode.

Textareas without a syntax option specified will not have CodeMirror
enabled.

To test, apply the patch and go to Administration -> System preferences.

Test the behavior of several preferences which use <textarea> as their
input. For example:

- OPACUserJS (JS)
- IntranetUserCSS (CSS)
- OpacHeader (HTML)
- BibtexExportAdditionalFields (no highlighting)

Text entry in each of these should have the correct syntax highlighting
applied to them. All data should be saved correctly.

Test with UseWYSIWYGinSystemPreferences both on and off.

Signed-off-by: Liz Rea <wizzyrea@gmail.com>
Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io>

Signed-off-by: Nick Clemens <nick@bywatersolutions.com>
2019-04-12 02:28:17 +00:00

219 lines
13 KiB
Text

[% USE raw %]
[% USE Asset %]
[% USE Koha %]
[% SET footerjs = 1 %]
[% INCLUDE 'doc-head-open.inc' %]
<title>Koha &rsaquo; Administration &rsaquo; System preferences</title>
[% INCLUDE 'doc-head-close.inc' %]
[% Asset.css("css/preferences.css") | $raw %]
[% Asset.css("lib/jquery/plugins/multiple-select/multiple-select.css") | $raw %]
[% Asset.css("css/humanmsg.css") | $raw %]
[% Asset.css("lib/codemirror/codemirror.css") | $raw %]
</head>
<body id="admin_preferences" class="admin">
[% INCLUDE 'header.inc' %]
[% INCLUDE 'prefs-admin-search.inc' %]
<div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/admin/admin-home.pl">Administration</a> &rsaquo; System preferences</div>
<div class="main container-fluid">
<div class="row">
<div class="col-sm-10 col-sm-push-2">
<main>
[% IF ( jump_not_found ) %]
<h2>System preferences</h2>
<div class="dialog alert">
Could not find a system preference named <code>[% jumpfield | html %]</code>.
</div>
[% END %]
[% IF ( search_not_found ) %]
<div class="dialog alert">
No system preferences matched your search for: <strong>[% searchfield | html %]</strong>
</div>
[% ELSIF searchfield %]
<h1>You searched for: [% searchfield | html %]</h1>
[% END %]
[% FOREACH TAB IN TABS %]
<div class="prefs-tab">
<h2>[% TAB.tab_title | html %] preferences</h2>
<form action="/cgi-bin/koha/admin/preferences.pl" method="post">
[% UNLESS ( searchfield ) %]<div id="toolbar"><button class="save-all submit" type="submit">Save all [% TAB.tab_title | html %] preferences</button></div>[% END %]
<input type="hidden" name="op" value="save" />
<input type="hidden" name="tab" value="[% TAB.tab_id | html %]" />
[% FOREACH LINE IN TAB.LINES %]
[% IF ( LINE.is_group_title ) %]
[% UNLESS ( loop.first ) %]</tbody></table>[% END %]
<h3>[% LINE.title | html %]</h3>
<table class="preferences">
<thead><tr><th>Preference</th><th>Value</th></tr></thead>
[% UNLESS ( loop.last ) %]<tbody>[% END %]
[% ELSE %]
[% IF ( loop.first ) %]<table class="preferences"><thead><tr><th>Preference</th><th>Value</th></tr></thead><tbody>[% END %]
<tr class="name-row">
<td class="name-cell">
<code>
[% FOREACH NAME IN LINE.NAMES %]
<label for="pref_[% NAME.name | html %]">
[% IF ( NAME.jumped ) %]
<span class="term" id="jumped">[% NAME.name | html %]</span>
[% ELSIF ( NAME.highlighted ) %]
<span class="term">[% NAME.name | html %]</span>
[% ELSE %]
[% NAME.name | html %]
[% END %]
[% IF NAME.overridden %]
<span class="overridden" title="The system preference [% NAME.name | html %] may have been overridden from this value by one or more virtual hosts.">
[Overridden]
</span>
[% END %]
</label>
[% UNLESS ( loop.last ) %]<br />[% END %]
[% END %]
</code>
</td>
<td><div>
[% FOREACH CHUNK IN LINE.CHUNKS %]
[% IF ( CHUNK.type_text ) %]
[% CHUNK.contents | $raw %]
[% ELSIF ( CHUNK.type_input ) %]
<input type="[%IF CHUNK.input_type %][% CHUNK.input_type | html %][% ELSE %]text[% END %]" name="pref_[% CHUNK.name | html %]" id="pref_[% CHUNK.name | html %]" class="preference preference-[% CHUNK.class or "short" | html %]" value="[% CHUNK.value | html %]" autocomplete="off" /> [% IF ( CHUNK.dateinput ) %]<span class="hint">[% INCLUDE 'date-format.inc' %]</span>[% END %]
[% ELSIF ( CHUNK.type_select ) %]
<select name="pref_[% CHUNK.name | html %]" id="pref_[% CHUNK.name | html %]" class="preference preference-[% CHUNK.class or "choice" | html %]">
[% FOREACH CHOICE IN CHUNK.CHOICES.sort('value') %]
[% IF ( CHOICE.selected ) %]
<option value="[% CHOICE.value | html %]" selected="selected">
[% ELSE %]
<option value="[% CHOICE.value | html %]">
[% END %]
[% CHOICE.text | html %]
</option>
[% END %]
</select>
[% ELSIF ( CHUNK.type_multiple ) %]
<select name="pref_[% CHUNK.name | html %]" id="pref_[% CHUNK.name | html %]" class="preference preference-[% CHUNK.class or "choice" | html %]" multiple="multiple">
[% FOREACH CHOICE IN CHUNK.CHOICES %][% IF ( CHOICE.selected ) %]<option value="[% CHOICE.value | html %]" selected="selected">[% ELSE %]<option value="[% CHOICE.value | html %]">[% END %][% CHOICE.text | html %]</option>[% END %]
</select>
[% ELSIF ( CHUNK.type_textarea )%]
[% IF ( CHUNK.syntax == "text/html" && Koha.Preference('UseWYSIWYGinSystemPreferences') ) %]
<textarea name="pref_[% CHUNK.name | html %]" id="pref_[% CHUNK.name | html %]" class="preference preference-[% CHUNK.class or "short" | html %] mce" rows="20" cols="60">[% CHUNK.value | html %]</textarea>
[% ELSE %]
<a class="expand-textarea" id="expand_[% CHUNK.name | html %]" data-target="[% CHUNK.name | html %]" data-syntax="[% CHUNK.syntax | html %]" href="#">Click to edit</a>
<textarea style="display:none" name="pref_[% CHUNK.name | html %]" id="pref_[% CHUNK.name | html %]" class="preference preference-[% CHUNK.class or "short" | html %] codemirror" rows="10" cols="40">[% CHUNK.value | html %]</textarea>
<a class="collapse-textarea" id="collapse_[% CHUNK.name | html %]" data-target="[% CHUNK.name | html %]" data-syntax="[% CHUNK.syntax | html %]" style="display:none" href="#">Click to collapse</br></a>
[% END %]
[% ELSIF ( CHUNK.type_languages ) %]
<ul class="sortable">
[% FOREACH language IN CHUNK.languages %]
[% IF ( language.plural ) %]
<li>
[% IF ( language.native_description ) %]
[% language.native_description | html %]
[% ELSE %]
[% language.rfc4646_subtag | html %]
[% END %]
[% IF language.sublanguages_loop.size > 0 %]
<ul>
[% FOREACH sublanguages_loo IN language.sublanguages_loop %]
<li>
<label for="pref_[% CHUNK.name | html %]_[% sublanguages_loo.rfc4646_subtag | html %]">[% sublanguages_loo.native_description | html %] [% sublanguages_loo.script_description | html %] [% sublanguages_loo.region_description | html %] [% sublanguages_loo.variant_description | html %]([% sublanguages_loo.rfc4646_subtag | html %])</label>
[% IF ( sublanguages_loo.enabled ) %]
<input value="[% sublanguages_loo.rfc4646_subtag | html %]" name="pref_[% CHUNK.name | html %]" id="pref_[% CHUNK.name | html %]_[% sublanguages_loo.rfc4646_subtag | html %]" type="checkbox" checked="checked" class="preference preference-checkbox"/>
[% ELSE %]
<input value="[% sublanguages_loo.rfc4646_subtag | html %]" name="pref_[% CHUNK.name | html %]" id="pref_[% CHUNK.name | html %]_[% sublanguages_loo.rfc4646_subtag | html %]" type="checkbox" class="preference preference-checkbox"/>
[% END %]
</li>
[% END # FOREACH sublanguages %]
</ul>
[% END %]
</li>
[% ELSE %]
<li>
<label for="pref_[% CHUNK.name | html %]_[% language.rfc4646_subtag | html %]">[% language.native_description | html %] ([% language.rfc4646_subtag | html %])</label>
[% IF ( language.group_enabled ) %]
<input value="[% language.rfc4646_subtag | html %]" name="pref_[% CHUNK.name | html %]" id="pref_[% CHUNK.name | html %]_[% language.rfc4646_subtag | html %]" type="checkbox" checked="checked" class="preference preference-checkbox"/>
[% ELSE %]
<input value="[% language.rfc4646_subtag | html %]" name="pref_[% CHUNK.name | html %]" id="pref_[% CHUNK.name | html %]_[% language.rfc4646_subtag | html %]" type="checkbox" class="preference preference-checkbox"/>
[% END %]
</li>
[% END # IF language.plural %]
[% END # FOREACH language %]
</ul> <!-- / ul.sortable -->
[% END %]
[% END %]
</div></td>
</tr>
[% IF ( loop.last ) %]</tbody></table>[% END %]
[% END %]
[% END %]
<fieldset class="action"><button class="save-all submit" type="submit">Save all [% TAB.tab_title | html %] preferences</button> <a href="/cgi-bin/koha/admin/preferences.pl" class="force_reload cancel">Cancel</a></fieldset>
</form>
</div>
[% END %]
</main>
</div> <!-- /.col-sm-10.col-sm-push-2 -->
<div class="col-sm-2 col-sm-pull-10">
<aside>
[% INCLUDE 'prefs-menu.inc' %]
</aside>
</div> <!-- /.col-sm-2.col-sm-pull-10 -->
</div> <!-- /.row -->
[% MACRO jsinclude BLOCK %]
[% INCLUDE 'datatables.inc' %]
[% Asset.js("lib/hc-sticky.js") | $raw %]
[% Asset.js("lib/jquery/plugins/multiple-select/jquery.multiple.select.js") | $raw %]
[% Asset.js( "lib/codemirror/codemirror-compressed.js" ) | $raw %]
[% Asset.js( "lib/codemirror/css.min.js" ) | $raw %]
[% Asset.js( "lib/codemirror/javascript.min.js" ) | $raw %]
[% Asset.js( "lib/codemirror/xml.min.js" ) | $raw %]
<script>
var Sticky;
$(document).ready(function(){
[% UNLESS ( searchfield ) %]
Sticky = $("#toolbar");
Sticky.hcSticky({
stickTo: "main",
stickyClass: "floating"
});
[% END %]
$("select[multiple='multiple']").multipleSelect( {
placeholder: _("Please select ..."),
selectAllText: _("Select all"),
allSelected: _("All selected"),
countSelected: _("# of % selected"),
noMatchesFound: _("No matches found")
} );
$(".force_reload").on("click",function(e){
e.preventDefault();
window.location.reload(true);
});
});
// This is here because of its dependence on template variables, everything else should go in js/pages/preferences.js - jpw
var to_highlight = "[% searchfield |replace("'", "\'") |replace('"', '\"') |replace('\n', '\\n') |replace('\r', '\\r') | html %]";
var search_jumped = [% IF ( search_jumped ) %]true[% ELSE %]false[% END %];
var MSG_NOTHING_TO_SAVE = _("Nothing to save");
var MSG_SAVING = _("Saving...");
var MSG_SAVED_PREFERENCE = _("Saved preference %s");
var MSG_MODIFIED = _("modified");
var MSG_MADE_CHANGES = _("You have made changes to system preferences.");
var MSG_CLICK_TO_EXPAND = _("Click to expand this section");
var MSG_CLICK_TO_COLLAPSE = _("Click to collapse this section");
var MSG_INTERNAL_SERVER_ERROR = _( "Internal Server Error, please reload the page" );
var MSG_SESSION_TIMED_OUT = _( "You need to log in again, your session has timed out" );
var MSG_DATA_NOT_SAVED = _( "Error; your data might not have been saved" );
var MSG_LOADING = _( "Loading..." );
</script>
[% Asset.js("lib/jquery/plugins/humanmsg.js") | $raw %]
[% Asset.js("js/ajax.js") | $raw %]
[% Asset.js("js/pages/preferences.js") | $raw %]
[%# Add WYSIWYG editor for htmlarea system preferences %]
[% INCLUDE 'wysiwyg-systempreferences.inc' %]
[% END %]
[% INCLUDE 'intranet-bottom.inc' %]