From 3940ba65be1993c4a2c2be4599f53d3018228783 Mon Sep 17 00:00:00 2001
From: alecpl <alec@alec.pl>
Date: Wed, 30 Jun 2010 04:40:39 -0400
Subject: [PATCH] - Resize editor after switching to html mode - create toggle-editor command in app.js, to make possible binding to this command - Code cleanup in rcmail_ui (moved compose-related functions into rcmail_ui)
---
program/js/editor.js | 24 ---
skins/default/functions.js | 258 +++++++++++++++++++++---------------------
skins/default/templates/compose.html | 14 +-
program/js/app.js | 30 ++++
4 files changed, 168 insertions(+), 158 deletions(-)
diff --git a/program/js/app.js b/program/js/app.js
index 3543ed3..a3b2b27 100644
--- a/program/js/app.js
+++ b/program/js/app.js
@@ -225,7 +225,7 @@
}
}
else if (this.env.action == 'compose') {
- this.enable_command('send-attachment', 'remove-attachment', 'send', true);
+ this.enable_command('send-attachment', 'remove-attachment', 'send', 'toggle-editor', true);
if (this.env.spellcheck) {
this.env.spellcheck.spelling_state_observer = function(s){ ref.set_spellcheck_state(s); };
@@ -321,7 +321,7 @@
}
else if (this.env.action=='edit-identity' || this.env.action=='add-identity') {
this.enable_command('add', this.env.identities_level < 2);
- this.enable_command('save', 'delete', 'edit', true);
+ this.enable_command('save', 'delete', 'edit', 'toggle-editor', true);
}
else if (this.env.action=='folders')
this.enable_command('subscribe', 'unsubscribe', 'create-folder', 'rename-folder', 'delete-folder', 'enable-threading', 'disable-threading', true);
@@ -978,7 +978,6 @@
// unified command call (command name == function name)
default:
var func = command.replace('-', '_');
- alert(func);
if (this[func] && typeof this[func] == 'function')
this[func](props);
break;
@@ -2804,6 +2803,30 @@
// move body from html editor to textarea (just to be sure, #1485860)
if (window.tinyMCE && tinyMCE.get(this.env.composebody))
tinyMCE.triggerSave();
+
+ return true;
+ };
+
+ this.toggle_editor = function(props)
+ {
+ if (props.mode == 'html') {
+ this.display_spellcheck_controls(false);
+ this.plain2html($('#'+props.id).val(), props.id);
+ tinyMCE.execCommand('mceAddControl', false, props.id);
+ }
+ else {
+ var thisMCE = tinyMCE.get(props.id),
+ existingHtml = thisMCE.getContent();
+
+ if (existingHtml) {
+ if (!confirm(this.get_label('editorwarning'))) {
+ return false;
+ }
+ this.html2plain(existingHtml, props.id);
+ }
+ tinyMCE.execCommand('mceRemoveControl', false, props.id);
+ this.display_spellcheck_controls(true);
+ }
return true;
};
@@ -5116,3 +5139,4 @@
rcube_webmail.prototype.addEventListener = rcube_event_engine.prototype.addEventListener;
rcube_webmail.prototype.removeEventListener = rcube_event_engine.prototype.removeEventListener;
rcube_webmail.prototype.triggerEvent = rcube_event_engine.prototype.triggerEvent;
+
diff --git a/program/js/editor.js b/program/js/editor.js
index a5e3af3..fd128cb 100644
--- a/program/js/editor.js
+++ b/program/js/editor.js
@@ -95,7 +95,6 @@
// switch html/plain mode
function rcmail_toggle_editor(select, textAreaId, flagElement)
{
- var composeElement = document.getElementById(textAreaId);
var flag, ishtml;
if (select.tagName != 'SELECT')
@@ -103,32 +102,17 @@
else
ishtml = select.value == 'html';
- if (ishtml) {
- rcmail.display_spellcheck_controls(false);
+ var res = rcmail.command('toggle-editor', {id:textAreaId, mode:ishtml?'html':'plain'});
- rcmail.plain2html(composeElement.value, textAreaId);
- tinyMCE.execCommand('mceAddControl', false, textAreaId);
+ if (ishtml) {
// #1486593
setTimeout("rcmail_editor_tabindex();", 500);
if (flagElement && (flag = rcube_find_object(flagElement)))
flag.value = '1';
}
else {
- var thisMCE = tinyMCE.get(textAreaId);
- var existingHtml = thisMCE.getContent();
-
- if (existingHtml) {
- if (!confirm(rcmail.get_label('editorwarning'))) {
- if (select.tagName == 'SELECT')
- select.value = 'html';
- return false;
- }
-
- rcmail.html2plain(existingHtml, textAreaId);
- }
-
- tinyMCE.execCommand('mceRemoveControl', false, textAreaId);
- rcmail.display_spellcheck_controls(true);
+ if (!res && select.tagName == 'SELECT')
+ select.value = 'html';
if (flagElement && (flag = rcube_find_object(flagElement)))
flag.value = '0';
}
diff --git a/skins/default/functions.js b/skins/default/functions.js
index 3a97448..258742e 100644
--- a/skins/default/functions.js
+++ b/skins/default/functions.js
@@ -22,129 +22,7 @@
}
/**
- * Mail Composing
- */
-
-function rcmail_show_header_form(id)
-{
- var row, s,
- link = document.getElementById(id + '-link');
-
- if ((s = rcmail_next_sibling(link)))
- s.style.display = 'none';
- else if ((s = rcmail_prev_sibling(link)))
- s.style.display = 'none';
-
- link.style.display = 'none';
-
- if ((row = document.getElementById('compose-' + id))) {
- var div = document.getElementById('compose-div'),
- headers_div = document.getElementById('compose-headers-div');
- row.style.display = (document.all && !window.opera) ? 'block' : 'table-row';
- div.style.top = (parseInt(headers_div.offsetHeight, 10) + 1) + 'px';
- rcmail_resize_compose_body();
- }
-
- return false;
-}
-
-function rcmail_hide_header_form(id)
-{
- var row, ns,
- link = document.getElementById(id + '-link'),
- parent = link.parentNode,
- links = parent.getElementsByTagName('a');
-
- link.style.display = '';
-
- for (var i=0; i<links.length; i++)
- if (links[i].style.display != 'none')
- for (var j=i+1; j<links.length; j++)
- if (links[j].style.display != 'none')
- if ((ns = rcmail_next_sibling(links[i]))) {
- ns.style.display = '';
- break;
- }
-
- document.getElementById('_' + id).value = '';
-
- if ((row = document.getElementById('compose-' + id))) {
- var div = document.getElementById('compose-div'),
- headers_div = document.getElementById('compose-headers-div');
- row.style.display = 'none';
- div.style.top = (parseInt(headers_div.offsetHeight, 10) + 1) + 'px';
- rcmail_resize_compose_body();
- }
-
- return false;
-}
-
-function rcmail_next_sibling(elm)
-{
- var ns = elm.nextSibling;
- while (ns && ns.nodeType == 3)
- ns = ns.nextSibling;
- return ns;
-}
-
-function rcmail_prev_sibling(elm)
-{
- var ps = elm.previousSibling;
- while (ps && ps.nodeType == 3)
- ps = ps.previousSibling;
- return ps;
-}
-
-function rcmail_init_compose_form()
-{
- var cc_field = document.getElementById('_cc'),
- bcc_field = document.getElementById('_bcc'),
- div = document.getElementById('compose-div'),
- headers_div = document.getElementById('compose-headers-div');
-
- if (cc_field && cc_field.value != '')
- rcmail_show_header_form('cc');
-
- if (bcc_field && bcc_field.value != '')
- rcmail_show_header_form('bcc');
-
- // prevent from form data loss when pressing ESC key in IE
- if (bw.ie) {
- var form = rcube_find_object('form');
- form.onkeydown = function (e) {
- if (rcube_event.get_keycode(e) == 27)
- rcube_event.cancel(e);
- };
- }
-
- $(window).resize(function() {
- rcmail_resize_compose_body();
- });
-
- $('#compose-container').resize(function() {
- rcmail_resize_compose_body();
- });
-
- div.style.top = (parseInt(headers_div.offsetHeight, 10) + 1) + 'px';
- $(window).resize();
-}
-
-function rcmail_resize_compose_body(elem)
-{
- var ed, div = $('#compose-div'), w = div.width(), h = div.height();
- w = w-4;
- h = h-25;
-
- $('#compose-body').width(w-(bw.ie || bw.opera || bw.safari ? 2 : 0)+'px').height(h+'px');
-
- if (window.tinyMCE && tinyMCE.get('compose-body')) {
- $('#compose-body_tbl').width((w+4)+'px').height('');
- $('#compose-body_ifr').width((w+2)+'px').height((h-54)+'px');
- }
-}
-
-/**
- * Mailbox view
+ * Mail UI
*/
function rcube_mail_ui()
@@ -160,7 +38,7 @@
composemenu:'composeoptionsmenu',
uploadform:'attachment-form'
};
-
+
var obj;
for (var k in this.popupmenus) {
obj = $('#'+this.popupmenus[k])
@@ -181,7 +59,7 @@
var pos = $(ref).offset();
obj.css({ left:pos.left, top:(pos.top + (above ? -obj.height() : ref.offsetHeight)) });
}
-
+
obj[show?'show':'hide']();
},
@@ -238,15 +116,15 @@
}
this.searchmenu[show?'show':'hide']();
},
-
+
set_searchmod: function(elem)
{
if (!rcmail.env.search_mods)
rcmail.env.search_mods = {};
-
+
if (!rcmail.env.search_mods[rcmail.env.mailbox])
rcmail.env.search_mods[rcmail.env.mailbox] = rcube_clone_object(rcmail.env.search_mods['*']);
-
+
if (!elem.checked)
delete(rcmail.env.search_mods[rcmail.env.mailbox][elem.value]);
else
@@ -417,9 +295,129 @@
rcmail.show_contentframe(false);
rcmail.http_post('save-pref', '_name=preview_pane&_value=0');
}
+},
+
+/* Message composing */
+init_compose_form: function()
+{
+ var cc_field = document.getElementById('_cc'),
+ bcc_field = document.getElementById('_bcc'),
+ div = document.getElementById('compose-div'),
+ headers_div = document.getElementById('compose-headers-div');
+
+ if (cc_field && cc_field.value != '')
+ rcmail_show_header_form('cc');
+
+ if (bcc_field && bcc_field.value != '')
+ rcmail_show_header_form('bcc');
+
+ // prevent from form data loss when pressing ESC key in IE
+ if (bw.ie) {
+ var form = rcube_find_object('form');
+ form.onkeydown = function (e) {
+ if (rcube_event.get_keycode(e) == 27)
+ rcube_event.cancel(e);
+ };
+ }
+
+ $(window).resize(function() {
+ rcmail_ui.resize_compose_body();
+ });
+
+ $('#compose-container').resize(function() {
+ rcmail_ui.resize_compose_body();
+ });
+
+ div.style.top = (parseInt(headers_div.offsetHeight, 10) + 1) + 'px';
+ $(window).resize();
+},
+
+resize_compose_body: function()
+{
+ var ed, div = $('#compose-div'), w = div.width(), h = div.height();
+ w = w-4;
+ h = h-25;
+
+ $('#compose-body').width(w-(bw.ie || bw.opera || bw.safari ? 2 : 0)+'px').height(h+'px');
+
+ if (window.tinyMCE && tinyMCE.get('compose-body')) {
+ $('#compose-body_tbl').width((w+4)+'px').height('');
+ $('#compose-body_ifr').width((w+2)+'px').height((h-54)+'px');
+ }
+},
+
+show_header_form: function(id)
+{
+ var row, s,
+ link = document.getElementById(id + '-link');
+
+ if ((s = this.next_sibling(link)))
+ s.style.display = 'none';
+ else if ((s = this.prev_sibling(link)))
+ s.style.display = 'none';
+
+ link.style.display = 'none';
+
+ if ((row = document.getElementById('compose-' + id))) {
+ var div = document.getElementById('compose-div'),
+ headers_div = document.getElementById('compose-headers-div');
+ row.style.display = (document.all && !window.opera) ? 'block' : 'table-row';
+ div.style.top = (parseInt(headers_div.offsetHeight, 10) + 1) + 'px';
+ this.resize_compose_body();
+ }
+
+ return false;
+},
+
+hide_header_form: function(id)
+{
+ var row, ns,
+ link = document.getElementById(id + '-link'),
+ parent = link.parentNode,
+ links = parent.getElementsByTagName('a');
+
+ link.style.display = '';
+
+ for (var i=0; i<links.length; i++)
+ if (links[i].style.display != 'none')
+ for (var j=i+1; j<links.length; j++)
+ if (links[j].style.display != 'none')
+ if ((ns = this.next_sibling(links[i]))) {
+ ns.style.display = '';
+ break;
+ }
+
+ document.getElementById('_' + id).value = '';
+
+ if ((row = document.getElementById('compose-' + id))) {
+ var div = document.getElementById('compose-div'),
+ headers_div = document.getElementById('compose-headers-div');
+ row.style.display = 'none';
+ div.style.top = (parseInt(headers_div.offsetHeight, 10) + 1) + 'px';
+ this.resize_compose_body();
+ }
+
+ return false;
+},
+
+next_sibling: function(elm)
+{
+ var ns = elm.nextSibling;
+ while (ns && ns.nodeType == 3)
+ ns = ns.nextSibling;
+ return ns;
+},
+
+prev_sibling: function(elm)
+{
+ var ps = elm.previousSibling;
+ while (ps && ps.nodeType == 3)
+ ps = ps.previousSibling;
+ return ps;
}
};
+
var rcmail_ui;
@@ -436,7 +434,11 @@
rcmail.addEventListener('menu-open', 'open_listmenu', rcmail_ui);
rcmail.addEventListener('menu-save', 'save_listmenu', rcmail_ui);
rcmail.addEventListener('aftersend-attachment', 'show_uploadform', rcmail_ui);
+ rcmail.addEventListener('aftertoggle-editor', 'resize_compose_body', rcmail_ui);
rcmail.gui_object('message_dragmenu', 'dragmessagemenu');
+
+ if (rcmail.env.action == 'compose')
+ rcmail_ui.init_compose_form();
}
}
diff --git a/skins/default/templates/compose.html b/skins/default/templates/compose.html
index 96f771f..bd58603 100644
--- a/skins/default/templates/compose.html
+++ b/skins/default/templates/compose.html
@@ -13,7 +13,7 @@
}
</style>
</head>
-<body onload="rcmail_init_compose_form(); rcube_init_mail_ui()">
+<body onload="rcube_init_mail_ui()">
<roundcube:include file="/includes/taskbar.html" />
<roundcube:include file="/includes/header.html" />
@@ -55,11 +55,11 @@
<roundcube:object name="composeHeaders" part="from" form="form" id="_from" tabindex="1" />
</td>
<td id="formlinks">
- <a href="#cc" onclick="return rcmail_show_header_form('cc')" id="cc-link"><roundcube:label name="addcc" /></a>
+ <a href="#cc" onclick="return rcmail_ui.show_header_form('cc')" id="cc-link"><roundcube:label name="addcc" /></a>
<span class="separator">|</span>
- <a href="#bcc" onclick="return rcmail_show_header_form('bcc')" id="bcc-link"><roundcube:label name="addbcc" /></a>
+ <a href="#bcc" onclick="return rcmail_ui.show_header_form('bcc')" id="bcc-link"><roundcube:label name="addbcc" /></a>
<span class="separator">|</span>
- <a href="#reply-to" onclick="return rcmail_show_header_form('replyto')" id="replyto-link"><roundcube:label name="addreplyto" /></a>
+ <a href="#reply-to" onclick="return rcmail_ui.show_header_form('replyto')" id="replyto-link"><roundcube:label name="addreplyto" /></a>
</td>
</tr><tr>
<td class="title top"><label for="_to"><roundcube:label name="to" /></label></td>
@@ -68,7 +68,7 @@
</td>
</tr><tr id="compose-cc">
<td class="title top">
- <a href="#cc" onclick="return rcmail_hide_header_form('cc');"><img src="/images/icons/minus.gif" alt="" title="<roundcube:label name='delete' />" /></a>
+ <a href="#cc" onclick="return rcmail_ui.hide_header_form('cc');"><img src="/images/icons/minus.gif" alt="" title="<roundcube:label name='delete' />" /></a>
<label for="_cc"><roundcube:label name="cc" /></label>
</td>
<td colspan="2" class="editfield">
@@ -76,7 +76,7 @@
</td>
</tr><tr id="compose-bcc">
<td class="title top">
- <a href="#bcc" onclick="return rcmail_hide_header_form('bcc');"><img src="/images/icons/minus.gif" alt="" title="<roundcube:label name='delete' />" /></a>
+ <a href="#bcc" onclick="return rcmail_ui.hide_header_form('bcc');"><img src="/images/icons/minus.gif" alt="" title="<roundcube:label name='delete' />" /></a>
<label for="_bcc"><roundcube:label name="bcc" /></label>
</td>
<td colspan="2" class="editfield">
@@ -84,7 +84,7 @@
</td>
</tr><tr id="compose-replyto">
<td class="title top">
- <a href="#replyto" onclick="return rcmail_hide_header_form('replyto');"><img src="/images/icons/minus.gif" alt="" title="<roundcube:label name='delete' />" /></a>
+ <a href="#replyto" onclick="return rcmail_ui.hide_header_form('replyto');"><img src="/images/icons/minus.gif" alt="" title="<roundcube:label name='delete' />" /></a>
<label for="_replyto"><roundcube:label name="replyto" /></label>
</td>
<td colspan="2" class="editfield">
--
Gitblit v1.9.1