Index: typo3/sysext/rtehtmlarea/htmlarea/htmlarea.js
===================================================================
--- typo3/sysext/rtehtmlarea/htmlarea/htmlarea.js (révision 6629)
+++ typo3/sysext/rtehtmlarea/htmlarea/htmlarea.js (copie de travail)
@@ -794,21 +794,30 @@
* Create the htmlArea iframe and replace the textarea with it.
*/
HTMLArea.prototype.generate = function () {
+ var self = this;
+ // Get the textarea, hide it and make it resizable
+ this.textArea = Ext.get(this._textArea).setVisibilityMode(2).setVisible(false);
+ if (TYPO3.settings.textareaResize) {
+ this.textArea.addClass('resizable');
+ this.textAreaResizer = new Ext.Resizable(this.textArea, {
+ minWidth: 300,
+ minHeight: 200,
+ maxHeight: TYPO3.settings.textareaMaxHeight,
+ dynamic: true
+ });
+ this.textAreaResizer.on('resize', function(ev) { self.resizeOnTextAreaChange(2); });
+ }
- // get the textarea and hide it
- var textarea = this._textArea;
- textarea.style.display = "none";
+ // Create the editor framework and insert it before the textarea
+ this.htmlArea = Ext.DomHelper.insertBefore(this.textArea, {
+ tag: 'div',
+ cls: 'htmlarea'
+ }, true).setWidth(this.textArea.getStyle('width'));
+ this._htmlArea = this.htmlArea.dom;
- // create the editor framework and insert the editor before the textarea
- var htmlarea = document.createElement("div");
- htmlarea.className = "htmlarea";
- htmlarea.style.width = textarea.style.width;
- this._htmlArea = htmlarea;
- textarea.parentNode.insertBefore(htmlarea, textarea);
-
- if(textarea.form) {
- // we have a form, on reset, re-initialize the HTMLArea content and update the toolbar
- var f = textarea.form;
+ // If we have a form, on reset, re-initialize the HTMLArea content and update the toolbar
+ if (this.textArea.dom.form) {
+ var f = this.textArea.dom.form;
if (typeof(f.onreset) == "function") {
var funcref = f.onreset;
if (typeof(f.__msh_prevOnReset) == "undefined") f.__msh_prevOnReset = [];
@@ -818,27 +827,33 @@
HTMLArea._addEvent(f, "reset", HTMLArea.resetHandler);
}
- // create & append the toolbar
+ // Create & append the toolbar
this._createToolbar();
HTMLArea._appendToLog("[HTMLArea::generate]: Toolbar successfully created.");
- // create and append the IFRAME
- var iframe = document.createElement("iframe");
- if (HTMLArea.is_gecko && !HTMLArea.is_safari && !HTMLArea.is_opera) {
- iframe.setAttribute("src", "javascript:void(0);");
- } else {
- iframe.setAttribute("src", (HTMLArea.is_opera?_typo3_host_url:"") + _editor_url + "popups/blank.html");
+ // Create the editor iframe and append it to the toolbar
+ this.iframe = Ext.DomHelper.append(this.htmlArea, {
+ tag: 'iframe',
+ cls: 'editorIframe',
+ src: (HTMLArea.is_gecko && !HTMLArea.is_safari && !HTMLArea.is_opera) ? 'javascript:void(0);' : (HTMLArea.is_opera?_typo3_host_url:'') + _editor_url + 'popups/blank.html'
+ }, true);
+ if (!this.getPluginInstance('StatusBar')) {
+ this.iframe.addClass('noStatusBar');
}
- iframe.className = "editorIframe";
- if (!this.getPluginInstance("StatusBar")) {
- iframe.className += " noStatusBar";
+ this._iframe = this.iframe.dom;
+ HTMLArea._appendToLog("[HTMLArea::generate]: Editor iframe successfully created.");
+ // Make the editor framework resizable
+ if (TYPO3.settings.textareaResize) {
+ this.htmlArea.addClass('resizable');
+ var dimensions = this.getDimensions();
+ this.htmlAreaResizer = new Ext.Resizable(this.htmlArea, {
+ maxHeight: parseInt(TYPO3.settings.textareaMaxHeight) + dimensions.toolbar.height + dimensions.statusbar.height,
+ dynamic: false
+ });
+ this.htmlAreaResizer.on('resize', function(ev) { self.resizeOnHtmlAreaChange(2); });
}
- htmlarea.appendChild(iframe);
- this._iframe = iframe;
- HTMLArea._appendToLog("[HTMLArea::generate]: Editor iframe successfully created.");
if (HTMLArea.is_opera) {
- var self = this;
- this._iframe.onload = function() { self.initIframe(); };
+ this.iframe.on('load', function() { self.initIframe(); } , this);
} else {
this.initIframe();
}
@@ -846,6 +861,58 @@
};
/*
+ * Resize the editor framework and the iframe when the textarea was resized
+ */
+HTMLArea.prototype.resizeOnTextAreaChange = function(diff) {
+ // Set width first as it may change the height of the toolbar and of the statusbar
+ var width = this.textArea.getStyle('width');
+ if (width.indexOf('%') == -1) {
+ width = (parseInt(width) + diff) + 'px';
+ }
+ this.iframe.setStyle('width', HTMLArea.is_opera ? width : '100%');
+ this.htmlArea.setStyle('width', width);
+ // Set height
+ var dimensions = this.getDimensions();
+ var height = this.textArea.getStyle('height');
+ if (height.indexOf('%') == -1) {
+ height = (parseInt(height) + diff) + 'px';
+ }
+ this.iframe.setStyle('height', height);
+ this.htmlArea.setStyle('height', (dimensions.toolbar.height + dimensions.statusbar.height) + 'px');
+};
+
+/*
+ * Resize the textarea and iframe when the htmlArea was resized
+ */
+HTMLArea.prototype.resizeOnHtmlAreaChange = function(diff) {
+ // Set width first as it may change the height of the toolbar and of the statusbar
+ var width = this.htmlArea.getStyle('width');
+ // Do not shrink narrower than configured textarea
+ if (parseInt(width) < this.textAreaResizer.minWidth + diff) {
+ width = (this.textAreaResizer.minWidth + diff) + 'px';
+ this.htmlArea.setStyle('width', width);
+ }
+ if (width.indexOf('%') == -1) {
+ width = (parseInt(width) - diff) + 'px';
+ }
+ this.textArea.setStyle('width', width);
+ // Set height
+ var height = this.iframe.getStyle('height');
+ if (height.indexOf('%') == -1) {
+ var dimensions = this.getDimensions();
+ height = parseInt(this.htmlArea.getStyle('height')) - dimensions.toolbar.height - dimensions.statusbar.height;
+ // Do not shrink shorter than configured textarea
+ if (height < this.textAreaResizer.minHeight + diff) {
+ height = this.textAreaResizer.minHeight + diff;
+ this.htmlArea.setStyle('height', (height + dimensions.toolbar.height + dimensions.statusbar.height) + 'px');
+ }
+ this.iframe.setStyle('height', height + 'px');
+ height = (height - diff) + 'px';
+ }
+ this.textArea.setStyle('height', height);
+};
+
+/*
* Size the iframe according to user's prefs or initial textarea
*/
HTMLArea.prototype.sizeIframe = function(diff) {
@@ -857,7 +924,8 @@
this.config.height = (this.config.height == "auto") ? this._textArea.style.height : this.config.height;
var iframeHeight = this.config.height;
var textareaHeight = this.config.height;
- if (textareaHeight.indexOf("%") == -1) {
+ var htmlAreaHeight = this.config.height;
+ if (this.config.height.indexOf("%") == -1) {
iframeHeight = parseInt(iframeHeight) - diff;
if (this.config.sizeIncludesToolbar) {
this._initialToolbarOffsetHeight = this._initialToolbarOffsetHeight ? this._initialToolbarOffsetHeight : dimensions.toolbar.height;
@@ -867,6 +935,7 @@
if (iframeHeight < 0) {
iframeHeight = 0;
}
+ htmlAreaHeight = (iframeHeight + dimensions.toolbar.height + dimensions.statusbar.height) + 'px';
textareaHeight = (iframeHeight - 4);
if (textareaHeight < 0) {
textareaHeight = 0;
@@ -876,6 +945,7 @@
}
this._iframe.style.height = iframeHeight;
this._textArea.style.height = textareaHeight;
+ this.htmlArea.setStyle('height', htmlAreaHeight);
// Set width
this.config.width = (this.config.width == "auto") ? this._textArea.style.width : this.config.width;
var textareaWidth = this.config.width;
Index: typo3/sysext/rtehtmlarea/htmlarea/plugins/EditorMode/editor-mode.js
===================================================================
--- typo3/sysext/rtehtmlarea/htmlarea/plugins/EditorMode/editor-mode.js (révision 6629)
+++ typo3/sysext/rtehtmlarea/htmlarea/plugins/EditorMode/editor-mode.js (copie de travail)
@@ -158,6 +158,9 @@
case "docnotwellformedmode":
this.textArea.value = this.getHTML();
editor._iframe.style.display = "none";
+ var dimensions = editor.getDimensions();
+ editor.htmlArea.setStyle('height', (dimensions.toolbar.height + dimensions.statusbar.height) + 'px');
+ editor.htmlArea.removeClass('resizable');
this.textArea.style.display = "block";
this.editorMode = "textmode";
break;
@@ -173,6 +176,9 @@
}
this.textArea.style.display = "none";
editor._iframe.style.display = "block";
+ var dimensions = editor.getDimensions();
+ editor.htmlArea.setStyle('height', (parseInt(editor.iframe.getStyle('height')) + dimensions.toolbar.height + dimensions.statusbar.height) + 'px');
+ editor.htmlArea.addClass('resizable');
if (HTMLArea.is_gecko && !HTMLArea.is_safari && !HTMLArea.is_opera) {
editor._doc.designMode = "on";
}
Index: typo3/sysext/rtehtmlarea/htmlarea/skins/default/htmlarea.css
===================================================================
--- typo3/sysext/rtehtmlarea/htmlarea/skins/default/htmlarea.css (révision 6629)
+++ typo3/sysext/rtehtmlarea/htmlarea/skins/default/htmlarea.css (copie de travail)
@@ -3,6 +3,14 @@
background-color:#fff;
margin:0;padding:0;
}
+.resizable {
+ background-color:transparent;
+ padding-right:7px;
+ padding-bottom:6px;
+ background-image: url("images/resize.gif");
+ background-position: bottom right;
+ background-repeat: no-repeat;
+}
.pleasewait {
position:relative;top:0px;text-align:left;
font-size:8pt;
Index: typo3/sysext/rtehtmlarea/htmlarea/skins/default/images/resize.gif
===================================================================
Impossible d'afficher : fichier considéré comme binaire.
svn:mime-type = application/octet-stream
Modification de propriétés sur typo3\sysext\rtehtmlarea\htmlarea\skins\default\images\resize.gif
___________________________________________________________________
Ajouté : svn:mime-type
+ application/octet-stream
Index: typo3/sysext/rtehtmlarea/pi2/class.tx_rtehtmlarea_pi2.php
===================================================================
--- typo3/sysext/rtehtmlarea/pi2/class.tx_rtehtmlarea_pi2.php (révision 6629)
+++ typo3/sysext/rtehtmlarea/pi2/class.tx_rtehtmlarea_pi2.php (copie de travail)
@@ -217,14 +217,24 @@
* LOAD JS, CSS and more
* =======================================
*/
+ $pageRenderer = $GLOBALS['TSFE']->getPageRenderer();
+ $pageRenderer->setBackPath(TYPO3_mainDir);
// Preloading the pageStyle and including RTE skin stylesheets
$this->addPageStyle();
$this->addSkin();
+ $pageRenderer->addCssFile($this->hostURL . '/t3lib/js/extjs/ux/resize.css');
// Loading JavaScript files and code
+ $pageRenderer->loadExtJs();
+ $pageRenderer->addJsFile($this->hostURL . '/t3lib/js/extjs/ux/ext.resizable.js');
if ($this->TCEform->RTEcounter == 1) {
$this->TCEform->additionalJS_pre['rtehtmlarea-loadJScode'] = $this->loadJScode($this->TCEform->RTEcounter);
}
$this->TCEform->additionalJS_initial = $this->loadJSfiles($this->TCEform->RTEcounter);
+ $resizableSettings = array(
+ 'textareaResize' => true,
+ 'textareaMaxHeight' => '600'
+ );
+ $pageRenderer->addInlineSettingArray('', $resizableSettings);
/* =======================================
* DRAW THE EDITOR
Index: typo3/sysext/t3skin/rtehtmlarea/htmlarea.css
===================================================================
--- typo3/sysext/t3skin/rtehtmlarea/htmlarea.css (révision 6629)
+++ typo3/sysext/t3skin/rtehtmlarea/htmlarea.css (copie de travail)
@@ -4,6 +4,14 @@
background-color:#fff;
margin:0;padding:0;
}
+.resizable {
+ background-color:transparent;
+ padding-right:7px;
+ padding-bottom:6px;
+ background-image: url("images/resize.gif");
+ background-position: bottom right;
+ background-repeat: no-repeat;
+}
.pleasewait {
position:relative;top:0px;text-align:left;
font-size:10px;
Index: typo3/sysext/t3skin/rtehtmlarea/images/resize.gif
===================================================================
Impossible d'afficher : fichier considéré comme binaire.
svn:mime-type = application/octet-stream
Modification de propriétés sur typo3\sysext\t3skin\rtehtmlarea\images\resize.gif
___________________________________________________________________
Ajouté : svn:mime-type
+ application/octet-stream