Robin Elfrink wrote:

You might want to wait for an hour or so; after Bratt's comments I looked again at doing it the Web2.0 way and I'm almost there.

Here's a new version of my patch.

There's a new config option, called $rcmail_config['preview']. If set to true, a single click will show the message in a preview pane.

A small number of issues remain:

1. Internet Explorer has a problem with width and height. I tried to set

the 'expression' css attributes from JavaScript but IE gave errors. Can anybody help me to do this from JavaScript:

width: expression((parseInt(document.documentElement.clientWidth)-240)+'px'); height: expression((parseInt(document.documentElement.clientHeight)-125)+'px');

[125 should be replaced with 125 plus mailcontframe.offsetHeight]

2. Clicking on an attachment within the preview pane does nothing. I

have not yet taken time to investigate this.

3. I probably should scroll the preview pane to the top when inserting

new content.

4. The selected message in the message list should be scrolled in to

view. I think I saw something in the DOM docs about that.

Any more comments anybody?

Robin

Index: config/main.inc.php.dist

--- config/main.inc.php.dist (revision 335) +++ config/main.inc.php.dist (working copy) @@ -225,6 +225,9 @@ // list of configuration option names that need to be available in Javascript. $rcmail_config['javascript_config'] = array('read_when_deleted', 'flag_for_deletion');

+// use preview pane +$rcmail_config['preview'] = TRUE;

// end of config file ?> Index: program/include/main.inc =================================================================== --- program/include/main.inc (revision 335) +++ program/include/main.inc (working copy) @@ -1170,6 +1170,7 @@ 'charsetselector' => 'rcmail_charset_selector', 'searchform' => 'rcmail_search_form', 'receiptcheckbox' => 'rcmail_receipt_checkbox',

•    'preview' => 'rcmail_message_preview',
  
     // ADDRESS BOOK
     'addresslist' => 'rcmail_contacts_list',
  

Index: program/js/app.js

--- program/js/app.js (revision 335) +++ program/js/app.js (working copy) @@ -1256,18 +1256,28 @@ this.in_selection_before = false;

 // row was double clicked

• if (this.task=='mail' && this.list_rows && this.list_rows[id].clicked && this.in_selection(id))

• if (this.task=='mail' && this.list_rows) {

•  if (this.env.mailbox==this.env.drafts_mailbox)
  

•  // row was double clicked
  

•  if (this.list_rows[id].clicked && this.in_selection(id))
     {
  

•    this.set_busy(true);
  

•    location.href = this.env.comm_path+'&_action=compose&_draft_uid='+id+'&_mbox='+urlencode(this.env.mailbox);
  

•    if (this.env.mailbox==this.env.drafts_mailbox)
  

•      {
  

•      this.set_busy(true);
  

•      location.href = this.env.comm_path+'&_action=compose&_draft_uid='+id+'&_mbox='+urlencode(this.env.mailbox);
  

•      }
  

•    else
  

•      {
  

•      this.show_message(id);
  

•      }
  

•    return false;
     }
  

•  // row was single clicked
   else
     {
  

•    this.show_message(id);
  

•      if (this.env.preview)
  

•        this.show_preview(id);
     }
  

•  return false;
   }
  

  else if (this.task=='addressbook') {

@@ -1502,6 +1512,29 @@

 return true;  
 };

• // when user clicks on a row

• this.show_preview = function(id, safe)

• {

• var add_url = '';

• var target = window;

• var contentframe = rcube_find_object('mailcontframe');

• var previewpane = rcube_find_object('previewpane');

• if (id && contentframe && previewpane)

•  {
  

•  rcmail.set_busy(true, 'loading');
  

•  if (previewpane.style.display=='none')
  

•    {
  

•    contentframe.style.height = (contentframe.offsetHeight/2) + 'px';
  

•    previewpane.style.top = (contentframe.offsetTop+contentframe.offsetHeight) + 'px';
  

•    previewpane.style.display = 'block';
  

•    }
  

•  var url = '_action=preview&_uid='+id;
  

•  rcmail.http_request('preview', url, true);
  

•  }
  

• };

  // when user doble-clicks on a row

@@ -3569,6 +3602,11 @@ case 'expunge': this.enable_command('select-all', 'select-none', 'expunge', this.env.messagecount ? true : false); break;

•  case 'preview':
  

•    var previewpane = rcube_find_object('previewpane');
  

•    previewpane.innerHTML = request_obj.get_text();
  

•    break;
   }
  
  

  request_obj.reset();

Index: program/steps/mail/show.inc

--- program/steps/mail/show.inc (revision 335) +++ program/steps/mail/show.inc (working copy) @@ -171,6 +171,8 @@

if ($_action=='print') parse_template('printmessage'); +else if ($_action=='preview')

• parse_template('previewmessage');

else parse_template('message'); -?> \ No newline at end of file +?> Index: program/steps/mail/func.inc =================================================================== --- program/steps/mail/func.inc (revision 335) +++ program/steps/mail/func.inc (working copy) @@ -480,6 +480,7 @@ $javascript .= sprintf("%s.set_env('pagecount', %d);\n", $JS_OBJECT_NAME, ceil($message_count/$IMAP->page_size)); $javascript .= sprintf("%s.set_env('sort_col', '%s');\n", $JS_OBJECT_NAME, $sort_col); $javascript .= sprintf("%s.set_env('sort_order', '%s');\n", $JS_OBJECT_NAME, $sort_order);

• $javascript .= sprintf("%s.set_env('preview', '%s');\n", $JS_OBJECT_NAME, $sort_order);

  if ($attrib['messageicon']) $javascript .= sprintf("%s.set_env('messageicon', '%s%s');\n", $JS_OBJECT_NAME, $skin_path, $attrib['messageicon']);

Index: skins/default/mail.css

--- skins/default/mail.css (revision 335) +++ skins/default/mail.css (working copy) @@ -120,7 +120,19 @@ height: expression((parseInt(document.documentElement.clientHeight)-125)+'px'); }

+#previewpane +{

• position: absolute;
• left: 200px;
• right: 40px;
• bottom: 40px;
• border: 1px solid #999999;
• border-top: none;
• background-color: #F9F9F9;
• overflow: auto;

+}

#messagepartframe { border: 1px solid #999999; Index: skins/default/templates/mail.html =================================================================== --- skins/default/templates/mail.html (revision 335) +++ skins/default/templates/mail.html (working copy) @@ -52,6 +52,8 @@ attachmentIcon="/images/icons/attachment.png" />

</div>

+<div id="previewpane" style="display: none;"></div>

<div id="listcontrols"> <roundcube:label name="select" />:&nbsp; <roundcube:button command="select-all" label="all" classAct="active" />&nbsp; Index: skins/default/templates/previewmessage.html =================================================================== --- skins/default/templates/previewmessage.html (revision 0) +++ skins/default/templates/previewmessage.html (revision 0) @@ -0,0 +1,3 @@ +<roundcube:object name="messageHeaders" class="headers-table" cellspacing="0" cellpadding="2" /> +<roundcube:object name="messageAttachments" id="attachment-list" /> +<roundcube:object name="messageBody" id="messagebody" showImages="false" /> Index: index.php =================================================================== --- index.php (revision 335) +++ index.php (working copy) @@ -241,7 +241,7 @@ { include_once('program/steps/mail/func.inc');

• if ($_action=='show' || $_action=='print')

• if ($_action=='show' || $_action=='print' || $_action=='preview') include('program/steps/mail/show.inc');

  if ($_action=='get')