Skip to content

Commit

Permalink
Widescreen layout aka three column view (#5093)
Browse files Browse the repository at this point in the history
  • Loading branch information
@alecpl
alecpl committed Sep 17, 2016
1 parent 650ac8b commit 6886a4d
Show file tree
Hide file tree
Showing 22 changed files with 673 additions and 266 deletions.
9 changes: 6 additions & 3 deletions config/defaults.inc.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -643,7 +643,7 @@
$config['message_sort_order'] = 'DESC';

// These cols are shown in the message list. Available cols are:
// subject, from, to, fromto, cc, replyto, date, size, status, flag, attachment, 'priority'
// subject, from, to, fromto, cc, replyto, date, size, status, flag, attachment, priority
$config['list_cols'] = array('subject', 'status', 'fromto', 'date', 'size', 'flag', 'attachment');

// the default locale setting (leave empty for auto-detection)
Expand Down Expand Up @@ -1067,8 +1067,11 @@
// save compose message every 300 seconds (5min)
$config['draft_autosave'] = 300;

// default setting if preview pane is enabled
$config['preview_pane'] = false;
// Interface layout. Default: 'widescreen'.
// 'widescreen' - three columns
// 'desktop' - two columns, preview on bottom
// 'list' - two columns, no preview
$config['layout'] = 'widescreen';

// Mark as read when viewed in preview pane (delay in seconds)
// Set to -1 if messages in preview pane should not be marked as read
Expand Down
12 changes: 0 additions & 12 deletions installer/config.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,6 @@
'auto_create_user' => 1,
'smtp_log' => 1,
'prefer_html' => 1,
'preview_pane' => 1,
'debug_level' => 1,
);

Expand Down Expand Up @@ -598,17 +597,6 @@
<label for="cfghtmlview">Prefer displaying HTML messages</label><br />
</dd>

<dt class="propname">preview_pane <span class="userconf">*</span></dt>
<dd>
<?php

$check_prevpane = new html_checkbox(array('name' => '_preview_pane', 'id' => "cfgprevpane", 'value' => 1));
echo $check_prevpane->show(intval($RCI->getprop('preview_pane')));

?>
<label for="cfgprevpane">If preview pane is enabled</label><br />
</dd>

<dt class="propname">htmleditor <span class="userconf">*</span></dt>
<dd>
<label for="cfghtmlcompose">Compose HTML formatted messages</label>
Expand Down
2 changes: 1 addition & 1 deletion program/include/rcmail_install.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ class rcmail_install
public $bool_config_props = array();

public $local_config = array('db_dsnw', 'default_host', 'support_url', 'des_key', 'plugins');
public $obsolete_config = array('db_backend', 'db_max_length', 'double_auth');
public $obsolete_config = array('db_backend', 'db_max_length', 'double_auth', 'preview_pane');
public $replaced_config = array(
'skin_path' => 'skin',
'locale_string' => 'language',
Expand Down
67 changes: 63 additions & 4 deletions program/js/app.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -215,6 +215,12 @@ function rcube_webmail()
this.enable_command('list', 'checkmail', 'add-contact', 'search', 'reset-search', 'collapse-folder', 'import-messages', true);

if (this.gui_objects.messagelist) {
this.env.widescreen_list_template = [
{className: 'threads', cells: ['threads']},
{className: 'subject', cells: ['fromto', 'date', 'status', 'subject']},
{className: 'flags', cells: ['flag', 'attachment']}
];

this.message_list = new rcube_list_widget(this.gui_objects.messagelist, {
multiselect:true, multiexpand:true, draggable:true, keyboard:true,
column_movable:this.env.col_movable, dblclick_time:this.dblclick_time
Expand Down Expand Up @@ -2141,7 +2147,7 @@ function rcube_webmail()
}

expando = '<div id="rcmexpando' + row.id + '" class="' + (message.expanded ? 'expanded' : 'collapsed') + '">&nbsp;&nbsp;</div>';
row_class += ' thread' + (message.expanded? ' expanded' : '');
row_class += ' thread' + (message.expanded ? ' expanded' : '');
}

if (flags.unread_children && flags.seen && !message.expanded)
Expand Down Expand Up @@ -2211,8 +2217,6 @@ function rcube_webmail()
else if (c == 'threads')
html = expando;
else if (c == 'subject') {
if (bw.ie)
col.events.mouseover = function() { rcube_webmail.long_subject_title_ex(this); };
html = tree + cols[c];
}
else if (c == 'priority') {
Expand All @@ -2233,6 +2237,9 @@ function rcube_webmail()
row.cols.push(col);
}

if (this.env.layout == 'widescreen')
row = this.widescreen_message_row(row, uid, message);

list.insert_row(row, attop);

// remove 'old' row
Expand All @@ -2243,6 +2250,52 @@ function rcube_webmail()
}
};

// Converts standard message list record into "widescreen" (3-column) layout
this.widescreen_message_row = function(row, uid, message)
{
var domrow = document.createElement('tr');

domrow.id = row.id;
domrow.uid = row.uid;
domrow.className = row.className;
if (row.style) $.extend(domrow.style, row.style);

$.each(this.env.widescreen_list_template, function() {
if (!ref.env.threading && this.className == 'threads')
return;

var i, n, e, col, domcol,
domcell = document.createElement('td');

if (this.className) domcell.className = this.className;

for (i=0; this.cells && i < this.cells.length; i++) {
for (n=0; row.cols && n < row.cols.length; n++) {
if (this.cells[i] == row.cols[n].className) {
col = row.cols[n];
domcol = document.createElement('span');
domcol.className = this.cells[i];
if (this.className == 'subject' && domcol.className != 'subject')
domcol.className += ' skip-on-drag';
if (col.innerHTML)
domcol.innerHTML = col.innerHTML;
domcell.appendChild(domcol);
break;
}
}
}

domrow.appendChild(domcell);
});

if (this.env.threading && message.depth) {
$('td.subject', domrow).attr('style', 'padding-left:' + Math.min(90, message.depth * 15) + 'px !important');
$('span.branch', domrow).remove();
}

return domrow;
};

this.set_list_sorting = function(sort_col, sort_order)
{
var sort_old = this.env.sort_col == 'arrival' ? 'date' : this.env.sort_col,
Expand All @@ -2260,7 +2313,7 @@ function rcube_webmail()
this.env.sort_order = sort_order;
};

this.set_list_options = function(cols, sort_col, sort_order, threads)
this.set_list_options = function(cols, sort_col, sort_order, threads, layout)
{
var update, post_data = {};

Expand All @@ -2279,6 +2332,12 @@ function rcube_webmail()
post_data._threads = threads;
}

if (layout && this.env.layout != layout) {
this.triggerEvent('layout-change', {old_layout: this.env.layout, new_layout: layout});
update = 1;
this.env.layout = post_data._layout = layout;
}

if (cols && cols.length) {
// make sure new columns are added at the end of the list
var i, idx, name, newcols = [], oldcols = this.env.listcols;
Expand Down
18 changes: 11 additions & 7 deletions program/js/list.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -356,20 +356,24 @@ insert_row: function(row, before)
// create a real dom node first
if (row.nodeName === undefined) {
// for performance reasons use DOM instead of jQuery here
var domrow = document.createElement(this.row_tagname());
var i, e, domcell, col,
domrow = document.createElement(this.row_tagname());

if (row.id) domrow.id = row.id;
if (row.uid) domrow.uid = row.uid;
if (row.className) domrow.className = row.className;
if (row.style) $.extend(domrow.style, row.style);

for (var e, domcell, col, i=0; row.cols && i < row.cols.length; i++) {
for (i=0; row.cols && i < row.cols.length; i++) {
col = row.cols[i];
domcell = document.createElement(this.col_tagname());
if (col.className) domcell.className = col.className;
if (col.innerHTML) domcell.innerHTML = col.innerHTML;
for (e in col.events)
domcell['on' + e] = col.events[e];
domcell = col.dom;
if (!domcell) {
domcell = document.createElement(this.col_tagname());
if (col.className) domcell.className = col.className;
if (col.innerHTML) domcell.innerHTML = col.innerHTML;
for (e in col.events)
domcell['on' + e] = col.events[e];
}
domrow.appendChild(domcell);
}

Expand Down
4 changes: 4 additions & 0 deletions program/localization/en_US/labels.inc
View file
Original file line number Diff line number Diff line change
Expand Up @@ -199,6 +199,10 @@ $labels['listcolumns'] = 'List columns';
$labels['listsorting'] = 'Sorting column';
$labels['listorder'] = 'Sorting order';
$labels['listmode'] = 'List view mode';
$labels['layout'] = 'Layout';
$labels['layoutwidescreen'] = 'Widescreen';
$labels['layoutdesktop'] = 'Desktop';
$labels['layoutlist'] = 'List';

$labels['folderactions'] = 'Folder actions...';
$labels['compact'] = 'Compact';
Expand Down
66 changes: 48 additions & 18 deletions program/steps/mail/func.inc
View file
Original file line number Diff line number Diff line change
Expand Up @@ -84,6 +84,7 @@ if (empty($RCMAIL->action) || $RCMAIL->action == 'list') {
$OUTPUT->set_env('threads', $threading || $RCMAIL->storage->get_capability('THREAD'));
$OUTPUT->set_env('reply_all_mode', (int) $RCMAIL->config->get('reply_all_mode'));
$OUTPUT->set_env('preview_pane_mark_read', (int) $RCMAIL->config->get('preview_pane_mark_read'));
$OUTPUT->set_env('layout', $RCMAIL->config->get('layout') ?: 'widescreen');

if ($RCMAIL->storage->get_capability('QUOTA')) {
$OUTPUT->set_env('quota', true);
Expand Down Expand Up @@ -119,6 +120,7 @@ $OUTPUT->add_handlers(array(
'quotadisplay' => array($RCMAIL, 'quota_display'),
'messages' => 'rcmail_message_list',
'messagecountdisplay' => 'rcmail_messagecount_display',
'listmenulink' => 'rcmail_options_menu_link',
'mailboxname' => 'rcmail_mailbox_name_display',
'messageheaders' => 'rcmail_message_headers',
'messagefullheaders' => 'rcmail_message_full_headers',
Expand Down Expand Up @@ -357,13 +359,22 @@ function rcmail_message_list($attrib)
if (!in_array('threads', $a_show_cols))
array_unshift($a_show_cols, 'threads');

$listcols = $a_show_cols;

// Widescreen layout uses hardcoded list of columns
if ($RCMAIL->config->get('layout', 'widescreen') == 'widescreen') {
$a_show_cols = array('threads', 'subject', 'fromto', 'date', 'flag', 'attachment');
$listcols = $a_show_cols;
array_shift($listcols);
}

// set client env
$OUTPUT->add_gui_object('messagelist', $attrib['id']);
$OUTPUT->set_env('autoexpand_threads', intval($RCMAIL->config->get('autoexpand_threads')));
$OUTPUT->set_env('sort_col', $_SESSION['sort_col']);
$OUTPUT->set_env('sort_order', $_SESSION['sort_order']);
$OUTPUT->set_env('messages', array());
$OUTPUT->set_env('listcols', $a_show_cols);
$OUTPUT->set_env('listcols', $listcols);

$OUTPUT->include_script('list.js');

Expand Down Expand Up @@ -425,6 +436,11 @@ function rcmail_js_message_list($a_headers, $insert_top=false, $a_show_cols=null
$a_show_cols = array_unique($a_show_cols);
$_SESSION['list_attrib']['columns'] = $a_show_cols;

// Widescreen layout uses hardcoded list of columns
if ($RCMAIL->config->get('layout', 'widescreen') == 'widescreen') {
$a_show_cols = array('threads', 'subject', 'fromto', 'date', 'flag', 'attachment');
}

// Plugins may set header's list_cols/list_flags and other rcube_message_header variables
// and list columns
$plugin = $RCMAIL->plugins->exec_hook('messages_list',
Expand All @@ -433,6 +449,14 @@ function rcmail_js_message_list($a_headers, $insert_top=false, $a_show_cols=null
$a_show_cols = $plugin['cols'];
$a_headers = $plugin['messages'];

if ($RCMAIL->config->get('layout', 'widescreen') == 'widescreen') {
if (!$OUTPUT->get_env('threading')) {
if (($idx = array_search('threads', $a_show_cols)) !== false) {
unset($a_show_cols[$idx]);
}
}
}

$thead = $head_replace ? rcmail_message_list_head($_SESSION['list_attrib'], $a_show_cols) : NULL;

// get name of smart From/To column in folder context
Expand Down Expand Up @@ -568,22 +592,7 @@ function rcmail_message_list_head($attrib, $a_show_cols)
$a_sort_cols = array('subject', 'date', 'from', 'to', 'fromto', 'size', 'cc');

if (!empty($attrib['optionsmenuicon'])) {
$onclick = 'return ' . rcmail_output::JS_OBJECT_NAME . ".command('menu-open', 'messagelistmenu', this, event)";
$inner = $RCMAIL->gettext('listoptions');
if (is_string($attrib['optionsmenuicon']) && $attrib['optionsmenuicon'] != 'true') {
$inner = html::img(array('src' => $RCMAIL->output->abs_url($attrib['optionsmenuicon'], true), 'alt' => $RCMAIL->gettext('listoptions')));
}
$list_menu = html::a(array(
'href' => '#list-options',
'onclick' => $onclick,
'class' => 'listmenu',
'id' => 'listmenulink',
'title' => $RCMAIL->gettext('listoptions'),
'tabindex' => '0',
), $inner);
}
else {
$list_menu = '';
$list_menu = rcmail_options_menu_link($attrib);
}

$cells = $coltypes = array();
Expand Down Expand Up @@ -611,7 +620,7 @@ function rcmail_message_list_head($attrib, $a_show_cols)
$col_name = html::span($col, $RCMAIL->gettext('readstatus'));
break;
case 'threads':
$col_name = $list_menu;
$col_name = (string) $list_menu;
break;
case 'fromto':
$label = $RCMAIL->gettext($smart_col);
Expand Down Expand Up @@ -648,6 +657,27 @@ function rcmail_message_list_head($attrib, $a_show_cols)
return $cells;
}

function rcmail_options_menu_link($attrib)
{
global $RCMAIL;

$onclick = 'return ' . rcmail_output::JS_OBJECT_NAME . ".command('menu-open', 'messagelistmenu', this, event)";
$inner = $title = $RCMAIL->gettext('listoptions');

if (is_string($attrib['optionsmenuicon']) && $attrib['optionsmenuicon'] != 'true') {
$inner = html::img(array('src' => $RCMAIL->output->abs_url($attrib['optionsmenuicon'], true), 'alt' => $title));
}

return html::a(array(
'href' => '#list-options',
'onclick' => $onclick,
'class' => 'listmenu',
'id' => 'listmenulink',
'title' => $title,
'tabindex' => '0',
), $inner);
}

/**
* return an HTML iframe for loading mail content
*/
Expand Down
9 changes: 8 additions & 1 deletion program/steps/mail/list.inc
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,8 +40,15 @@ if ($sort = rcube_utils::get_input_value('_sort', rcube_utils::INPUT_GET)) {
}
}

// register layout change
if ($layout = rcube_utils::get_input_value('_layout', rcube_utils::INPUT_GET)) {
$OUTPUT->set_env('layout', $layout);
$save_arr['layout'] = $layout;
// force header replace on layout change
$cols = $_SESSION['list_attrib']['columns'];
}
// is there a set of columns for this request?
if ($cols = rcube_utils::get_input_value('_cols', rcube_utils::INPUT_GET)) {
else if ($cols = rcube_utils::get_input_value('_cols', rcube_utils::INPUT_GET)) {
$_SESSION['list_attrib']['columns'] = explode(',', $cols);
if (!in_array('list_cols', $dont_override)) {
$save_arr['list_cols'] = explode(',', $cols);
Expand Down
5 changes: 0 additions & 5 deletions program/steps/mail/show.inc
View file
Original file line number Diff line number Diff line change
Expand Up @@ -170,11 +170,6 @@ if (!empty($set_seen_flag)) {
}
}

// Save preview_pane preference, if not set yet (#1490362)
if ($RCMAIL->action == 'preview' && !$RCMAIL->config->get('preview_pane')) {
$RCMAIL->user->save_prefs(array('preview_pane' => true));
}

exit;


Expand Down
Loading

0 comments on commit 6886a4d

Please sign in to comment.