improve codemirror

lib/views/admin/customize.html

@@ -2,6 +2,19 @@
 
 {% block html_title %}カスタマイズ · {% endblock %}
 
+{% block html_additional_headers %}
+  <!-- CodeMirror -->
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/g/codemirror@4.5.0(codemirror.css+addon/hint/show-hint.css)">
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/jquery.ui/1.11.4/jquery-ui.min.css">
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/codemirror/4.5.0/theme/eclipse.css">
+  <style>
+    .CodeMirror {
+      border: 1px solid #eee;
+    }
+  </style>
+{% endblock %}
+
+
 {% block content_head %}
 <div class="header-wrap">
   <header id="page-header">
@@ -118,15 +131,7 @@
   </script>
 
   <!-- CodeMirror -->
-  <link rel="stylesheet" href="https://cdn.jsdelivr.net/g/codemirror@4.5.0(codemirror.css+addon/hint/show-hint.css)">
-  <link rel="stylesheet" href="https://cdn.jsdelivr.net/jquery.ui/1.11.4/jquery-ui.min.css">
-  <link rel="stylesheet" href="https://cdn.jsdelivr.net/codemirror/4.5.0/theme/eclipse.css">
-  <style>
-    .CodeMirror {
-      border: 1px solid #eee;
-    }
-  </style>
-  <script src="https://cdn.jsdelivr.net/g/codemirror@4.5.0(codemirror.min.js+addon/lint/css-lint.js+mode/css/css.js+addon/hint/css-hint.js+addon/hint/show-hint.js+addon/edit/matchbrackets.js),jquery.ui@1.11.4"></script>
+  <script src="https://cdn.jsdelivr.net/g/codemirror@4.5.0(codemirror.min.js+addon/lint/css-lint.js+mode/css/css.js+addon/hint/css-hint.js+addon/hint/show-hint.js+addon/edit/matchbrackets.js+addon/edit/closebrackets.js),jquery.ui@1.11.4"></script>
   <script>
     var editor = CodeMirror.fromTextArea(document.getElementById('taCustomCss'), {
       mode: "css",
@@ -135,8 +140,12 @@
       indentUnit: 2,
       theme: 'eclipse',
       matchBrackets: true,
+      autoCloseBrackets: true,
       extraKeys: {"Ctrl-Space": "autocomplete"},
     });
+    editor.on('change', function(cm, change) {
+      cm.save();
+    });
     // resizable with jquery.ui
     $(editor.getWrapperElement()).resizable({
       resize: function() {