/* Copyright (c) 2004-2011, The Dojo Foundation All Rights Reserved. Available via Academic Free License >= 2.1 OR the modified BSD license. see: http://dojotoolkit.org/license for details */ if(!dojo._hasResource["dijit._editor.plugins.ViewSource"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code. dojo._hasResource["dijit._editor.plugins.ViewSource"] = true; dojo.provide("dijit._editor.plugins.ViewSource"); dojo.require("dojo.window"); dojo.require("dojo.i18n"); dojo.require("dijit._editor._Plugin"); dojo.require("dijit.form.Button"); dojo.requireLocalization("dijit._editor", "commands", null, "ROOT,ar,ca,cs,da,de,el,es,fi,fr,he,hu,it,ja,kk,ko,nb,nl,pl,pt,pt-pt,ro,ru,sk,sl,sv,th,tr,zh,zh-tw"); dojo.declare("dijit._editor.plugins.ViewSource",dijit._editor._Plugin,{ // summary: // This plugin provides a simple view source capability. When view // source mode is enabled, it disables all other buttons/plugins on the RTE. // It also binds to the hotkey: CTRL-SHIFT-F11 for toggling ViewSource mode. // stripScripts: [public] Boolean // Boolean flag used to indicate if script tags should be stripped from the document. // Defaults to true. stripScripts: true, // stripComments: [public] Boolean // Boolean flag used to indicate if comment tags should be stripped from the document. // Defaults to true. stripComments: true, // stripComments: [public] Boolean // Boolean flag used to indicate if iframe tags should be stripped from the document. // Defaults to true. stripIFrames: true, // readOnly: [const] Boolean // Boolean flag used to indicate if the source view should be readonly or not. // Cannot be changed after initialization of the plugin. // Defaults to false. readOnly: false, // _fsPlugin: [private] Object // Reference to a registered fullscreen plugin so that viewSource knows // how to scale. _fsPlugin: null, toggle: function(){ // summary: // Function to allow programmatic toggling of the view. // For Webkit, we have to focus a very particular way. // when swapping views, otherwise focus doesn't shift right // but can't focus this way all the time, only for VS changes. // If we did it all the time, buttons like bold, italic, etc // break. if(dojo.isWebKit){this._vsFocused = true;} this.button.set("checked", !this.button.get("checked")); }, _initButton: function(){ // summary: // Over-ride for creation of the resize button. var strings = dojo.i18n.getLocalization("dijit._editor", "commands"), editor = this.editor; this.button = new dijit.form.ToggleButton({ label: strings["viewSource"], dir: editor.dir, lang: editor.lang, showLabel: false, iconClass: this.iconClassPrefix + " " + this.iconClassPrefix + "ViewSource", tabIndex: "-1", onChange: dojo.hitch(this, "_showSource") }); // IE 7 has a horrible bug with zoom, so we have to create this node // to cross-check later. Sigh. if(dojo.isIE == 7){ this._ieFixNode = dojo.create("div", { style: { opacity: "0", zIndex: "-1000", position: "absolute", top: "-1000px" } }, dojo.body()); } // Make sure readonly mode doesn't make the wrong cursor appear over the button. this.button.set("readOnly", false); }, setEditor: function(/*dijit.Editor*/ editor){ // summary: // Tell the plugin which Editor it is associated with. // editor: Object // The editor object to attach the print capability to. this.editor = editor; this._initButton(); this.editor.addKeyHandler(dojo.keys.F12, true, true, dojo.hitch(this, function(e){ // Move the focus before switching // It'll focus back. Hiding a focused // node causes issues. this.button.focus(); this.toggle(); dojo.stopEvent(e); // Call the focus shift outside of the handler. setTimeout(dojo.hitch(this, function(){ // We over-ride focus, so we just need to call. this.editor.focus(); }), 100); })); }, _showSource: function(source){ // summary: // Function to toggle between the source and RTE views. // source: boolean // Boolean value indicating if it should be in source mode or not. // tags: // private var ed = this.editor; var edPlugins = ed._plugins; var html; this._sourceShown = source; var self = this; try{ if(!this.sourceArea){ this._createSourceView(); } if(source){ // Update the QueryCommandEnabled function to disable everything but // the source view mode. Have to over-ride a function, then kick all // plugins to check their state. ed._sourceQueryCommandEnabled = ed.queryCommandEnabled; ed.queryCommandEnabled = function(cmd){ var lcmd = cmd.toLowerCase(); if(lcmd === "viewsource"){ return true; }else{ return false; } }; this.editor.onDisplayChanged(); html = ed.get("value"); html = this._filter(html); ed.set("value", html); this._pluginList = []; dojo.forEach(edPlugins, function(p){ // Turn off any plugins not controlled by queryCommandenabled. if(!(p instanceof dijit._editor.plugins.ViewSource)){ p.set("disabled", true) } }); // We actually do need to trap this plugin and adjust how we // display the textarea. if(this._fsPlugin){ this._fsPlugin._getAltViewNode = function(){ return self.sourceArea; }; } this.sourceArea.value = html; var is = dojo._getMarginSize(ed.iframe.parentNode); dojo.marginBox(this.sourceArea, { w: is.w, h: is.h }); dojo.style(ed.iframe, "display", "none"); dojo.style(this.sourceArea, { display: "block" }); var resizer = function(){ // function to handle resize events. // Will check current VP and only resize if // different. var vp = dojo.window.getBox(); if("_prevW" in this && "_prevH" in this){ // No actual size change, ignore. if(vp.w === this._prevW && vp.h === this._prevH){ return; }else{ this._prevW = vp.w; this._prevH = vp.h; } }else{ this._prevW = vp.w; this._prevH = vp.h; } if(this._resizer){ clearTimeout(this._resizer); delete this._resizer; } // Timeout it to help avoid spamming resize on IE. // Works for all browsers. this._resizer = setTimeout(dojo.hitch(this, function(){ delete this._resizer; this._resize(); }), 10); }; this._resizeHandle = dojo.connect(window, "onresize", this, resizer); //Call this on a delay once to deal with IE glitchiness on initial size. setTimeout(dojo.hitch(this, this._resize), 100); //Trigger a check for command enablement/disablement. this.editor.onNormalizedDisplayChanged(); this.editor.__oldGetValue = this.editor.getValue; this.editor.getValue = dojo.hitch(this, function() { var txt = this.sourceArea.value; txt = this._filter(txt); return txt; }); }else{ // First check that we were in source view before doing anything. // corner case for being called with a value of false and we hadn't // actually been in source display mode. if(!ed._sourceQueryCommandEnabled){ return; } dojo.disconnect(this._resizeHandle); delete this._resizeHandle; if(this.editor.__oldGetValue){ this.editor.getValue = this.editor.__oldGetValue; delete this.editor.__oldGetValue; } // Restore all the plugin buttons state. ed.queryCommandEnabled = ed._sourceQueryCommandEnabled; if(!this._readOnly){ html = this.sourceArea.value; html = this._filter(html); ed.beginEditing(); ed.set("value", html); ed.endEditing(); } dojo.forEach(edPlugins, function(p){ // Turn back on any plugins we turned off. p.set("disabled", false); }); dojo.style(this.sourceArea, "display", "none"); dojo.style(ed.iframe, "display", "block"); delete ed._sourceQueryCommandEnabled; //Trigger a check for command enablement/disablement. this.editor.onDisplayChanged(); } // Call a delayed resize to wait for some things to display in header/footer. setTimeout(dojo.hitch(this, function(){ // Make resize calls. var parent = ed.domNode.parentNode; if(parent){ var container = dijit.getEnclosingWidget(parent); if(container && container.resize){ container.resize(); } } ed.resize(); }), 300); }catch(e){ console.log(e); } }, updateState: function(){ // summary: // Over-ride for button state control for disabled to work. this.button.set("disabled", this.get("disabled")); }, _resize: function(){ // summary: // Internal function to resize the source view // tags: // private var ed = this.editor; var tbH = ed.getHeaderHeight(); var fH = ed.getFooterHeight(); var eb = dojo.position(ed.domNode); // Styles are now applied to the internal source container, so we have // to subtract them off. var containerPadding = dojo._getPadBorderExtents(ed.iframe.parentNode); var containerMargin = dojo._getMarginExtents(ed.iframe.parentNode); var extents = dojo._getPadBorderExtents(ed.domNode); var mExtents = dojo._getMarginExtents(ed.domNode); var edb = { w: eb.w - (extents.w + mExtents.w), h: eb.h - (tbH + extents.h + mExtents.h + fH) }; // Fullscreen gets odd, so we need to check for the FS plugin and // adapt. if(this._fsPlugin && this._fsPlugin.isFullscreen){ //Okay, probably in FS, adjust. var vp = dojo.window.getBox(); edb.w = (vp.w - extents.w); edb.h = (vp.h - (tbH + extents.h + fH)); } if(dojo.isIE){ // IE is always off by 2px, so we have to adjust here // Note that IE ZOOM is broken here. I can't get //it to scale right. edb.h -= 2; } // IE has a horrible zoom bug. So, we have to try and account for // it and fix up the scaling. if(this._ieFixNode){ var _ie7zoom = -this._ieFixNode.offsetTop / 1000; edb.w = Math.floor((edb.w + 0.9) / _ie7zoom); edb.h = Math.floor((edb.h + 0.9) / _ie7zoom); } dojo.marginBox(this.sourceArea, { w: edb.w - (containerPadding.w + containerMargin.w), h: edb.h - (containerPadding.h + containerMargin.h) }); // Scale the parent container too in this case. dojo.marginBox(ed.iframe.parentNode, { h: edb.h }); }, _createSourceView: function(){ // summary: // Internal function for creating the source view area. // tags: // private var ed = this.editor; var edPlugins = ed._plugins; this.sourceArea = dojo.create("textarea"); if(this.readOnly){ dojo.attr(this.sourceArea, "readOnly", true); this._readOnly = true; } dojo.style(this.sourceArea, { padding: "0px", margin: "0px", borderWidth: "0px", borderStyle: "none" }); dojo.place(this.sourceArea, ed.iframe, "before"); if(dojo.isIE && ed.iframe.parentNode.lastChild !== ed.iframe){ // There's some weirdo div in IE used for focus control // But is messed up scaling the textarea if we don't config // it some so it doesn't have a varying height. dojo.style(ed.iframe.parentNode.lastChild,{ width: "0px", height: "0px", padding: "0px", margin: "0px", borderWidth: "0px", borderStyle: "none" }); } // We also need to take over editor focus a bit here, so that focus calls to // focus the editor will focus to the right node when VS is active. ed._viewsource_oldFocus = ed.focus; var self = this; ed.focus = function(){ if(self._sourceShown){ self.setSourceAreaCaret(); }else{ try{ if(this._vsFocused){ delete this._vsFocused; // Must focus edit node in this case (webkit only) or // focus doesn't shift right, but in normal // cases we focus with the regular function. dijit.focus(ed.editNode); }else{ ed._viewsource_oldFocus(); } }catch(e){ console.log(e); } } }; var i, p; for(i = 0; i < edPlugins.length; i++){ // We actually do need to trap this plugin and adjust how we // display the textarea. p = edPlugins[i]; if(p && (p.declaredClass === "dijit._editor.plugins.FullScreen" || p.declaredClass === (dijit._scopeName + "._editor.plugins.FullScreen"))){ this._fsPlugin = p; break; } } if(this._fsPlugin){ // Found, we need to over-ride the alt-view node function // on FullScreen with our own, chain up to parent call when appropriate. this._fsPlugin._viewsource_getAltViewNode = this._fsPlugin._getAltViewNode; this._fsPlugin._getAltViewNode = function(){ return self._sourceShown?self.sourceArea:this._viewsource_getAltViewNode(); }; } // Listen to the source area for key events as well, as we need to be able to hotkey toggle // it from there too. this.connect(this.sourceArea, "onkeydown", dojo.hitch(this, function(e){ if(this._sourceShown && e.keyCode == dojo.keys.F12 && e.ctrlKey && e.shiftKey){ this.button.focus(); this.button.set("checked", false); setTimeout(dojo.hitch(this, function(){ed.focus();}), 100); dojo.stopEvent(e); } })); }, _stripScripts: function(html){ // summary: // Strips out script tags from the HTML used in editor. // html: String // The HTML to filter // tags: // private if(html){ // Look for closed and unclosed (malformed) script attacks. html = html.replace(/<\s*script[^>]*>((.|\s)*?)<\\?\/\s*script\s*>/ig, ""); html = html.replace(/<\s*script\b([^<>]|\s)*>?/ig, ""); html = html.replace(/<[^>]*=(\s|)*[("|')]javascript:[^$1][(\s|.)]*[$1][^>]*>/ig, ""); } return html; }, _stripComments: function(html){ // summary: // Strips out comments from the HTML used in editor. // html: String // The HTML to filter // tags: // private if(html){ html = html.replace(//g, ""); } return html; }, _stripIFrames: function(html){ // summary: // Strips out iframe tags from the content, to avoid iframe script // style injection attacks. // html: String // The HTML to filter // tags: // private if(html){ html = html.replace(/<\s*iframe[^>]*>((.|\s)*?)<\\?\/\s*iframe\s*>/ig, ""); } return html; }, _filter: function(html){ // summary: // Internal function to perform some filtering on the HTML. // html: String // The HTML to filter // tags: // private if(html){ if(this.stripScripts){ html = this._stripScripts(html); } if(this.stripComments){ html = this._stripComments(html); } if(this.stripIFrames){ html = this._stripIFrames(html); } } return html; }, setSourceAreaCaret: function(){ // summary: // Internal function to set the caret in the sourceArea // to 0x0 var win = dojo.global; var elem = this.sourceArea; dijit.focus(elem); if(this._sourceShown && !this.readOnly){ if(dojo.isIE){ if(this.sourceArea.createTextRange){ var range = elem.createTextRange(); range.collapse(true); range.moveStart("character", -99999); // move to 0 range.moveStart("character", 0); // delta from 0 is the correct position range.moveEnd("character", 0); range.select(); } }else if(win.getSelection){ if(elem.setSelectionRange){ elem.setSelectionRange(0,0); } } } }, destroy: function(){ // summary: // Over-ride to remove the node used to correct for IE's // zoom bug. if(this._ieFixNode){ dojo.body().removeChild(this._ieFixNode); } if(this._resizer){ clearTimeout(this._resizer); delete this._resizer; } if(this._resizeHandle){ dojo.disconnect(this._resizeHandle); delete this._resizeHandle; } this.inherited(arguments); } }); // Register this plugin. dojo.subscribe(dijit._scopeName + ".Editor.getPlugin",null,function(o){ if(o.plugin){ return; } var name = o.args.name.toLowerCase(); if(name === "viewsource"){ o.plugin = new dijit._editor.plugins.ViewSource({ readOnly: ("readOnly" in o.args)?o.args.readOnly:false, stripComments: ("stripComments" in o.args)?o.args.stripComments:true, stripScripts: ("stripScripts" in o.args)?o.args.stripScripts:true, stripIFrames: ("stripIFrames" in o.args)?o.args.stripIFrames:true }); } }); }