- Merge with edhelas

app/assets/js/movim_tpl.js

@@ -89,6 +89,9 @@ var MovimTpl = {
     toggleMenu : function() {
         movim_toggle_class('body > nav', 'active');
     },
+    hideMenu : function() {
+        movim_remove_class('body > nav', 'active');
+    },
     back : function() {
         // If a dialog box is shown
         if(Dialog.filled()) {
@@ -102,6 +105,10 @@ var MovimTpl = {
         } else {
             window.history.back();
         }
+    },
+    getHeaderColor : function() {
+        var header = document.querySelector('body main > header');
+        return window.getComputedStyle(header).backgroundColor;
     }
 }
 

app/views/chat.tpl

@@ -1,7 +1,6 @@
 <nav class="color dark">
-    <?php $this->widget('Presence');?>
     <?php $this->widget('Navigation');?>
-    <?php //$this->widget('Notification');?>
+    <?php $this->widget('Presence');?>
 </nav>
 
 <main>

app/views/conf.tpl

@@ -1,6 +1,6 @@
 <nav class="color dark">
-    <?php $this->widget('Presence');?>
     <?php $this->widget('Navigation');?>
+    <?php $this->widget('Presence');?>
 </nav>
 
 <main>

app/views/contact.tpl

@@ -1,6 +1,6 @@
 <nav class="color dark">
-    <?php $this->widget('Presence');?>
     <?php $this->widget('Navigation');?>
+    <?php $this->widget('Presence');?>
 </nav>
 
 <main>

app/views/help.tpl

@@ -1,6 +1,6 @@
 <nav class="color dark">
-    <?php $this->widget('Presence');?>
     <?php $this->widget('Navigation');?>
+    <?php $this->widget('Presence');?>
 </nav>
 
 <main>

app/widgets/Avatar/_avatar_form.tpl

@@ -1,5 +1,5 @@
-<form name="avatarform" id="avatarform">
-    <h3>{$c->__('page.avatar')}</h3>
+<form name="avatarform" id="avatarform" class="flex">
+    <h3 class="block large">{$c->__('page.avatar')}</h3>
     <div class="block">        
         <input type="file" onchange="vCardImageLoad(this.files);">
         <label for="avatar">{$c->__('page.avatar')}</label>
@@ -32,15 +32,15 @@
         <label for="url">{$c->__('avatar.webcam')}</label>
     </div>
 
-    <div class="clear"></div>
-
-    <a
-        onclick="
-            {$submit}
-            movim_button_save('#avatarvalidate');
-            this.value = '{$c->__('button.submitting')}'; 
-            this.className='button inactive oppose';" 
-        class="button color oppose"
-        id="avatarvalidate"
-        >{$c->__('button.submit')}</a>
+    <div class="block large">
+        <a
+            onclick="
+                {$submit}
+                movim_button_save('#avatarvalidate');
+                this.value = '{$c->__('button.submitting')}'; 
+                this.className='button inactive oppose';" 
+            class="button color oppose"
+            id="avatarvalidate"
+            >{$c->__('button.submit')}</a>
+    </div>
 </form>

app/widgets/Chats/Chats.php

@@ -56,7 +56,9 @@ class Chats extends WidgetCommon
         $chats = Cache::c('chats');
         if($chats == null) $chats = array();
 
-        if(!array_key_exists($jid, $chats) && $jid != $this->user->getLogin()) {
+        if(!array_key_exists($jid, $chats)
+        && $jid != $this->user->getLogin()
+        && $jid != '') {
             $chats[$jid] = 1;
             Cache::c('chats', $chats);
 

app/widgets/Chats/chats.js

@@ -15,7 +15,7 @@ var Chats = {
                     Chat_ajaxGet(this.dataset.jid);
                     Chats.reset(items);
                     Notification_ajaxClear('chat|' + this.dataset.jid);
-                    Notification_ajaxCurrent('chat|' + this.dataset.jid);
+                    Notification.current('chat|' + this.dataset.jid);
                     movim_add_class(this, 'active');
                 }
 

app/widgets/Contact/_contact.tpl

@@ -10,7 +10,7 @@
         </ul>
     </header>
     <br />
-    <ul>
+    <ul class="flex">
         {if="$contact->delay != null"}
         <li class="condensed block">
             <span class="icon brown"><i class="md md-restore"></i></span>

app/widgets/Notification/Notification.php

@@ -25,10 +25,12 @@ class Notification extends WidgetCommon
             RPC::call('Notification.toast', $title);
             return;
         }
-        
+
         $session = Session::start();
         $notifs = $session->get('notifs');
 
+        RPC::call('Notification.desktop', $title, $body, $picture);
+
         $notifs_key = $session->get('notifs_key');
         if($notifs_key != null && $key == $notifs_key) return;
 
@@ -55,7 +57,6 @@ class Notification extends WidgetCommon
 
         $n = new Notification;
         RPC::call('Notification.snackbar', $n->prepareSnackbar($title, $body, $picture), $time);
-        RPC::call('Notification.desktop', $title, $body, $picture);
 
         $session->set('notifs', $notifs);
     }

app/widgets/Notification/notification.js

@@ -2,6 +2,7 @@ var DesktopNotification = Notification;
 
 var Notification = {
     inhibed : false,
+    focused : false,
     tab_counter1 : 0,
     tab_counter2 : 0,
     tab_counter1_key : 'chat',
@@ -68,6 +69,10 @@ var Notification = {
             document.title = '(' + Notification.tab_counter1 + '/' + Notification.tab_counter2 + ') ' + Notification.document_title;
         }
     },
+    current : function(key) {
+        Notification.notifs_key = key;
+        Notification_ajaxCurrent(Notification.notifs_key);
+    },
     toast : function(html) {
         target = document.getElementById('toast');
         
@@ -97,7 +102,8 @@ var Notification = {
             time*1000);
     },
     desktop : function(title, body, picture) {
-        if(Notification.inhibed == true) return;
+        if(Notification.inhibed == true
+        || Notification.focused) return;
 
         var notification = new DesktopNotification(title, { icon: picture, body: body });
     }
@@ -105,9 +111,19 @@ var Notification = {
 
 MovimWebsocket.attach(function() {
     Notification_ajaxGet();
-    Notification_ajaxCurrent(Notification.notifs_key);
+    Notification.current(Notification.notifs_key);
 });
 
+document.onblur = function() {
+    Notification.focused = false;
+    Notification_ajaxCurrent();
+}
+document.onfocus = function() {
+    Notification.focused = true;
+    Notification.current(Notification.notifs_key);
+    Notification_ajaxClear(Notification.notifs_key);
+}
+
 /*
 window.addEventListener('load', function () {
     DesktopNotification.requestPermission(function (status) {

app/widgets/Presence/_presence.tpl

@@ -1,4 +1,4 @@
-<li onclick="{$dialog}" class="condensed action">
+<li onclick="{$dialog} MovimTpl.hideMenu()" class="condensed action">
     <div class="action">
         <i class="md md-edit"></i>
     </div>
@@ -6,7 +6,7 @@
     <span>{$me->getTrueName()}</span>
     <p class="wrap">{$presence->status}</p>
 </li>
-<a class="block classic" href="{$c->route('conf')}">
+<a class="classic" href="{$c->route('conf')}">
     <li>
         <span class="icon">
             <i class="md md-settings"></i>
@@ -14,7 +14,7 @@
         <span>{$c->__('page.configuration')}</span>
     </li>
 </a>
-<a class="block classic" href="{$c->route('help')}">
+<a class="classic" href="{$c->route('help')}">
     <li>
         <span class="icon">
             <i class="md md-help"></i>

app/widgets/Presence/presence.tpl

@@ -1,3 +1,3 @@
-<ul id="presence_widget" class="active oppose">
+<ul id="presence_widget" class="active oppose thick">
     {$presence}
 </ul>

app/widgets/Vcard4/_vcard4_form.tpl

@@ -27,8 +27,8 @@
 
 <div class="clear padded"></div>
 
-<form name="vcard4" id="vcard4form">
-    <h3>{$c->__('page.profile')}</h3>
+<form name="vcard4" id="vcard4form" class="flex">
+    <h3 class="block large">{$c->__('page.profile')}</h3>
     <div class="block">
         <input type="text" name="fn" class="content" value="{$me->fn}">
         <label for="fn">{$c->__('vcard.name')}</label>
@@ -38,16 +38,14 @@
         <label for="fn">{$c->__('vcard.nickname')}</label>
     </div>
 
-    <div class="block">
+    <div class="block large">
         <input type="email" name="email" class="content" value="{$me->email}">
         <label for="fn">{$c->__('vcard.email')}</label>
     </div>
 
-    <div class="clear"></div>
-
     <!-- The date picker -->
 
-    <div>
+    <div class="block large">
         <label for="day">{$c->__('vcard.date_of_birth')}</label>
 
         <div class="select" style="width: 33.33%; float: left;">
@@ -62,26 +60,24 @@
                 {/loop}
             </select>
         </div>
-
-        <div class="select" style="width: 33.33%; float: left;">
-            <select name="month" class="datepicker">
-                <option value="-1">{$c->__('Month')}</option>
-                {loop="$months"}
-                    <option value="{$key}" 
-                    {if="$key == substr($me->date,5,2)"}
+        <div class="select" style="width: 33.33%; float: right;">
+            <select name="year" class="datepicker">
+                <option value="-1">{$c->__('Year')}</option>
+                {loop="$years"}
+                    <option value="{$value}" 
+                    {if="$value == substr($me->date,0,4)"}
                         selected 
                     {/if}
                     >{$value}</option>
                 {/loop}
             </select>
         </div>
-
-        <div class="select" style="width: 33.33%; float: left;">
-            <select name="year" class="datepicker">
-                <option value="-1">{$c->__('Year')}</option>
-                {loop="$years"}
-                    <option value="{$value}" 
-                    {if="$value == substr($me->date,0,4)"}
+        <div class="select" style="width: 33.33%;">
+            <select name="month" class="datepicker">
+                <option value="-1">{$c->__('Month')}</option>
+                {loop="$months"}
+                    <option value="{$key}" 
+                    {if="$key == substr($me->date,5,2)"}
                         selected 
                     {/if}
                     >{$value}</option>
@@ -120,21 +116,19 @@
         </div>
     </div>
 
-    <div class="clear"></div>
-
-    <div>
+    <div class="block">
         <input type="url" name ="url" class="content" value="{$me->url}">
         <label for="url">{$c->__('vcard.website')}</label>
     </div>
 
-    <div>
+    <div class="block large">
         <textarea name="desc" id="desctext" class="content" onkeyup="movim_textarea_autoheight(this);">{$desc}</textarea>
         <label for="desc">{$c->__('vcard.about')}</label>
     </div>
 
     <div class="clear padded"></div>
 
-    <h3>{$c->__('vcard.position_title')}</h3>
+    <h3 class="block large">{$c->__('vcard.position_title')}</h3>
 
     <div class="block">
         <input type="text" type="locality" name ="locality" class="content" value="{$me->adrlocality}" placeholder="{$c->__('Locality')}">
@@ -157,9 +151,7 @@
         <label for="country">{$c->__('vcard.country')}</label>
     </div>
 
-    <div class="clear padded"></div>
-
-    <h3>{$c->__('vcard.accounts_title')}</h3>
+    <h3 class="block large">{$c->__('vcard.accounts_title')}</h3>
     
     <div class="block">
         <input type="text" name="twitter" class="content" value="{$me->twitter}" placeholder="{$c->__('Nickname')}">
@@ -176,26 +168,24 @@
         <label for="skype"><i class="fa fa-yahoo"></i> {$c->__('vcard.yahoo')}</label>
     </div>
 
-    <div class="clear"></div>
-
-    <a
-        onclick="
-            {$submit}
-            movim_button_save('#vcard4validate');
-            this.value = '{$c->__('Submitting')}'; 
-            this.className='button oppose inactive';" 
-        class="button color oppose" 
-        id="vcard4validate"
-        >
-        {$c->__('Submit')}
-    </a>
-    <a
-        onclick="document.querySelector('#vcard4form').reset();"
-        class="button flat oppose">
-        {$c->__('Reset')}
-    </a>
-
-    <div class="clear padded"></div>
+    <div class="block large">
+        <a
+            onclick="
+                {$submit}
+                movim_button_save('#vcard4validate');
+                this.value = '{$c->__('Submitting')}'; 
+                this.className='button oppose inactive';" 
+            class="button color oppose" 
+            id="vcard4validate"
+            >
+            {$c->__('Submit')}
+        </a>
+        <a
+            onclick="document.querySelector('#vcard4form').reset();"
+            class="button flat oppose">
+            {$c->__('Reset')}
+        </a>
+    </div>
 </form>
                 
 

themes/material/css/block.css

@@ -1,32 +1,20 @@
-.block {
-    width: 50%;
-    display: inline-block;
-    box-sizing: border-box;
-    float: left;
-    clear: left;
+.flex {
+    display: flex;
+    flex-flow: row wrap;
 }
 
-.block:nth-of-type(even) {
-    float: right;
-    clear: right;
+.flex .block {
+    flex: 1 50%;
+    padding: 0 1rem;
 }
 
-.block:nth-of-type(even):not(li) {
-    padding-left: 2rem;
-}
-
-.block.large {
-    width: 100%;
-    clear: both;
+.flex .block.large {
+    flex: 1 100%;
 }
 
 @media screen and (max-width: 1024px) {
-    .block {
-        width: 100%;
-        padding-right: 2rem;
-    }
-
-    .block:nth-of-type(even):not(li) {
-        padding-left: 0;
+    .flex .block {
+        flex: 1 100%;
+        padding: 0;
     }
 }

themes/material/css/menu.css

@@ -4,12 +4,12 @@ body > nav > ul span.icon {
     left: 1rem;
 }
 
-body > nav > ul > li:first-child {
+body > nav > ul:first-child > li:first-child {
     height: 7rem;
     line-height: 7rem;
 }
 
-body > nav > ul > li:first-child div.control {
+body > nav > ul:first-child > li:first-child div.control {
     line-height: 7rem;
 }
 
@@ -17,6 +17,10 @@ body > nav > ul a {
     color: white;
 }
 
+body > nav > ul p {
+    color: gray;
+}
+
 body > nav > header.big {
     overflow: hidden;
     height: 7rem;

themes/material/css/style.css

@@ -688,7 +688,7 @@ main section > div:first-child:nth-last-child(2) ~ div .actions.fixed > div:last
 .icon.explore   { background-image: url(../img/placeholder/explore.png); }
 .icon.plane     { background-image: url(../img/placeholder/plane.png); }
 .icon.file      { background-image: url(../img/placeholder/file.png); }
-.icon.clipboard { background-image: url(../img/placeholder/clipboard.png); }
+.icon.clipboard { background-image: url(../img/icons/assignment_turned_in.svg); }
 
 /* Definition list */