From 57fcafb3243319eac6fffb71fb0fa3cdba8c6fe2 Mon Sep 17 00:00:00 2001 From: Jake Howard Date: Sat, 14 May 2016 13:51:10 +0100 Subject: [PATCH] Add JS build pipeline --- package.json | 5 ++- scripts/build-js.sh | 20 ++++----- theme/static/src/js/app.js | 1 + theme/static/src/js/creative/creative.js | 44 +++++++++++++++++++ theme/static/src/js/creative/index.js | 3 ++ .../static/src/js/creative/jquery.fittext.js | 43 ++++++++++++++++++ theme/templates/index.html | 9 ---- 7 files changed, 104 insertions(+), 21 deletions(-) create mode 100644 theme/static/src/js/app.js create mode 100644 theme/static/src/js/creative/creative.js create mode 100644 theme/static/src/js/creative/index.js create mode 100644 theme/static/src/js/creative/jquery.fittext.js diff --git a/package.json b/package.json index 381f761..7d91144 100644 --- a/package.json +++ b/package.json @@ -3,10 +3,10 @@ "version": "4.0.0", "description": " Source code for TheOrangeOne.net", "scripts": { - "lint": "eslint 'static/src/js/'", + "lint": "eslint 'theme/static/src/js/'", "build-js": "./scripts/build-js.sh", - "create-build-dirs": "mkdir -p static/build/js/lib static/build/fonts static/build/css static/build/img", "build-scss": "bash scripts/build-scss.sh", + "create-build-dirs": "mkdir -p theme/static/build/js/lib theme/static/build/fonts theme/static/build/css theme/static/build/img", "test": "npm run lint", "spellcheck": "mdspell --en-gb -ranx \"templates/**/*.*\"" }, @@ -19,6 +19,7 @@ "bootstrap-sass": "=3.3.6", "ionicons": "=3.0.0", "jquery": "=2.2.3", + "jquery.easing": "=1.3.2", "underscore": "=1.8.3" }, "devDependencies": { diff --git a/scripts/build-js.sh b/scripts/build-js.sh index b4fdede..c76274f 100755 --- a/scripts/build-js.sh +++ b/scripts/build-js.sh @@ -7,38 +7,38 @@ then echo ">>> WARNING: Building in Production Mode!" fi -mkdir -p static/build/js/lib +mkdir -p theme/static/build/js/lib if [[ $BUILD_PRODUCTION ]] then echo ">> Compressing Libraries..." - uglifyjs node_modules/bootstrap/dist/js/bootstrap.js --compress --screw-ie8 --define --stats --keep-fnames -o static/build/js/lib/bootstrap.js - uglifyjs static/build/js/lib/* --compress --screw-ie8 --define --stats --keep-fnames -o static/build/js/libs.js + uglifyjs node_modules/bootstrap-sass/assets/javascripts/bootstrap.js --compress --screw-ie8 --define --stats --keep-fnames -o theme/static/build/js/lib/bootstrap.js + uglifyjs theme/static/build/js/lib/* --compress --screw-ie8 --define --stats --keep-fnames -o theme/static/build/js/libs.js else echo ">> Building Libraries..." - cp node_modules/bootstrap/dist/js/bootstrap.js static/build/js/lib/bootstrap.js - uglifyjs static/build/js/lib/* --screw-ie8 --stats --keep-fnames -o static/build/js/libs.js + cp node_modules/bootstrap-sass/assets/javascripts/bootstrap.js theme/static/build/js/lib/bootstrap.js + uglifyjs theme/static/build/js/lib/* --screw-ie8 --stats --keep-fnames -o theme/static/build/js/libs.js fi -rm -rf static/build/js/lib +rm -rf theme/static/build/js/lib if [[ $BUILD_PRODUCTION ]] then echo ">> Compressing jQuery..." - uglifyjs node_modules/jquery/dist/jquery.js --compress --screw-ie8 --define --stats --keep-fnames -o static/build/js/jquery.js + uglifyjs node_modules/jquery/dist/jquery.js --compress --screw-ie8 --define --stats --keep-fnames -o theme/static/build/js/jquery.js else echo ">> Building jQuery..." - uglifyjs node_modules/jquery/dist/jquery.js --screw-ie8 --stats --keep-fnames -o static/build/js/jquery.js + uglifyjs node_modules/jquery/dist/jquery.js --screw-ie8 --stats --keep-fnames -o theme/static/build/js/jquery.js fi echo ">> Building Application JS..." -browserify -t [ babelify --presets [ es2015 react ] ] static/src/js/app.js -o static/build/js/app.js +browserify -t [ babelify --presets [ es2015 react ] ] theme/static/src/js/app.js -o theme/static/build/js/app.js if [[ $BUILD_PRODUCTION ]] then echo ">> Compressing Application..." - uglifyjs static/build/js/app.js --compress --screw-ie8 --define --stats --keep-fnames -o static/build/js/app.js + uglifyjs theme/static/build/js/app.js --compress --screw-ie8 --define --stats --keep-fnames -o theme/static/build/js/app.js fi echo "> JS Built!" diff --git a/theme/static/src/js/app.js b/theme/static/src/js/app.js new file mode 100644 index 0000000..9d74810 --- /dev/null +++ b/theme/static/src/js/app.js @@ -0,0 +1 @@ +import './creative'; diff --git a/theme/static/src/js/creative/creative.js b/theme/static/src/js/creative/creative.js new file mode 100644 index 0000000..d8ae688 --- /dev/null +++ b/theme/static/src/js/creative/creative.js @@ -0,0 +1,44 @@ +/*! + * Start Bootstrap - Creative Bootstrap Theme (http://startbootstrap.com) + * Code licensed under the Apache License v2.0. + * For details, see http://www.apache.org/licenses/LICENSE-2.0. + */ + +(function($) { + "use strict"; // Start of use strict + + // jQuery for page scrolling feature - requires jQuery Easing plugin + $('a.page-scroll').bind('click', function(event) { + var $anchor = $(this); + $('html, body').stop().animate({ + scrollTop: ($($anchor.attr('href')).offset().top - 50) + }, 1250, 'easeInOutExpo'); + event.preventDefault(); + }); + + // Highlight the top nav as scrolling occurs + $('body').scrollspy({ + target: '.navbar-fixed-top', + offset: 51 + }) + + // Closes the Responsive Menu on Menu Item Click + $('.navbar-collapse ul li a').click(function() { + $('.navbar-toggle:visible').click(); + }); + + // Fit Text Plugin for Main Header + $("h1").fitText( + 1.2, { + minFontSize: '35px', + maxFontSize: '65px' + } + ); + + // Offset for Main Navigation + $('#mainNav').affix({ + offset: { + top: 100 + } + }); +})(jQuery); // End of use strict diff --git a/theme/static/src/js/creative/index.js b/theme/static/src/js/creative/index.js new file mode 100644 index 0000000..4fe7aa3 --- /dev/null +++ b/theme/static/src/js/creative/index.js @@ -0,0 +1,3 @@ +import 'jquery.easing'; +import './jquery.fittext'; +import './creative'; diff --git a/theme/static/src/js/creative/jquery.fittext.js b/theme/static/src/js/creative/jquery.fittext.js new file mode 100644 index 0000000..0b3ddef --- /dev/null +++ b/theme/static/src/js/creative/jquery.fittext.js @@ -0,0 +1,43 @@ +/*global jQuery */ +/*! +* FitText.js 1.2 +* +* Copyright 2011, Dave Rupert http://daverupert.com +* Released under the WTFPL license +* http://sam.zoy.org/wtfpl/ +* +* Date: Thu May 05 14:23:00 2011 -0600 +*/ + +(function( $ ){ + + $.fn.fitText = function( kompressor, options ) { + + // Setup options + var compressor = kompressor || 1, + settings = $.extend({ + 'minFontSize' : Number.NEGATIVE_INFINITY, + 'maxFontSize' : Number.POSITIVE_INFINITY + }, options); + + return this.each(function(){ + + // Store the object + var $this = $(this); + + // Resizer() resizes items based on the object width divided by the compressor * 10 + var resizer = function () { + $this.css('font-size', Math.max(Math.min($this.width() / (compressor*10), parseFloat(settings.maxFontSize)), parseFloat(settings.minFontSize))); + }; + + // Call once to set. + resizer(); + + // Call on resize. Opera debounces their resize by default. + $(window).on('resize.fittext orientationchange.fittext', resizer); + + }); + + }; + +})( jQuery ); diff --git a/theme/templates/index.html b/theme/templates/index.html index a9dbd8e..4140884 100644 --- a/theme/templates/index.html +++ b/theme/templates/index.html @@ -253,15 +253,6 @@ - - - - - - - - -