差分
このページの2つのバージョン間の差分を表示します。
両方とも前のリビジョン 前のリビジョン 次のリビジョン | 前のリビジョン | ||
javascript:codemirror [2023/04/09 09:18] – [動作確認] ともやん | javascript:codemirror [2023/04/19 07:52] (現在) – [CodeMirror plugin for DokuWiki] ともやん | ||
---|---|---|---|
行 1069: | 行 1069: | ||
==== 動作確認 ==== | ==== 動作確認 ==== | ||
+ | ===== CodeMirror test 🤔 ===== | ||
<WRAP mincode src>< | <WRAP mincode src>< | ||
- | <div class=" | + | <div class=" |
+ | <link rel=" | ||
+ | <link rel=" | ||
+ | | ||
< | < | ||
- | | + | |
- | | + | |
- | + | | |
- | .dokuwiki pre { | + | |
- | | + | |
} | } | ||
- | .embed_codemirror | + | |
- | | + | |
- | font-size: 11px; | + | |
} | } | ||
- | .select-theme .form-control { width: auto; display: inline-block; | + | |
</ | </ | ||
- | + | | |
- | <!-- <link rel=" | + | |
- | <!-- <link rel=" | + | |
<script src="/ | <script src="/ | ||
<!-- 言語に応じたjsファイルを読み込む --> | <!-- 言語に応じたjsファイルを読み込む --> | ||
<script src="/ | <script src="/ | ||
| | ||
- | <textarea id=" | + | <script> |
- | var jsEditor = CodeMirror.fromTextArea(document.getElementById(' | + | 'use strict'; |
- | mode: " | + | window.CodeMirror5 = CodeMirror; // 5.65.12 を保持 |
- | theme: " | + | // DOMContentLoaded 時に実行 |
- | lineNumbers: | + | document.addEventListener(' |
- | indentUnit: 4 | + | var jsEditor = CodeMirror5.fromTextArea(document.getElementById(' |
- | }); | + | mode: " |
- | </ | + | theme: " |
- | | + | lineNumbers: |
+ | indentUnit: 4 | ||
+ | }).setSize(null, | ||
+ | | ||
+ | |||
+ | var input = document.getElementById("select"); | ||
+ | function selectTheme() { | ||
+ | var theme = input.options[input.selectedIndex].textContent; | ||
+ | editor.setOption(" | ||
+ | location.hash = "#" | ||
+ | } | ||
+ | }); | ||
+ | | ||
| | ||
- | <script> | + | <textarea id=" |
- | var jsEditor = CodeMirror.fromTextArea(document.getElementById(' | + | var jsEditor = CodeMirror.fromTextArea(document.getElementById(' |
mode: " | mode: " | ||
theme: " | theme: " | ||
行 1108: | 行 1119: | ||
indentUnit: 4 | indentUnit: 4 | ||
}).setSize(null, | }).setSize(null, | ||
- | | + | |
- | </script> | + | <div class=" |
+ | <!-- < | ||
+ | <p>CodeMirror | ||
+ | </div> | ||
</ | </ | ||
</ | </ | ||
+ | |||
< | < | ||
- | <div class=" | + | <div class=" |
+ | <link rel=" | ||
+ | <link rel=" | ||
+ | | ||
< | < | ||
- | | + | |
- | | + | |
- | + | | |
- | .dokuwiki pre { | + | |
- | | + | |
} | } | ||
- | .embed_codemirror | + | |
- | | + | |
- | font-size: 11px; | + | |
} | } | ||
- | .select-theme .form-control { width: auto; display: inline-block; | + | |
</ | </ | ||
- | + | | |
- | <!-- <link rel=" | + | |
- | <!-- <link rel=" | + | |
<script src="/ | <script src="/ | ||
<!-- 言語に応じたjsファイルを読み込む --> | <!-- 言語に応じたjsファイルを読み込む --> | ||
<script src="/ | <script src="/ | ||
| | ||
- | < | + | |
- | var jsEditor = CodeMirror.fromTextArea(document.getElementById(' | + | 'use strict'; |
+ | window.CodeMirror5 = CodeMirror; // 5.65.12 を保持 | ||
+ | // DOMContentLoaded 時に実行 | ||
+ | document.addEventListener(' | ||
+ | var jsEditor = CodeMirror5.fromTextArea(document.getElementById(' | ||
+ | mode: " | ||
+ | theme: " | ||
+ | lineNumbers: | ||
+ | indentUnit: 4 | ||
+ | }).setSize(null, | ||
+ | document.getElementById(' | ||
+ | |||
+ | var input = document.getElementById(" | ||
+ | function selectTheme() { | ||
+ | var theme = input.options[input.selectedIndex].textContent; | ||
+ | editor.setOption(" | ||
+ | location.hash = "#" | ||
+ | } | ||
+ | }); | ||
+ | </ | ||
+ | |||
+ | | ||
+ | var jsEditor = CodeMirror.fromTextArea(document.getElementById(' | ||
mode: " | mode: " | ||
theme: " | theme: " | ||
行 1146: | 行 1181: | ||
< | < | ||
</ | </ | ||
- | < | ||
- | var jsEditor = CodeMirror.fromTextArea(document.getElementById(' | ||
- | mode: " | ||
- | theme: " | ||
- | lineNumbers: | ||
- | indentUnit: 4 | ||
- | }).setSize(null, | ||
- | document.getElementById(' | ||
- | | ||
- | var input = document.getElementById(" | ||
- | function selectTheme() { | ||
- | var theme = input.options[input.selectedIndex].textContent; | ||
- | editor.setOption(" | ||
- | location.hash = "#" | ||
- | } | ||
- | </ | ||
</ | </ | ||
< | < | ||
- | document.querySelector(' | + | document.querySelector(' |
</ | </ | ||
</ | </ | ||
行 1171: | 行 1190: | ||
===== CodeMirror plugin for DokuWiki ===== | ===== CodeMirror plugin for DokuWiki ===== | ||
[[https:// | [[https:// | ||
- | ソースコード: | + | ソースコード: |
+ | [[git> | ||
<WRAP color_term> | <WRAP color_term> |