move to simpeler webserver

This commit is contained in:
Mats van Reenen 2021-01-03 14:31:26 +01:00
parent 9ba7524c9c
commit b46a688bfe
4 changed files with 71 additions and 105 deletions

View File

@ -5,8 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge"> <meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Scrum Board - Manage your tasks with ease</title> <title>Scrum Board - Manage your tasks with ease</title>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css"> <link rel="stylesheet" href="assets/stylesheets/app.min.css">
<link rel="stylesheet" href="app/assets/stylesheets/app.min.css">
</head> </head>
<body> <body>
<div class="wrapper"> <div class="wrapper">
@ -25,29 +24,29 @@
<ul class="controls"> <ul class="controls">
<li data-tooltip="Drag A Task Here To Delete"> <li data-tooltip="Drag A Task Here To Delete">
<a href="#" class="remove" id="remove"> <a href="#" class="remove" id="remove">
<img src="app/assets/images/bin.svg" alt=""> <img src="assets/images/bin.svg" alt="">
</a> </a>
</li> </li>
<li data-tooltip="Create backup"> <li data-tooltip="Create backup">
<a href="#" class="export" id="export"> <a href="#" class="export" id="export">
export export
<!-- <img src="app/assets/images/.svg" alt=""> --> <!-- <img src="assets/images/.svg" alt=""> -->
</a> </a>
</li> </li>
<li data-tooltip="Import backup"> <li data-tooltip="Import backup">
<a href="#" class="import" id="import"> <a href="#" class="import" id="import">
import import
<!-- <img src="app/assets/images/.svg" alt=""> --> <!-- <img src="assets/images/.svg" alt=""> -->
</a> </a>
</li> </li>
<li data-tooltip="Add Task"> <li data-tooltip="Add Task">
<a href="#" id="add-task" class="add-task"> <a href="#" id="add-task" class="add-task">
<img src="app/assets/images/plus.svg" alt=""> <img src="assets/images/plus.svg" alt="">
</a> </a>
</li> </li>
<li data-tooltip="Github" class="github-ref"> <li data-tooltip="Github" class="github-ref">
<a href="https://github.com/i-break-codes/scrum-board" target="_blank"> <a href="https://github.com/i-break-codes/scrum-board" target="_blank">
<img src="app/assets/images/github.svg" alt=""> <img src="assets/images/github.svg" alt="">
</a> </a>
</li> </li>
</ul> </ul>
@ -165,9 +164,8 @@
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<script src="app/assets/scripts/lib/handlebars-v4.0.5.min.js"></script> <script src="assets/scripts/lib/handlebars-v4.0.5.min.js"></script>
<script src="app/assets/scripts/helper.min.js"></script> <script src="assets/scripts/helper.min.js"></script>
<script src="app/assets/scripts/localstorage.min.js"></script> <script src="assets/scripts/app.min.js"></script>
<script src="app/assets/scripts/app.min.js"></script>
</body> </body>
</html> </html>

View File

@ -8,66 +8,64 @@
* @version 1.0 Beta * @version 1.0 Beta
*/ */
const BrowserSync = require('browser-sync'); // const BrowserSync = require('browser-sync');
const fs = require('fs');
const http = require('http');
const Gulp = require('gulp'); const Gulp = require('gulp');
Gulp.clean = require('gulp-clean'); Gulp.clean = require('gulp-clean');
const sass = require('gulp-sass'); Gulp.sass = require('gulp-sass');
const autoprefixer = require('gulp-autoprefixer'); Gulp.autoprefixer = require('gulp-autoprefixer');
const cleanCSS = require('gulp-clean-css'); Gulp.cleanCSS = require('gulp-clean-css');
const uglify = require('gulp-uglify'); Gulp.uglify = require('gulp-uglify');
const renameFiles = require('gulp-rename'); Gulp.rename = require('gulp-rename');
const Url = 'http://localhost:8888/scrum/'; const PORT = 3000;
const Browser = 'google chrome';
function browserSync(cb){ function httpd(){
BrowserSync.init({ function servePage(req, res, url){
server: { if(url[url.length - 1] == '/'){
// baseDir: "app", return servePage(req, res, url + 'index.html')
proxy: Url,
// files: ['app/views/**/*.*', 'public/**/*.css', 'public/**/*.js'],
browser: Browser,
port: 3005,
// open: false
} }
}, function (err, bs){ urlSplit = url.split('.');
cb(); if(urlSplit[urlSplit.length-1].length > 4){
return servePage(req, res, url + '/index.html')
}
fs.readFile(__dirname + '/app' + url, function (err,data) {
if (err) {
res.writeHead(404);
res.end(JSON.stringify(err));
return;
}
res.writeHead(200);
res.end(data);
}); });
}; }
http.createServer(function (req, res) {
function bsReload(cb){ servePage(req, res, req.url)
BrowserSync.reload(); }).listen(PORT);
cb(); }
};
function css(){ function css(){
return Gulp.src('src/stylesheets/**/*.scss') return Gulp.src('src/stylesheets/**/*.scss')
.pipe(sass().on('error', sass.logError)) .pipe(Gulp.sass().on('error', Gulp.sass.logError))
.pipe(autoprefixer('last 3 version')) .pipe(Gulp.autoprefixer('last 3 version'))
.pipe(Gulp.dest('app/assets/stylesheets')) .pipe(Gulp.dest('app/assets/stylesheets'))
} }
function cssMinify(){ function cssMinify(){
return Gulp.src(['app/assets/stylesheets/**/*.css', '!app/assets/stylesheets/**/*.min.css']) return Gulp.src(['app/assets/stylesheets/**/*.css', '!app/assets/stylesheets/**/*.min.css'])
.pipe(cleanCSS({debug: true}, function(details) { .pipe(Gulp.cleanCSS({debug: true}, function(details) {
console.log('Original Size : ' + details.name + ': ' + details.stats.originalSize + ' bytes'); console.log('Original Size : ' + details.name + ': ' + details.stats.originalSize + ' bytes');
console.log('Minified Size : ' + details.name + ': ' + details.stats.minifiedSize + ' bytes'); console.log('Minified Size : ' + details.name + ': ' + details.stats.minifiedSize + ' bytes');
})) }))
.pipe(renameFiles({ suffix: '.min' })) .pipe(Gulp.rename({ suffix: '.min' }))
.pipe(Gulp.dest('app/assets/stylesheets')) .pipe(Gulp.dest('app/assets/stylesheets'))
// .pipe(browserSync.reload({ // ??
// stream:true
// }));
}; };
function jsMinify(){ function jsMinify(){
return Gulp.src('src/scripts/**/*.js') return Gulp.src('src/scripts/**/*.js')
.pipe(uglify()) .pipe(Gulp.uglify())
.pipe(renameFiles({ suffix: '.min' })) .pipe(Gulp.rename({ suffix: '.min' }))
.pipe(Gulp.dest('app/assets/scripts')) .pipe(Gulp.dest('app/assets/scripts'))
// .pipe(browserSync.reload({ // ??
// stream: true,
// once: true
// }));
}; };
function clean(mode = 'all'){ function clean(mode = 'all'){
@ -105,8 +103,8 @@ const jsTask = jsMinify;
const buildTask = Gulp.parallel(cssTask, jsTask); const buildTask = Gulp.parallel(cssTask, jsTask);
exports.clean = clean('all'); exports.clean = clean('all');
exports.server = browserSync; exports.server = httpd;
exports.cssBuild = cssTask; exports.cssBuild = cssTask;
exports.jsBuild = jsTask; exports.jsBuild = jsTask;
exports.build = Gulp.series(clean('all'), buildTask); exports.build = Gulp.series(clean('all'), buildTask);
exports.default = Gulp.series(buildTask, browserSync); exports.default = Gulp.series(buildTask, httpd);

View File

@ -29,10 +29,10 @@ var App = function() {
function exportData(){ function exportData(){
function getFullData(){ function getFullData(){
var data = {}; var data = {};
data['status'] = JSON.parse(LocalStorage.get('status')); data['status'] = JSON.parse(localStorage.getItem('status'));
data['taskCounter'] = parseInt(LocalStorage.get('taskCounter')); data['taskCounter'] = parseInt(localStorage.getItem('taskCounter'));
for(var i=0; i <= data['taskCounter']; i++){ for(var i=0; i <= data['taskCounter']; i++){
const task = LocalStorage.get('task-' + i); const task = localStorage.getItem('task-' + i);
if(task != null) if(task != null)
data['task-' + i] = JSON.parse(task) data['task-' + i] = JSON.parse(task)
} }
@ -71,7 +71,7 @@ var App = function() {
for(key in data){ for(key in data){
if(!data.hasOwnProperty(key)) if(!data.hasOwnProperty(key))
continue; continue;
LocalStorage.set(key, JSON.stringify(data[key])); localStorage.setItem(key, JSON.stringify(data[key]));
} }
window.location.reload() window.location.reload()
} }
@ -95,22 +95,22 @@ var App = function() {
status: 'pending' status: 'pending'
} }
if(!LocalStorage.get('appInitialized', true)) { if(!localStorage.getItem('appInitialized', true)) {
LocalStorage.set('taskCounter', 1); localStorage.setItem('taskCounter', 1);
LocalStorage.set('status', JSON.stringify([ localStorage.setItem('status', JSON.stringify([
{key: 'rejected', value: 'Rejected'}, {key: 'rejected', value: 'Rejected'},
{key: 'pending', value: 'Pending'}, {key: 'pending', value: 'Pending'},
{key: 'development', value: 'Development'}, {key: 'development', value: 'Development'},
{key: 'testing', value: 'Testing'}, {key: 'testing', value: 'Testing'},
{key: 'production', value: 'Production'}])); {key: 'production', value: 'Production'}]));
LocalStorage.set('task-1', JSON.stringify(defaultTask)); localStorage.setItem('task-1', JSON.stringify(defaultTask));
LocalStorage.set('appInitialized', true); localStorage.setItem('appInitialized', true);
} }
} }
function addStatusColumns(){ function addStatusColumns(){
var statusArr = JSON.parse(LocalStorage.get('status')); var statusArr = JSON.parse(localStorage.getItem('status'));
var headerObj = $('header ul'); var headerObj = $('header ul');
var myDashboard = $('#dashboard'); var myDashboard = $('#dashboard');
statusArr.map(function(item){ statusArr.map(function(item){
@ -138,7 +138,7 @@ var App = function() {
e.preventDefault(); e.preventDefault();
var newStatus = $('#new_status').val(); var newStatus = $('#new_status').val();
var newStatusId = $('#new_status_id').val(); var newStatusId = $('#new_status_id').val();
var currentStatus = JSON.parse(LocalStorage.get('status')); var currentStatus = JSON.parse(localStorage.getItem('status'));
currentStatus.map(function(obj){ currentStatus.map(function(obj){
if(obj.key == newStatusId) if(obj.key == newStatusId)
{ {
@ -148,7 +148,7 @@ var App = function() {
$('header ul li[data-id=' + newStatusId + ']').html(newStatus); $('header ul li[data-id=' + newStatusId + ']').html(newStatus);
LocalStorage.set('status', JSON.stringify(currentStatus)); localStorage.setItem('status', JSON.stringify(currentStatus));
$('.close-modal').trigger('click'); $('.close-modal').trigger('click');
}); });
@ -178,11 +178,11 @@ var App = function() {
return; return;
} }
var iid = LocalStorage.get('taskCounter'); var iid = localStorage.getItem('taskCounter');
obj.id = ++iid; obj.id = ++iid;
obj.status = 'pending'; obj.status = 'pending';
LocalStorage.set('task-' + obj.id, JSON.stringify(obj)); localStorage.setItem('task-' + obj.id, JSON.stringify(obj));
LocalStorage.set('taskCounter', iid); localStorage.setItem('taskCounter', iid);
var newCard = template([obj]); var newCard = template([obj]);
$('#dashboard #' + obj.status).append(newCard); $('#dashboard #' + obj.status).append(newCard);
@ -206,11 +206,11 @@ var App = function() {
$(document).on('input', '.card p', function() { $(document).on('input', '.card p', function() {
var taskId = $(this).parents('.card').data('task-id'); var taskId = $(this).parents('.card').data('task-id');
var fieldToEdit = $(this).data('field'); var fieldToEdit = $(this).data('field');
var getTaskData = JSON.parse(LocalStorage.get('task-' + taskId)); var getTaskData = JSON.parse(localStorage.getItem('task-' + taskId));
getTaskData[fieldToEdit] = $(this).text(); getTaskData[fieldToEdit] = $(this).text();
LocalStorage.set('task-' + taskId, JSON.stringify(getTaskData)); localStorage.setItem('task-' + taskId, JSON.stringify(getTaskData));
}); });
} }
@ -256,7 +256,7 @@ var App = function() {
if($(this).attr('id') == 'remove') { if($(this).attr('id') == 'remove') {
//Deletes task //Deletes task
elm.remove(); elm.remove();
LocalStorage.remove('task-' + taskId); localStorage.removeItem('task-' + taskId);
$('#removed-task-notification').text('Task removed successfully').removeClass('hide'); $('#removed-task-notification').text('Task removed successfully').removeClass('hide');
@ -268,10 +268,10 @@ var App = function() {
if(parentId != currentId) { if(parentId != currentId) {
$(elm).detach().removeAttr('style').appendTo(this); $(elm).detach().removeAttr('style').appendTo(this);
var getTaskData = JSON.parse(LocalStorage.get('task-' + taskId)); var getTaskData = JSON.parse(localStorage.getItem('task-' + taskId));
getTaskData.status = currentId; getTaskData.status = currentId;
LocalStorage.set('task-' + taskId, JSON.stringify(getTaskData)); localStorage.setItem('task-' + taskId, JSON.stringify(getTaskData));
} }
} }
@ -312,7 +312,7 @@ var App = function() {
var source = $("#task-card-template").html(); var source = $("#task-card-template").html();
var template = Handlebars.compile(source); var template = Handlebars.compile(source);
var status = JSON.parse(LocalStorage.get('status')); var status = JSON.parse(localStorage.getItem('status'));
for(var i = 0, l = status.length; i < l; i++) { for(var i = 0, l = status.length; i < l; i++) {
var result = App.getAllNotes().filter(function(obj) { var result = App.getAllNotes().filter(function(obj) {
@ -328,13 +328,13 @@ var App = function() {
} }
function tips() { function tips() {
if(!JSON.parse(LocalStorage.get('showedTip'))) { if(!JSON.parse(localStorage.getItem('showedTip'))) {
$('#tips').removeClass('hide').addClass('tips'); $('#tips').removeClass('hide').addClass('tips');
} }
$('#tips').on('click', function() { $('#tips').on('click', function() {
$(this).addClass('hide'); $(this).addClass('hide');
LocalStorage.set('showedTip', true); localStorage.setItem('showedTip', true);
}); });
} }

View File

@ -1,30 +0,0 @@
/**
* scrum-board
*
* @category scrum-board
* @author Vaibhav Mehta <vaibhav@decodingweb.com>
* @copyright Copyright (c) 2016 Vaibhav Mehta <https://github.com/i-break-codes>
* @license http://www.opensource.org/licenses/mit-license.html MIT License
* @version 1.0 Beta
*/
var LocalStorage = function() {
function set(key, val) {
localStorage.setItem(key, val);
}
function get(key) {
return localStorage.getItem(key);
}
function remove(key) {
localStorage.removeItem(key);
}
return {
set: set,
get: get,
remove: remove
}
}();