novoland-developer-networks/OfficialSite
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge pull request #40 from locomotivemtl/es5-to-es6

Browse Source 
ES6 merge with master (without charcoal)
This commit is contained in:
Antoine Boulanger
2016-02-04 14:33:08 -05:00
parent 442d74b453 3506a95ee9
commit 240db72b06
22 changed files with 488 additions and 239 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
.babelrc Normal file
View File

@@ -0,0 +1,3 @@
{
"presets": ["es2015"]
}

42
.eslintrc Normal file
View File

@@ -0,0 +1,42 @@
{
"env": {
"browser": true,
"node": true,
"es6": true
},
"ecmaFeatures": {
"arrowFunctions": true,
"binaryLiterals": true,
"blockBindings": true,
"classes": true,
"defaultParams": true,
"destructuring": true,
"forOf": true,
"generators": true,
"modules": true,
"objectLiteralComputedProperties": true,
"objectLiteralDuplicateProperties": true,
"objectLiteralShorthandMethods": true,
"objectLiteralShorthandProperties": true,
"octalLiterals": true,
"regexUFlag": true,
"regexYFlag": true,
"spread": true,
"superInFunctions": false,
"templateStrings": true,
"unicodeCodePointEscapes": true,
"globalReturn": true,
"jsx": true
},
"rules": {
"eqeqeq": 2,
"strict": 0,
"no-empty": 1,
"no-alert": 2,
"no-eval": 2,
"quotes": [1, "single", "avoid-escape"],
"no-trailing-spaces": [2, { "skipBlankLines": true }],
"eol-last": 0,
"yoda": [2, "never", { "exceptRange": true }]
}
}

24
Gruntfile.js
View File

@@ -1,5 +1,6 @@
module.exports = function(grunt) {
function loadConfig(path) {
var glob = require('glob');
var object = {};
@@ -15,7 +16,7 @@ module.exports = function(grunt) {
var config = {
pkg: grunt.file.readJSON('package.json')
};
}
grunt.loadTasks('grunt_tasks');
grunt.util._.extend(config, loadConfig('./grunt_tasks/'));
@@ -28,14 +29,17 @@ module.exports = function(grunt) {
grunt.registerTask('default', ['watch', 'notify:watch']);
grunt.registerTask('sync', ['browserSync', 'watch', 'notify:watch']);
grunt.registerTask('build', [
'concat',
// CSS
'sass',
'svgstore',
'postcss',
'uglify',
'cssmin',
'svgmin',
'imagemin'
// JS
'browserify:prod',
'eslint',
'uglify',
// SVG
'svgstore',
'svgmin'
]);
grunt.registerTask('c', [
'csscomb'
@@ -43,4 +47,12 @@ module.exports = function(grunt) {
grunt.registerTask('j', [
'jshint'
]);
grunt.registerTask('wlint', [
// PHP
'phplint',
'jsonlint',
// Utilities
'watch'
]);
};

11
grunt_tasks/browserSync.js
View File

@@ -1,16 +1,17 @@
module.exports = {
dev: {
bsFiles: {
src: [
'www/assets/styles/dist/*.css',
'www/assets/scripts/dist/*.js'
src : [
'www/assets/styles/dist/*.css'
,'www/assets/scripts/dist/*.js'
,'www/assets/templates/*.php'
]
},
options: {
proxy: 'localhost',
proxy: "localhost",
port: 3000,
watchTask: true,
notify: false
}
}
};
}

28
grunt_tasks/browserify.js Normal file
View File

@@ -0,0 +1,28 @@
module.exports = {
dev: {
options: {
transform: [['babelify', { presets: ['es2015'] }]],
browserifyOptions: { debug: true },
exclude: ''
},
files: {
'www/assets/scripts/dist/app.js': [
'www/assets/scripts/src/**/*.js',
'!www/assets/scripts/src/vendors/*.js'
]
}
},
prod: {
options: {
transform: [['babelify', { presets: ['es2015'] }]],
browserifyOptions: { debug: false },
exclude: ''
},
files: {
'www/assets/scripts/dist/app.js': [
'www/assets/scripts/src/**/*.js',
'!www/assets/scripts/src/vendors/*.js'
]
}
}
};

10
grunt_tasks/eslint.js Normal file
View File

@@ -0,0 +1,10 @@
module.exports = {
options: {
format: require('eslint-tap'),
configFile: '.eslintrc'
},
target: [
'www/assets/scripts/src/**/*.js',
'!www/assets/scripts/src/vendors/*.js'
],
};

22
grunt_tasks/jshint.js
View File

@@ -1,19 +1,19 @@
module.exports = {
options: {
'curly': true,
'eqeqeq': true,
'eqnull': true,
'undef': true,
'unused': true,
'browser': true,
'globals': {
'window': true,
'$': true,
'jQuery': true
"curly":true,
"eqeqeq": true,
"eqnull": true,
"undef":true,
"unused": true,
browser:true,
"globals":{
"window":true,
"$":true,
"jQuery":true
}
},
src: [
'www/assets/scripts/src/**/*.js',
'!www/assets/scripts/src/vendors/**/*.js'
]
],
}

4
grunt_tasks/notify.js
View File

@@ -17,10 +17,10 @@ module.exports = {
message: 'Sass compiled to CSS.'
}
},
concat: {
javascript: {
options: {
// title: '<%= pkg.title %>',
message: 'JavaScript is now concatenated'
message: 'JavaScript is ready.'
}
},
svg: {

22
grunt_tasks/phplint.js Normal file
View File

@@ -0,0 +1,22 @@
module.exports = {
options: {
swapPath: '/tmp',
phpArgs : {
// add -f for fatal errors
'-lf': null
}
},
project: [
'code/*.php',
'code/**/*.php',
'www/assets/templates/*.php',
'www/assets/templates/**/*.php'
],
charcoal: [
'../charcoal/core/code/*.php',
'../charcoal/core/code/**/*.php',
'../charcoal/modules/**/code/*.php',
'../charcoal/modules/**/code/**/*.php'
]
}

10
grunt_tasks/postcss.js
View File

@@ -4,15 +4,15 @@ module.exports = {
processors: [
require('autoprefixer')({
browsers: ['last 2 versions', '> 1%', 'ie >= 9']
})
}),
]
},
files: [
{
src: ['www/assets/styles/dist/*.css'],
dest: 'www/assets/styles/dist/',
expand: true,
flatten: true
src : ['www/assets/styles/dist/*.css'],
dest : 'www/assets/styles/dist/',
expand : true,
flatten : true
}
]
}

8
grunt_tasks/svgstore.js
View File

@@ -1,8 +1,10 @@
module.exports = {
options: {},
default: {
options: {
},
default : {
files: {
'www/assets/images/dist/svgs.svg': ['www/assets/images/svgs/*.svg']
'www/assets/images/dist/svgs.svg': ['www/assets/images/svgs/*.svg'],
}
}
}

53
grunt_tasks/watch.js
View File

@@ -1,24 +1,33 @@
module.exports = {
javascript: {
files: ['www/assets/scripts/src/**/*.js'],
tasks: ['concat', 'notify:concat']
},
sass: {
files: ['www/assets/styles/src/**/*.scss'],
tasks: ['sass', 'postcss', 'notify:sass'],
options: {
spawn: false,
livereload: true
}
},
svg: {
files: ['www/assets/images/**/*.svg'],
tasks: ['svgstore', 'notify:svg']
},
tasks: {
files: ['grunt_tasks/*.js'],
options: {
reload: true
}
}
javascript_app: {
files: [
'www/assets/scripts/src/**/*.js',
'!www/assets/scripts/src/vendors/*.js'
],
tasks: ['browserify:dev', 'eslint', 'notify:javascript']
},
javascript_vendors: {
files: [
'www/assets/scripts/src/vendors/*.js'
],
tasks: ['concat', 'notify:javascript']
},
sass: {
files: ['www/assets/styles/src/**/*.scss'],
tasks: ['sass', 'postcss', 'notify:sass'],
options: {
spawn: false,
livereload: true
}
},
svg: {
files: ['www/assets/images/**/*.svg'],
tasks: ['svgstore', 'notify:svg']
},
tasks: {
files: ['grunt_tasks/*.js'],
options: {
reload: true
}
}
}

41
package.json
View File

@@ -3,23 +3,28 @@
"version": "1.0.0",
"author": "Locomotive <info@locomotive.ca>",
"devDependencies": {
"autoprefixer": "0.0.0",
"glob": "0.0.0",
"grunt": "0.0.0",
"grunt-browser-sync": "0.0.0",
"grunt-contrib-concat": "0.0.0",
"grunt-contrib-cssmin": "0.0.0",
"grunt-contrib-jshint": "0.0.0",
"grunt-contrib-uglify": "0.0.0",
"grunt-contrib-watch": "0.0.0",
"grunt-csscomb": "0.0.0",
"grunt-jsonlint": "0.0.0",
"grunt-notify": "0.0.0",
"grunt-phplint": "0.0.0",
"grunt-postcss": "0.0.0",
"grunt-sass": "0.0.0",
"grunt-svgmin": "0.0.0",
"grunt-svgstore": "0.0.0",
"load-grunt-tasks": "0.0.0"
"autoprefixer": "6.3.1",
"babel-preset-es2015": "6.3.13",
"babelify": "7.2.0",
"eslint-tap": "1.1.0",
"glob": "6.0.4",
"grunt": "0.4.5",
"grunt-browser-sync": "2.2.0",
"grunt-browserify": "4.0.1",
"grunt-contrib-concat": "0.5.1",
"grunt-contrib-cssmin": "0.14.0",
"grunt-contrib-jshint": "0.12.0",
"grunt-contrib-uglify": "0.11.0",
"grunt-contrib-watch": "0.6.1",
"grunt-csscomb": "3.1.0",
"grunt-eslint": "17.3.1",
"grunt-jsonlint": "1.0.7",
"grunt-notify": "0.4.3",
"grunt-phplint": "0.0.8",
"grunt-postcss": "0.7.1",
"grunt-sass": "1.1.0",
"grunt-svgmin": "3.1.2",
"grunt-svgstore": "0.5.0",
"load-grunt-tasks": "3.4.0"
}
}

280
www/assets/scripts/dist/app.js vendored
View File

File diff suppressed because one or more lines are too long

106
www/assets/scripts/src/app.js
View File

@@ -1,70 +1,70 @@
/* jshint esnext: true */
// ==========================================================================
// App
// ==========================================================================
var app = window.app || {};
import * as modules from './modules'
import * as templates from './templates'
app.init = function() {
class App {
constructor (options) {
'use strict';
this.elements = {
html: document.documentElement,
body: document.body
};
var self = this;
this.params = {
current_modules: [],
current_template: this.elements.html.getAttribute('data-template')
};
self.params = {
this.modules = modules;
this.templates = templates;
};
/**
* @todo [1] Discuss storing instanciated objects
* @todo [2] Discuss singleton concept (one off functions/declarations)
*/
// Modules
// ==========================================================================
var moduleEls = document.querySelectorAll('[data-module]');
for (let i = 0, elsLen = moduleEls.length; i < elsLen; i++) {
self.elements = {
html : document.documentElement,
body : document.body
};
let attr = moduleEls[i].getAttribute('data-module');
self.templates = self.templates || {};
// Splitting modules found in the data-attribute
let moduleAttrs = attr.replace(/\s/g, '').split(',');
self.widgets = self.widgets || {};
for (let j = 0, modLen = moduleAttrs.length; j < modLen; j++) {
let moduleAttr = moduleAttrs[j];
// Uppercasing for class usage
let ident = moduleAttr.charAt(0).toUpperCase() + moduleAttr.slice(1) + 'Module';
if (typeof this.modules[ident] === 'function' && this.params.current_modules.indexOf(ident) === -1) {
// [1,2]
let module = new this.modules[ident]({
$el: $(moduleEls[i])
});
// [2]
this.params.current_modules.push(module);
}
}
}
// Template
// ==========================================================================
if (typeof(this.params.current_template) === 'string' && this.params.current_template.length !== 0) {
var templateIdent = this.params.current_template.charAt(0).toUpperCase() + this.params.current_template.slice(1) + 'Template';
if (typeof this.templates[templateIdent] === 'function') {
var template = new this.templates[templateIdent];
}
}
// Globals
// ==========================================================================
if (typeof self.globals === 'object') {
self.globals.init();
}
// Modules
// ==========================================================================
self.params.current_modules = [];
var modules = document.querySelectorAll('[data-app]');
for (var m = 0; m < modules.length; m++) {
var dataApp = modules[m].getAttribute('data-app');
if (typeof self[dataApp] === 'object' && self.params.current_modules.indexOf(dataApp) === -1) {
self[dataApp].init();
self.params.current_modules.push(dataApp);
}
}
// Template
// ==========================================================================
self.params.current_template = self.elements.body.getAttribute('data-template');
if (typeof self.templates[ self.params.current_template ] === 'object') {
self.templates[ self.params.current_template ].init();
}
// Widgets
// ==========================================================================
self.params.current_widgets = [];
var widgets = document.querySelectorAll('[data-widget]');
for (var w = 0; w < widgets.length; w++) {
var dataWidget = widgets[w].getAttribute('data-widget');
if (typeof self.widgets[dataWidget] === 'object' && self.params.current_widgets.indexOf(dataWidget) === -1) {
self.widgets[dataWidget].init();
self.params.current_widgets.push(dataWidget);
}
}
};
// Init
// ==========================================================================
$(function() {
app.init();
window.app = new App();
});

2
www/assets/scripts/src/modules.js Normal file
View File

@@ -0,0 +1,2 @@
export {default as GenericModule} from './modules/Generic';
export {default as TitleModule} from './modules/Title';

13
www/assets/scripts/src/modules/Generic.js Normal file
View File

@@ -0,0 +1,13 @@
// ==========================================================================
// Generic module
// ==========================================================================
class GenericModule {
constructor (options) {
this.$el = options.$el;
console.log('Generic module');
console.log(this.$el);
}
}
export default GenericModule;

13
www/assets/scripts/src/modules/Title.js Normal file
View File

@@ -0,0 +1,13 @@
// ==========================================================================
// Title module
// ==========================================================================
class TitleModule {
constructor (options) {
this.$el = options.$el;
console.log('Title module');
console.log(this.$el);
}
}
export default TitleModule;

1
www/assets/scripts/src/templates.js Normal file
View File

@@ -0,0 +1 @@
export {default as GenericTemplate} from './templates/Generic';

15
www/assets/scripts/src/templates/generic.js → www/assets/scripts/src/templates/Generic.js
View File

@@ -1,13 +1,12 @@
// ==========================================================================
// Generic template
// ==========================================================================
var app = window.app || {};
app.templates = app.templates || {};
app.templates.generic = {
class GenericTemplate {
constructor (options) {
console.log('Generic template');
this.options = options;
}
}
init : function() {
}
};
export default GenericTemplate;

13
www/assets/scripts/src/widgets/generic.js
View File

@@ -1,13 +0,0 @@
// ==========================================================================
// Generic widget
// ==========================================================================
var app = window.app || {};
app.widgets = app.widgets || {};
app.widgets.generic = {
init : function() {
}
};

6
www/index.html
View File

@@ -1,6 +1,6 @@
<!doctype html>
<!--[if lte IE 9]> <html lang="fr" class="ie9"> <![endif]-->
<!--[if gt IE 9]><!--> <html lang="fr"> <!--<![endif]-->
<!--[if gt IE 9]><!--> <html lang="fr" data-template="generic"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
@@ -14,7 +14,9 @@
<link rel="stylesheet" href="assets/styles/dist/main.css">
</head>
<body>
<body >
<h1 data-module="generic,title">Locomotive boilerplate</h1>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="assets/scripts/dist/jquery-1.11.3.min.js"><\/script>')</script>