[ALL] setup for 'parcel bundler'
xdrm-brackets
|
|
@ -2,6 +2,7 @@
|
|||
.sass-cache
|
||||
*.map
|
||||
/node_modules
|
||||
/public_html/css
|
||||
/public_html/js
|
||||
/public_html/*
|
||||
!/public_htm/.htaccess
|
||||
/package-lock.json
|
||||
.cache
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
{
|
||||
"modules": false,
|
||||
"plugins": {
|
||||
"autoprefixer": true
|
||||
}
|
||||
}
|
||||
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.6 KiB |
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.6 KiB |
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.6 KiB |
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.6 KiB |
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.6 KiB |
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.6 KiB |
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.6 KiB |
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.6 KiB |
|
Before Width: | Height: | Size: 930 B After Width: | Height: | Size: 930 B |
|
Before Width: | Height: | Size: 1.9 KiB After Width: | Height: | Size: 1.9 KiB |
|
Before Width: | Height: | Size: 1.8 KiB After Width: | Height: | Size: 1.8 KiB |
|
Before Width: | Height: | Size: 3.4 KiB After Width: | Height: | Size: 3.4 KiB |
|
Before Width: | Height: | Size: 3.4 KiB After Width: | Height: | Size: 3.4 KiB |
|
Before Width: | Height: | Size: 801 B After Width: | Height: | Size: 801 B |
|
Before Width: | Height: | Size: 2.1 KiB After Width: | Height: | Size: 2.1 KiB |
|
Before Width: | Height: | Size: 768 B After Width: | Height: | Size: 768 B |
|
Before Width: | Height: | Size: 2.0 KiB After Width: | Height: | Size: 2.0 KiB |
|
Before Width: | Height: | Size: 928 B After Width: | Height: | Size: 928 B |
|
Before Width: | Height: | Size: 2.8 KiB After Width: | Height: | Size: 2.8 KiB |
|
Before Width: | Height: | Size: 2.8 KiB After Width: | Height: | Size: 2.8 KiB |
|
Before Width: | Height: | Size: 2.0 KiB After Width: | Height: | Size: 2.0 KiB |
|
Before Width: | Height: | Size: 295 B After Width: | Height: | Size: 295 B |
|
Before Width: | Height: | Size: 226 B After Width: | Height: | Size: 226 B |
|
Before Width: | Height: | Size: 214 B After Width: | Height: | Size: 214 B |
|
Before Width: | Height: | Size: 1.9 KiB After Width: | Height: | Size: 1.9 KiB |
|
Before Width: | Height: | Size: 2.2 KiB After Width: | Height: | Size: 2.2 KiB |
|
Before Width: | Height: | Size: 450 B After Width: | Height: | Size: 450 B |
|
Before Width: | Height: | Size: 402 B After Width: | Height: | Size: 402 B |
|
Before Width: | Height: | Size: 1.9 KiB After Width: | Height: | Size: 1.9 KiB |
|
Before Width: | Height: | Size: 1.9 KiB After Width: | Height: | Size: 1.9 KiB |
|
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.4 KiB |
|
|
@ -0,0 +1,39 @@
|
|||
<html>
|
||||
|
||||
<!-- HEADER -->
|
||||
<head>
|
||||
<title>Douscord</title>
|
||||
|
||||
<!-- META -->
|
||||
<meta charset='utf-8'>
|
||||
<meta name='author' content='xdrm-brackets (Adrien Marquès)'>
|
||||
<meta name='description' content='[Home] Home page'>
|
||||
|
||||
<!-- STYLESHEET -->
|
||||
<link type='text/css' rel='stylesheet' href='./scss/layout.scss'>
|
||||
<link type='text/css' rel='stylesheet' href='./scss/global.scss'>
|
||||
<link type='text/css' rel='stylesheet' href='./scss/menu.scss'>
|
||||
<link type='text/css' rel='stylesheet' href='./scss/dialog.scss'>
|
||||
<link type='text/css' rel='stylesheet' href='./scss/side-menu.scss'>
|
||||
<link type='text/css' rel='stylesheet' href='./scss/container.scss'>
|
||||
<link type='text/css' rel='stylesheet' href='./scss/pop-up.scss'>
|
||||
|
||||
<!-- FONT -->
|
||||
<link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro" rel="stylesheet">
|
||||
|
||||
<!-- SCRIPTS -->
|
||||
<script type='/text/javascript' src='./webpack/page/auth/channel.js'></script>
|
||||
<script type='/text/javascript' src='./webpack/page/noauth/login.js'></script>
|
||||
|
||||
<!-- BODY -->
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id='vue'></div>
|
||||
|
||||
|
||||
<script type='text/javascript' src='./webpack/main.js'></script>
|
||||
</body>
|
||||
|
||||
|
||||
</html>
|
||||
35
package.json
|
|
@ -6,19 +6,13 @@
|
|||
"license": "MIT",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"bundle:clean": "exit 0",
|
||||
"bundle:prod": "cross-env NODE_ENV=production webpack --progress --hide-modules",
|
||||
"bundle:dev": "cross-env NODE_ENV=development webpack --progress --hide-modules",
|
||||
"bundle:watch": "cross-env NODE_ENV=development webpack --progress --watch --hide-modules",
|
||||
"scss": "node-sass -r --output-style compressed --output ./public_html/css ./webpack/scss",
|
||||
"watch-css": "node-sass -w -r --output-style compressed --output ./public_html/css ./webpack/scss",
|
||||
"dev": "npm run bundle:clean; npm run bundle:dev; npm run watch-css",
|
||||
"devjs": "npm run bundle:clean; npm run bundle:watch",
|
||||
"build": "npm run bundle:clean; npm run bundle:prod; npm run scss"
|
||||
"clean": "rm ./public_html/*.{js,css,html,svg,map}",
|
||||
"dev": "parcel index.html --out-dir ./public_html",
|
||||
"build": "parcel build index.html --out-dir ./public_html"
|
||||
},
|
||||
"dependencies": {
|
||||
"uglifyjs-webpack-plugin": "^1.2.3",
|
||||
"vue": "^2.5.9",
|
||||
"vue-hot-reload-api": "^2.3.0",
|
||||
"vue-router": "^2.5.3"
|
||||
},
|
||||
"browserslist": [
|
||||
|
|
@ -27,20 +21,11 @@
|
|||
"not ie <= 8"
|
||||
],
|
||||
"devDependencies": {
|
||||
"babel-core": "^6.26.0",
|
||||
"babel-loader": "^7.1.2",
|
||||
"cross-env": "^5.0.5",
|
||||
"babel-preset-env": "^1.6.0",
|
||||
"babel-preset-stage-3": "^6.24.1",
|
||||
"css-loader": "^0.28.7",
|
||||
"extract-text-webpack-plugin": "^3.0.2",
|
||||
"file-loader": "^1.1.4",
|
||||
"node-sass": "^4.7.2",
|
||||
"sass-loader": "^6.0.6",
|
||||
"vue-loader": "^13.0.5",
|
||||
"vue-svg-loader": "^0.5.0",
|
||||
"vue-template-compiler": "^2.5.9",
|
||||
"webpack": "^3.8.1",
|
||||
"webpack-dev-server": "^2.9.5"
|
||||
"@vue/component-compiler-utils": "^1.0.0",
|
||||
"babel-cli": "^6.26.0",
|
||||
"babel-preset-env": "^1.6.1",
|
||||
"node-sass": "^4.8.3",
|
||||
"parcel-bundler": "^1.7.0",
|
||||
"vue-template-compiler": "^2.5.16"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,36 +1 @@
|
|||
<html>
|
||||
|
||||
<!-- HEADER -->
|
||||
<head>
|
||||
<title>Douscord</title>
|
||||
|
||||
<!-- META -->
|
||||
<meta charset='utf-8'>
|
||||
<meta name='author' content='xdrm-brackets (Adrien Marquès)'>
|
||||
<meta name='description' content='[Home] Home page'>
|
||||
|
||||
<!-- STYLESHEET -->
|
||||
<link type='text/css' rel='stylesheet' href='./css/layout.css'>
|
||||
<link type='text/css' rel='stylesheet' href='./css/global.css'>
|
||||
<link type='text/css' rel='stylesheet' href='./css/menu.css'>
|
||||
<link type='text/css' rel='stylesheet' href='./css/dialog.css'>
|
||||
<link type='text/css' rel='stylesheet' href='./css/side-menu.css'>
|
||||
<link type='text/css' rel='stylesheet' href='./css/container.css'>
|
||||
<link type='text/css' rel='stylesheet' href='./css/pop-up.css'>
|
||||
|
||||
<!-- FONT -->
|
||||
<link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro" rel="stylesheet">
|
||||
|
||||
|
||||
<!-- BODY -->
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id='vue'></div>
|
||||
|
||||
|
||||
<script type='text/javascript' src='./js/bundle.js'></script>
|
||||
</body>
|
||||
|
||||
|
||||
</html>
|
||||
<html> <head> <title>Douscord</title> <meta charset="utf-8"> <meta name="author" content="xdrm-brackets (Adrien Marquès)"> <meta name="description" content="[Home] Home page"> <link type="text/css" rel="stylesheet" href="/layout.ab4d0007.css"> <link type="text/css" rel="stylesheet" href="/global.d996701a.css"> <link type="text/css" rel="stylesheet" href="/menu.e694b334.css"> <link type="text/css" rel="stylesheet" href="/dialog.6fa52644.css"> <link type="text/css" rel="stylesheet" href="/side-menu.e104f256.css"> <link type="text/css" rel="stylesheet" href="/container.31553847.css"> <link type="text/css" rel="stylesheet" href="/pop-up.abd69e60.css"> <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro" rel="stylesheet"> <script type="/text/javascript" src="/channel.b456b40a.js"></script> <script type="/text/javascript" src="/login.3e6290e9.js"></script> </head> <body> <div id="vue"></div> <script src="/main.79f2b3b0.js"></script> </body> </html>
|
||||
|
|
@ -298,7 +298,7 @@
|
|||
|
||||
border-radius: 5px / 5px;
|
||||
|
||||
background: url('/asset/svg/audio.close.svg') center center no-repeat;
|
||||
background: url('../asset/svg/audio.close.svg') center center no-repeat;
|
||||
background-size: auto 60%;
|
||||
|
||||
transition: background-color .1s ease-in-out;
|
||||
|
|
@ -330,7 +330,7 @@
|
|||
width: 1.5em;
|
||||
height: 1em;
|
||||
|
||||
background: url('/asset/svg/voice.connected.svg') center center no-repeat;
|
||||
background: url('../asset/svg/voice.connected.svg') center center no-repeat;
|
||||
background-size: auto 85%;
|
||||
}
|
||||
|
||||
|
|
@ -338,4 +338,88 @@
|
|||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
@keyframes scale-up{
|
||||
0%{ transform: scale(0); }
|
||||
100%{ transform: scale(1); }
|
||||
}
|
||||
|
||||
.minipopup{
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: calc( 100% - 2*1em );
|
||||
height: auto;
|
||||
|
||||
margin: .7em 1em;
|
||||
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 2px 10 0 rgba(0,0,0,.5);
|
||||
|
||||
background-color: #ffffff;
|
||||
|
||||
will-change: transform;
|
||||
transform-origin: 100% 0;
|
||||
|
||||
animation: scale-up .3s ease-in-out;
|
||||
|
||||
|
||||
|
||||
overflow: hidden;
|
||||
|
||||
z-index: 100;
|
||||
|
||||
& > span{
|
||||
|
||||
display: block;
|
||||
position: relative;
|
||||
|
||||
padding: .7em 1em;
|
||||
padding-left: 3em;
|
||||
|
||||
background-color: #fff;
|
||||
background: url('../asset/svg/minipopup.invite.svg') left 1em center no-repeat;
|
||||
background-size: auto 45%;
|
||||
|
||||
color: #99aab5;
|
||||
font-size: .85em;
|
||||
letter-spacing: .05em;
|
||||
white-space: nowrap;
|
||||
|
||||
cursor: pointer;
|
||||
|
||||
transition: background-color .2s ease-in-out,
|
||||
color .2s ease-in-out;
|
||||
|
||||
|
||||
&[data-icon='create']{ background-image: url('../asset/svg/minipopup.create.svg'); }
|
||||
&[data-icon='category']{ background-image: url('../asset/svg/minipopup.category.svg'); }
|
||||
&[data-icon='edit']{ background-image: url('../asset/svg/minipopup.edit.svg'); }
|
||||
&[data-icon='remove']{ background-image: url('../asset/svg/minipopup.remove.svg'); }
|
||||
&[data-icon='remove']{ background-image: url('../asset/svg/minipopup.remove.svg'); }
|
||||
&[data-icon='logout']{ background-image: url('../asset/svg/minipopup.logout.svg'); }
|
||||
&[data-icon='leave']{ background-image: url('../asset/svg/minipopup.leave.svg'); }
|
||||
&[data-icon='password']{ background-image: url('../asset/svg/minipopup.password.svg'); }
|
||||
|
||||
&:hover{ background-color: #f9f9f9; color: #737f8d; }
|
||||
|
||||
/* separators */
|
||||
/*after*/ &.sa{ border-bottom: 1px solid #f3f3f3; }
|
||||
/*before*/ &.sb{ border-top: 1px solid #f3f3f3; }
|
||||
|
||||
&.special{
|
||||
color: #7289da;
|
||||
|
||||
&:hover{ color: #677bc4; }
|
||||
}
|
||||
|
||||
&.invalid{ color: #e65835; }
|
||||
|
||||
&.invalid-h:hover{ color: #e65835; }
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
|
@ -7,7 +7,6 @@ import noauth_wrapper from './vue/noauth/wrapper.vue'
|
|||
/* (1) Setup: Vue, VueRouter, Authentication, ClientDriver-s */
|
||||
require('./setup.js');
|
||||
|
||||
|
||||
/* (2) Set router hooks to load page data before loading content */
|
||||
gs.get.router.beforeEach((to, from, next) => {
|
||||
|
||||
|
|
@ -18,10 +17,15 @@ gs.get.router.beforeEach((to, from, next) => {
|
|||
// {2} Get appropriate page location //
|
||||
let auth_folder = (gs.get.authed) ? 'auth' : 'noauth';
|
||||
let page_file = to.name || gs.get.routes[auth_folder][0].name;
|
||||
let fullpath = `${auth_folder}/${page_file}`;
|
||||
|
||||
// {3} Load page script //
|
||||
require(`./page/${auth_folder}/${page_file}.js`);
|
||||
// console.log(`./page/${auth_folder}/${page_file}.js`);
|
||||
if( fullpath === 'noauth/login')
|
||||
require('./page/noauth/login.js');
|
||||
else if( fullpath === 'noauth/register')
|
||||
require('./page/noauth/register.js');
|
||||
else if( fullpath === 'auth/channel')
|
||||
require('./page/auth/channel.js');
|
||||
|
||||
// {4} Let VueRouter do the magic //
|
||||
next();
|
||||
|
|
|
|||
|
|
@ -3,7 +3,6 @@ import ContentController from '../../lib/content-controller'
|
|||
import RoomController from '../../lib/room-controller'
|
||||
import ChannelController from '../../lib/channel-controller'
|
||||
|
||||
|
||||
/* (1) Channel data gathering
|
||||
---------------------------------------------------------*/
|
||||
/* (1) Store route params */
|
||||
|
|
|
|||
|
|
@ -1,91 +1,3 @@
|
|||
<style lang="scss">
|
||||
|
||||
@keyframes scale-up{
|
||||
0%{ transform: scale(0); }
|
||||
100%{ transform: scale(1); }
|
||||
}
|
||||
|
||||
.minipopup{
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: calc( 100% - 2*1em );
|
||||
height: auto;
|
||||
|
||||
margin: .7em 1em;
|
||||
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 2px 10 0 rgba(0,0,0,.5);
|
||||
|
||||
background-color: #ffffff;
|
||||
|
||||
will-change: transform;
|
||||
transform-origin: 100% 0;
|
||||
|
||||
animation: scale-up .3s ease-in-out;
|
||||
|
||||
|
||||
|
||||
overflow: hidden;
|
||||
|
||||
z-index: 100;
|
||||
|
||||
& > span{
|
||||
|
||||
display: block;
|
||||
position: relative;
|
||||
|
||||
padding: .7em 1em;
|
||||
padding-left: 3em;
|
||||
|
||||
background-color: #fff;
|
||||
background: url('/asset/svg/minipopup.invite.svg') left 1em center no-repeat;
|
||||
background-size: auto 45%;
|
||||
|
||||
color: #99aab5;
|
||||
font-size: .85em;
|
||||
letter-spacing: .05em;
|
||||
white-space: nowrap;
|
||||
|
||||
cursor: pointer;
|
||||
|
||||
transition: background-color .2s ease-in-out,
|
||||
color .2s ease-in-out;
|
||||
|
||||
|
||||
&[data-icon='create']{ background-image: url('/asset/svg/minipopup.create.svg'); }
|
||||
&[data-icon='category']{ background-image: url('/asset/svg/minipopup.category.svg'); }
|
||||
&[data-icon='edit']{ background-image: url('/asset/svg/minipopup.edit.svg'); }
|
||||
&[data-icon='remove']{ background-image: url('/asset/svg/minipopup.remove.svg'); }
|
||||
&[data-icon='remove']{ background-image: url('/asset/svg/minipopup.remove.svg'); }
|
||||
&[data-icon='logout']{ background-image: url('/asset/svg/minipopup.logout.svg'); }
|
||||
&[data-icon='leave']{ background-image: url('/asset/svg/minipopup.leave.svg'); }
|
||||
&[data-icon='password']{ background-image: url('/asset/svg/minipopup.password.svg'); }
|
||||
|
||||
&:hover{ background-color: #f9f9f9; color: #737f8d; }
|
||||
|
||||
/* separators */
|
||||
/*after*/ &.sa{ border-bottom: 1px solid #f3f3f3; }
|
||||
/*before*/ &.sb{ border-top: 1px solid #f3f3f3; }
|
||||
|
||||
&.special{
|
||||
color: #7289da;
|
||||
|
||||
&:hover{ color: #677bc4; }
|
||||
}
|
||||
|
||||
&.invalid{ color: #e65835; }
|
||||
|
||||
&.invalid-h:hover{ color: #e65835; }
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
</style>
|
||||
<template>
|
||||
|
||||
|
||||
|
|
|
|||