Wednesday, 3 June 2009
Html view plugin for dijit.Editor
« Geokit geocoding with multiple matches | Main | Workaround for an issue with dojo.io.iframe.send »I've searched a bit for a plugin for dijit.Editor able to provide the HTML view of the content but I haven't found anything so I've thought it was a good occasion to try to build a plugin by myself.
Here the code, probably you want to change the module name if you try it:
dojo.provide("pc.widget.editor_html_view");
dojo.require("dijit._editor._Plugin");
dojo.require("dijit.Dialog");
dojo.requireLocalization('pc.widget', 'editor');
dojo.declare("pc.widget.editor_html_view",
dijit._editor._Plugin,
{
// Override _Plugin.useDefaultCommand... processing is handled by this plugin, not by dijit.Editor.
useDefaultCommand: false,
_initButton: function() {
// Override _Plugin._initButton() to setup listener on button click
this.command = "htmlView";
this.editor.commands[this.command] = "HTML";
this.inherited("_initButton", arguments);
delete this.command;
this.connect(this.button, "onClick", this._htmlView);
},
_htmlView: function() {
this._initDialog();
this.textarea.value = this.editor.getValue();
this.dialog.show();
},
_initDialog: function () {
if (!this.dialog) {
this.dialog = new dijit.Dialog({}, dojo.doc.createElement('div'));
var messages = dojo.i18n.getLocalization('pc.widget', 'editor', this.lang);
//var buttonsHtml = '<button>Set</button><button>Set and continue</button>';
var buttonsHtml = dojo.string.substitute('<button>${0}</button><button>${1}</button>', [
messages['Set'], messages['Set_and_continue']
]);
this.dialog.attr('content', '<div class="html-view"><div><textarea></textarea></div><div class="buttons">' + buttonsHtml + '</div></div>');
dojo.body().appendChild(this.dialog.domNode);
this.dialog.startup();
this.textarea = dojo.query("textarea", this.dialog.domNode).pop();
var buttons = dojo.query("button", this.dialog.domNode);
this.setBtn = buttons.pop();
this.setAndHideBtn = buttons.pop();
this.connect(this.setAndHideBtn, 'onclick', this._replaceValueAndHide);
this.connect(this.setBtn, 'onclick', this._replaceValue);
}
},
_replaceValue: function () {
this.editor.replaceValue(this.textarea.value);
},
_replaceValueAndHide: function () {
this._replaceValue();
this.dialog.hide();
}
}
);
// Register this plugin.
dojo.subscribe(dijit._scopeName + ".Editor.getPlugin",null,function(o) {
if(o.plugin){ return; }
switch(o.args.name) {
case "htmlView":
o.plugin = new pc.widget.editor_html_view({command: o.args.name});
}
});
Here you can see it in action:
https://superfluo.org/blojsom-resources/htmlView-dijit.Editor/editor.html
and here you can list and download all files:
https://superfluo.org/blojsom-resources/htmlView-dijit.Editor/
Technorati Tags: dojo toolkit dojo dijit dijit.Editor html view plugin
Posted by at 5:47 PM CEST in devel/
