- Fixing the CSS to put select in the header

- Start implementing the chatrooms
- Fixing some headers

app/assets/js/movim_websocket.js

@@ -97,7 +97,7 @@ var MovimWebsocket = {
         if(funcalls != null) {
             for(h = 0; h < funcalls.length; h++) {
                 var funcall = funcalls[h];
-                //console.log(funcall);
+                console.log(funcall);
                 if(funcall.func != null && (typeof window[funcall.func] == 'function')) {
                     try {
                         window[funcall.func].apply(null, funcall.params);

app/helpers/StringHelper.php

@@ -284,10 +284,10 @@ function stringToColor($string) {
         6 => 'yellow',
         7 => 'brown');
         
-    $s = base_convert(sha1($string), 16, 8);
+    $s = base_convert(sha1($string), 12, 8);
     
-    if(isset($s[5])) {
-        return $colors[(int) $s[5]];
+    if(isset($s[4])) {
+        return $colors[(int) $s[4]];
     } else {
         return 'orange';
     }
@@ -299,6 +299,6 @@ function stringToColor($string) {
  * @return string
  */
 function firstLetterCapitalize($string) {
-    return ucfirst(strtolower(substr($string, 0, 2)));
+    return ucfirst(strtolower(mb_substr($string, 0, 2)));
 }
 

app/models/postn/PostnDAO.php

@@ -241,7 +241,7 @@ class PostnDAO extends SQL {
         return $this->run('ContactPostn', 'item');
     }
     
-    function getAllPosts($jid, $limitf = false, $limitr = false) {
+    function getAllPosts($jid = false, $limitf = false, $limitr = false) {
         $this->_sql = '
             select *, postn.aid, privacy.value as privacy from postn
             left outer join contact on postn.aid = contact.jid
@@ -251,6 +251,9 @@ class PostnDAO extends SQL {
 
         if($limitr) 
             $this->_sql = $this->_sql.' limit '.$limitr.' offset '.$limitf;
+
+        if($jid == false)
+            $jid = $this->_user;
         
         $this->prepare(
             'Postn', 

app/widgets/Avatar/_avatar_form.tpl

@@ -39,7 +39,7 @@
             {$submit}
             movim_button_save('#avatarvalidate');
             this.value = '{$c->__('button.submitting')}'; 
-            this.className='button color inactive oppose';" 
+            this.className='button inactive oppose';" 
         class="button color oppose"
         id="avatarvalidate"
         >{$c->__('button.submit')}</a>

app/widgets/Chat/Chat.php

@@ -24,7 +24,7 @@ class Chat extends WidgetCommon
             $from = $message->jidto;
         }
 
-        RPC::call('movim_fill', $from.'_messages', $this->prepareMessages($from));
+        RPC::call('movim_fill', $from.'_messages', $this->prepareMessages($from));        
         RPC::call('MovimTpl.scrollPanel');
     }
 
@@ -188,9 +188,18 @@ class Chat extends WidgetCommon
         
         $cd = new \Modl\ContactDAO;
         $view = $this->tpl();
+
+        $contact = $cd->get($jid);
+        if($contact != null) {
+            RPC::call(
+                'Chat.notify',
+                $contact->getTrueName(),
+                trim($messages[0]->body),
+                $contact->getPhoto('m'));
+        }
         
         $view->assign('jid', $jid);
-        $view->assign('contact', $cd->get($jid));
+        $view->assign('contact', $contact);
         $view->assign('me', $cd->get());
         $view->assign('messages', $messages);
 

app/widgets/Chat/_chat_header.tpl

@@ -1,5 +1,4 @@
-<span id="back" class="on_mobile icon" onclick="MovimTpl.hidePanel()"><i class="md md-arrow-back"></i></span>
-<span class="on_desktop icon" onclick="MovimTpl.hidePanel()"><i class="md md-person"></i></span>
+<span id="back" class="icon" onclick="MovimTpl.hidePanel()"><i class="md md-arrow-back"></i></span>
 
 <ul class="active">
     <li onclick="Chats_ajaxClose('{$jid}'); MovimTpl.hidePanel();">

app/widgets/Chat/_chat_messages.tpl

@@ -1,9 +1,13 @@
 <ul class="middle">
     {loop="$messages"}
         <li {if="$value->jidfrom == $jid"}class="oppose"{/if}>
-            <span class="icon bubble">
+            <span class="icon bubble {if="$contact == null"}color {$value->ressource|stringToColor}{/if}">
                 {if="$value->jidfrom == $jid"}
-                    <img src="{$contact->getPhoto('s')}">
+                    {if="$contact != null"}
+                        <img src="{$contact->getPhoto('s')}">
+                    {else}
+                        {$value->ressource|firstLetterCapitalize}
+                    {/if}
                 {else}
                     <img src="{$me->getPhoto('s')}">
                 {/if}

app/widgets/Chat/chat.js

@@ -13,4 +13,11 @@ var Chat = {
         n.focus();
         return encodeURIComponent(text);
     },
+    notify : function(title, body, image)
+    {
+        if(document_focus == false) {
+            movim_title_inc();
+            movim_desktop_notification(title, body, image);
+        }
+    }
 }

app/widgets/Chats/Chats.php

@@ -1,5 +1,7 @@
 <?php
 
+use Moxl\Xec\Action\Presence\Muc;
+
 class Chats extends WidgetCommon
 {
     function load()
@@ -53,6 +55,15 @@ class Chats extends WidgetCommon
         RPC::call('Chats.refresh');
     }
 
+    // Join a MUC 
+    function ajaxBookmarkMucJoin($jid, $nickname)
+    {
+        $p = new Muc;
+        $p->setTo($jid)
+          ->setNickname($nickname)
+          ->request();
+    }
+
     function prepareChats()
     {
         $chats = Cache::c('chats');
@@ -60,7 +71,8 @@ class Chats extends WidgetCommon
         $view = $this->tpl();
 
         $cd = new \Modl\ContactDAO;
-
+        $cod = new \modl\ConferenceDAO();
+        
         foreach($chats as $jid => $value) {
             $cr = $cd->getRosterItem($jid);
             if(isset($cr)) {
@@ -69,12 +81,20 @@ class Chats extends WidgetCommon
                 $chats[$jid] = $cd->get($jid);
             }
         }
-
+        
+        $view->assign('conferences', $cod->getAll());
         $view->assign('chats', array_reverse($chats));
         
         return $view->draw('_chats', true);
     }
 
+    function prepareChatrooms()
+    {
+
+
+        return $view->draw('_chatrooms', true);
+    }
+
     function display()
     {
         $this->view->assign('list', $this->prepareChats());

app/widgets/Chats/_chatrooms.tpl

@@ -0,0 +1 @@
+

app/widgets/Chats/_chats.tpl

@@ -9,3 +9,12 @@
         <span>{$value->getTrueName()}</span>
     </li>
 {/loop}
+<li class="subheader">
+    Chatrooms **FIXME**
+</li>
+{loop="$conferences"}
+    <li  data-jid="{$value->conference}">
+        <span class="icon bubble color {$value->name|stringToColor}">{$value->name|firstLetterCapitalize}</span>
+        <span>{$value->name}</span>
+    </li>
+{/loop}

app/widgets/Chats/chats.js

@@ -1,6 +1,6 @@
 var Chats = {
     refresh: function() {
-        var items = document.querySelectorAll('ul#chats_widget_list li');
+        var items = document.querySelectorAll('ul#chats_widget_list li:not(.subheader)');
         var i = 0;
         while(i < items.length)
         {

app/widgets/Header/_header_main.tpl

@@ -1,5 +1,16 @@
 <header id="header">
     <span id="menu" class="on_mobile icon" onclick="MovimTpl.showMenu()"><i class="md md-menu"></i></span>
     <span class="on_desktop icon"><i class="md md-speaker-notes"></i></span>
-    <h2>{$c->__('page.news')}</h2>
+    <form>
+        <div>
+            <div class="select">
+                <select name="language" id="language">
+                    <option onclick="Menu_ajaxGetAll()" selected="selected" value="all">All **FIXME*</option>
+                    <option onclick="Menu_ajaxGetNews()" value="news">News</option>
+                    <option onclick="Menu_ajaxGetFeed()" value="contacts">Contacts</option>
+                </select>
+            </div>
+        </div>
+    </form>
+    <!--<h2>{$c->__('page.news')}</h2>-->
 </header>

app/widgets/Menu/Menu.php

@@ -27,6 +27,76 @@ class Menu extends WidgetCommon
         }
     }
 
+    function ajaxGetAll($page = 0)
+    {
+        $this->prepareList('all', null, null, $page);
+    }
+
+    function ajaxGetNews($page = 0)
+    {
+        $this->prepareList('news', null, null, $page);
+    }
+
+    function ajaxGetFeed($page = 0)
+    {
+        $this->prepareList('feed', null, null, $page);
+    }
+
+    function ajaxGetNode($server = null, $node = null, $page = 0)
+    {
+        $this->prepareList('node', $server, $node, $page);
+    }
+
+    function prepareList($type = 'all', $server = null, $node = null, $page = 0) {
+
+        $view = $this->tpl();
+        $pd = new \Modl\PostnDAO;
+
+        Cache::c('since', date(DATE_ISO8601, strtotime($pd->getLastDate())));
+
+        $next = $page + 1;
+
+        switch($type) {
+            case 'all' :
+                $view->assign('history', $this->call('ajaxGetAll', $next));
+                $items  = $pd->getAllPosts(false, $page*$this->_paging, $this->_paging);
+                break;
+            case 'news' :
+                $view->assign('history', $this->call('ajaxGetNews', $next));
+                $items  = $pd->getNews($page*$this->_paging, $this->_paging);
+                break;
+            case 'feed' :
+                $view->assign('history', $this->call('ajaxGetFeed', $next));
+                $items  = $pd->getFeed($page*$this->_paging, $this->_paging);
+                break;
+            case 'node' :
+                $view->assign('history', $this->call('ajaxGetNode', '"'.$server.'"', '"'.$node.'"', $next));
+                $items  = $pd->getNode($server, $node, $page*$this->_paging, $this->_paging);
+                break;
+        }
+        /*
+        if($server == null || $node == null) {
+            $view->assign('history', $this->call('ajaxGetMenuList', "''", "''", $next));
+            $items  = $pd->getNews($page*$this->_paging, $this->_paging);
+        } else {
+            $view->assign('history', $this->call('ajaxGetMenuList', '"'.$server.'"', '"'.$node.'"', $next));
+            $items  = $pd->getNode($server, $node, $page*$this->_paging, $this->_paging);
+        }*/
+        
+        $view->assign('items', $items);
+        $view->assign('page', $page);
+
+        $html = $view->draw('_menu_list', true);
+
+        if($page > 0) {
+            RPC::call('movim_append', 'menu_widget', $html);
+        } else {
+            RPC::call('movim_fill', 'menu_widget', $html);
+            RPC::call('movim_posts_unread', 0);
+        }
+        RPC::call('Menu.refresh');
+    }
+
     function ajaxGetMenuList($server = null, $node = null, $page = 0)
     {
         $html = $this->prepareMenuList($server, $node, $page);

app/widgets/Menu/_menu_list.tpl

@@ -5,14 +5,29 @@
             <li class="condensed" data-id="{$value->nodeid}">
                 {if="current(explode('.', $value->jid)) == 'nsfw'"}
                     <span class="icon bubble color red">
-                        <i class="fa fa-exclamation-triangle"></i>
+                        <i class="md md-warning"></i>
                     </span>
+                {elseif="$value->node == 'urn:xmpp:microblog:0'"}
+                    <span class="icon bubble color {$value->jid|stringToColor}">
+                        <i class="md md-create"></i>
+                    </span>                    
                 {else}
                     <span class="icon bubble color {$value->node|stringToColor}">{$value->node|firstLetterCapitalize}</span>
                 {/if}
 
-                <span>{$value->title}</span><span class="info">{$value->published|strtotime|prepareDate}</span>
-                <p class="wrap">{$value->node}</p>
+                {if="$value->title != null"}
+                    <span>{$value->title}</span>
+                {else}
+                    <span>{$c->__('menu.contact_post')}</span>
+                {/if}
+
+                <span class="info">{$value->published|strtotime|prepareDate}</span>
+                
+                {if="$value->node == 'urn:xmpp:microblog:0'"}
+                    <p class="wrap">{$value->jid}</p>
+                {else}
+                    <p class="wrap">{$value->node}</p>
+                {/if}
             </li>
         {/loop}
 

app/widgets/Menu/locales.ini

@@ -1,2 +1,3 @@
 menu.empty_title    = 'Hello'
+menu.contact_post   = 'Contact post'
 menu.empty          = 'Welcome on your news feed, here you will see all the posts published in the groups you have subscribed.'

app/widgets/Post/_post.tpl

@@ -13,7 +13,11 @@
                 <a href="{$c->route('node', array($post->jid, $post->node))}">
                     <span class="icon bubble color {$post->node|stringToColor}">{$post->node|firstLetterCapitalize}</span>
                 </a>
-                <span>{$post->title}</span>
+                {if="$post->title != null"}
+                    <span>{$post->title}</span>
+                {else}
+                    <span>{$c->__('post.default_title')}</span>
+                {/if}
                 <p>{$post->published|strtotime|prepareDate}</p>
             </li>
         </ul>

app/widgets/Post/_post_header.tpl

@@ -1,7 +1,11 @@
-<span id="back" class="on_mobile icon" onclick="MovimTpl.hidePanel()"><i class="md md-arrow-back"></i></span>
-<span class="on_desktop icon" onclick="MovimTpl.hidePanel()"><i class="md md-textsms"></i></span>
+<span id="back" class="icon" onclick="MovimTpl.hidePanel()"><i class="md md-arrow-back"></i></span>
+
 {if="$post != null"}
-    <h2>{$post->title}</h2>
+    {if="$post->title != null"}
+        <h2>{$post->title}</h2>
+    {else}
+        <h2>{$c->__('post.default_title')}</h2>
+    {/if}
 {else}
     <h2>Empty</h2>
 {/if}

app/widgets/Post/locales.ini

@@ -1,2 +1,3 @@
 post.news_feed      = 'News Feed'
+post.default_title  = 'Contact publication'
 post.placeholder    = 'Discover and register to the groups you are interested in'

app/widgets/Vcard4/locales.ini

@@ -1,4 +1,4 @@
-data.title          = 'Data'
+vcard.title         = 'Profile'
 vcard.updated       = 'Profile Updated'
 vcard.not_updated   = 'Profile Not Updated'
 vcard.public        = 'Your profile is now public'

app/widgets/Vcard4/vcard4.tpl

@@ -1,4 +1,4 @@
-<div class="tabelem padded" title="{$c->__('Data')}" id="vcard4" >
+<div class="tabelem padded" title="{$c->__('vcard.title')}" id="vcard4" >
     {if="!isset($me->jid)"}
         <script type="text/javascript">
             MovimWebsocket.attach(function() {

themes/material/css/color.css

@@ -72,14 +72,14 @@ form input:focus + label,
 form textarea:focus + label {
     color: #2196F3;
 }
-
+*/
 form input:focus:invalid {
-    border-bottom: 2px solid #F44336;
+    border-bottom-color: #F44336;
 }
 form input:focus:invalid + label {
     color: #F44336;
 }
-
+/*
 form input:focus:valid {
     border-bottom: 2px solid #4CAF50;
 }
@@ -93,11 +93,9 @@ form input:focus:valid + label {
 body.indigo .button.color,
 body.indigo input[type=button].color,
 body.indigo ul li span.counter,
-body.indigo .oppose .bubble,
 body.indigo main > header { background-color: #3F51B5; color: white; border-color: #3F51B5; }
 
 /* 200 */
-body.indigo .oppose .bubble a,
 body.indigo main > header a { color: #9fa8da; }
 
 body.indigo .tabs,
@@ -129,7 +127,6 @@ body.indigo form textarea:focus:not(:invalid) {
 body.gray .button.color,
 body.gray input[type=button].color,
 body.gray ul li span.counter,
-body.gray .oppose .bubble,
 body.gray main > header { background-color: #9E9E9E; color: white; border-color: #9E9E9E; }
 
 body.gray .tabs,
@@ -161,12 +158,10 @@ body.gray form textarea:focus:not(:invalid) {
 
 body.green .button.color,
 body.green input[type=button].color,
-body.green .oppose .bubble,
 body.green ul li span.counter,
 body.green main > header { background-color: #689F38; color: white; border-color: #689F38; }
 
 /* 200 */
-body.green .oppose .bubble a,
 body.green main > header a { color: #DCEDC8; }
 
 body.green .tabs,
@@ -199,7 +194,6 @@ body.green form textarea:focus:not(:invalid) {
 body.orange .button.color, 
 body.orange input[type=button].color,
 body.orange ul li span.counter,
-body.orange .oppose .bubble,
 body.orange main > header { background-color: #FB8C00; color: white; border-color: #FB8C00; }
 
 body.orange .tabs,
@@ -232,11 +226,9 @@ body.orange form textarea:focus:not(:invalid) {
 body.blue .button.color, 
 body.blue input[type=button].color,
 body.blue ul li span.counter,
-body.blue .oppose .bubble,
 body.blue main > header { background-color: #2196F3; color: white; border-color: #2196F3; }
 
 /* 200 */
-body.blue .oppose .bubble a,
 body.blue main > header a { color: #90caf9; }
 
 body.blue .tabs,
@@ -269,7 +261,6 @@ body.blue form textarea:focus:not(:invalid) {
 body.red .button.color, 
 body.red input[type=button].color,
 body.red ul li span.counter,
-body.red .oppose .bubble,
 body.red main > header { background-color: #DB4336; color: white; border-color: #DB4336; }
 
 body.red .tabs,

themes/material/css/form.css

@@ -1,7 +1,7 @@
 /* Form */
 
 form > div:not(.clear):not(.control) {
-    min-height: 9rem;
+    min-height: 9.5rem;
     position: relative;
     box-sizing: border-box;
 }
@@ -22,29 +22,24 @@ form > div > label {
 form > div > textarea {
     border: none;
     resize: none;
-    font-size: 2rem;
     font-family: sans-serif;
     line-height: 3rem;
     box-sizing: border-box;
 }
 
 form > div > .select {
-    font-size: 2rem;
-    margin-top: 4.2rem;
-    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
-    padding-bottom: 1rem;
-    overflow: hidden;
+    position: relative;
 }
 
-
-form > div > .select:before {
+form > div > .select:after {
     font-family: "Material Design Iconic Font";
     content: "\f295";
     display: block;
     font-size: 4rem;
-    margin-bottom: -4rem;
-    float: right;
     color: #B8B8B8;
+    position: absolute;
+    right: 0;
+    bottom: 0.25rem;
 }
 
 form > div > .select select {
@@ -52,6 +47,33 @@ form > div > .select select {
     background-color: transparent;
 }
 
+main > header form > div:not(.clear):not(.control) {
+    min-height: 0;
+}
+
+main > header form > div:not(.clear):not(.control) > .select {
+    margin-top: 1.5rem;
+    padding-top: 0.4rem;
+    width: calc(25% - 9rem);
+}
+
+@media screen and (max-width: 1024px) {
+    main > header form > div:not(.clear):not(.control) > .select {
+        width: calc(100% - 1rem);
+    }
+}
+
+main > header form > div:not(.clear):not(.control) > .select option {
+    background-color: white;
+    color: initial;
+}
+
+main > header form > div:not(.clear):not(.control) > .select:after,
+main > header form > div:not(.clear):not(.control) > .select select {
+    color: white;
+}
+
+form > div > .select,
 form > div > input:not([type=submit]),
 form > div > textarea {
     display: block;

themes/material/css/style.css

@@ -83,7 +83,7 @@ h3 { /* Title */
     font-weight: 700;
 }
 
-h4, input { /* Headline */
+h4, input, textarea, select { /* Headline */
     font-size: 2rem;
     line-height: 3rem;
 }