diff --git a/gulpfile.js b/gulpfile.js index bcd36e268..9e8dd9a35 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -1,69 +1,180 @@ // include plug-ins var gulp = require('gulp'); -var debug = require('gulp-debug'); -var gulpif = require("gulp-if"); + +var del = require('del'); +var concat = require('gulp-concat'); +var rename = require('gulp-rename'); +var size = require('gulp-size'); var replace = require('gulp-replace'); var watch = require('gulp-watch'); -var rename = require('gulp-rename'); var jshint = require('gulp-jshint'); var uglify = require('gulp-uglify'); -var spritesmith = require("gulp-spritesmith"); + +var spritesmith = require("gulp.spritesmith"); +var imagemin = require('gulp-imagemin'); +var uncss = require('gulp-uncss'); +var minifyCSS = require('gulp-minify-css'); // settings var base = './htdocs/frontend/'; -var dest = './htdocs/frontend/'; +var build = base + 'build/'; + +// styles +var styles = base + 'stylesheets/'; + +// images +var images = base + 'images/'; + +// js +var vendor = base + 'vendor/'; +var javascripts = base + 'javascripts/'; +var flot = base + 'javascripts/flot/'; +var extensions = base + 'javascripts/jquery/'; /** * Defaults */ -gulp.task('build', ['sprites'/*, 'scripts', 'styles', 'replace'*/]); - -// watch for JS changes gulp.task('default', function() { + // watch for JS changes gulp.src(base + 'javascripts/**/*.js', { read: false }) .pipe(watch()) .pipe(jshint()) .pipe(jshint.reporter('default')); }); + /** - * jsHint JS scripts + * Build */ +gulp.task('build', ['clean', 'jshint', 'scripts', 'sprites']); + +gulp.task('clean', function () { + del([ + build + '**' + ]); +}); + + gulp.task('jshint', function() { - gulp.src([base + 'javascripts/!(property)*.js']) + gulp.src([ + base + 'javascripts/*.js', + '!**/*.min.js', // omit minified files + ]) .pipe(jshint()) .pipe(jshint.reporter('default')); }); + /** - * Create CSS sprites for icons + * Scripts + */ +gulp.task('scripts', ['flot', 'jquery-ext', 'vz-scripts']); + +gulp.task('vz-scripts', function() { + return gulp.src([ + javascripts + 'helper.js', // in order of index.html + javascripts + 'init.js', + javascripts + 'functions.js', + javascripts + 'entities.js', + javascripts + 'wui.js', + javascripts + 'entity.js', + '!**/options.js', // exclude options + ]) + .pipe(concat('scripts.js')) + .pipe(gulp.dest(build)) // for reference only + .pipe(size({showFiles: true})) + .pipe(uglify()) + .pipe(rename('scripts.min.js')) + .pipe(gulp.dest(javascripts)) + .pipe(size({showFiles: true})) +}); + +gulp.task('flot', function() { + return gulp.src([ + flot + '**/jquery.flot.js', // flot first + flot + '**.js', // then flot modules + '!**/excanvas*.js', // omit canvas helper + '!**/*.min.js', // omit minified files + ]) + .pipe(concat('flot.js')) + .pipe(gulp.dest(build)) // for reference only + .pipe(size({showFiles: true})) + .pipe(uglify()) + .pipe(rename('flot.min.js')) + .pipe(gulp.dest(flot)) + .pipe(size({showFiles: true})) +}); + +gulp.task('jquery-ext', function() { + return gulp.src([ + extensions + '**.js', + '!**/*.min.js', // omit minified files + ]) + .pipe(concat('jquery-ext.js')) + .pipe(gulp.dest(build)) // for reference only + .pipe(size({showFiles: true})) + .pipe(uglify()) + .pipe(rename('jquery-ext.min.js')) + .pipe(gulp.dest(extensions)) + .pipe(size({showFiles: true})) +}); + + +/** + * Sprites */ gulp.task('sprites', ['sprites-combine', 'sprites-optimize']); // Combine images into sprite gulp.task('sprites-combine', function () { - var imgBase = base + 'images/'; - var cssDst = 'stylesheets/sprites.max.css'; - - gulp.src([imgBase + '!(sprites|blank|ui-|style_|empty)*.png', imgBase + 'types/*!(32).png']) + var spriteData = gulp.src([ + images + '!(sprites|blank|ui-|style_|empty)*.png', + images + 'types/*!(32).png' + ]) .pipe(spritesmith({ - imgName: 'images/sprites.png', - styleName: cssDst, - imgPath: '../images/sprites.png', + imgName: '../images/sprites.png', // link to images folder + cssName: 'sprites.css', algorithm: 'top-down' - })) - .pipe(gulpif('*.png', gulp.dest(dest))) - .pipe(gulpif('*.css', gulp.dest(dest))); + })); + + spriteData.img + .pipe(imagemin()) + .pipe(gulp.dest(images)); + + spriteData.css + .pipe(gulp.dest(build)); }); // Rewrite sprites.css gulp.task('sprites-optimize', function () { - var cssDst = 'stylesheets/sprites.max.css'; - // remove dimensions and save as new css file - gulp.src(base + cssDst) + gulp.src(build + 'sprites.css') .pipe(replace(/ width: 16px;\n height: 16px;\n/g, '')) - .pipe(rename('sprites.css')) - .pipe(gulp.dest(dest + 'stylesheets/')); + .pipe(gulp.dest(styles)); +}); + + +/** + * CSS + */ +// not used +gulp.task('css-minimize', function () { + gulp.src(styles + '*.css') + .pipe(concat('styles.css')) + .pipe(gulp.dest(build)) + .pipe(minifyCSS({keepBreaks:true})) + .pipe(rename('styles.min.css')) + .pipe(gulp.dest(build)); +}); + +// not used +gulp.task('css-strip', function() { + gulp.src(styles + '*.css') + // gulp.src(build + 'styles.min.css') + .pipe(uncss({ + html: [base + 'index.html'] + })) + // .pipe(rename('styles.min.css')) + .pipe(gulp.dest(build)); }); diff --git a/htdocs/frontend/images/sprites.png b/htdocs/frontend/images/sprites.png index f01adda6c..99ccf0c4b 100644 Binary files a/htdocs/frontend/images/sprites.png and b/htdocs/frontend/images/sprites.png differ diff --git a/htdocs/frontend/index.html b/htdocs/frontend/index.html index 9ee52640d..bfa6a202b 100644 --- a/htdocs/frontend/index.html +++ b/htdocs/frontend/index.html @@ -25,10 +25,17 @@ + + + + + + - diff --git a/htdocs/frontend/javascripts/entity.js b/htdocs/frontend/javascripts/entity.js index d98b8d743..dbb3c3faf 100644 --- a/htdocs/frontend/javascripts/entity.js +++ b/htdocs/frontend/javascripts/entity.js @@ -441,6 +441,7 @@ Entity.prototype.getDOMDetails = function(edit) { var definition = vz.capabilities.definitions.get('properties', property); var title = definition.translation[vz.options.language]; var value = this[property]; + var prefix; // unit prefix if (definition.type == 'boolean') { // value = '' + ((value) ? 'ja' : 'nein') + ''; @@ -449,12 +450,12 @@ Entity.prototype.getDOMDetails = function(edit) { switch (property) { case 'cost': - var prefix = (this.definition.scale == 1000) ? ' ct/k' : ' ct/'; // ct per Wh or kWh + prefix = (this.definition.scale == 1000) ? ' ct/k' : ' ct/'; // ct per Wh or kWh value = Number(value * 100).toFixed(2) + prefix + vz.wui.formatConsumptionUnit(this.definition.unit); break; case 'resolution': - var prefix = (this.definition.scale == 1000) ? 'k' : ''; // per Wh or kWh + prefix = (this.definition.scale == 1000) ? 'k' : ''; // per Wh or kWh value += '/' + prefix + vz.wui.formatConsumptionUnit(this.definition.unit); break; diff --git a/htdocs/frontend/javascripts/init.js b/htdocs/frontend/javascripts/init.js index 76e4ded97..51c265d84 100644 --- a/htdocs/frontend/javascripts/init.js +++ b/htdocs/frontend/javascripts/init.js @@ -98,7 +98,7 @@ $(document).ready(function() { // clear cookies and localStorage cache var params = $.getUrlParams(); - if (params.hasOwnProperty('reset') && params['reset']) { + if (params.hasOwnProperty('reset') && params.reset) { $.setCookie('vz_entities', null); try { localStorage.removeItem('vz.capabilities'); @@ -114,16 +114,6 @@ $(document).ready(function() { vz.options.plot.xaxis.max = new Date().getTime(); vz.options.plot.xaxis.min = vz.options.plot.xaxis.max - vz.options.interval; - // clear cookies and localStorage cache - var params = $.getUrlParams(); - if (params.hasOwnProperty('reset') && params['reset']) { - $.setCookie('vz_entities', null); - try { - localStorage.removeItem('vz.capabilities'); - } - catch (e) { } - } - // parse additional url params (new uuid etc e.g. for permalink) after loading defaults vz.parseUrlParams(); diff --git a/htdocs/frontend/javascripts/property.js b/htdocs/frontend/javascripts/property.js deleted file mode 100644 index 6f8bbfc3a..000000000 --- a/htdocs/frontend/javascripts/property.js +++ /dev/null @@ -1,106 +0,0 @@ -/** - * Property handling & validation - * - * @author Florian Ziegler - * @author Justin Otherguy - * @author Steffen Vogel - * @copyright Copyright (c) 2011, The volkszaehler.org project - * @package default - * @license http://opensource.org/licenses/gpl-license.php GNU Public License - */ -/* - * This file is part of volkzaehler.org - * - * volkzaehler.org is free software: you can redistribute it and/or modify it - * under the terms of the GNU General Public License as published by the Free - * Software Foundation, either version 3 of the License, or any later version. - * - * volkzaehler.org is distributed in the hope that it will be useful, but - * WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or - * FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more - * details. - * - * You should have received a copy of the GNU General Public License along with - * volkszaehler.org. If not, see . - */ - -/** - * Property constructor - */ -var Property = function(json) { - $.extend(this, json); -}; - -/** - * Validate value - * @param value - * @return boolean - * @todo implement/test - */ -Property.prototype.validate = function(value) { - switch (this.type) { - case 'string': - case 'text': - // TODO check pattern - // TODO check string length - return true; - - case 'float': - // TODO check format - // TODO check min/max - return true; - - case 'integer': - // TODO check format - // TODO check min/max - return true; - - case 'boolean': - return value == '1' || value == ''; - - case 'multiple': - return this.options.contains(value); - - default: - throw new Exception('EntityException', 'Unknown property'); - } -}; - -/** - * - * @todo implement/test - */ -Property.prototype.getInput = function(value) { - switch (this.type) { - case 'string': - case 'float': - case 'integer': - return $('') - .attr('type', 'text') - .attr('name=', this.name) - .attr('maxlength', (property.type == 'string') ? this.max : 0); - - case 'text': - return $('