グローバルJavaScript入力欄をAceエディタ化 & jQuery対応 [geoEditor-1-3]
下記記事で紹介したスクリプトの改良版です(v.3)。
- エディタ上部の確定ボタンを廃止しました。自動で変更内容を確定します。
- 保守性を高めるため、スクリプトを全面改訂しました(スクリプトの全体像の説明を冒頭に追加、よく使う要素やメソッドを一括管理するオブジェクト「_reference」を導入、関数の細分化など)。
- 入力中にスクリプトが即時実行されてしまうバグを補正
導入方法
グローバルJavaScript記述欄に、本記事末尾のスクリプトをコピペして、アプレットを保存する。
エディター導入前に、すでにグローバルJavaScript欄にスクリプトを記述している場合は、そのスクリプトを一旦メモ帳などにコピーしておき、エディター導入後に、再びペーストしてください。
ブラウザを更新することで、アプレットを再読み込みすれば、グローバルJavaScript記述欄がJSエディタ化する。
入力後、アプレットを保存して再読み込みすれば、記述したスクリプトが使えるようになる。
デフォルトでは、エラー行番号とエディタ上の行番号が一致しません。
一致させたい場合は、下記スクリプト中「// firstLineNumber: ...」をコメントインしてください。
無効化の方法
①エディタの任意の箇所に「// disable_usiusi」とコメントする(カギカッコ不要) 。
②アプレットを保存する。
③アプレットを再読込して、グローバルJS入力欄が元に戻っていることを確認する。
④グローバルJS入力欄に書かれたスクリプトを全て削除する。これまでエディタに記述したスクリプトを引き続き使用したい場合は、それをグローバルJS入力欄にコピペする。そして、アプレットを保存する。
再導入したい場合
上記ステップ③まで実行した段階で、エディタを再導入したい場合は、グローバルJS入力欄のコメント「// disable_usiusi」を削除して、アプレットを再読み込みしてください。
ステップ④まで実行した段階で、エディタを再導入したい場合は、本記事上述「導入方法」に従って再導入してください。
スクリプト
See the Pen geoEditor-1-3 by うし (@usi_desu) on CodePen.