Style fixes across the material-sprint branch.

Should bring the build back to a pleasant green color.
master
Sérgio Gomes 2014-10-14 16:19:35 +01:00
parent 7227ed68fa
commit cc72b01894
8 changed files with 46 additions and 39 deletions

View File

@ -16,9 +16,8 @@
* limitations under the License * limitations under the License
* *
*/ */
(function () { (function() {
'use strict'; 'use strict';
var querySelector = document.querySelector.bind(document); // TODO: Do we still need this file?
})(); })();

View File

@ -3,9 +3,11 @@
function PaperButton(el) { function PaperButton(el) {
var buttonElement = el; var buttonElement = el;
var rippleElement = buttonElement.querySelector('.PaperButton-ripple'); var rippleElement = buttonElement.querySelector('.PaperButton-ripple');
var frameCount = 0, x, y; var frameCount = 0;
var x;
var y;
if(rippleElement) { if (rippleElement) {
var bound = buttonElement.getBoundingClientRect(); var bound = buttonElement.getBoundingClientRect();
var rippleSize = Math.max(bound.width, bound.height) * 2; var rippleSize = Math.max(bound.width, bound.height) * 2;
@ -28,7 +30,8 @@ function PaperButton(el) {
}; };
this.setRippleXY = function(newX, newY) { this.setRippleXY = function(newX, newY) {
x = newX, y = newY; x = newX;
y = newY;
}; };
this.animFrameHandler = function() { this.animFrameHandler = function() {
@ -58,7 +61,8 @@ PaperButton.prototype.onClickHandler = function(evt) {
this.setFrameCount(1); this.setFrameCount(1);
var bound = evt.currentTarget.getBoundingClientRect(); var bound = evt.currentTarget.getBoundingClientRect();
var x, y; var x;
var y;
// Check if we are handling a keyboard click // Check if we are handling a keyboard click
if (event.clientX === 0 && event.clientY === 0) { if (event.clientX === 0 && event.clientY === 0) {
x = Math.round(bound.width / 2); x = Math.round(bound.width / 2);
@ -71,7 +75,7 @@ PaperButton.prototype.onClickHandler = function(evt) {
var transformString = 'translate(-50%, -50%) ' + var transformString = 'translate(-50%, -50%) ' +
'translate(' + x + 'px, ' + y + 'px) ' + 'translate(' + x + 'px, ' + y + 'px) ' +
'scale(0.0001, 0.0001)'; 'scale(0.0001, 0.0001)';
var rippleElement = this.getRippleElement(); var rippleElement = this.getRippleElement();
if (rippleElement) { if (rippleElement) {
rippleElement.style.webkitTransform = transformString; rippleElement.style.webkitTransform = transformString;

View File

@ -102,7 +102,6 @@
sidenav.close(); sidenav.close();
}); });
menuButton.addEventListener('click', function(evt) { menuButton.addEventListener('click', function(evt) {
sidenav.toggle(); sidenav.toggle();
}); });

View File

@ -27,14 +27,17 @@ function RadioButton(btnElement, labelElement) {
}; };
labelElement.addEventListener('click', this.onClick.bind(this)); labelElement.addEventListener('click', this.onClick.bind(this));
ripple.addEventListener('webkitTransitionEnd', this.onEndOfRippleTransition.bind(this)); ripple.addEventListener('webkitTransitionEnd',
ripple.addEventListener('oTransitionEnd', this.onEndOfRippleTransition.bind(this)); this.onEndOfRippleTransition.bind(this));
ripple.addEventListener('transitionEnd', this.onEndOfRippleTransition.bind(this)); ripple.addEventListener('oTransitionEnd',
this.onEndOfRippleTransition.bind(this));
ripple.addEventListener('transitionEnd',
this.onEndOfRippleTransition.bind(this));
} }
window.addEventListener('load', function() { window.addEventListener('load', function() {
var radioLabels = document.querySelectorAll('.RadioButton-label'); var radioLabels = document.querySelectorAll('.RadioButton-label');
for(var i = 0; i < radioLabels.length; i++) { for (var i = 0; i < radioLabels.length; i++) {
var radioButton = radioLabels[i].querySelector('.RadioButton'); var radioButton = radioLabels[i].querySelector('.RadioButton');
new RadioButton(radioButton, radioLabels[i]); new RadioButton(radioButton, radioLabels[i]);
} }

View File

@ -24,9 +24,9 @@ function Slider(element) {
this.updateValue(); this.updateValue();
} }
window.addEventListener('load', function(){ window.addEventListener('load', function() {
var sliders = document.querySelectorAll('input[type="range"]'); var sliders = document.querySelectorAll('input[type="range"]');
for(var i = 0; i < sliders.length; i++) { for (var i = 0; i < sliders.length; i++) {
new Slider(sliders[i]); new Slider(sliders[i]);
} }
}); });

View File

@ -8,8 +8,9 @@ function TextField(element) {
if (inputElement.hasAttribute('maxrows')) { if (inputElement.hasAttribute('maxrows')) {
maxRows = parseInt(inputElement.getAttribute('maxrows'), 10); maxRows = parseInt(inputElement.getAttribute('maxrows'), 10);
if(isNaN(maxRows)) { if (isNaN(maxRows)) {
console.log('maxrows attribute provided, but wasn\'t a number: '+maxRows); console.log(
'maxrows attribute provided, but wasn\'t a number: ' + maxRows);
maxRows = NO_MAX_ROWS; maxRows = NO_MAX_ROWS;
} }
} }
@ -24,15 +25,15 @@ function TextField(element) {
this.onKeyDown = function(evt) { this.onKeyDown = function(evt) {
var currentRowCount = evt.target.value.split('\n').length; var currentRowCount = evt.target.value.split('\n').length;
if(evt.keyCode === 13) { if (evt.keyCode === 13) {
if(currentRowCount >= maxRows) { if (currentRowCount >= maxRows) {
evt.preventDefault(); evt.preventDefault();
} }
} }
}; };
inputElement.addEventListener('input', this.onInputChange.bind(this)); inputElement.addEventListener('input', this.onInputChange.bind(this));
if(maxRows !== NO_MAX_ROWS) { if (maxRows !== NO_MAX_ROWS) {
// TODO: This should handle pasting multi line text // TODO: This should handle pasting multi line text
// Currently doesn't // Currently doesn't
inputElement.addEventListener('keydown', this.onKeyDown.bind(this)); inputElement.addEventListener('keydown', this.onKeyDown.bind(this));

View File

@ -1,3 +1,5 @@
'use strict';
// From: http://www.paulirish.com/2011/requestanimationframe-for-smart-animating/ // From: http://www.paulirish.com/2011/requestanimationframe-for-smart-animating/
// shim layer with setTimeout fallback // shim layer with setTimeout fallback
window.requestAnimFrame = (function() { window.requestAnimFrame = (function() {

View File

@ -41,8 +41,8 @@ var AUTOPREFIXER_BROWSERS = [
]; ];
// Lint JavaScript // Lint JavaScript
gulp.task('jshint', function () { gulp.task('jshint', function() {
return gulp.src('app/scripts/**/*.js') return gulp.src(['app/scripts/**/*.js', 'app/styleguide/**/*.js'])
.pipe(reload({stream: true, once: true})) .pipe(reload({stream: true, once: true}))
.pipe($.jshint()) .pipe($.jshint())
.pipe($.jshint.reporter('jshint-stylish')) .pipe($.jshint.reporter('jshint-stylish'))
@ -50,7 +50,7 @@ gulp.task('jshint', function () {
}); });
// Optimize Images // Optimize Images
gulp.task('images', function () { gulp.task('images', function() {
return gulp.src('app/images/**/*') return gulp.src('app/images/**/*')
.pipe($.cache($.imagemin({ .pipe($.cache($.imagemin({
progressive: true, progressive: true,
@ -61,7 +61,7 @@ gulp.task('images', function () {
}); });
// Copy All Files At The Root Level (app) // Copy All Files At The Root Level (app)
gulp.task('copy', function () { gulp.task('copy', function() {
return gulp.src([ return gulp.src([
'app/*', 'app/*',
'!app/*.html', '!app/*.html',
@ -73,26 +73,25 @@ gulp.task('copy', function () {
}); });
// Copy Web Fonts To Dist // Copy Web Fonts To Dist
gulp.task('fonts', function () { gulp.task('fonts', function() {
return gulp.src(['app/fonts/**']) return gulp.src(['app/fonts/**'])
.pipe(gulp.dest('dist/fonts')) .pipe(gulp.dest('dist/fonts'))
.pipe($.size({title: 'fonts'})); .pipe($.size({title: 'fonts'}));
}); });
// Compile and Automatically Prefix Stylesheets // Compile and Automatically Prefix Stylesheets
gulp.task('styles', function () { gulp.task('styles', function() {
// For best performance, don't add Sass partials to `gulp.src` // For best performance, don't add Sass partials to `gulp.src`
return gulp.src([ return gulp.src([
'app/**/*.scss', 'app/**/*.scss',
'app/styles/**/*.css' 'app/styles/**/*.css'
]) ])
.pipe($.changed('styles', {extension: '.scss'})) .pipe($.changed('styles', {extension: '.scss'}))
.pipe($.rubySass({ .pipe($.rubySass({
style: 'expanded', style: 'expanded',
precision: 10 precision: 10
}) })
.on('error', console.error.bind(console)) .on('error', console.error.bind(console)))
)
.pipe($.autoprefixer(AUTOPREFIXER_BROWSERS)) .pipe($.autoprefixer(AUTOPREFIXER_BROWSERS))
.pipe(gulp.dest('.tmp')) .pipe(gulp.dest('.tmp'))
// Concatenate And Minify Styles // Concatenate And Minify Styles
@ -102,7 +101,7 @@ gulp.task('styles', function () {
}); });
// Scan Your HTML For Assets & Optimize Them // Scan Your HTML For Assets & Optimize Them
gulp.task('html', function () { gulp.task('html', function() {
var assets = $.useref.assets({searchPath: '{.tmp,app}'}); var assets = $.useref.assets({searchPath: '{.tmp,app}'});
return gulp.src('app/**/*.html') return gulp.src('app/**/*.html')
@ -141,7 +140,7 @@ gulp.task('html', function () {
gulp.task('clean', del.bind(null, ['.tmp', 'dist'])); gulp.task('clean', del.bind(null, ['.tmp', 'dist']));
// Watch Files For Changes & Reload // Watch Files For Changes & Reload
gulp.task('serve', ['styles'], function () { gulp.task('serve', ['styles'], function() {
browserSync({ browserSync({
notify: false, notify: false,
// Customize the BrowserSync console logging prefix // Customize the BrowserSync console logging prefix
@ -160,7 +159,7 @@ gulp.task('serve', ['styles'], function () {
}); });
// Build and serve the output from the dist build // Build and serve the output from the dist build
gulp.task('serve:dist', ['default'], function () { gulp.task('serve:dist', ['default'], function() {
browserSync({ browserSync({
notify: false, notify: false,
logPrefix: 'WSK', logPrefix: 'WSK',
@ -173,7 +172,7 @@ gulp.task('serve:dist', ['default'], function () {
}); });
// Build Production Files, the Default Task // Build Production Files, the Default Task
gulp.task('default', ['clean'], function (cb) { gulp.task('default', ['clean'], function(cb) {
runSequence('styles', ['jshint', 'html', 'images', 'fonts', 'copy'], cb); runSequence('styles', ['jshint', 'html', 'images', 'fonts', 'copy'], cb);
}); });