maxmod + router-like system with URL
This commit is contained in:
xdrm-brackets
parent
6bcc725d31
commit
092836359b
|
|
@ -0,0 +1,48 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
version="1.1"
|
||||
viewBox="0 0 27.264933 27.91894"
|
||||
xml:space="preserve"
|
||||
id="svg4192"
|
||||
inkscape:version="0.91 r13725"
|
||||
sodipodi:docname="bell.svg"
|
||||
width="27.264933"
|
||||
height="27.91894"><metadata
|
||||
id="metadata4208"><rdf:RDF><cc:Work
|
||||
rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /><dc:title /></cc:Work></rdf:RDF></metadata><defs
|
||||
id="defs4206" /><sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1920"
|
||||
inkscape:window-height="1056"
|
||||
id="namedview4204"
|
||||
showgrid="false"
|
||||
fit-margin-top="0"
|
||||
fit-margin-left="0"
|
||||
fit-margin-right="0"
|
||||
fit-margin-bottom="0"
|
||||
inkscape:zoom="19.833333"
|
||||
inkscape:cx="13.632468"
|
||||
inkscape:cy="13.95947"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="24"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="svg4192" /><path
|
||||
style="fill:#303030"
|
||||
d="M 6.2334745,2.8200083 C 4.9127641,3.5825208 3.8161064,4.7610239 3.14727,6.1384613 2.5498244,7.3681209 2.2834618,8.7361758 2.3751714,10.096279 c 0.043636,0.640147 0.1754012,1.284037 0.4147444,2.024304 0.1433218,0.442894 0.3426228,0.863323 0.5348972,1.270792 0.1230364,0.261182 0.2467934,0.522849 0.3551845,0.78891 0.2587977,0.635917 0.5054067,1.323636 0.7550252,2.101857 0.3276133,1.024217 0.6186368,2.081206 0.8999229,3.103514 0.0989,0.358395 0.1976377,0.716604 0.2979726,1.074465 L 6.1312489,20.17241 21.384741,11.365802 21.883072,11.07809 C 21.519849,10.711677 21.152042,10.349241 20.782999,9.9885358 19.911961,9.1374768 19.01207,8.2573947 18.211279,7.3147403 17.868437,6.9109221 17.544935,6.4762407 17.233768,6.0559234 16.732049,5.3784772 16.213974,4.6773502 15.582176,4.0669455 14.542459,3.0625379 13.381494,2.3824444 12.131114,2.0476967 10.12185,1.5090318 8.0276696,1.7841293 6.2334745,2.8200083 Z M 5.333391,5.9884819 c 0.086873,-0.064846 0.2073855,-0.075858 0.3067679,-0.017718 0.1321312,0.076838 0.1767463,0.2471934 0.099228,0.3797021 -0.7782634,1.3313681 -0.9925158,2.8905071 -0.6355729,4.634773 0.024968,0.1208 -0.032221,0.23889 -0.1329585,0.297051 -0.025184,0.01454 -0.052988,0.0261 -0.083544,0.03211 C 4.7369552,11.3448 4.5900172,11.24694 4.5594892,11.097122 4.1794942,9.2408071 4.4212277,7.5028214 5.2591128,6.0707617 c 0.019458,-0.033177 0.045317,-0.060669 0.074276,-0.082285 z M 5.34982,12.270592 c 0.1416573,-0.05941 0.3044256,0.0069 0.3632978,0.148439 l 0.3167845,0.762725 c 0.054401,0.130674 0.00244,0.277978 -0.1167702,0.346804 -0.010412,0.006 -0.021841,0.01258 -0.033033,0.01722 -0.1416373,0.05944 -0.303839,-0.009 -0.3627124,-0.150525 L 5.1992603,12.63331 c -0.059261,-0.142191 0.00879,-0.305053 0.1505577,-0.36273 z m 0.4264062,8.747949 1.0636038,4.34864 c 0.052183,0.215234 0.1963741,0.388984 0.3982298,0.475715 0.2018063,0.08586 0.4292832,0.07273 0.6210275,-0.03797 l 7.4333247,-4.291631 0.482212,-0.278406 1.931536,-1.115172 0.482212,-0.278406 0.124919,-0.07212 7.096178,-4.09698 c 0.191408,-0.110509 0.316235,-0.299886 0.342055,-0.518065 0.02615,-0.21837 -0.05082,-0.430031 -0.211524,-0.58351 l -3.240947,-3.09155 -0.50236,0.290038 -15.5181062,8.959382 -0.5023606,0.290038 z m 9.8409238,0.926933 c 0.40791,0.374706 1.024929,0.464915 1.529429,0.173642 l 0.639368,-0.369139 c 0.5045,-0.291274 0.734886,-0.870732 0.614334,-1.411345 l -0.531911,0.307099 -1.719309,0.992644 -0.531911,0.307099 z"
|
||||
id="fill-edit"
|
||||
inkscape:connector-curvature="0" /></svg>
|
||||
|
After Width: | Height: | Size: 4.0 KiB |
|
|
@ -7,17 +7,18 @@
|
|||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
style="enable-background:new 0 0 24 24;"
|
||||
version="1.1"
|
||||
viewBox="0 0 24 24"
|
||||
viewBox="0 0 26.324236 19.183594"
|
||||
xml:space="preserve"
|
||||
id="svg4274"
|
||||
id="svg4176"
|
||||
inkscape:version="0.91 r13725"
|
||||
sodipodi:docname="messages.svg"><metadata
|
||||
id="metadata4283"><rdf:RDF><cc:Work
|
||||
sodipodi:docname="messages.svg"
|
||||
width="26.324236"
|
||||
height="19.183594"><metadata
|
||||
id="metadata4190"><rdf:RDF><cc:Work
|
||||
rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><defs
|
||||
id="defs4281" /><sodipodi:namedview
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /><dc:title></dc:title></cc:Work></rdf:RDF></metadata><defs
|
||||
id="defs4188" /><sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
|
|
@ -26,18 +27,22 @@
|
|||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="715"
|
||||
inkscape:window-height="480"
|
||||
id="namedview4279"
|
||||
inkscape:window-width="1920"
|
||||
inkscape:window-height="1056"
|
||||
id="namedview4186"
|
||||
showgrid="false"
|
||||
inkscape:zoom="9.8333333"
|
||||
inkscape:cx="12"
|
||||
inkscape:cy="12"
|
||||
fit-margin-top="0"
|
||||
fit-margin-left="0"
|
||||
fit-margin-right="0"
|
||||
fit-margin-bottom="0"
|
||||
inkscape:zoom="14.024284"
|
||||
inkscape:cx="14.033312"
|
||||
inkscape:cy="4.9732261"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="24"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:current-layer="svg4274" /><g
|
||||
id="info" /><path
|
||||
inkscape:connector-curvature="0"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="svg4176" /><path
|
||||
style="fill:#303030"
|
||||
d="M 2.048828,0 C 0.918458,0 0,0.922854 0,2.058594 l 0,10.851562 c 0,1.13086 0.918458,2.048829 2.048828,2.048829 l 2.634765,0 0,-0.699219 0,-9.759766 c 0,-1.13086 0.920412,-2.050781 2.050782,-2.050781 l 14.205078,0 0.701172,0 0,-0.390625 C 21.640615,0.922844 20.715828,0 19.580078,0 L 2.048828,0 Z m 5.552734,3.148438 c -1.55036,0 -2.216797,0.615655 -2.216797,2.166015 l 0,8.587891 c 0,1.54448 1.264114,2.808594 2.808594,2.808594 l 14.623047,0 c 0.19824,0 0.393551,0.06543 0.550781,0.185547 l 2.257813,1.732421 0.699218,0.554688 0,-14.673828 c 0,-0.0052 4e-5,-0.01039 0,-0.01563 -0.0059,-0.76167 -0.693388,-1.345703 -1.455078,-1.345703 l -0.605469,0 -16.662109,0 z m 3.212891,5.117187 9.378906,0 c 0.19336,0 0.349609,0.15625 0.349609,0.34961 0,0.193359 -0.156249,0.349609 -0.349609,0.349609 l -9.378906,0 c -0.19336,0 -0.34961,-0.15625 -0.34961,-0.349609 0,-0.19336 0.15625,-0.34961 0.34961,-0.34961 z m 1.634765,2.841797 6.109375,0 c 0.19336,0 0.351563,0.156249 0.351563,0.349609 0,0.19336 -0.158203,0.34961 -0.351563,0.34961 l -6.109375,0 c -0.19336,0 -0.349609,-0.15625 -0.349609,-0.34961 0,-0.19336 0.156249,-0.349609 0.349609,-0.349609 z"
|
||||
id="fill-edit"
|
||||
d="M 20,1 4,1 C 1.8,1 0,2.8 0,5 l 0,10 c 0,2.2 1.8,4 4,4 l 0,3 c 0,0.9 1.1,1.3 1.7,0.7 L 9.4,19 20,19 c 2.2,0 4,-1.8 4,-4 L 24,5 C 24,2.8 22.2,1 20,1 Z M 14,13 8,13 C 7.4,13 7,12.6 7,12 7,11.4 7.4,11 8,11 l 6,0 c 0.6,0 1,0.4 1,1 0,0.6 -0.4,1 -1,1 z M 16,9 8,9 C 7.4,9 7,8.6 7,8 7,7.4 7.4,7 8,7 l 8,0 c 0.6,0 1,0.4 1,1 0,0.6 -0.4,1 -1,1 z" /></svg>
|
||||
inkscape:connector-curvature="0" /></svg>
|
||||
|
Before Width: | Height: | Size: 1.8 KiB After Width: | Height: | Size: 2.7 KiB |
|
|
@ -52,6 +52,7 @@ window.wsc_connect = window.wsc.channel('connect').listen(function(msg, err){
|
|||
if( msg.connected != null ){
|
||||
console.log('Detected '+msg.connected.length+' new user(s)');
|
||||
window.gstore.data.notif[0].data = window.gstore.data.notif[0].data.concat( msg.connected );
|
||||
window.gstore.data.notif[0].count += msg.connected.length;
|
||||
}
|
||||
|
||||
}).send({name: window._SERVER.session.name});
|
||||
|
|
@ -71,7 +72,8 @@ window.wsc_chat = window.wsc.channel('chat').listen(function(msg, err){
|
|||
// {3} Manage notification //
|
||||
if( msg.msg != null ){
|
||||
console.log('Received '+msg.msg.length+' new message(s)');
|
||||
window.gstore.data.notif[1].data = window.gstore.data.notif[1].data.concat( msg.msg );
|
||||
window.gstore.data.notif[1].data = window.gstore.data.notif[1].data.concat( msg.msg );
|
||||
window.gstore.data.notif[1].count += msg.msg.length
|
||||
}
|
||||
|
||||
}).send({name: window._SERVER.session.name});
|
||||
|
|
|
|||
|
|
@ -10,10 +10,10 @@ window.gstore.add('info', {
|
|||
message: 'Warning! blabla'
|
||||
});
|
||||
window.gstore.add('notif', [
|
||||
{ class: 'bell', link: 'notifications', data: [] },
|
||||
{ class: 'message', link: 'inbox', data: [] },
|
||||
{ class: 'search', link: 'search', data: [] },
|
||||
{ class: 'menu', link: 'menu', data: [] }
|
||||
{ class: 'bell', link: 'notifications', data: [], count: 0 },
|
||||
{ class: 'message', link: 'inbox', data: [], count: 0 },
|
||||
{ class: 'search', link: 'search', data: [], count: 0 },
|
||||
{ class: 'menu', link: 'dashboard', data: [], count: 0 }
|
||||
])
|
||||
|
||||
// Menu
|
||||
|
|
@ -27,11 +27,25 @@ window.gstore.add('menu_item', {
|
|||
}, inbox: {
|
||||
label: 'Messagerie instantannée',
|
||||
icon: 'messages'
|
||||
}, notifications: {
|
||||
label: 'Notifications',
|
||||
icon: 'bell'
|
||||
}
|
||||
});
|
||||
window.gstore.add('menu_item_active', 'dashboard');
|
||||
window.gstore.add('min_menu', true);
|
||||
|
||||
window.gstore.add('URI', document.URL.replace(/^(?:\/\/|[^\/]+)*/, ''));
|
||||
window.gstore.add('min_menu', false);
|
||||
|
||||
// Proccess current page from url
|
||||
if( /^\/(\w+)(?:\/?.*)$/.test(window.gstore.data.URI) ){
|
||||
var mi_keys = Object.keys( window.gstore.data.menu_item );
|
||||
|
||||
// if current page exists
|
||||
if( !!~mi_keys.indexOf(RegExp.$1) ) window.gstore.add('menu_item_active', RegExp.$1);
|
||||
else window.gstore.add('menu_item_active', 'dashboard');
|
||||
|
||||
}else
|
||||
window.gstore.add('menu_item_active', 'dashboard');
|
||||
|
||||
// Functions
|
||||
window.gstore.add('func', {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,17 @@
|
|||
<template>
|
||||
|
||||
<div id='CONTAINER'>
|
||||
|
||||
DASHBOARD
|
||||
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'CONTAINER_DASHBOARD',
|
||||
data(){ return { gstore: window.gstore.data }; },
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<template>
|
||||
|
||||
<div id='CONTAINER'>
|
||||
|
||||
NOTIFICATIONS
|
||||
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'CONTAINER_NOTIFICATIONS',
|
||||
data(){ return { gstore: window.gstore.data }; },
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<template>
|
||||
|
||||
<div id='CONTAINER'>
|
||||
|
||||
PROFILE
|
||||
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'CONTAINER_PROFILE',
|
||||
data(){ return { gstore: window.gstore.data }; },
|
||||
}
|
||||
</script>
|
||||
|
|
@ -12,7 +12,7 @@
|
|||
|
||||
<!-- Header Notif -->
|
||||
<div id='header-notif'>
|
||||
<div v-for='notif in gstore.notif' :class='"hnotif " + notif.class' :data-count='notif.data.length'></div>
|
||||
<div v-for='(notif, index) in gstore.notif' @click='show_notif(index, notif.link)' :class='"hnotif " + notif.class' :data-count='notif.count'></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
@ -25,7 +25,14 @@ export default {
|
|||
name: 'HEADER',
|
||||
data(){ return { gstore: window.gstore.data }; },
|
||||
methods: {
|
||||
show_notif(){
|
||||
show_notif(index, link){
|
||||
|
||||
// {1} Load link //
|
||||
window.gstore.data.menu_item_active = link;
|
||||
|
||||
// {2} Reset notification count to 0 //
|
||||
window.gstore.data.notif[index].count = 0;
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -8,7 +8,10 @@
|
|||
<menu-comp></menu-comp>
|
||||
|
||||
<!-- Container -->
|
||||
<message-container v-show="gstore.menu_item_active == 'inbox'"></message-container>
|
||||
<dashboard-container v-show="gstore.menu_item_active == 'dashboard'" ></dashboard-container>
|
||||
<profile-container v-show="gstore.menu_item_active == 'profile'" ></profile-container>
|
||||
<message-container v-show="gstore.menu_item_active == 'inbox'" ></message-container>
|
||||
<notifications-container v-show="gstore.menu_item_active == 'notifications'" ></notifications-container>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -21,7 +24,11 @@
|
|||
|
||||
import header_vue from './header.vue';
|
||||
import menu_vue from './menu.vue';
|
||||
import messageContainer_vue from './container/message.vue';
|
||||
|
||||
import dashboardContainer_vue from './container/dashboard.vue';
|
||||
import profileContainer_vue from './container/profile.vue';
|
||||
import messageContainer_vue from './container/message.vue';
|
||||
import notificationsContainer_vue from './container/notifications.vue';
|
||||
|
||||
|
||||
export default {
|
||||
|
|
@ -30,9 +37,12 @@ export default {
|
|||
gstore: window.gstore.data
|
||||
}; },
|
||||
components: {
|
||||
'HeaderComp': header_vue,
|
||||
'MenuComp': menu_vue,
|
||||
'MessageContainer': messageContainer_vue
|
||||
'HeaderComp': header_vue,
|
||||
'MenuComp': menu_vue,
|
||||
'DashboardContainer': dashboardContainer_vue,
|
||||
'ProfileContainer': profileContainer_vue,
|
||||
'MessageContainer': messageContainer_vue,
|
||||
'NotificationsContainer': notificationsContainer_vue
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Loading…
Reference in New Issue