Skip to content

Commit

Permalink
Merge pull request #72 from Mikhus/v2.0.8
Browse files Browse the repository at this point in the history
Merge release 2.0.8 branch into master
  • Loading branch information
Mikhus authored Sep 28, 2016
2 parents 7c085d7 + 5336d7c commit e6d9e33
Show file tree
Hide file tree
Showing 14 changed files with 305 additions and 186 deletions.
2 changes: 1 addition & 1 deletion bower.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "canvas-gauges",
"version": "2.0.7",
"version": "2.0.8",
"homepage": "https://github.com/Mikhus/canvas-gauges",
"authors": [
"Mykhailo Stadnyk <[email protected]>"
Expand Down
2 changes: 1 addition & 1 deletion docs-coverage.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 3 additions & 1 deletion examples/linear-component.html
Original file line number Diff line number Diff line change
Expand Up @@ -16,19 +16,21 @@
data-width="160"
data-height="600"
data-border-radius="20"
data-borders="0"
data-borders="true"
data-bar-stroke-width="20"
data-minor-ticks="10"
data-major-ticks="0,10,20,30,40,50,60,70,80,90,100"
data-color-numbers="red,green,blue,transparent,#ccc,#ccc,#ccc,#ccc,#ccc,#ccc,#ccc"
data-color-major-ticks="red,green,blue,transparent,#ccc,#ccc,#ccc,#ccc,#ccc,#ccc,#ccc"
data-color-bar-stroke="#444"
data-value="22.3"
data-units="°C"
data-color-value-box-shadow="false"
data-tick-side="left"
data-number-side="left"
data-needle-side="left"
data-animate-on-init="true"
data-color-plate="transparent"
></canvas>

<canvas data-type="linear-gauge"
Expand Down
6 changes: 5 additions & 1 deletion examples/radial-component.html
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@
{ "from": 150, "to": 200, "color": "rgba(255,0,225,.25)" },
{ "from": 200, "to": 220, "color": "rgba(0,0,255,.25)" }
]'
data-color-plate="#222"
data-color-plate="transparent"
data-color-major-ticks="#f5f5f5"
data-color-minor-ticks="#ddd"
data-color-title="#fff"
Expand All @@ -46,6 +46,9 @@
data-animation-duration="500"
data-font-value="Led"
data-font-numbers="Led"
data-border-outer-width="3"
data-border-middle-width="3"
data-border-inner-width="3"
></canvas>

<canvas data-type="radial-gauge"
Expand Down Expand Up @@ -85,6 +88,7 @@
data-ticks-angle="250"
data-start-angle="55"
data-color-needle-shadow-down="#333"
data-value-box-width="45"
></canvas>

<canvas data-type="radial-gauge"
Expand Down
6 changes: 4 additions & 2 deletions gauge.min.js

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion gauge.min.js.map

Large diffs are not rendered by default.

114 changes: 52 additions & 62 deletions gulpfile.js
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,7 @@ const babel = require('gulp-babel');
const fsc = require('fs-cli');
const semver = require('semver');
const inject = require('gulp-inject-string');
const version = require('./package.json').version;

/**
* @typedef {{argv: object}} yargs
Expand Down Expand Up @@ -70,7 +71,50 @@ function es6concat(type = 'all') {
.pipe(concat('gauge.es6.js'))
.pipe(replace(/((var|const|let)\s+.*?=\s*)?require\(.*?\);?/g, ''))
.pipe(replace(/(module\.)?exports(.default)?\s+=\s*.*?\r?\n/g, ''))
.pipe(replace(/export\s+(default\s+)?(GenericOptions;)?/g, ''));
.pipe(replace(/export\s+(default\s+)?(GenericOptions;)?/g, ''))
.pipe(replace(/%VERSION%/g, version));
}

function es5transpile(type = 'all', withSourceMaps = true, resolve = () => {}) {
let stream = es6concat(type)
.pipe(rename('gauge.es5.js'))
.pipe(babel({
presets: ['es2015'],
compact: false
}))
.on('error', function(err) {
gutil.log(err);
this.emit('end');
resolve();
})
.pipe(rename('gauge.min.js'))
.pipe(replace(/^/, license() + '(function(ns) {'))
.pipe(replace(/$/,
';typeof module !== "undefined" && Object.assign(ns, {' +
'Collection: Collection,' +
'GenericOptions: GenericOptions,' +
'Animation: Animation,' +
'BaseGauge: BaseGauge,' +
'drawings: drawings,' +
'SmartCanvas: SmartCanvas,' +
'vendorize: vendorize' +
'});' +
'}(typeof module !== "undefined" ? ' +
'module.exports : window));'));

if (withSourceMaps) {
stream = stream.pipe(sourcemaps.init({ loadMaps: true }));
}

stream = stream.pipe(uglify({
preserveComments: (node, comment) => comment.line === 1
}));

if (withSourceMaps) {
stream = stream.pipe(sourcemaps.write('.'));
}

return stream;
}

function license() {
Expand All @@ -80,7 +124,8 @@ function license() {

src.pop();

return '/*!\n * ' + src.join('\n * ') + '\n */\n';
return '/*!\n * ' + src.join('\n * ') + '\n *\n * @version ' +
version + '\n */\n';
}

/**
Expand All @@ -99,34 +144,7 @@ gulp.task('build:prod', done => {
rimraf('dist', () => {
Promise.all(types.map(type => {
return new Promise(resolve => {
es6concat(type)
.pipe(rename('gauge.es5.js'))
.pipe(babel({
presets: ['es2015'],
compact: false
}))
.on('error', function(err) {
gutil.log(err);
this.emit('end');
resolve();
})
.pipe(rename('gauge.min.js'))
.pipe(replace(/^/, license() + '(function(ns) {'))
.pipe(replace(/$/,
';typeof module !== "undefined" && Object.assign(ns, {' +
'Collection: Collection,' +
'GenericOptions: GenericOptions,' +
'Animation: Animation,' +
'BaseGauge: BaseGauge,' +
'drawings: drawings,' +
'SmartCanvas: SmartCanvas,' +
'vendorize: vendorize' +
'});' +
'}(typeof module !== "undefined" ? ' +
'module.exports : window));'))
.pipe(uglify({
preserveComments: (node, comment) => comment.line === 1
}))
es5transpile(type, false, resolve)
.pipe(gulp.dest('dist/' + type))
.on('end', () => {
let pkg = JSON.parse(fs.readFileSync('./package.json'));
Expand Down Expand Up @@ -159,7 +177,6 @@ gulp.task('build:prod', done => {
});
});
})).then(() => {
let version = require('./package.json').version;
let cmd = '';

console.log(chalk.bold.green('Production packages are now ready!'));
Expand Down Expand Up @@ -253,36 +270,8 @@ gulp.task('build:es6', ['clean'], () => {
* @task {build:es5}
* @arg {type} build type: 'radial' - Gauge object only, 'linear' - LinearGauge object only, 'all' - everything (default)
*/
gulp.task('build:es5', ['clean'], () => {
es6concat(yargs.argv.type || 'all')
.pipe(rename('gauge.es5.js'))
.pipe(babel({
presets: ['es2015'],
compact: false
}))
.on('error', function(err) {
gutil.log(err);
this.emit('end');
})
//.pipe(gulp.dest('.'))
.pipe(rename('gauge.min.js'))
.pipe(replace(/^/, license() + '(function(ns) {'))
.pipe(replace(/$/,
';typeof module !== "undefined" && Object.assign(ns, {' +
'Collection: Collection,' +
'GenericOptions: GenericOptions,' +
'Animation: Animation,' +
'BaseGauge: BaseGauge,' +
'drawings: drawings,' +
'SmartCanvas: SmartCanvas,' +
'vendorize: vendorize' +
'});' +
'}(typeof module !== "undefined" ? module.exports : window));'))
.pipe(sourcemaps.init({ loadMaps: true }))
.pipe(uglify({
preserveComments: (node, comment) => comment.line === 1
}))
.pipe(sourcemaps.write('.'))
gulp.task('build:es5', ['clean'], done => {
es5transpile(yargs.argv.type || 'all')
.pipe(gulp.dest('.'))
.on('end', () => {
if (!process.env.TRVIS) {
Expand All @@ -297,6 +286,8 @@ gulp.task('build:es5', ['clean'], () => {
fs.readFileSync('gauge.min.js.map')
);
}

done();
});
});

Expand Down Expand Up @@ -366,7 +357,6 @@ gulp.task('doc', ['clean:docs'], done => {

//move to pages

let version = require('./package.json').version;
let target = '../canvas-gauges-pages/docs/' + version;

rimraf(target, () => fs.rename('docs', target, done));
Expand Down
20 changes: 20 additions & 0 deletions lib/BaseGauge.js
Original file line number Diff line number Diff line change
Expand Up @@ -28,11 +28,15 @@ const Animation = require('./Animation');
const Collection = require('./Collection');
const DomObserver = require('./DomObserver');

const version = '%VERSION%';

const round = Math.round;
const abs = Math.abs;

let gauges = new Collection();

gauges.version = version;

/**
* Basic abstract BaseGauge class implementing common functionality
* for different type of gauges.
Expand Down Expand Up @@ -75,6 +79,13 @@ export default class BaseGauge {

gauges.push(this);

/**
* Gauges version string
*
* @type {string}
*/
this.version = version;

/**
* Gauge type class
*
Expand Down Expand Up @@ -239,6 +250,15 @@ export default class BaseGauge {
this.animation = null;
}

/**
* Returns gauges version string
*
* @return {string}
*/
static get version() {
return version;
}

/**
* Triggering gauge render on a canvas.
*
Expand Down
8 changes: 6 additions & 2 deletions lib/GenericOptions.js
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@
/**
* Shared generic gauges options
*
* @type {{renderTo: RenderTarget, width: number, height: number, minValue: number, maxValue: number, value: number, units: string|boolean, majorTicks: number[]|string[], minorTicks: number, strokeTicks: boolean, animatedValue: boolean, animateOnInit: boolean, title: string|boolean, borders: boolean, valueInt: number, valueDec: number, majorTicksInt: number, majorTicksDec: number, animation: boolean, animationDuration: number, animationRule: string|AnimationRule, colorPlate: string, colorPlateEnd: string, colorMajorTicks: string, colorMinorTicks: string, colorTitle: string, colorUnits: string, colorNumbers: string, colorNeedle: string, colorNeedleEnd: string, colorValueText: string, colorValueTextShadow: string, colorBorderShadow: string, colorBorderOuter: string, colorBorderOuterEnd: string, colorBorderMiddle: string, colorBorderMiddleEnd: string, colorBorderInner: string, colorBorderInnerEnd: string, colorValueBoxRect: string, colorValueBoxRectEnd: string, colorValueBoxBackground: string, colorValueBoxShadow: string, colorNeedleShadowUp: string, colorNeedleShadowDown: string, needle: boolean, needleShadow: boolean, needleType: string, needleStart: number, needleEnd: number, needleWidth: number, borderOuterWidth: number, borderMiddleWidth: number, borderInnerWidth: number, borderShadowWidth: number, valueBox: boolean, valueBoxStroke: number, valueText: string, valueTextShadow: boolean, valueBoxBorderRadius: number, highlights: Highlight[], fontNumbers: string, fontTitle: string, fontUnits: string, fontValue: string, fontTitleSize: number, fontValueSize: number, fontUnitsSize: number, fontNumbersSize: number, fontNumbersStyle: string, fontTitleStyle: string, fontUnitsStyle: string, fontValueStyle: string, fontNumbersWeight: string, fontTitleWeight: string, fontUnitsWeight: string, fontValueWeight: string}} GenericOptions
* @type {{renderTo: RenderTarget, width: number, height: number, minValue: number, maxValue: number, value: number, units: string|boolean, majorTicks: number[]|string[], minorTicks: number, strokeTicks: boolean, animatedValue: boolean, animateOnInit: boolean, title: string|boolean, borders: boolean, valueInt: number, valueDec: number, majorTicksInt: number, majorTicksDec: number, animation: boolean, animationDuration: number, animationRule: string|AnimationRule, colorPlate: string, colorPlateEnd: string, colorMajorTicks: string, colorMinorTicks: string, colorTitle: string, colorUnits: string, colorNumbers: string, colorNeedle: string, colorNeedleEnd: string, colorValueText: string, colorValueTextShadow: string, colorBorderShadow: string, colorBorderOuter: string, colorBorderOuterEnd: string, colorBorderMiddle: string, colorBorderMiddleEnd: string, colorBorderInner: string, colorBorderInnerEnd: string, colorValueBoxRect: string, colorValueBoxRectEnd: string, colorValueBoxBackground: string, colorValueBoxShadow: string, colorNeedleShadowUp: string, colorNeedleShadowDown: string, needle: boolean, needleShadow: boolean, needleType: string, needleStart: number, needleEnd: number, needleWidth: number, borderOuterWidth: number, borderMiddleWidth: number, borderInnerWidth: number, borderShadowWidth: number, valueBox: boolean, valueBoxWidth: number, valueBoxStroke: number, valueText: string, valueTextShadow: boolean, valueBoxBorderRadius: number, highlights: Highlight[], highlightsWidth: number, fontNumbers: string, fontTitle: string, fontUnits: string, fontValue: string, fontTitleSize: number, fontValueSize: number, fontUnitsSize: number, fontNumbersSize: number, fontNumbersStyle: string, fontTitleStyle: string, fontUnitsStyle: string, fontValueStyle: string, fontNumbersWeight: string, fontTitleWeight: string, fontUnitsWeight: string, fontValueWeight: string}} GenericOptions
*/
const GenericOptions = {
// basic options
Expand Down Expand Up @@ -133,13 +133,17 @@ const GenericOptions = {
// value and highlights
valueBox: true,
valueBoxStroke: 5,
valueBoxWidth: 0,
valueText: '',
valueTextShadow: true,
valueBoxBorderRadius: 2.5,

// highlights
highlights: [
{ from: 20, to: 60, color: '#eee' },
{ from: 60, to: 80, color: '#ccc' },
{ from: 80, to: 100, color: '#999' }]
{ from: 80, to: 100, color: '#999' }],
highlightsWidth: 15
};

export default GenericOptions;
Expand Down
Loading

0 comments on commit e6d9e33

Please sign in to comment.