diff --git a/src/static/css/iframe_editor.css b/src/static/css/iframe_editor.css index b7ece1e66..5b980e74e 100644 --- a/src/static/css/iframe_editor.css +++ b/src/static/css/iframe_editor.css @@ -119,10 +119,8 @@ body.doesWrap > div{ } #innerdocbody { - padding-top: 1px; /* important for some reason? */ - padding-right: 10px; - padding-bottom: 8px; - padding-left: 1px /* prevents characters from looking chopped off in FF3 -- Removed because it added too much whitespace */; + position: absolute; + top: 8px; overflow: hidden; /* blank 1x1 gif, so that IE8 doesn't consider the body transparent */ background-image: url(data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==); diff --git a/src/static/css/pad.css b/src/static/css/pad.css index ff8ab5ab7..de314e172 100644 --- a/src/static/css/pad.css +++ b/src/static/css/pad.css @@ -16,9 +16,6 @@ body, textarea { font-family: Helvetica, Arial, sans-serif } -iframe { - position: absolute -} .readonly .acl-write { display: none; } @@ -217,13 +214,6 @@ li[data-key=showusers] > a #online_count { bottom: 0px; z-index: 1; } -#editorcontainer iframe { - height: 100%; - width: 100%; - padding: 0; - margin: 0; - left: 0; /* Required for safari fixes RTL */ -} #editorloadingbox { padding-top: 100px; padding-bottom: 100px; diff --git a/src/static/js/ace.js b/src/static/js/ace.js index c446939a3..efae37f0d 100644 --- a/src/static/js/ace.js +++ b/src/static/js/ace.js @@ -200,7 +200,6 @@ function Ace2Editor() editor.init = function(containerId, initialCode, doneFunc) { - editor.importText(initialCode); info.onEditorReady = function() @@ -210,126 +209,10 @@ function Ace2Editor() doneFunc(); }; - (function() - { - var doctype = ""; - - var iframeHTML = []; - - iframeHTML.push(doctype); - iframeHTML.push(""); - - // calls to these functions ($$INCLUDE_...) are replaced when this file is processed - // and compressed, putting the compressed code from the named file directly into the - // source here. - // these lines must conform to a specific format because they are passed by the build script: - var includedCSS = []; - var $$INCLUDE_CSS = function(filename) {includedCSS.push(filename)}; - $$INCLUDE_CSS("../static/css/iframe_editor.css"); - $$INCLUDE_CSS("../static/css/pad.css"); - $$INCLUDE_CSS("../static/custom/pad.css"); - - var additionalCSS = _(hooks.callAll("aceEditorCSS")).map(function(path){ return '../static/plugins/' + path }); - includedCSS = includedCSS.concat(additionalCSS); - - pushStyleTagsFor(iframeHTML, includedCSS); - - if (!Ace2Editor.EMBEDED && Ace2Editor.EMBEDED[KERNEL_SOURCE]) { - // Remotely src'd script tag will not work in IE; it must be embedded, so - // throw an error if it is not. - throw new Error("Require kernel could not be found."); - } - - iframeHTML.push(scriptTag( -Ace2Editor.EMBEDED[KERNEL_SOURCE] + '\n\ -require.setRootURI("../javascripts/src");\n\ -require.setLibraryURI("../javascripts/lib");\n\ -require.setGlobalKeyPath("require");\n\ -\n\ -var hooks = require("ep_etherpad-lite/static/js/pluginfw/hooks");\n\ -var plugins = require("ep_etherpad-lite/static/js/pluginfw/client_plugins");\n\ -hooks.plugins = plugins;\n\ -plugins.adoptPluginsFromAncestorsOf(window);\n\ -\n\ -$ = jQuery = require("ep_etherpad-lite/static/js/rjquery").jQuery; // Expose jQuery #HACK\n\ -var Ace2Inner = require("ep_etherpad-lite/static/js/ace2_inner");\n\ -\n\ -plugins.ensure(function () {\n\ - Ace2Inner.init();\n\ -});\n\ -')); - - iframeHTML.push(''); - - hooks.callAll("aceInitInnerdocbodyHead", { - iframeHTML: iframeHTML - }); - - iframeHTML.push(' '); - - // Expose myself to global for my child frame. - var thisFunctionsName = "ChildAccessibleAce2Editor"; - (function () {return this}())[thisFunctionsName] = Ace2Editor; - - var outerScript = '\ -editorId = ' + JSON.stringify(info.id) + ';\n\ -editorInfo = parent[' + JSON.stringify(thisFunctionsName) + '].registry[editorId];\n\ -window.onload = function () {\n\ - window.onload = null;\n\ - setTimeout(function () {\n\ - var iframe = document.createElement("IFRAME");\n\ - iframe.name = "ace_inner";\n\ - iframe.title = "pad";\n\ - iframe.scrolling = "no";\n\ - var outerdocbody = document.getElementById("outerdocbody");\n\ - iframe.frameBorder = 0;\n\ - iframe.allowTransparency = true; // for IE\n\ - outerdocbody.insertBefore(iframe, outerdocbody.firstChild);\n\ - iframe.ace_outerWin = window;\n\ - readyFunc = function () {\n\ - editorInfo.onEditorReady();\n\ - readyFunc = null;\n\ - editorInfo = null;\n\ - };\n\ - var doc = iframe.contentWindow.document;\n\ - doc.open();\n\ - var text = (' + JSON.stringify(iframeHTML.join('\n')) + ');\n\ - doc.write(text);\n\ - doc.close();\n\ - }, 0);\n\ -}'; - - var outerHTML = [doctype, ''] - - var includedCSS = []; - var $$INCLUDE_CSS = function(filename) {includedCSS.push(filename)}; - $$INCLUDE_CSS("../static/css/iframe_editor.css"); - $$INCLUDE_CSS("../static/css/pad.css"); - $$INCLUDE_CSS("../static/custom/pad.css"); - - - var additionalCSS = _(hooks.callAll("aceEditorCSS")).map(function(path){ return '../static/plugins/' + path }); - includedCSS = includedCSS.concat(additionalCSS); - - pushStyleTagsFor(outerHTML, includedCSS); - - // bizarrely, in FF2, a file with no "external" dependencies won't finish loading properly - // (throbs busy while typing) - outerHTML.push('', '', scriptTag(outerScript), '
x
'); - - var outerFrame = document.createElement("IFRAME"); - outerFrame.name = "ace_outer"; - outerFrame.frameBorder = 0; // for IE - outerFrame.title = "Ether"; - info.frame = outerFrame; - document.getElementById(containerId).appendChild(outerFrame); - - var editorDocument = outerFrame.contentWindow.document; - - editorDocument.open(); - editorDocument.write(outerHTML.join('')); - editorDocument.close(); - })(); + var Ace2Inner = require("ep_etherpad-lite/static/js/ace2_inner"); + var editorId = info.id; + var editorInfo = Ace2Editor.registry[editorId]; + Ace2Inner.init(editorInfo); }; return editor; diff --git a/src/static/js/ace2_inner.js b/src/static/js/ace2_inner.js index 555512118..2f3dd9888 100644 --- a/src/static/js/ace2_inner.js +++ b/src/static/js/ace2_inner.js @@ -47,7 +47,7 @@ var isNodeText = Ace2Common.isNodeText, noop = Ace2Common.noop; var hooks = require('./pluginfw/hooks'); -function Ace2Inner(){ +function Ace2Inner(editorInfo){ var makeChangesetTracker = require('./changesettracker').makeChangesetTracker; var colorutils = require('./colorutils').colorutils; @@ -80,13 +80,9 @@ function Ace2Inner(){ var thisAuthor = ''; var disposed = false; - var editorInfo = parent.editorInfo; - - var iframe = window.frameElement; - var outerWin = iframe.ace_outerWin; - iframe.ace_outerWin = null; // prevent IE 6 memory leak - var sideDiv = iframe.nextSibling; - var lineMetricsDiv = sideDiv.nextSibling; + var sideDiv = $('#sidediv')[0]; + var lineMetricsDiv = $('#linemetricsdiv')[0]; + var innerdocbody = $('#innerdocbody')[0]; initLineNumbers(); var outsideKeyDown = noop; @@ -961,7 +957,7 @@ function Ace2Inner(){ setClassPresence(sideDiv, "sidedivhidden", !hasLineNumbers); fixView(); }, - grayedout: setClassPresenceNamed(outerWin.document.body, "grayedout"), + grayedout: setClassPresenceNamed(window.document.body, "grayedout"), dmesg: function(){ dmesg = window.dmesg = value; }, userauthor: function(value){ thisAuthor = String(value); @@ -3263,7 +3259,7 @@ function Ace2Inner(){ function getViewPortTopBottom() { var theTop = getScrollY(); - var doc = outerWin.document; + var doc = window.document; var height = doc.documentElement.clientHeight; return { top: theTop, @@ -3809,7 +3805,7 @@ function Ace2Inner(){ //scrollSelectionIntoView(); scheduler.setTimeout(function() { - outerWin.scrollBy(-100, 0); + window.scrollBy(-100, 0); }, 0); specialHandled = true; } @@ -4721,6 +4717,7 @@ function Ace2Inner(){ function fixView() { + //return; // TODO: look into this later // calling this method repeatedly should be fast if (getInnerWidth() === 0 || getInnerHeight() === 0) { @@ -4740,7 +4737,7 @@ function Ace2Inner(){ if (newSideDivWidth < MIN_LINEDIV_WIDTH) newSideDivWidth = MIN_LINEDIV_WIDTH; iframePadLeft = EDIT_BODY_PADDING_LEFT; if (hasLineNumbers) iframePadLeft += newSideDivWidth + LINE_NUMBER_PADDING_RIGHT; - setIfNecessary(iframe.style, "left", iframePadLeft + "px"); + setIfNecessary(innerdocbody.style, "left", iframePadLeft + "px"); setIfNecessary(sideDiv.style, "width", newSideDivWidth + "px"); for (var i = 0; i < 2; i++) @@ -4752,11 +4749,11 @@ function Ace2Inner(){ if (newHeight < viewHeight) { newHeight = viewHeight; - if (browser.msie) setIfNecessary(outerWin.document.documentElement.style, 'overflowY', 'auto'); + if (browser.msie) setIfNecessary(window.document.documentElement.style, 'overflowY', 'auto'); } else { - if (browser.msie) setIfNecessary(outerWin.document.documentElement.style, 'overflowY', 'scroll'); + if (browser.msie) setIfNecessary(window.document.documentElement.style, 'overflowY', 'scroll'); } if (doesWrap) { @@ -4766,8 +4763,8 @@ function Ace2Inner(){ { if (newWidth < viewWidth) newWidth = viewWidth; } - setIfNecessary(iframe.style, "height", newHeight + "px"); - setIfNecessary(iframe.style, "width", newWidth + "px"); + setIfNecessary(innerdocbody.style, "height", newHeight + "px"); + setIfNecessary(innerdocbody.style, "width", newWidth + "px"); setIfNecessary(sideDiv.style, "height", newHeight + "px"); } if (browser.firefox) @@ -4792,7 +4789,7 @@ function Ace2Inner(){ // if near edge, scroll to edge var scrollX = getScrollX(); var scrollY = getScrollY(); - var win = outerWin; + var win = window; var r = 20; enforceEditability(); @@ -4802,8 +4799,8 @@ function Ace2Inner(){ function getScrollXY() { - var win = outerWin; - var odoc = outerWin.document; + var win = window; + var odoc = window.document; if (typeof(win.pageYOffset) == "number") { return { @@ -4833,17 +4830,17 @@ function Ace2Inner(){ function setScrollX(x) { - outerWin.scrollTo(x, getScrollY()); + window.scrollTo(x, getScrollY()); } function setScrollY(y) { - outerWin.scrollTo(getScrollX(), y); + window.scrollTo(getScrollX(), y); } function setScrollXY(x, y) { - outerWin.scrollTo(x, y); + window.scrollTo(x, y); } var _teardownActions = []; @@ -5077,7 +5074,7 @@ function Ace2Inner(){ function getPageHeight() { - var win = outerWin; + var win = window; var odoc = win.document; if (win.innerHeight && win.scrollMaxY) return win.innerHeight + win.scrollMaxY; else if (odoc.body.scrollHeight > odoc.body.offsetHeight) return odoc.body.scrollHeight; @@ -5086,7 +5083,7 @@ function Ace2Inner(){ function getPageWidth() { - var win = outerWin; + var win = window; var odoc = win.document; if (win.innerWidth && win.scrollMaxX) return win.innerWidth + win.scrollMaxX; else if (odoc.body.scrollWidth > odoc.body.offsetWidth) return odoc.body.scrollWidth; @@ -5095,7 +5092,7 @@ function Ace2Inner(){ function getInnerHeight() { - var win = outerWin; + var win = window; var odoc = win.document; var h; if (browser.opera) h = win.innerHeight; @@ -5109,7 +5106,7 @@ function Ace2Inner(){ function getInnerWidth() { - var win = outerWin; + var win = window; var odoc = win.document; return odoc.documentElement.clientWidth; } @@ -5119,8 +5116,8 @@ function Ace2Inner(){ // requires element (non-text) node; // if node extends above top of viewport or below bottom of viewport (or top of scrollbar), // scroll it the minimum distance needed to be completely in view. - var win = outerWin; - var odoc = outerWin.document; + var win = window; + var odoc = window.document; var distBelowTop = node.offsetTop + iframePadTop - win.scrollY; var distAboveBottom = win.scrollY + getInnerHeight() - (node.offsetTop + iframePadTop + node.offsetHeight); @@ -5136,8 +5133,8 @@ function Ace2Inner(){ function scrollXHorizontallyIntoView(pixelX) { - var win = outerWin; - var odoc = outerWin.document; + var win = window; + var odoc = window.document; pixelX += iframePadLeft; var distInsideLeft = pixelX - win.scrollX; var distInsideRight = win.scrollX + getInnerWidth() - pixelX; @@ -5331,7 +5328,7 @@ function Ace2Inner(){ { lineNumbersShown = 1; sideDiv.innerHTML = '
1
'; - sideDivInner = outerWin.document.getElementById("sidedivinner"); + sideDivInner = window.document.getElementById("sidedivinner"); } function updateLineNumbers() @@ -5377,7 +5374,7 @@ function Ace2Inner(){ if (newNumLines != lineNumbersShown) { var container = sideDivInner; - var odoc = outerWin.document; + var odoc = window.document; var fragment = odoc.createDocumentFragment(); while (lineNumbersShown < newNumLines) { @@ -5457,7 +5454,7 @@ function Ace2Inner(){ scheduler.setTimeout(function() { - parent.readyFunc(); // defined in code that sets up the inner iframe + editorInfo.onEditorReady(); // defined in code that sets up the inner iframe }, 0); isSetUp = true; @@ -5466,7 +5463,7 @@ function Ace2Inner(){ } -exports.init = function () { - var editor = new Ace2Inner() +exports.init = function (editorInfo) { + var editor = new Ace2Inner(editorInfo) editor.init(); }; diff --git a/src/templates/pad.html b/src/templates/pad.html index dd260414e..69479cda9 100644 --- a/src/templates/pad.html +++ b/src/templates/pad.html @@ -41,6 +41,8 @@ <% e.begin_block("styles"); %> + + <% e.begin_block("customStyles"); %> @@ -100,7 +102,13 @@
-
+
+
+
+
x
+
+
 
+

You need a password to access this pad