Merge pull request #34 from AntoineBoulanger/baker-js

[JS UPDATE PROPOSITION] More modular JavaScript system

www/modules/boilerplate/assets/scripts/src/app.js

@@ -1,8 +1,9 @@
-// App object
+// ==========================================================================
+// App
+// ==========================================================================
 var app = window.app || {};
 
-// Initialize app
-app.init = function(){
+app.init = function() {
 
 	'use strict';
 
@@ -17,28 +18,53 @@ app.init = function(){
 		body : document.body
 	};
 
-	// Init as empty and / or build
 	self.templates = self.templates || {};
 
-	/* Template scripts pseudo loader
-	========================================================================== */
+	self.widgets = self.widgets || {};
 
-	// Identify the template we're using
+	// 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');
 
-	// Run the template script only if it's found
-	if( typeof self.templates[ self.params.current_template ] === 'object' ){
+	if (typeof self.templates[ self.params.current_template ] === 'object') {
 		self.templates[ self.params.current_template ].init();
 	}
 
-	/* Execute global site scripts
-	========================================================================== */
-	if( typeof self.Globals === 'object' ){
-		self.Globals.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);
+        }
+    }
 };
 
-// On doc ready, init your app
-$(function(){
+// Init
+// ==========================================================================
+$(function() {
 	app.init();
 });

www/modules/boilerplate/assets/scripts/src/app/boilerplate.globals.js

@@ -1,26 +0,0 @@
-var app = window.app || {};
-
-app.Globals = {
-
-    init : function(){
-
-        'use strict';
-
-        //var self = this;
-
-        /* Site wide binds go here
-        ========================================================================== */
-
-        $('.js-boilerplate-toggle').on('click',function() {
-            // toggle toggle
-        });
-
-        /* When all content has loaded, not just DOM
-        ========================================================================== */
-        window.onload = function() {
-
-        };
-
-    }
-
-};

www/modules/boilerplate/assets/scripts/src/app/globals.js

@@ -0,0 +1,16 @@
+// ==========================================================================
+// Globals
+// ==========================================================================
+var app = window.app || {};
+
+app.globals = {
+
+    init : function() {
+
+        // Global modules
+        // ==========================================================================
+        // app.parallax.init();
+
+    }
+
+};

www/modules/boilerplate/assets/scripts/src/templates/boilerplate.template.generic.js

@@ -1,16 +0,0 @@
-// App object
-var app = window.app || {};
-// Templates object
-app.templates = app.templates || {};
-
-/* ==========================================================================
-   Generic template scripts
-============================================================================= */
-app.templates.generic = {
-
-    init:function(){
-
-        // Template specific code
-    }
-
-};

www/modules/boilerplate/assets/scripts/src/templates/generic.js

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

www/modules/boilerplate/assets/scripts/src/widgets/generic.js

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

www/modules/boilerplate/grunt_tasks/concat.js

@@ -4,6 +4,7 @@ module.exports = {
 		src: [
 			'assets/scripts/src/app/*.js',
 			'assets/scripts/src/templates/*.js',
+			'assets/scripts/src/widgets/*.js',
 			'assets/scripts/src/app.js'
 		],
 		dest: 'assets/scripts/dist/app.js'
@@ -15,4 +16,4 @@ module.exports = {
 		dest: 'assets/scripts/dist/vendors.js'
 	}
 
-};
+};