ki9
/
tracman-server
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

#100 Webpacked CSS

master
Keith Irwin 2017-06-30 16:38:30 -04:00
parent 9d9dc66cf0
commit f57101c18f
No known key found for this signature in database
GPG Key ID: 378933C743E2BBC0
19 changed files with 881 additions and 240 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
nodemon.json
View File

@ -1,4 +1,7 @@
{
"verbose": true,
"ext": "html, js, json, css"
"ext": "html, js, json, css",
"events": {
"start": "npm run build"
}
}

812
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

2
package.json
View File

@ -37,7 +37,9 @@
"devDependencies": {
"chai": "^4.0.2",
"chai-http": "^3.0.0",
"css-loader": "^0.28.4",
"nodemon": "^1.11.0",
"style-loader": "^0.18.2",
"supertest": "^3.0.0",
"webpack": "^3.0.0"
},

40
static/css/map.css
View File

@ -126,43 +126,3 @@ main {
height: 18px;
}
}
/* Control buttons */
#controls {
width: 100vw;
position: absolute;
bottom: 50px;
display: flex;
justify-content: space-around;
}
#controls .btn {
z-index: 50;
background: #222;
height: 10vh;
padding: 2vh 0;
}
#controls .btn .fa {
margin: 0 2vw;
}
#controls .btn:hover {
background: #333;
}
#controls .btn.set, #controls .btn.clear {
width: 30vw;
}
#controls .btn.track {
width: 35vw;
}
@media (max-width:250px) {
#controls .btn { font-size:.8em; }
}
@media (min-width:250px) and (max-width:350px) {
#controls .btn { font-size:1em; }
}
@media (min-width:350px) and (max-width:450px) {
#controls .btn { font-size:1.15em; }
}
@media (min-width:450px) {
#controls .btn { font-size:1.3em; }
}

2
static/js/footer.js
View File

@ -1,5 +1,7 @@
'use strict';
/* global $ */
import css from '../css/footer.css';
// Push footer to bottom on pages with little content
function setFooter(){

2
static/js/header.js
View File

@ -1,6 +1,8 @@
/* global $ */
'use strict';
import css from '../css/header.css';
$(document).ready(function(){
// Open drawer with hamburger

119
static/js/map-controls.js
View File

@ -1,119 +0,0 @@
'use strict';
/* global navigator $ socket userid token mapuser toggleMaps */
$(function(){
var wpid, newloc;
// Set location
$('#set-loc').click(function(){
if (!userid===mapuser._id){ alert('You are not logged in! '); }
else { if (!navigator.geolocation){ alert('Geolocation not enabled. '); }
else { navigator.geolocation.getCurrentPosition(
// Success callback
function(pos){
var newloc = {
ts: Date.now(),
tok: token,
usr: userid,
lat: pos.coords.latitude,
lon: pos.coords.longitude,
spd: (pos.coords.speed||0)
};
socket.emit('set', newloc);
toggleMaps(newloc);
console.log('⚜ Set location:',newloc.lat+", "+newloc.lon);
},
// Error callback
function(err) {
alert("Unable to set location.");
console.error('❌️',err.message);
},
// Options
{ enableHighAccuracy:true }
); } }
});
// Track location
$('#track-loc').click(function(){
if (!userid===mapuser._id) { alert('You are not logged in! '); }
else {
// Start tracking
if (!wpid) {
if (!navigator.geolocation) { alert('Unable to track location. '); }
else {
$('#track-loc').html('<i class="fa fa-crosshairs fa-spin"></i>Stop').prop('title',"Click here to stop tracking your location. ");
wpid = navigator.geolocation.watchPosition(
// Success callback
function(pos) {
newloc = {
ts: Date.now(),
tok: token,
usr: userid,
lat: pos.coords.latitude,
lon: pos.coords.longitude,
spd: (pos.coords.speed||0)
}; socket.emit('set',newloc);
toggleMaps(newloc);
console.log('⚜ Set location:',newloc.lat+", "+newloc.lon);
},
// Error callback
function(err){
alert("Unable to track location.");
console.error(err.message);
},
// Options
{ enableHighAccuracy:true }
);
}
}
// Stop tracking
else {
$('#track-loc').html('<i class="fa fa-crosshairs"></i>Track').prop('title',"Click here to track your location. ");
navigator.geolocation.clearWatch(wpid);
wpid = undefined;
}
}
});
// Clear location
$('#clear-loc').click(function(){
if (!userid===mapuser._id) { alert('You are not logged in! '); }
else {
// Stop tracking
if (wpid) {
$('#track-loc').html('<i class="fa fa-crosshairs"></i>Track');
navigator.geolocation.clearWatch(wpid);
wpid = undefined;
}
// Clear location
newloc = {
ts: Date.now(),
tok: token,
usr: userid,
lat:0, lon:0, spd:0
}; socket.emit('set',newloc);
// Turn off map
toggleMaps(newloc);
console.log('⚜ Cleared location');
}
});
});

2
static/js/map.js
View File

@ -1,6 +1,8 @@
'use strict';
/* global mapuser userid disp noHeader mapKey */
import css from '../css/map.css';
// Webpack imports
import io from 'socket.io-client';
import $ from 'jquery';

2
static/js/settings.js
View File

@ -1,6 +1,8 @@
'use strict';
/* global location $ */
import css from '../css/settings.css';
// Validate email addresses
function validateEmail(email) {
var re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;

6
views/admin.html
View File

@ -1,9 +1,9 @@
{% extends 'templates/base.html' %}
{% block title %}{{super()}} | Admin{% endblock %}
{% block head %}
{{ super() }}
<link rel="stylesheet" type="text/css" href="/static/css/.table.min.css">
{% block javascript %}
{{super()}}
<script type="application/javascript" src="/static/js/.table.bun.js"></script>
{% endblock %}
{% block main %}

19
views/contact.html
View File

@ -3,9 +3,12 @@
{% block head %}
{{super()}}
<link rel="stylesheet" type="text/css" href="/static/css/.form.min.css">
<link rel="stylesheet" type="text/css" href="/static/css/.contact.min.css">
<script src='https://www.google.com/recaptcha/api.js'></script>
<script type="application/javascript" src='https://www.google.com/recaptcha/api.js'></script>
{% endblock %}
{% block javascript %}
{{super()}}
<script type="application/javascript" src="/static/js/.form.bun.js"></script>
<script type="application/javascript" src="/static/js/.contact.bun.js"></script>
{% endblock %}
{% block main %}
@ -26,13 +29,3 @@
</section>
{% endblock %}
{% block javascript %}
{{super()}}
<script type="application/javascript">
/* global $ */
function onSubmit() {
$('#contact-form').submit();
}
</script>
{% endblock %}

4
views/forgot.html
View File

@ -1,9 +1,9 @@
{% extends 'templates/base.html' %}
{% block title %}{{super()}} | Reset Password{% endblock %}
{% block head %}
{% block javascript %}
{{super()}}
<link rel="stylesheet" type="text/css" href="/static/css/.form.min.css">
<script type="application/javascript" src="/static/js/.form.bun.js"></script>
{% endblock %}
{% block main %}

4
views/index.html
View File

@ -1,7 +1,7 @@
{% extends 'templates/base.html' %}
{% block head %}
{% block javascript %}
{{super()}}
<link href="/static/css/.index.min.css" rel="stylesheet">
<script type="application/javascript" src="/static/js/.index.bun.js"></script>
{% endblock %}
{% block main %}

30
views/login.html
View File

@ -1,9 +1,10 @@
{% extends 'templates/base.html' %}
{% block title %}{{ super() }} | Login{% endblock %}
{% block head %}
{% block title %}{{super()}} | Login{% endblock %}
{% block javascript %}
{{super()}}
<link rel="stylesheet" type="text/css" href="/static/css/.form.min.css">
<link rel="stylesheet" type="text/css" href="/static/css/.login.min.css">
<script type="application/javascript" src="/static/js/.form.bun.js"></script>
<script type="application/javascript" src="/static/js/.login.bun.js"></script>
{% endblock %}
{% block main %}
@ -70,24 +71,3 @@
</section>
{% endblock %}
{% block javascript %}
<script type="application/javascript">
/* global $ */
// On page load
$(function(){
// On clocking 'show'
$('#show').click(function(){
if ($('#password').attr('type')==="password") {
$('#password').attr('type','text');
} else {
$('#password').attr('type','password');
}
});
});
</script>
{% endblock %}

3
views/map.html
View File

@ -3,9 +3,8 @@
{% block head %}
{{super()}}
<link href="/static/css/.map.min.css" rel="stylesheet">
<style>/* These styles include values passed from to the template from the server. Other styles are in map.css */
{% if noHeader!='0' %} main { top:0; } {% endif %}
{% if noHeader!='0' %} main { top: 0 !important; } {% endif %}
{% if mapuser.settings.showStreetview and disp!='0' and disp!='1' %}
/* show both */

10
views/password.html
View File

@ -1,9 +1,10 @@
{% extends 'templates/base.html' %}
{% block title %}{{super()}} | Set Password{% endblock %}
{% block head %}
{% block javascript %}
{{super()}}
<link rel="stylesheet" type="text/css" href="/static/css/.form.min.css">
<script type="application/javascript" src="/static/js/.form.bun.js"></script>
<script type="application/javascript" src="/static/js/.password.bun.js"></script>
{% endblock %}
{% block main %}
@ -50,8 +51,3 @@
</section>
{% endblock %}
{% block javascript %}
{{super()}}
<script type="application/javascript" src="/static/js/.password.bun.js"></script>
{% endblock %}

11
views/settings.html
View File

@ -1,10 +1,10 @@
{% extends 'templates/base.html' %}
{% block title %}{{super()}} | Settings{% endblock %}
{% block head %}
{% block javascript %}
{{super()}}
<link rel="stylesheet" type="text/css" href="/static/css/.form.min.css">
<link rel="stylesheet" type="text/css" href="/static/css/.settings.min.css">
<script type="application/javascript" src="/static/js/.form.bun.js"></script>
<script type="application/javascript" src="/static/js/.settings.bun.js"></script>
{% endblock %}
{% block main %}
@ -147,8 +147,3 @@
</section>
{% endblock %}
{% block javascript %}
{{super()}}
<script type="application/javascript" src="/static/js/.settings.bun.js"></script>
{% endblock %}

17
views/templates/base.html
View File

@ -41,15 +41,12 @@
<link rel="icon apple-touch-icon" sizes="228x228" type="image/png" href="/static/img/icon/by/228.png">
<link rel="apple-touch-icon-precomposed" type="image/png" href="/static/img/icon/by/152.png">
<link rel="stylesheet" type="text/css" href="/static/css/.base.min.css">
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Open+Sans:300,600">
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Merriweather:300,700">
<script type="application/javascript" src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
{% endblock %}
{% if not noHeader %}<link href="/static/css/.header.min.css" rel="stylesheet">{% endif %}
{% if not noFooter %}<link href="/static/css/.footer.min.css" rel="stylesheet">{% endif %}
</head>
<body>
@ -61,19 +58,7 @@
<!-- Javascript -->
{% block javascript %}
<script>
// Google analytics
(function(t,r,a,c,m,o,n){t['GoogleAnalyticsObject']=m;t[m]=t[m]||function(){
(t[m].q=t[m].q||[]).push(arguments);},t[m].l=1*new Date();o=r.createElement(a),
n=r.getElementsByTagName(a)[0];o.async=1;o.src=c;n.parentNode.insertBefore(o,n);
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
/* global ga */
ga('create','UA-44266909-3','auto');
ga('require','linkid');
ga('send','pageview');
</script>
<script type="application/javascript" src="/static/js/.base.bun.js"></script>
{% endblock %}
</body>

31
webpack.config.js
View File

@ -1,16 +1,43 @@
const path = require('path');
const path = require('path'),
webpack = require('webpack');
module.exports = {
// Javascript files to be bundled
entry: {
base: './static/js/base.js',
header: './static/js/header.js',
footer: './static/js/footer.js',
index: './static/js/index.js',
table: './static/js/table.js',
form: './static/js/form.js',
contact: './static/js/contact.js',
login: './static/js/login.js',
map: './static/js/map.js',
controls: './static/js/map-controls.js',
controls: './static/js/controls.js',
settings: './static/js/settings.js',
password: './static/js/password.js'
},
// Output format
output: {
filename: '.[name].bun.js',
path: path.resolve(__dirname, 'static/js')
},
// Optimization
// plugins: [
// new webpack.optimize.UglifyJsPlugin({minimize: true})
// ],
// Load CSS into bundles
module: {
rules: [
{
test: /\.css$/,
use: [ 'style-loader', 'css-loader' ]
}
]
}
};