goog.editor.plugins

cljs で hello world プラグインを実装する

元ネタ

code:foo/plugin/hello.cljs

(ns foo.plugin.hello

(:import goog.dom.TagName

goog.editor.Plugin))

(defn CljsHelloWorldPlugin []

(this-as this (.call Plugin this)))

(goog/inherits CljsHelloWorldPlugin Plugin)

(set! (.. CljsHelloWorldPlugin -COMMAND) "+cljsHello")

(set! (.. CljsHelloWorldPlugin -prototype -getTrogClassId)

(fn [] "CljsHelloWorld"))

(set! (.. CljsHelloWorldPlugin -prototype -isSupportedCommand)

(= cmd (.. CljsHelloWorldPlugin -COMMAND))))

(set! (.. CljsHelloWorldPlugin -prototype -execCommandInternal)

(this-as this

(let [field (.getFieldObject this)

dom-helper (.getEditableDomHelper field)

range (.getRange field)

;; NOTE: IE以外だと dom-helper ではなく goog.dom で作ったノードも追加できるが

;; IEだと追加に失敗してエラーになるので注意

new-node (.createDom dom-helper (.-SPAN TagName) nil "hello cljs world")]

(.removeContents range)

(.insertNode range new-node false)))))

code:foo/core.cljs

(ns foo.core

(let [field (Field. "your-editor-id")

toolbar (DefaultToolbar.makeToolbar

(js/document.querySelector "#your-toolbar-id"))]

(doto field

(.registerPlugin (hello/CljsHelloWorldPlugin.)))

(ToolbarController. field toolbar)

(.makeEditable field))