refs #259: Feature: Custom Header

WIP
show custom html editor

lib/routes/index.js

@@ -73,6 +73,7 @@ module.exports = function(crowi, app) {
   app.get('/admin/customize'                , loginRequired(crowi, app) , middleware.adminRequired() , admin.customize.index);
   app.post('/_api/admin/customize/css'      , loginRequired(crowi, app) , middleware.adminRequired() , csrf, form.admin.customcss, admin.api.customizeSetting);
   app.post('/_api/admin/customize/script'   , loginRequired(crowi, app) , middleware.adminRequired() , csrf, form.admin.customscript, admin.api.customizeSetting);
+  app.post('/_api/admin/customize/html'     , loginRequired(crowi, app) , middleware.adminRequired() , csrf, form.admin.customhtml, admin.api.customizeSetting);
   app.post('/_api/admin/customize/behavior' , loginRequired(crowi, app) , middleware.adminRequired() , csrf, form.admin.custombehavior, admin.api.customizeSetting);
   app.post('/_api/admin/customize/layout'   , loginRequired(crowi, app) , middleware.adminRequired() , csrf, form.admin.customlayout, admin.api.customizeSetting);
   app.post('/_api/admin/customize/features' , loginRequired(crowi, app) , middleware.adminRequired() , csrf, form.admin.customfeatures, admin.api.customizeSetting);

lib/views/admin/customize.html

@@ -284,11 +284,56 @@
       </fieldset>
       </form>
 
+      <form action="/_api/admin/customize/html" method="post" class="form-horizontal" id="cutomhtmlSettingForm" role="form">
+      <fieldset>
+        <legend>カスタムHTML</legend>
+
+        <p class="well">
+          システム全体に適用されるHTMLを記述できます。<br>
+          変更の反映はページの更新が必要です。
+        </p>
+
+        <p class="help-block">
+          Available Placeholders:
+          <dl class="dl-horizontal">
+            <dt><code>crowi</code></dt>
+            <dd>Crowi context instance</dd>
+            <dt><code>Crowi</code></dt>
+            <dd>Crowi legacy instance (jQuery based)</dd>
+            <dt><code>crowiRenderer</code></dt>
+            <dd>Crowi Renderer instance</dd>
+            <dt><code>crowiPlugin</code></dt>
+            <dd>crowi-plus plugin manager instance</dd>
+          </dl>
+        </p>
+
+        <div class="form-group">
+          <div class="col-xs-12">
+            <div id="custom-html-editor"></div>
+            <input type="hidden" id="inputCustomHtml" name="settingForm[customize:script]" value="{{ settingForm['customize:script'] }}">
+          </div>
+          <div class="col-xs-12">
+            <p class="help-block text-right">
+              <i class="fa fa-fw fa-keyboard-o" aria-hidden="true"></i>
+              Ctrl+Space でコード補完
+            </p>
+          </div>
+        </div>
+
+        <div class="form-group">
+          <div class="col-xs-offset-5 col-xs-6">
+            <input type="hidden" name="_csrf" value="{{ csrf() }}">
+            <button type="submit" class="btn btn-primary">更新</button>
+          </div>
+        </div>
+
+      </fieldset>
+      </form>
     </div>
   </div>
 
   <script>
-    $('#cutomcssSettingForm, #cutomscriptSettingForm, #cutomlayoutSettingForm, #cutombehaviorSettingForm, #customfeaturesSettingForm').each(function() {
+    $('#cutomcssSettingForm, #cutomscriptSettingForm, #cutomlayoutSettingForm, #cutombehaviorSettingForm, #customfeaturesSettingForm, #cutomhtmlSettingForm').each(function() {
       $(this).submit(function()
       {
         function showMessage(formId, msg, status) {

resource/js/app.js

@@ -191,6 +191,16 @@ if (customScriptEditorElem != null) {
     customScriptEditorElem
   )
 }
+const customHtmlEditorElem = document.getElementById('custom-html-editor');
+if (customHtmlEditorElem != null) {
+  // get input[type=hidden] element
+  const customHtmlInputElem = document.getElementById('inputCustomHtml');
+
+  ReactDOM.render(
+    <CustomScriptEditor inputElem={customHtmlInputElem} />,
+    customHtmlEditorElem
+  )
+}
 
 // うわーもうー
 $('a[data-toggle="tab"][href="#revision-history"]').on('show.bs.tab', function() {