R55209 - in /trunk/mail: inc/ js/ templates/mobile/

hnategh-2 2016-03-01 17:00:28 UTC #1

Author: hnategh
New Revision: 55209

URL: http://svn.stylite.de/viewvc/egroupware?rev=55209&view=rev
Log:
Mobile theme W.I.P:

Implement view mode for mail
Improve performance for reading mails

Added:
trunk/mail/templates/mobile/view.xet
- copied, changed from r55202, trunk/mail/templates/mobile/display.xet
Modified:
trunk/mail/inc/class.mail_ui.inc.php
trunk/mail/js/app.js
trunk/mail/templates/mobile/app.css
trunk/mail/templates/mobile/app.less

Modified: trunk/mail/inc/class.mail_ui.inc.php
URL: http://svn.stylite.de/viewvc/egroupware/trunk/mail/inc/class.mail_ui.inc.php?rev=55209&r1=55208&r2=55209&view=diff

— trunk/mail/inc/class.mail_ui.inc.php (original)
+++ trunk/mail/inc/class.mail_ui.inc.php Tue Mar 1 18:00:28 2016
@@ -721,6 +721,10 @@

			// sending preview toolbar actions
			if ($content['mailSplitter']) $etpl->setElementAttribute('mailPreview[toolbar]', 'actions', $this->get_toolbar_actions());

  		// We need to send toolbar actions to client-side because view template needs them

  		if (html::$ua_mobile) $sel_options['toolbar'] = $this->get_toolbar_actions();

  		//we use the category "filter" option as specifier where we want to search (quick, subject, from, to, etc. ....)
  		if (empty($content[self::$nm_index]['cat_id']) || empty($content[self::$nm_index]['search'])) $content[self::$nm_index]['cat_id']=(emailadmin_imapbase::$supportsORinQuery[$this->mail_bo->profileID]?'quick':'subject');
  		$readonlys = $preserv = array();

@@ -909,9 +913,10 @@
‘caption’ => lang(‘Open’),
‘icon’ => ‘view’,
‘group’ => ++$group,

  		'onExecute' => 'javaScript:app.mail.mail_open',

  		'onExecute' => html::$ua_mobile?'javaScript:app.mail.mobileView':'javaScript:app.mail.mail_open',
  		'allowOnMultiple' => false,
  		'default' => true,

  		'mobileViewTemplate' => 'view.xet'
  	),
  	'reply' => array(
  		'caption' => 'Reply',

Modified: trunk/mail/js/app.js
URL: http://svn.stylite.de/viewvc/egroupware/trunk/mail/js/app.js?rev=55209&r1=55208&r2=55209&view=diff

— trunk/mail/js/app.js (original)
+++ trunk/mail/js/app.js Tue Mar 1 18:00:28 2016
@@ -157,7 +157,6 @@
case ‘mail.sieve.vacation’:
this.vacationFilterStatusChange();
break;

  	case 'mail.mobile_index':
  	case 'mail.index':
  		var self = this;
  		jQuery('iframe#mail-index_messageIFRAME').on('load', function()

@@ -4257,12 +4256,12 @@
* Prepare display dialog for printing
* copies iframe content to a DIV, as iframe causes
* trouble for multipage printing

- @param {jQuery object} _iframe mail body iframe
- @returns {undefined}
  */

mail_prepare_print: function()
{

  var mainIframe = jQuery('#mail-display_mailDisplayBodySrc');

mail_prepare_print: function(_iframe)
{

  var $mainIframe = _iframe || jQuery('#mail-display_mailDisplayBodySrc');
  var tmpPrintDiv = jQuery('#tempPrintDiv');

  if (tmpPrintDiv.length == 0 && tmpPrintDiv.children())

@@ -4273,12 +4272,12 @@
var notAttached = true;
}

```
  if (mainIframe)
```
```
  {
```

  	tmpPrintDiv[0].innerHTML = mainIframe.contents().find('body').html();

```
  if ($mainIframe)
```
```
  {
```

  	tmpPrintDiv[0].innerHTML = $mainIframe.contents().find('body').html();
  }
  // Attach the element to the DOM after maniupulation

  if (notAttached) jQuery('#mail-display_mailDisplayBodySrc').after(tmpPrintDiv);

```
  if (notAttached) $mainIframe.after(tmpPrintDiv);
  tmpPrintDiv.find('#divAppboxHeader').remove();
```
},
@@ -5139,7 +5138,66 @@
};
et2_dialog.show_dialog(callbackDialog, this.egw.lang(‘Are you sure you want to delete all selected folders?’), this.egw.lang(‘Delete folder’), {},
et2_dialog.BUTTON_YES_NO, et2_dialog.WARNING_MESSAGE, undefined, egw);
},
/**
- Implement mobile view
- @param {type} _action
- @param {type} _sender
*/
mobileView: function(_action, _sender)
{
```
  // app id in nm
```
```
  var id = _sender[0].id;
```
```
  var content = {};
```
```
  if (id){
```
```
  	content = egw.dataGetUIDdata(id);
```

  	content.data['toolbar'] = etemplate2.getByApplication('mail')[0].widgetContainer.getArrayMgr('sel_options').data.toolbar;

  	this.et2.setArrayMgr('content', content);

```
  }
```
```
  // set the current selected row
```
```
  this.mail_currentlyFocussed = id;
```
```
  var self = this;
```

  this.viewEntry(_action, _sender, function(etemplate){

```
  	// et2 object in view
```

  	var et2 = etemplate.widgetContainer;

```
  	// iframe to load message
```

  	var iframe = et2.getWidgetById('iframe');

```
  	// toolbar widget
```

  	var toolbar = et2.getWidgetById('toolbar');

  	// attachments details title DOM node

  	var $attachment = jQuery('.attachments span.et2_details_title');

```
  	// details DOM
```

  	var $details = jQuery('.et2_details.details');

```
  	// Content
```

  	var content = et2.getArrayMgr('content').data;

  	if (content.attachmentsBlock.length>0 && content.attachmentsBlock[0].filename)

```
  	{
```

  		$attachment.text(content.attachmentsBlock.length+' '+ egw.lang('attachments'));

```
  	}
```
```
  	else
```
```
  	{
```

  		// disable attachments area if there's no attachments

```
  		$attachment.parent().hide();
```
```
  	}
```

  	// disable the detials if there's no details

  	if (!content.ccaddress) $details.hide();

  	toolbar.set_actions(content.toolbar);

```
  	// Request email body from server
```

  	iframe.set_src(egw.link('/index.php',{menuaction:'mail.mail_ui.loadEmailBody',_messageID:id}));

  	jQuery(iframe.getDOMNode()).on('load',function(){

  		// Use prepare print function to copy iframe content into div

  		// as we don't want to show content in iframe.

  		self.mail_prepare_print(jQuery(this));

```
  	});
```
```
  });
```
}

});

Modified: trunk/mail/templates/mobile/app.css
URL: http://svn.stylite.de/viewvc/egroupware/trunk/mail/templates/mobile/app.css?rev=55209&r1=55208&r2=55209&view=diff

— trunk/mail/templates/mobile/app.css (original)
+++ trunk/mail/templates/mobile/app.css Tue Mar 1 18:00:28 2016
@@ -2499,6 +2499,9 @@
padding: 1px 8px 0 8px;
background: none;
}

body #popupMainDiv .mobile-view-editBtn {
display: none;
}
body #popupMainDiv div.et2_toolbar.et2_head_toolbar {
padding: 1px 5px 5px 10px !important;
}
@@ -2535,71 +2538,74 @@
body #popupMainDiv #mail-compose_composeToolbar button#composeToolbar-send:disabled {
background-color: none;
}

body #popupMainDiv #mail-display .mail-d-h1 {

body #popupMainDiv .mail-d-h1 {
padding-bottom: 15px;
border-bottom: 1px solid silver;
font-size: 12pt;
padding-top: 10px;
font-weight: bold;
}

body #popupMainDiv #mail-display .mail-d-h1 span {

body #popupMainDiv .mail-d-h1 span {
font-size: 12pt;
}

body #popupMainDiv #mail-display .mail-d-h2 {

body #popupMainDiv .mail-d-h2 {
padding-top: 5px;
font-size: 10pt;
color: grey;
}

body #popupMainDiv #mail-display .mail-d-h2 a,
body #popupMainDiv #mail-display .mail-d-h2 span,
body #popupMainDiv #mail-display .mail-d-h2 .et2_label {

body #popupMainDiv .mail-d-h2 a,
body #popupMainDiv .mail-d-h2 span,
body #popupMainDiv .mail-d-h2 .et2_label {
color: grey;
font-size: 10pt;
}

body #popupMainDiv #mail-display .mail-d-h2 a#mail-display_FROM > * {

body #popupMainDiv .mail-d-h2 a#mail-display_FROM > * {
color: black;
padding-top: 15px;
font-size: 12pt;
}

body #popupMainDiv #mail-display .et2_details {
width: 50%;
display: inline-block;
}
body #popupMainDiv #mail-display .et2_details.et2_details_expanded {

body #popupMainDiv .et2_details {
width: 100%;
display: block;
}

body #popupMainDiv #mail-display span.et2_details_title {

body #popupMainDiv .et2_details.et2_details_expanded {
width: 100%;
display: block;
}
body #popupMainDiv span.et2_details_title {
color: #26537c;
font-size: 10pt;
}

body #popupMainDiv #mail-display div#mail-display_mailDisplayHeadersFrom > * {

body #popupMainDiv div#mail-display_mailDisplayHeadersFrom > * {
color: black;
padding-top: 15px;
}

body #popupMainDiv #mail-display .mailDisplayAttachments {

body #popupMainDiv .mailDisplayAttachments {
position: initial;
padding: 0;
margin-top: 10px;
}

body #popupMainDiv #mail-display button[id=“displayToolbar-delete”] {

body #popupMainDiv button[id=“displayToolbar-delete”] {
margin-left: 0;
}

body #popupMainDiv #mail-display .mailDisplay {

body #popupMainDiv .mailDisplay {
position: initial;
margin-top: 20px;
}

body #popupMainDiv #mail-display #mail-display_mailDisplayBodySrc {

body #popupMainDiv #mail-view_iframe {
display: none;
}

body #popupMainDiv #mail-display #tempPrintDiv div:first-child {

body #popupMainDiv #tempPrintDiv {
display: block;
}
body #popupMainDiv #tempPrintDiv div:first-child {
height: auto !important;
}

body #popupMainDiv #mail-display #tempPrintDiv td,
body #popupMainDiv #mail-display #tempPrintDiv textarea {

body #popupMainDiv #tempPrintDiv td,
body #popupMainDiv #tempPrintDiv textarea {
font-family: Verdana, Arial, Helvetica, sans-serif;
}

body #popupMainDiv #mail-display #tempPrintDiv .td_display {

body #popupMainDiv #tempPrintDiv .td_display {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 120%;
color: black;

Modified: trunk/mail/templates/mobile/app.less
URL: http://svn.stylite.de/viewvc/egroupware/trunk/mail/templates/mobile/app.less?rev=55209&r1=55208&r2=55209&view=diff

— trunk/mail/templates/mobile/app.less (original)
+++ trunk/mail/templates/mobile/app.less Tue Mar 1 18:00:28 2016
@@ -39,6 +39,7 @@
padding: 1px 8px 0 8px;
background: none;

  	.mobile-view-editBtn {display: none;}
  	div.et2_toolbar.et2_head_toolbar {
  		padding: 1px 5px 5px 10px !important;
  		button {

@@ -76,82 +77,81 @@
}

```
  	#mail-display{
```
```
  		.mail-d-h1{
```
```
  			padding-bottom: 15px;
```
```
  			border-bottom: 1px solid silver;
```
```
  			span {
```
```
  				.mob-fontsize-l;
```
```
  			}
```

```
  	.mail-d-h1{
```
```
  		padding-bottom: 15px;
```
```
  		border-bottom: 1px solid silver;
```
```
  		span {
  			.mob-fontsize-l;
```

```
  			padding-top: 10px;
```
```
  			font-weight: bold;
```
```
  		}
```
```
  		.mail-d-h2{
```
```
  			padding-top: 5px;
```

```
  		}
```
```
  		.mob-fontsize-l;
```
```
  		padding-top: 10px;
```
```
  		font-weight: bold;
```
```
  	}
```
```
  	.mail-d-h2{
```
```
  		padding-top: 5px;
```
```
  		.mob-fontsize-n;
```
```
  		color: grey;
```
```
  		a,span,.et2_label {
```

  			color: grey;
  			.mob-fontsize-n;

```
  			color: grey;
```
```
  			a,span,.et2_label {
```
```
  				color: grey;
```
```
  				.mob-fontsize-n;
```
```
  			}
```
```
  			a#mail-display_FROM>* {
```
```
  				color:black;
```
```
  				padding-top: 15px;
```
```
  				.mob-fontsize-l;
```
```
  			}
```
```
  		}
```
```
  		.et2_details {
```
```
  			width: 50%;
```
```
  			display: inline-block;
```
```
  		}
```

  		.et2_details.et2_details_expanded {

```
  			width: 100%;
```
```
  			display: block;
```
```
  		}
```
```
  		span.et2_details_title {
```
```
  				color:#26537c;
```
```
  				.mob-fontsize-n;
```
```
  			}
```

  		div#mail-display_mailDisplayHeadersFrom>*, {

```
  		}
```

  		a#mail-display_FROM>* {
  			color:black;
  			padding-top: 15px;

```
  		}
```
```
  		.mailDisplayAttachments {
```
```
  			position: initial;
```
```
  			padding: 0;
```
```
  			margin-top: 10px;
```
```
  		}
```

  		button[id="displayToolbar-delete"] {

```
  			margin-left: 0;
```
```
  		}
```
```
  		.mailDisplay {
```
```
  			position: initial;
```
```
  			margin-top: 20px;
```
```
  		}
```
```
  		#mail-display_mailDisplayBodySrc {
```
```
  			display: none;
```
```
  		}
```
```
  		#tempPrintDiv {
```
```
  			div:first-child {
```
```
  				height:auto !important;
```
```
  			}
```
```
  			td, textarea {
```

  				font-family: Verdana, Arial, Helvetica, sans-serif;

```
  			}
```
```
  			.td_display {
```

  				font-family: Verdana, Arial, Helvetica, sans-serif;

```
  				font-size: 120%;
```
```
  				color: black;
```
```
  				background-color: #FFFFFF;
```
```
  			}
```
```
  		}
```

```
  			.mob-fontsize-l;
```
```
  		}
```
```
  	}
```
```
  	.et2_details {
```
```
  		width: 100%;
```
```
  		display: block;
```
```
  	}
```
```
  	.et2_details.et2_details_expanded {
```
```
  		width: 100%;
```
```
  		display: block;
```
```
  	}
```
```
  	span.et2_details_title {
```
```
  			color:#26537c;
```
```
  			.mob-fontsize-n;
```
```
  		}
```

  	div#mail-display_mailDisplayHeadersFrom>*, {

```
  		color:black;
```
```
  		padding-top: 15px;
```
```
  	}
```
```
  	.mailDisplayAttachments {
```
```
  		position: initial;
```
```
  		padding: 0;
```
```
  		margin-top: 10px;
```
```
  	}
```

  	button[id="displayToolbar-delete"] {

```
  		margin-left: 0;
```
```
  	}
```
```
  	.mailDisplay {
```
```
  		position: initial;
```
```
  		margin-top: 20px;
```
```
  	}
```
```
  	#mail-view_iframe {
```
```
  		display: none;
```
```
  	}
```
```
  	#tempPrintDiv {
```
```
  		display:block;
```
```
  		div:first-child {
```
```
  			height:auto !important;
```
```
  		}
```
```
  		td, textarea {
```

  			font-family: Verdana, Arial, Helvetica, sans-serif;

```
  		}
```
```
  		.td_display {
```

  			font-family: Verdana, Arial, Helvetica, sans-serif;

```
  			font-size: 120%;
```
```
  			color: black;
```
```
  			background-color: #FFFFFF;
```
```
  		}
```
```
  	}
```

```
  	} 
  }
  
  .dtree {
```

Copied: trunk/mail/templates/mobile/view.xet (from r55202, trunk/mail/templates/mobile/display.xet)
URL: http://svn.stylite.de/viewvc/egroupware/trunk/mail/templates/mobile/view.xet?p2=trunk/mail/templates/mobile/view.xet&p1=trunk/mail/templates/mobile/display.xet&r1=55202&r2=55209&rev=55209&view=diff

— trunk/mail/templates/mobile/display.xet (original)
+++ trunk/mail/templates/mobile/view.xet Tue Mar 1 18:00:28 2016
@@ -2,90 +2,77 @@

- - - - + + - + - + - - - + + - + - - - - - + + + -

- - - - - +

+ - - - - - - - - - - -

- - + - - - - - - - - - - + - - - - - - - - - - - + + - + +

+ + + + + + + + + + + + + + + + + + + + + + + + + + + +

- - - - -