This commit is contained in:
George Michael Brower 2014-09-07 22:43:10 -04:00
parent a746f0e29b
commit 8b13c1b403
12 changed files with 131 additions and 122 deletions

View File

@ -28,9 +28,9 @@
"beforeAlternate": true "beforeAlternate": true
}, },
"requireSpacesInsideParentheses": "allButNested", "requireSpacesInsideParentheses": "all",
"requireSpacesInsideObjectBrackets": "allButNested", "requireSpacesInsideObjectBrackets": "all",
"requireSpacesInsideArrayBrackets": "allButNested", "requireSpacesInsideArrayBrackets": "all",
"requireParenthesesAroundIIFE": true, "requireParenthesesAroundIIFE": true,

View File

@ -9,6 +9,6 @@
"noarg": true, "noarg": true,
"undef": true, "undef": true,
"unused": "vars", "unused": "vars",
"strict": true, "strict": false,
"browser": true "browser": true
} }

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -74,7 +74,11 @@
Gui.ready = function( fnc ) { Gui.ready = function( fnc ) {
ready ? fnc() : readyHandlers.push( fnc ); if ( ready ) {
fnc();
} else {
readyHandlers.push( fnc );
}
}; };

View File

@ -24,14 +24,14 @@ Polymer( 'controller-base', {
this.object = object; this.object = object;
this.path = path; this.path = path;
this.bind( 'value', new PathObserver( this.object, this.path )); this.bind( 'value', new PathObserver( this.object, this.path ) );
}, },
valueChanged: function() { valueChanged: function() {
this.update();
this.fire( 'change', this.value ); this.fire( 'change', this.value );
this.update();
}, },

View File

@ -203,7 +203,7 @@ Polymer( 'controller-number', {
tracky: function( e ) { tracky: function( e ) {
this._dragFriction = Math.max( 0.01, Math.min( 1, this.map( e.dy, 50, 300, 1, 0.1 )) ); this._dragFriction = Math.max( 0.01, Math.min( 1, this.map( e.dy, 50, 300, 1, 0.1 ) ) );
}, },
@ -240,7 +240,7 @@ Polymer( 'controller-number', {
var str = v.toString(); var str = v.toString();
var numDecimals = str.substring( str.indexOf( '.' ) + 1 ).length; var numDecimals = str.substring( str.indexOf( '.' ) + 1 ).length;
str = v.toFixed( Math.min( numDecimals, this.decimals )); str = v.toFixed( Math.min( numDecimals, this.decimals ) );
for ( var z, i = 0, l = str.length; i < l; i++ ) { for ( var z, i = 0, l = str.length; i < l; i++ ) {
if ( str.charAt( i ) !== '0' ) { if ( str.charAt( i ) !== '0' ) {

View File

@ -1,5 +1,5 @@
/* globals Polymer, Object, Array */ /* globals Polymer, Object, Array */
'use strict';
Polymer( 'controller-option', { Polymer( 'controller-option', {

View File

@ -24,80 +24,80 @@ spacing = ( ( ( size - ph*2 ) - stroke * 3 ) / 2 )
xlen = 11px xlen = 11px
#container #container
// font-size 0 // font-size 0
// border: 1px solid blue // border: 1px solid blue
height: 100% height: 100%
cursor: pointer cursor: pointer
#button #button
width size width size
height size height size
box-sizing border-box box-sizing border-box
border-radius border-radius border-radius border-radius
padding ph pw padding ph pw
position relative position relative
background bg background bg
margin 0 auto margin 0 auto
&.open-true &.open-true
.one .one
transform translate3d(4px, 0, 0) rotate(45deg) translate3d(3.5px, 0, 0) transform translate3d(4px, 0, 0) rotate(45deg) translate3d(3.5px, 0, 0)
width xlen width xlen
.three .three
transform translate3d(4px, 0, 0) rotate(-45deg) translate3d(3.5px, 0, 0) transform translate3d(4px, 0, 0) rotate(-45deg) translate3d(3.5px, 0, 0)
width xlen width xlen
.two .two
width 0 width 0
.slider .slider
&:before &:before
width 0 width 0
height 0 height 0
.slider .slider
width size - pw * 2 width size - pw * 2
border-radius stroke * 2 border-radius stroke * 2
height stroke height stroke
background fg
position absolute
transform-origin stroke * 0.5 stroke * 0.5
transition all dur delay ease
&:before
width knob
height knob
margin-top -( ( knob - stroke ) / 2 )
margin-left -( ( knob ) / 2 )
border-radius knob
background fg background fg
display inline-block
content ' '
position absolute position absolute
left l transform-origin stroke * 0.5 stroke * 0.5
transition left knob-dur cubic-bezier(0, 0.5, 0, 1), width 0.001s delay, height 0.001s delay transition all dur delay ease
// #container:hover &
// left r
&.two
margin-top spacing + stroke
&:before &:before
left r width knob
transition-delay: stagger, delay, delay height knob
margin-top -( ( knob - stroke ) / 2 )
// #container:hover & margin-left -( ( knob ) / 2 )
// left l border-radius knob
background fg
display inline-block
content ' '
position absolute
left l
transition left knob-dur cubic-bezier(0, 0.5, 0, 1), width 0.001s delay, height 0.001s delay
// #container:hover &
// left r
&.three &.two
margin-top spacing * 2 + stroke * 2 margin-top spacing + stroke
&:before &:before
left l left r
transition-delay: stagger * 2, delay, delay transition-delay: stagger, delay, delay
// #container:hover & // #container:hover &
// left r // left l
&.three
margin-top spacing * 2 + stroke * 2
&:before
left l
transition-delay: stagger * 2, delay, delay
// #container:hover &
// left r

View File

@ -47,8 +47,7 @@ Polymer( 'gui-panel', {
var value = Path.get( path ).getValueFrom( object ); var value = Path.get( path ).getValueFrom( object );
if ( value === null || value === undefined ) { if ( value === null || value === undefined ) {
return Gui.error( object + return Gui.error( object + ' doesn\'t have a value for path "' + path + '".' );
' doesn\'t have a value for path "' + path + '".' );
} }
var args = Array.prototype.slice.call( arguments, 2 ); var args = Array.prototype.slice.call( arguments, 2 );
@ -135,8 +134,7 @@ Polymer( 'gui-panel', {
listenAll: function() { listenAll: function() {
Gui.warn( 'controller.listenAll() is deprecated. ' + Gui.warn( 'controller.listenAll() is deprecated. All controllers are listened for free.' );
'All controllers are listened for free.' );
} }

View File

@ -1,5 +1,5 @@
/* globals Polymer */ /* globals Polymer */
'use strict';
Polymer( 'gui-row', { Polymer( 'gui-row', {

View File

@ -1,66 +1,73 @@
var gulp = require( 'gulp' ), 'use strict';
$ = require( 'gulp-load-plugins' )(),
nib = require( 'nib' ), var gulp = require( 'gulp' ),
fs = require( 'fs' ), nib = require( 'nib' ),
marked = require( 'marked' ), fs = require( 'fs' ),
karma = require( 'karma' ), marked = require( 'marked' ),
karma = require( 'karma' ),
browserSync = require( 'browser-sync' ), browserSync = require( 'browser-sync' ),
reload = browserSync.reload; reload = browserSync.reload,
$ = require( 'gulp-load-plugins' )();
gulp.task( 'default', ['docs', 'build'] )
gulp.task( 'watch', ['default'], function() { var paths = {
build: [ 'elements/**/*.styl', 'elements/**/*.html', 'elements/**/*.js' , 'gui.html' ],
lint: [ 'gulpfile.js', 'elements/**/*.js' ],
test: [ 'build/gui.js', 'tests/*.js' ],
clean: [ 'build/*', '**/*.css' ],
docs: [ 'README.md', 'docs/*' ]
};
gulp.task( 'default', [ 'docs', 'lint', 'build' ] );
gulp.task( 'watch', [ 'default' ], function() {
karma.server.start( { karma.server.start( {
frameworks: [ 'jasmine' ], frameworks: [ 'jasmine' ],
files: [ files: paths.test
'build/gui.js',
'tests/*.js'
]
} ); } );
gulp.watch( ['elements/**/*.styl', 'elements/**/*.html', 'elements/**/*.js', 'gui.html'], ['build'] ); gulp.watch( paths.docs, [ 'docs' ] );
gulp.watch( paths.lint, [ 'lint' ] );
gulp.watch( ['README.md', 'docs/*'], ['docs'] ); gulp.watch( paths.build, [ 'build' ] );
} ); } );
gulp.task( 'build', ['vulcanize'], function() { gulp.task( 'build', [ 'vulcanize' ], function() {
return gulp.src( 'build/gui.html' ) return gulp.src( 'build/gui.html' )
.pipe( $.replace( /\\/g, '\\\\' ) ) .pipe( $.replace( /\\/g, '\\\\' ) )
.pipe( $.replace( /'/g, '\\\'' ) ) .pipe( $.replace( /'/g, '\\\'' ) )
.pipe( $.replace( /^(.*)$/gm, '\'$1\',' ) ) .pipe( $.replace( /^(.*)$/gm, '\'$1\',' ) )
.pipe( $.insert.wrap( 'document.write( [', '].join( "\\n" ) )' ) ) .pipe( $.insert.wrap( 'document.write([', '].join("\\n"))' ) )
.pipe( $.rename( 'gui.js' ) ) .pipe( $.rename( 'gui.js' ) )
.pipe( gulp.dest( 'build' ) ); .pipe( gulp.dest( 'build' ) );
} ); } );
gulp.task( 'vulcanize', ['css'], function() { gulp.task( 'vulcanize', [ 'css' ], function() {
return gulp.src( 'gui.html' ) return gulp.src( 'gui.html' )
.pipe( $.vulcanize( { .pipe( $.vulcanize( {
dest: 'build', dest: 'build',
inline: true, inline: true,
strip: true strip: true
} ) ); } ) );
} ); } );
gulp.task( 'lint', ['jscs', 'jshint'] ); gulp.task( 'lint', [ 'jscs', 'jshint' ] );
gulp.task( 'jscs', function() { gulp.task( 'jscs', function() {
return gulp.src( 'elements/**/*.js', '*.json', '*.js' ) return gulp.src( paths.lint )
.pipe( $.jscs() ); .pipe( $.jscs() );
} ); } );
gulp.task( 'jshint', function() { gulp.task( 'jshint', function() {
return gulp.src( 'elements/**/*.js', '*.json', '*.js' ) return gulp.src( paths.lint )
.pipe( reload( { stream: true, once: true } ) ) .pipe( reload( { stream: true, once: true } ) )
.pipe( $.jshint( '.jshintrc' ) ) .pipe( $.jshint( '.jshintrc' ) )
.pipe( $.jshint.reporter( 'jshint-stylish' ) ) .pipe( $.jshint.reporter( 'jshint-stylish' ) )
@ -92,7 +99,7 @@ gulp.task( 'docs', function() {
gulp.task( 'clean', function() { gulp.task( 'clean', function() {
return gulp.src( ['build/*', '**/*.css'] ) return gulp.src( paths.clean )
.pipe( $.rimraf() ); .pipe( $.rimraf() );
} ); } );
@ -100,7 +107,7 @@ gulp.task( 'clean', function() {
function css( src, dest ) { function css( src, dest ) {
return gulp.src( src ) return gulp.src( src )
.pipe( $.stylus( { use: [nib()] } ) ) .pipe( $.stylus( { use: [ nib() ] } ) )
.pipe( gulp.dest( dest ) ); .pipe( gulp.dest( dest ) );
} }