- Rewrite the CSS of the posts enclosures + add new icons

- Fix the displayed avatar for the Groups
12 years ago · 5b9001001e
27 changed files with 248 additions and 82 deletions
--- a/app/models/contact/Contact.php
+++ b/app/models/contact/Contact.php
@ -207,9 +207,9 @@ class Contact extends ModlModel {
                    $out = base_convert($jid, 32, 8);
                    
                    if($out == false)
-                        $out[4] = 1;
+                        $out[3] = 1;
    
-                    return BASE_URI.'/themes/movim/img/default'.$out[4].'.svg';
+                    return BASE_URI.'/themes/movim/img/default'.$out[3].'.svg';
                }
            } else {
                $out = base_convert(md5(openssl_random_pseudo_bytes(5)), 16, 8);
--- a/app/widgets/Visio/visio.css
+++ b/app/widgets/Visio/visio.css
@ -48,7 +48,7 @@ body {
    top: 50%;
    max-width: 200px;
    margin-left: -100px;
-    margin-top: -150px;
+    margin-top: -160px;
 }

 #visio #avatar img {
@ -69,6 +69,13 @@ body {
    font-size: 1.6em;
 }

+#visio #avatar #status {
+    color: white;
+    text-align: center;
+    margin-top: 1em;
+    line-height: 1.5em;
+}
+
 #visio #remote-video,
 #visio #local-video {
    position: absolute;
@ -84,7 +91,6 @@ body {
    position: absolute;
    top: 0;
    left: 0;
-    display: none;
 }

 #visio #log div {
--- a/app/widgets/Visio/visio.js
+++ b/app/widgets/Visio/visio.js
@ -139,7 +139,7 @@ var Visio = {
 movim_add_onload(function()
 {
    document.getElementById("call").onclick = function() { init(true); };
-    document.getElementById("hang-up").onclick = function() { terminate(); };
+    document.getElementById("hang-up").onclick = function() { sendTerminate('success'); terminate(); };
    document.getElementById("toggle-screen").onclick = function() { Visio.fullScreen(); };
    document.getElementById("toggle-camera").onclick = function() { Visio.toggleVideoMute(); };
    document.getElementById("toggle-microphone").onclick = function() { Visio.toggleAudioMute(); };
--- a/app/widgets/Visio/visio.tpl
+++ b/app/widgets/Visio/visio.tpl
@ -12,6 +12,7 @@
    <div id="avatar">
        <img src="{$avatar}"/>
        <span class="name">{$name}</span>
+        <div id="status"></div>
    </div>
    <div class="menu">
        <a id="toggle-microphone" class="button color icon microphone alone merged right oppose">
--- a/app/widgets/Visio/webrtc.js
+++ b/app/widgets/Visio/webrtc.js
@ -97,6 +97,10 @@ function onIceCandidate(event) {
 */
 }

+function sendTerminate(reason) {
+    Visio.call(['VisioExt_ajaxSendSessionTerminate', VISIO_JID, VISIO_RESSOURCE, reason]);
+}
+
 function sendMessage(msg, accept) {
    offer = {};
    offer.sdp = msg.sdp;
@ -148,6 +152,7 @@ function onSetSessionDescriptionSuccess() {

 function onSetSessionDescriptionError(error) {
    Visio.log('Failed to set local session description: ' + error.toString());
+    sendTerminate('failed-application');
 }

 function onSetRemoteSessionDescriptionSuccess() {
@ -155,9 +160,8 @@ function onSetRemoteSessionDescriptionSuccess() {
 }

 function onSetRemoteSessionDescriptionError(error) {
-    //console.log('gnap');
-    console.log(error);
    Visio.log('Failed to set remote session description: ' + error.message);
+    sendTerminate('failed-application');
 }

 function onOffer(offer) {
@ -165,8 +169,6 @@ function onOffer(offer) {
    
    Visio.log('Offer received.');
    Visio.log('OFFER ' + offer);
-
-    console.log(offer);
      
    if(!pc)
        init(false);
@ -176,14 +178,9 @@ function onOffer(offer) {
        var message = {};
        message.sdp = offer;
        message.type = 'offer';
-        console.log(message);
+
        var desc = new RTCSessionDescription(message);
-        console.log(desc);
-        /*
-        var desc = new RTCSessionDescription();
-        desc.sdp = offer;
-        desc.type = 'offer';
-        */
+
        pc.setRemoteDescription(desc,
            onSetRemoteSessionDescriptionSuccess, onSetRemoteSessionDescriptionError);  
    }
@ -196,13 +193,7 @@ function onAccept(offer) {
    Visio.log('ACCEPT ' + offer);

    if(offer != null) {
-        //Visio.log('GN0P');
-        /*var message = {};
-        message.sdp = offer;
-        message.type = 'anwser';
-        console.log(message);*/
-        var desc = new RTCSessionDescription(/*message*/);
-        //console.log(desc);
+        var desc = new RTCSessionDescription();
        desc.sdp = offer;
        desc.type = 'answer';
        
@ -220,7 +211,6 @@ function onCandidate(message) {
    var candidate = new RTCIceCandidate({sdpMLineIndex: label[message[1]],
                                         candidate: message[0]});

-    //console.log(candidate);
    pc.addIceCandidate(candidate, onRemoteIceCandidateAdded, onRemoteIceCandidateError);
 }

@ -272,14 +262,13 @@ function init(isCaller) {
                pc.createOffer(onOfferCreated, onError);
            else
                pc.createAnswer(onAnswerCreated, onError);
-            
-            //pc.createOffer(onOfferCreated, onError);
        },

        // Error Callback
        function(err) {
            // Log the error to the console.
            Visio.log('The following error occurred when trying to use getUserMedia: ' + err);
+            sendTerminate('decline');
        }


@ -287,20 +276,19 @@ function init(isCaller) {
    } else {
        alert('Sorry, your browser does not support getUserMedia');
    }
-
-    console.log(pc);
 }

 function terminate() {
    // We close the RTCPeerConnection
-    pc.close();
+    console.log(pc);
+    if(pc != null && pc.signalingState != 'closed')
+        pc.close();

    // We close the local webcam and microphone
-    localStream.stop();
+    if(localStream != null)
+        localStream.stop();
    remoteStream = null;
    
-    Visio.call(['VisioExt_ajaxSendSessionTerminate', VISIO_JID, VISIO_RESSOURCE]);
-    
    // Get a reference to the video elements on the page.
    var vid = document.getElementById('local-video');
    var rvid = document.getElementById('remote-video');
--- a/app/widgets/VisioExt/VisioExt.php
+++ b/app/widgets/VisioExt/VisioExt.php
@ -58,6 +58,47 @@ class VisioExt extends WidgetBase
    }
    
    function onSessionTerminate($jingle) {
+        $message = '';
+        
+        switch($jingle->reason->children()->getName()) {
+            case 'success':
+                $message = t('Hung up');
+                break;
+                
+            case 'busy':
+                $message = t('Your contact is busy');
+                break;
+                
+            case 'decline':
+                $message = t('Declined');
+                break;
+                
+            case 'unsupported-transports':
+
+                break;
+                
+            case 'failed-transport':
+
+                break;
+                
+            case 'unsupported-applications':
+
+                break;
+                
+            case 'failed-application':
+                $message = t('Remote application incompatible');
+                break;
+                
+            case 'incompatible-parameters':
+
+                break;
+
+            default:
+                $message = t('Unknown error');
+                break;
+        }
+                
+        RPC::call('Popup.call', 'movim_fill', 'status', $message);
        RPC::call('Popup.call', 'terminate');
    }

@ -99,14 +140,18 @@ class VisioExt extends WidgetBase
          ->request();
    }

-    function ajaxSendSessionTerminate($jid, $ressource) {
+    function ajaxSendSessionTerminate($jid, $ressource, $reason = null) {
        $s = Session::start('movim');
        $jingleSid = $s->get("jingleSid");
        
        $r = new moxl\JingleSessionTerminate();
-        $r->setTo($jid.'/'.$ressource)
-          ->setJingleSid($jingleSid)
-          ->request();
+        $r->setTo($jid.'/'.$ressource);
+        $r->setJingleSid($jingleSid);
+
+        if(isset($reason))
+            $r->setReason($reason);
+
+        $r->request();
    }

    function ajaxSendCandidate($candidate) {
--- a/app/widgets/WidgetCommon/WidgetCommon.php
+++ b/app/widgets/WidgetCommon/WidgetCommon.php
@ -50,9 +50,12 @@ class WidgetCommon extends WidgetBase {
                $flagcolor='orange';
                $access .= 'protect orange';
            }
-                
+
            $avatar = $post->getContact()->getPhoto('m');
-        } else 
+        // A little hack which display a colored avatar for the Groups
+        } elseif(!filter_var($post->jid, FILTER_VALIDATE_EMAIL) && $post->node != '') {
+            $avatar = $post->getContact()->getPhoto('m', $post->node);
+        } else
            $avatar = $post->getContact()->getPhoto('m');
            
        if(!filter_var($post->jid, FILTER_VALIDATE_EMAIL) && $post->node != '')
@ -99,7 +102,7 @@ class WidgetCommon extends WidgetBase {
                
        if(isset($enc) && $enc != '') {
            $enc = '
-                <div class="enclosure">'.
+                <div class="enclosures">'.
                    $enc.
                '
                    <div class="clear"></div>
@ -218,26 +221,36 @@ class WidgetCommon extends WidgetBase {
                case 'enclosure' :
                    if(in_array($l['type'], array('image/jpeg', 'image/png', 'image/jpg'))) {
                        $enc .= '
-                            <a href="'.$l['href'].'" class="imglink" target="_blank">
-                                <img src="'.$l['href'].'"/>
+                            <a
+                                href="'.$l['href'].'"
+                                class="enclosure"
+                                type="'.$l['type'].'"
+                                target="_blank"><img
+                                    src="'.$l['href'].'"/>
                            </a>';
-                    } elseif(in_array($l['type'], array('audio/mpeg', 'audio/ogg'))) {
+                    /*} elseif(in_array($l['type'], array('audio/mpeg', 'audio/ogg'))) {
                        $enc .= '
                            <audio controls>
                                <source src="'.$l['href'].'" type="'.$l['type'].'">
                            </audio> ';
-                    } else {
+                    }*/} else {
                        $enc .= '
-                            <a href="'.$l['href'].'" target="_blank">
-                                '.$l['href'].'
+                            <a
+                                href="'.$l['href'].'"
+                                class="enclosure"
+                                type="'.$l['type'].'"
+                                target="_blank">'.$l['href'].'
                            </a>';
                    }
                    break;
                case 'alternate' :
                    $url = parse_url($l['href']);
                    $enc .= '
-                        <a href="'.$l['href'].'" class="imglink" target="_blank">
-                            <img class="icon" src="http://g.etfv.co/'.$l['href'].'"/>'.$url['scheme'].'://'.$url['host'].$url['path'].'
+                        <a
+                            href="'.$l['href'].'"
+                            class="alternate"
+                            target="_blank"><img
+                                src="http://g.etfv.co/'.$l['href'].'"/>'.$url['scheme'].'://'.$url['host'].$url['path'].'
                        </a>';
                    break;
            }
--- a/themes/movim/css/posts.css
+++ b/themes/movim/css/posts.css
@ -215,7 +215,8 @@ article p.summary {
    font-style:italic;
 }

-article .enclosure {
+/* Enclosures */
+article .enclosures {
    line-height: 1em;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
@ -224,6 +225,47 @@ article .enclosure {
    padding: 1em 0;
 }

+article .enclosures .enclosure,
+article .enclosures .alternate {
+    line-height: 2em;
+    display: block;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+article .enclosures .alternate img,
+article .enclosures .enclosure:before {
+    width: 16px;
+    height: 16px;
+    display: inline-block;
+    background-size: 16px 16px;
+    margin-bottom: -0.2em;
+    margin-right: 0.5em;
+}
+
+article .enclosures .enclosure:before {
+    content: '';
+    background-image: url(../img/icons/gray/file.svg);
+}
+
+article .enclosures .enclosure[type='application/x-bittorrent']:before {
+    background-image: url(../img/icons/gray/file-xml.svg);
+}
+
+article .enclosures .enclosure[type='image/jpeg']:before,
+article .enclosures .enclosure[type='image/png']:before,
+article .enclosures .enclosure[type='image/jpg']:before {
+    content: none;
+}
+
+article .enclosures .enclosure[type='image/jpeg'] img,
+article .enclosures .enclosure[type='image/png']  img
+article .enclosures .enclosure[type='image/jpg']  img{
+    max-height: 15em;
+}
+
+/* Others usefull elements */
 article span.tag {
    font-weight: normal;

@ -240,64 +282,39 @@ article span.recycle,
 article span.group {
    display: inline-block;
    padding-left: 2em;
+    
    font-weight: normal;
-    margin-top: 0.5em;
    float: right;
    margin-left: 1em;
    padding-right: 0.5em;
    line-height: 2em;
    max-width: 300px;
+
+    background-size: 16px 16px;
+    background-repeat: no-repeat;
+    background-position: 0 0.5em;
+    
    white-space: nowrap;  
    overflow: hidden;
    text-overflow: ellipsis;
 }

 article span.place {
-    background: url(../img/icons/place.png) 0 0.5em no-repeat;
+    background-image: url(../img/icons/gray/earth.svg);
 }

 article span.recycle {
-    background: url(../img/icons/recycle.png) 0 0.5em no-repeat;
+    background-image: url(../img/icons/gray/loop.svg);
 }

 article span.group {
-    background: url(../img/icons/users.png) 0 0.5em no-repeat;
+    background-image: url(../img/icons/gray/users.svg);
 }

 article .content i, article .content em { font-style: italic; }
 article .content b, article .content strong { font-weight: bold; }
 article .content u, article .content a { text-decoration: underline; }

-article .enclosure a {
-    display: inline-block;
-    height: auto;
-    width: 100%;
-    line-height: 1.5em;
-
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-}
-
-article a.imglink img {
-    max-height: 400px;
-    width: 100%;
-}
-
-article .enclosure a.imglink img {
-    max-height: 200px;
-    max-width: 100%;
-    width: auto;
-    margin-bottom: -0.2em;
-}
-
-article .enclosure a.imglink img.icon {
-    max-height: 24px;
-    margin-right: 0.5em;
-    min-width: 16px;
-    min-height: 16px;
-}
-
 article .content img,
 article .content video {
    max-width: 100%;
--- a/themes/movim/img/icons/gray/earth.svg
+++ b/themes/movim/img/icons/gray/earth.svg
@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generated by IcoMoon.io -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32">
+	<path d="M27.314 4.686c3.022 3.022 4.686 7.040 4.686 11.314s-1.664 8.292-4.686 11.314c-3.022 3.022-7.040 4.686-11.314 4.686-4.274 0-8.292-1.664-11.314-4.686-3.022-3.022-4.686-7.040-4.686-11.314 0-4.274 1.664-8.292 4.686-11.314 3.022-3.022 7.040-4.686 11.314-4.686 4.274 0 8.292 1.664 11.314 4.686zM25.899 25.9c1.971-1.971 3.281-4.425 3.821-7.096-0.421 0.62-0.824 0.85-1.073-0.538-0.257-2.262-2.335-0.817-3.641-1.621-1.375 0.927-4.466-1.802-3.941 1.276 0.81 1.388 4.375-1.858 2.598 1.079-1.134 2.050-4.145 6.592-3.753 8.946 0.049 3.43-3.504 0.715-4.729-0.422-0.824-2.279-0.281-6.262-2.434-7.378-2.338-0.102-4.344-0.314-5.25-2.927-0.545-1.87 0.58-4.653 2.584-5.083 2.933-1.843 3.98 2.158 6.731 2.232 0.854-0.894 3.182-1.178 3.375-2.18-1.805-0.318 2.29-1.517-0.173-2.199-1.358 0.16-2.234 1.409-1.512 2.467-2.632 0.614-2.717-3.809-5.247-2.414-0.064 2.206-4.132 0.715-1.407 0.268 0.936-0.409-1.527-1.594-0.196-1.379 0.654-0.036 2.854-0.807 2.259-1.325 1.225-0.761 2.255 1.822 3.454-0.059 0.866-1.446-0.363-1.713-1.448-0.98-0.612-0.685 1.080-2.165 2.573-2.804 0.497-0.213 0.973-0.329 1.336-0.296 0.752 0.868 2.142 1.019 2.215-0.104-1.862-0.892-3.915-1.363-6.040-1.363-3.051 0-5.952 0.969-8.353 2.762 0.645 0.296 1.012 0.664 0.39 1.134-0.483 1.439-2.443 3.371-4.163 3.098-0.893 1.54-1.482 3.238-1.733 5.017 1.441 0.477 1.773 1.42 1.464 1.736-0.734 0.64-1.185 1.548-1.418 2.541 0.469 2.87 1.818 5.515 3.915 7.612 2.644 2.644 6.16 4.1 9.899 4.1 3.739 0 7.255-1.456 9.899-4.1z" fill="#333333" />
+</svg>
--- a/themes/movim/img/icons/gray/file-css.svg
+++ b/themes/movim/img/icons/gray/file-css.svg
@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generated by IcoMoon.io -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32">
+	<path d="M12 19.108v-3.57c0-0.473 0.209-0.92 0.589-1.259 0.38-0.339 0.881-0.526 1.411-0.526v-1.785c-2.2 0-4 1.606-4 3.569v2.677c0 0.493-0.448 0.892-1 0.892h-1v1.785h1c0.552 0 1 0.4 1 0.892v2.677c0 1.963 1.8 3.569 4 3.569v-1.785c-0.53 0-1.031-0.187-1.411-0.526-0.38-0.339-0.589-0.786-0.589-1.259v-3.57c0-0.493-0.448-0.892-1-0.892 0.552 0 1-0.4 1-0.892zM20 20.892v3.57c0 0.473-0.209 0.92-0.589 1.259-0.38 0.339-0.881 0.526-1.411 0.526v1.785c2.2 0 4-1.606 4-3.569v-2.677c0-0.493 0.448-0.892 1-0.892h1v-1.785h-1c-0.552 0-1-0.4-1-0.892v-2.677c0-1.963-1.8-3.569-4-3.569v1.785c0.53 0 1.031 0.187 1.411 0.526 0.38 0.339 0.589 0.786 0.589 1.259v3.57c0 0.493 0.448 0.892 1 0.892-0.552-0-1 0.4-1 0.892zM28.232 6.232l-4.465-4.464c-0.972-0.972-2.893-1.768-4.268-1.768h-15c-1.375 0-2.5 1.125-2.5 2.5v27c0 1.375 1.125 2.5 2.5 2.5h23c1.375 0 2.5-1.125 2.5-2.5v-19c0-1.375-0.796-3.296-1.768-4.268zM26.818 7.646c0.098 0.098 0.195 0.218 0.29 0.354h-5.108v-5.108c0.136 0.095 0.256 0.192 0.354 0.29l4.465 4.464zM28 29.5c0 0.271-0.229 0.5-0.5 0.5h-23c-0.271 0-0.5-0.229-0.5-0.5v-27c0-0.271 0.229-0.5 0.5-0.5h15c0.151 0 0.32 0.019 0.5 0.053v7.947h7.947c0.034 0.18 0.053 0.349 0.053 0.5v19z" fill="#333333" />
+</svg>
--- a/themes/movim/img/icons/gray/file-excel.svg
+++ b/themes/movim/img/icons/gray/file-excel.svg
@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generated by IcoMoon.io -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32">
+	<path d="M23.22 12h-4.228l-2.992 4.407-2.992-4.407h-4.228l5.068 7.577-5.718 8.423h8.195v-2.862h-1.892l1.567-2.344 3.481 5.205h4.389l-5.718-8.423zM28.232 6.232l-4.465-4.464c-0.972-0.972-2.893-1.768-4.268-1.768h-15c-1.375 0-2.5 1.125-2.5 2.5v27c0 1.375 1.125 2.5 2.5 2.5h23c1.375 0 2.5-1.125 2.5-2.5v-19c0-1.375-0.796-3.296-1.768-4.268zM26.818 7.646c0.098 0.098 0.195 0.218 0.29 0.354h-5.108v-5.108c0.136 0.095 0.256 0.192 0.354 0.29l4.465 4.464zM28 29.5c0 0.271-0.229 0.5-0.5 0.5h-23c-0.271 0-0.5-0.229-0.5-0.5v-27c0-0.271 0.229-0.5 0.5-0.5h15c0.151 0 0.32 0.019 0.5 0.053v7.947h7.947c0.034 0.18 0.053 0.349 0.053 0.5v19z" fill="#333333" />
+</svg>
--- a/themes/movim/img/icons/gray/file-openoffice.svg
+++ b/themes/movim/img/icons/gray/file-openoffice.svg
@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generated by IcoMoon.io -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32">
+	<path d="M21.569 14.74c-1.896-0.895-4.312-1.076-6.089 0.189 2.161-0.206 4.53 0.151 6.097 1.785 1.5-1.721 3.879-2.044 6.030-1.867-1.796-1.192-4.163-1.032-6.038-0.107zM20.802 18.93c-2.137-0.049-4.201 0.724-5.972 1.878-3.349-1.425-7.585-1.16-10.438 1.218 0.823-0.029 1.625-0.233 2.439-0.337 2.974-0.296 6.143 0.442 8.391 2.494 0.93-1.361 2.239-2.445 3.739-3.123 1.971-0.954 4.192-1.053 6.338-1.079-1.303-0.895-2.957-1.061-4.498-1.052zM28.232 6.232l-4.465-4.464c-0.972-0.972-2.893-1.768-4.268-1.768h-15c-1.375 0-2.5 1.125-2.5 2.5v27c0 1.375 1.125 2.5 2.5 2.5h23c1.375 0 2.5-1.125 2.5-2.5v-19c0-1.375-0.796-3.296-1.768-4.268zM26.818 7.646c0.098 0.098 0.195 0.218 0.29 0.354h-5.108v-5.108c0.136 0.095 0.256 0.192 0.354 0.29l4.465 4.464zM28 29.5c0 0.271-0.229 0.5-0.5 0.5h-23c-0.271 0-0.5-0.229-0.5-0.5v-27c0-0.271 0.229-0.5 0.5-0.5h15c0.151 0 0.32 0.019 0.5 0.053v7.947h7.947c0.034 0.18 0.053 0.349 0.053 0.5v19z" fill="#333333" />
+</svg>
--- a/themes/movim/img/icons/gray/file-pdf.svg
+++ b/themes/movim/img/icons/gray/file-pdf.svg
@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generated by IcoMoon.io -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32">
+	<path d="M26.313 18.421c-0.427-0.42-1.372-0.643-2.812-0.662-0.974-0.011-2.147 0.075-3.38 0.248-0.552-0.319-1.122-0.665-1.568-1.083-1.202-1.122-2.205-2.68-2.831-4.394 0.041-0.16 0.075-0.301 0.108-0.444 0 0 0.677-3.846 0.498-5.146-0.025-0.178-0.040-0.23-0.088-0.369l-0.059-0.151c-0.184-0.425-0.545-0.875-1.111-0.85l-0.341-0.011c-0.631 0-1.146 0.323-1.281 0.805-0.411 1.514 0.013 3.778 0.781 6.711l-0.197 0.478c-0.55 1.34-1.238 2.689-1.846 3.88l-0.079 0.155c-0.639 1.251-1.22 2.313-1.745 3.213l-0.543 0.287c-0.040 0.021-0.97 0.513-1.188 0.645-1.852 1.106-3.079 2.361-3.282 3.357-0.065 0.318-0.017 0.725 0.313 0.913l0.525 0.264c0.228 0.114 0.468 0.172 0.714 0.172 1.319 0 2.85-1.643 4.959-5.324 2.435-0.793 5.208-1.452 7.638-1.815 1.852 1.043 4.129 1.767 5.567 1.767 0.255 0 0.475-0.024 0.654-0.072 0.276-0.073 0.508-0.23 0.65-0.444 0.279-0.42 0.335-0.998 0.26-1.59-0.023-0.176-0.163-0.393-0.315-0.541zM6.614 25.439c0.24-0.658 1.192-1.958 2.6-3.111 0.088-0.072 0.306-0.276 0.506-0.466-1.472 2.348-2.458 3.283-3.106 3.577zM14.951 6.24c0.424 0 0.665 1.069 0.685 2.070s-0.214 1.705-0.505 2.225c-0.241-0.77-0.357-1.984-0.357-2.778 0 0-0.018-1.517 0.177-1.517zM12.464 19.922c0.295-0.529 0.603-1.086 0.917-1.677 0.765-1.447 1.249-2.58 1.609-3.511 0.716 1.303 1.608 2.41 2.656 3.297 0.131 0.111 0.269 0.222 0.415 0.333-2.132 0.422-3.974 0.935-5.596 1.558zM25.903 19.802c-0.13 0.081-0.502 0.128-0.741 0.128-0.772 0-1.727-0.353-3.066-0.927 0.515-0.038 0.986-0.057 1.409-0.057 0.774 0 1.004-0.003 1.761 0.19s0.767 0.585 0.637 0.667zM28.232 6.232l-4.465-4.464c-0.972-0.972-2.893-1.768-4.268-1.768h-15c-1.375 0-2.5 1.125-2.5 2.5v27c0 1.375 1.125 2.5 2.5 2.5h23c1.375 0 2.5-1.125 2.5-2.5v-19c0-1.375-0.796-3.296-1.768-4.268zM26.818 7.646c0.098 0.098 0.195 0.218 0.29 0.354h-5.108v-5.108c0.136 0.095 0.256 0.192 0.354 0.29l4.465 4.464zM28 29.5c0 0.271-0.229 0.5-0.5 0.5h-23c-0.271 0-0.5-0.229-0.5-0.5v-27c0-0.271 0.229-0.5 0.5-0.5h15c0.151 0 0.32 0.019 0.5 0.053v7.947h7.947c0.034 0.18 0.053 0.349 0.053 0.5v19z" fill="#333333" />
+</svg>
--- a/themes/movim/img/icons/gray/file-powerpoint.svg
+++ b/themes/movim/img/icons/gray/file-powerpoint.svg
@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generated by IcoMoon.io -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32">
+	<path d="M6 16h6v2h-6v-2zM6 20h6v2h-6v-2zM6 24h6v2h-6v-2zM28.232 6.232l-4.465-4.464c-0.972-0.972-2.893-1.768-4.268-1.768h-15c-1.375 0-2.5 1.125-2.5 2.5v27c0 1.375 1.125 2.5 2.5 2.5h23c1.375 0 2.5-1.125 2.5-2.5v-19c0-1.375-0.796-3.296-1.768-4.268zM26.818 7.646c0.098 0.098 0.195 0.218 0.29 0.354h-5.108v-5.108c0.136 0.095 0.256 0.192 0.354 0.29l4.465 4.464zM28 29.5c0 0.271-0.229 0.5-0.5 0.5h-23c-0.271 0-0.5-0.229-0.5-0.5v-27c0-0.271 0.229-0.5 0.5-0.5h15c0.151 0 0.32 0.019 0.5 0.053v7.947h7.947c0.034 0.18 0.053 0.349 0.053 0.5v19zM18 22h5.9c-0.463 2.282-2.481 4-4.9 4-2.761 0-5-2.239-5-5 0-2.419 1.718-4.436 4-4.9v5.9zM21 14c2.761 0 5 2.239 5 5 0 0.342-0.035 0.677-0.1 1h-5.9v-5.9c0.323-0.066 0.658-0.1 1-0.1z" fill="#333333" />
+</svg>
--- a/themes/movim/img/icons/gray/file-word.svg
+++ b/themes/movim/img/icons/gray/file-word.svg
@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generated by IcoMoon.io -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32">
+	<path d="M19.993 14.872h1.382l-1.594 7.068-2.073-9.938h-3.33l-2.41 9.938-1.807-9.938h-3.481l3.534 15.996h3.401l2.384-9.46 2.133 9.46h3.136l4.051-15.996h-5.326zM28.232 6.232l-4.465-4.464c-0.972-0.972-2.893-1.768-4.268-1.768h-15c-1.375 0-2.5 1.125-2.5 2.5v27c0 1.375 1.125 2.5 2.5 2.5h23c1.375 0 2.5-1.125 2.5-2.5v-19c0-1.375-0.796-3.296-1.768-4.268zM26.818 7.646c0.098 0.098 0.195 0.218 0.29 0.354h-5.108v-5.108c0.136 0.095 0.256 0.192 0.354 0.29l4.465 4.464zM28 29.5c0 0.271-0.229 0.5-0.5 0.5h-23c-0.271 0-0.5-0.229-0.5-0.5v-27c0-0.271 0.229-0.5 0.5-0.5h15c0.151 0 0.32 0.019 0.5 0.053v7.947h7.947c0.034 0.18 0.053 0.349 0.053 0.5v19z" fill="#333333" />
+</svg>
--- a/themes/movim/img/icons/gray/file-xml.svg
+++ b/themes/movim/img/icons/gray/file-xml.svg
@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generated by IcoMoon.io -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32">
+	<path d="M14 18l-2-2-6 6 6 6 2-2-4-4zM18 26l2 2 6-6-6-6-2 2 4 4zM28.232 6.232l-4.465-4.464c-0.972-0.972-2.893-1.768-4.268-1.768h-15c-1.375 0-2.5 1.125-2.5 2.5v27c0 1.375 1.125 2.5 2.5 2.5h23c1.375 0 2.5-1.125 2.5-2.5v-19c0-1.375-0.796-3.296-1.768-4.268zM26.818 7.646c0.098 0.098 0.195 0.218 0.29 0.354h-5.108v-5.108c0.136 0.095 0.256 0.192 0.354 0.29l4.465 4.464zM28 29.5c0 0.271-0.229 0.5-0.5 0.5h-23c-0.271 0-0.5-0.229-0.5-0.5v-27c0-0.271 0.229-0.5 0.5-0.5h15c0.151 0 0.32 0.019 0.5 0.053v7.947h7.947c0.034 0.18 0.053 0.349 0.053 0.5v19z" fill="#333333" />
+</svg>
--- a/themes/movim/img/icons/gray/file-zip.svg
+++ b/themes/movim/img/icons/gray/file-zip.svg
@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generated by IcoMoon.io -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32">
+	<path d="M13 4h3v2h-3zM10 6h3v2h-3zM13 8h3v2h-3zM10 10h3v2h-3zM13 12h3v2h-3zM10 14h3v2h-3zM13 16v2h-3v7c0 0.552 0.448 1 1 1h4c0.552 0 1-0.448 1-1v-9h-3zM15 24h-4v-2h4v2zM28.232 6.232l-4.465-4.464c-0.972-0.972-2.893-1.768-4.268-1.768h-15c-1.375 0-2.5 1.125-2.5 2.5v27c0 1.375 1.125 2.5 2.5 2.5h23c1.375 0 2.5-1.125 2.5-2.5v-19c0-1.375-0.796-3.296-1.768-4.268zM26.818 7.646c0.098 0.098 0.195 0.218 0.29 0.354h-5.108v-5.108c0.136 0.095 0.256 0.192 0.354 0.29l4.465 4.464zM28 29.5c0 0.271-0.229 0.5-0.5 0.5h-23c-0.271 0-0.5-0.229-0.5-0.5v-27c0-0.271 0.229-0.5 0.5-0.5h15c0.151 0 0.32 0.019 0.5 0.053v7.947h7.947c0.034 0.18 0.053 0.349 0.053 0.5v19z" fill="#333333" />
+</svg>
--- a/themes/movim/img/icons/gray/file.svg
+++ b/themes/movim/img/icons/gray/file.svg
@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generated by IcoMoon.io -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32">
+	<path d="M28.232 6.232l-4.465-4.464c-0.972-0.972-2.893-1.768-4.268-1.768h-15c-1.375 0-2.5 1.125-2.5 2.5v27c0 1.375 1.125 2.5 2.5 2.5h23c1.375 0 2.5-1.125 2.5-2.5v-19c0-1.375-0.796-3.296-1.768-4.268zM26.818 7.646c0.098 0.098 0.195 0.218 0.29 0.354h-5.108v-5.108c0.136 0.095 0.256 0.192 0.354 0.29l4.465 4.464zM28 29.5c0 0.271-0.229 0.5-0.5 0.5h-23c-0.271 0-0.5-0.229-0.5-0.5v-27c0-0.271 0.229-0.5 0.5-0.5h15c0.151 0 0.32 0.019 0.5 0.053v7.947h7.947c0.034 0.18 0.053 0.349 0.053 0.5v19z" fill="#333333" />
+</svg>
--- a/themes/movim/img/icons/gray/film.svg
+++ b/themes/movim/img/icons/gray/film.svg
@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generated by IcoMoon.io -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32">
+	<path d="M0 4v24h32v-24h-32zM6 26h-4v-4h4v4zM6 18h-4v-4h4v4zM6 10h-4v-4h4v4zM24 26h-16v-20h16v20zM30 26h-4v-4h4v4zM30 18h-4v-4h4v4zM30 10h-4v-4h4v4zM12 10v12l8-6z" fill="#333333" />
+</svg>
--- a/themes/movim/img/icons/gray/image.svg
+++ b/themes/movim/img/icons/gray/image.svg
@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generated by IcoMoon.io -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32">
+	<path d="M0 4v26h32v-26h-32zM30 28h-28v-22h28v22zM22 11c0-1.657 1.343-3 3-3s3 1.343 3 3c0 1.657-1.343 3-3 3-1.657 0-3-1.343-3-3zM28 26h-24l6-16 8 10 4-3z" fill="#333333" />
+</svg>
--- a/themes/movim/img/icons/gray/link.svg
+++ b/themes/movim/img/icons/gray/link.svg
@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generated by IcoMoon.io -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32">
+	<path d="M29.794 2.333l-0.126-0.126c-2.942-2.942-7.756-2.942-10.698 0l-6.816 6.817c-2.942 2.942-2.942 7.756 0 10.697l0.126 0.126c0.245 0.245 0.505 0.466 0.773 0.671l2.495-2.495c-0.291-0.172-0.566-0.377-0.816-0.627l-0.126-0.126c-1.597-1.597-1.597-4.196 0-5.793l6.816-6.816c1.597-1.597 4.196-1.597 5.793 0l0.126 0.126c1.597 1.597 1.597 4.197 0 5.793l-3.084 3.084c0.535 1.322 0.789 2.731 0.767 4.137l4.769-4.769c2.942-2.942 2.942-7.756-0-10.697zM19.72 12.154c-0.245-0.245-0.505-0.466-0.773-0.67l-2.495 2.495c0.291 0.172 0.566 0.377 0.816 0.627l0.126 0.126c1.597 1.597 1.597 4.196 0 5.793l-6.817 6.817c-1.597 1.597-4.196 1.597-5.793 0l-0.126-0.126c-1.597-1.598-1.597-4.196 0-5.793l3.084-3.084c-0.535-1.322-0.789-2.731-0.767-4.137l-4.769 4.769c-2.942 2.942-2.942 7.756 0 10.698l0.126 0.126c2.942 2.942 7.756 2.942 10.698 0l6.816-6.816c2.942-2.942 2.942-7.756 0-10.698l-0.126-0.126z" fill="#333333" />
+</svg>
--- a/themes/movim/img/icons/gray/loop.svg
+++ b/themes/movim/img/icons/gray/loop.svg
@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generated by IcoMoon.io -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32">
+	<path d="M10 20v-6h6l-8-8-8 8h6v10h12l-4-4zM26 18v-10h-12l4 4h4v6h-6l8 8 8-8z" fill="#333333" />
+</svg>
--- a/themes/movim/img/icons/gray/music.svg
+++ b/themes/movim/img/icons/gray/music.svg
@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generated by IcoMoon.io -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32">
+	<path d="M10 6l22-6v23c0 2.761-3.134 5-7 5s-7-2.239-7-5c0-2.761 3.134-5 7-5 1.074 0 2.091 0.173 3 0.481v-10.3l-14 3.818v15c0 2.761-3.134 5-7 5-3.866 0-7-2.239-7-5 0-2.761 3.134-5 7-5 1.074 0 2.091 0.173 3 0.481v-16.481z" fill="#333333" />
+</svg>
--- a/themes/movim/img/icons/gray/users.svg
+++ b/themes/movim/img/icons/gray/users.svg
@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generated by IcoMoon.io -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32">
+	<path d="M22.969 25.168c-0.592-0.093-0.606-1.708-0.606-1.708s1.74-1.708 2.119-4.005c1.020 0 1.65-2.442 0.63-3.301 0.043-0.904 1.311-7.099-5.112-7.099-6.424 0-5.155 6.195-5.112 7.099-1.020 0.859-0.39 3.301 0.63 3.301 0.379 2.297 2.12 4.005 2.12 4.005s-0.014 1.615-0.606 1.708c-1.908 0.301-9.031 3.416-9.031 6.832h24c0-3.416-7.124-6.531-9.031-6.832zM10.752 25.713c1.378-0.848 3.051-1.635 4.423-2.107-0.492-0.701-1.040-1.654-1.385-2.783-0.481-0.393-0.873-0.954-1.125-1.644-0.252-0.691-0.348-1.464-0.269-2.178 0.056-0.512 0.202-0.99 0.427-1.409-0.136-1.456-0.232-4.314 1.639-6.398 0.725-0.808 1.642-1.389 2.741-1.74-0.196-2.024-1.224-4.399-5.202-4.399-6.424 0-5.155 6.195-5.112 7.099-1.020 0.859-0.39 3.301 0.63 3.301 0.379 2.297 2.12 4.005 2.12 4.005s-0.014 1.615-0.606 1.708c-1.908 0.301-9.031 3.416-9.031 6.832h10.3c0.147-0.096 0.297-0.192 0.452-0.287z" fill="#333333" />
+</svg>
--- a/themes/movim/img/icons/place.png
+++ b/themes/movim/img/icons/place.png
--- a/themes/movim/img/icons/recycle.png
+++ b/themes/movim/img/icons/recycle.png
--- a/themes/movim/img/icons/users.png
+++ b/themes/movim/img/icons/users.png