feat(Build): External markup support

Gruntfile.js

@@ -1,29 +1,30 @@
 module.exports = function(grunt) {
   var path = require('path'),
+      assets = grunt.file.exists('../assets.json') ?
+               grunt.file.readJSON('../assets.json').path :
+               'node_modules/my-jquery-plugins-assets/',
+      common = grunt.file.readJSON(assets + 'configs/common.json'),
       pkg = grunt.file.readJSON('package.json'),
       settings = grunt.file.readJSON('configs/settings.json'),
+      banner = require(assets + 'configs/banner'),
       env = grunt.option('target') || 'dev',
       prod = env === 'prod';
 
   grunt.pluginData = {
+    assets: assets,
     pkg: pkg,
+    common: common,
     settings: settings,
     prod: prod,
     env: env,
 
     envPath: !prod ?
-      'assets/page/' :
-      'http://assets.martinmetodiev.com/',
+             'assets/page/' :
+             'http://assets.' + common.domain + '/',
 
-    banner: '/*! \n' +
-            ' <%= pkg.title %> v<%= pkg.version %>\n' +
-            ' <%= pkg.homepage%>\n' +
-            '\n' +
-            ' Copyright (c) <%= grunt.template.today("yyyy") %> <%= pkg.author.name %>\n' +
-            ' Licensed under the <%= pkg.license %> license.\n' +
-            '*/\n',
+    banner: banner,
 
-    domain: pkg.name.toLowerCase() + '.martinmetodiev.com'
+    domain: pkg.name.toLowerCase() + '.' + common.domain
   };
 
   require('time-grunt')(grunt);
@@ -37,5 +38,4 @@ module.exports = function(grunt) {
     grunt.task.run(['concurrent:build']);
     grunt.task.run(['concurrent:' + env]);
   });
-
 };

configs/grunt/clean.js

@@ -5,10 +5,11 @@ module.exports = {
 
   plugin_scripts: ['dist/js'],
 
-  demo_markup:    ['index.html'],
+  demo_markup:    ['assets/demo/demo.html'],
   demo_styles:    ['assets/demo/css'],
   demo_scripts:   ['assets/demo/js'],
 
+  page_markup:    ['index.html'],
   page_styles:    ['assets/page/css'],
   page_scripts:   ['assets/page/js'],
   page_favicons:  ['assets/page/favicons']

configs/grunt/concurrent.js

@@ -1,7 +1,10 @@
 var grunt = require('grunt'),
 
+  // page markup
+  pageMarkupTasks = ['pug:page'],
+
   // demo markup
-  demoMarkupTasks = ['pug:demo'],
+  demoMarkupTasks = ['clean:demo_markup', 'copy:demo_markup'],
 
   // demo styles
   demoStylesTasks = ['sass:demo'],
@@ -14,6 +17,7 @@ var grunt = require('grunt'),
 
 module.exports = {
   build: [
+    pageMarkupTasks,
     demoMarkupTasks,
     demoStylesTasks,
     demoScriptsTasks,

configs/grunt/connect.js

@@ -4,7 +4,7 @@ var grunt = require('grunt'),
 module.exports = {
   server: {
     options: {
-      port: grunt.pluginData.settings.port,
+      port: grunt.pluginData.common.port,
       base: '.',
       livereload: false
     }

configs/grunt/copy.js

@@ -7,7 +7,7 @@ module.exports = {
         expand: true,
         cwd: './',
         flatten: true,
-        src: ['<%= settings.assetsPath %>dist/css/*.*'],
+        src: ['<%= assets %>dist/css/*.*'],
         dest: 'assets/page/css'
       }
     ]
@@ -19,7 +19,7 @@ module.exports = {
         expand: true,
         cwd: './',
         flatten: true,
-        src: ['<%= settings.assetsPath %>dist/js/*.*'],
+        src: ['<%= assets %>dist/js/*.*'],
         dest: 'assets/page/js'
       }
     ]
@@ -31,9 +31,18 @@ module.exports = {
         expand: true,
         cwd: './',
         flatten: true,
-        src: ['<%= settings.assetsPath %>dist/favicons/*.*'],
+        src: ['<%= assets %>dist/favicons/*.*'],
         dest: 'assets/page/favicons'
       }
     ]
+  },
+
+  demo_markup: {
+    files: [
+      {
+        src: ['src/demo/markup/demo.html'],
+        dest: 'assets/demo/demo.html'
+      }
+    ]
   }
 };

configs/grunt/open.js

@@ -3,7 +3,7 @@ var grunt = require('grunt');
 module.exports = {
   dev : {
     app: 'Google Chrome',
-    path: 'http://localhost:<%= settings.port %>'
+    path: 'http://localhost:<%= common.port %>'
   },
 
   prod : {
@@ -13,11 +13,11 @@ module.exports = {
 
   build: {
     app: 'Google Chrome',
-    path: 'https://travis-ci.org/<%= settings.githubUsername %>/<%= pkg.name %>/builds'
+    path: 'https://travis-ci.org/<%= common.githubUsername %>/<%= pkg.name %>/builds'
   },
 
   repo: {
     app: 'Google Chrome',
-    path: 'https://github.com/<%= settings.githubUsername %>/<%= pkg.name %>'
+    path: 'https://github.com/<%= common.githubUsername %>/<%= pkg.name %>'
   }
 };

configs/grunt/pug.js

@@ -2,18 +2,13 @@ var grunt = require('grunt');
 
 module.exports = {
   options: {
-    pretty: false,
-    data: {
-      debug: !grunt.pluginData.prod,
-      pkg: grunt.pluginData.pkg,
-      envPath: grunt.pluginData.envPath,
-      analytics: '<%= settings.analytics %>'
-    }
+    pretty: !grunt.pluginData.prod,
+    data: grunt.pluginData
   },
 
-  demo: {
+  page: {
     files: {
-      'index.html': 'src/demo/markup/index.pug'
+      'index.html': '<%= assets %>src/markup/index.pug'
     }
   }
 };

configs/grunt/shell.js

@@ -48,8 +48,7 @@ module.exports = {
       'git merge --no-ff release -m \'Merge branch "release" into "staging"\'',
       'grunt shell:changelog',
       'grunt shell:dist',
-      'git checkout prod',
-      'git merge --no-ff staging -m "Release v<%= pkg.version %>"',
+      'grunt shell:prod',
       'grunt bump-commit',
       'git checkout dev',
       'git merge --no-ff release -m \'Merge branch "release" into "dev"\'',

configs/grunt/watch.js

@@ -1,36 +1,41 @@
 var grunt = require('grunt');
 
 module.exports = {
-  demo_markup: {
-    files: ['src/demo/markup/**/*.pug'],
-    tasks: ['puglint:demo', 'clean:demo_markup', 'pug:demo']
-  },
-
-  demo_styles: {
-    files: ['src/demo/styles/**/*.scss'],
-    tasks: ['sasslint:demo', 'clean:demo_styles', 'sass:demo']
-  },
-
-  demo_scripts: {
-    files: ['src/demo/scripts/**/*.js'],
-    tasks: ['jshint:demo', 'clean:demo_scripts', 'concat:demo', 'uglify:demo']
+  page_markup: {
+    files: ['<%= assets %>src/markup/**/*.pug'],
+    tasks: ['clean:page_markup', 'pug:page']
   },
 
   page_styles: {
-    files: ['<%= settings.assetsPath %>dist/css/*.*'],
+    files: ['<%= assets %>dist/css/*.*'],
     tasks: ['clean:page_styles', 'copy:page_styles']
   },
 
   page_scripts: {
-    files: ['<%= settings.assetsPath %>dist/js/*.*'],
+    files: ['<%= assets %>dist/js/*.*'],
     tasks: ['clean:page_scripts', 'copy:page_scripts']
   },
 
   page_favicons: {
-    files: ['<%= settings.assetsPath %>dist/favicons/*.*'],
+    files: ['<%= assets %>dist/favicons/*.*'],
     tasks: ['clean:page_favicons', 'copy:page_favicons']
   },
 
+  demo_markup: {
+    files: ['src/demo/markup/**/*.html'],
+    tasks: ['clean:demo_markup', 'copy:demo_markup']
+  },
+
+  demo_styles: {
+    files: ['src/demo/styles/**/*.scss'],
+    tasks: ['sasslint:demo', 'clean:demo_styles', 'sass:demo']
+  },
+
+  demo_scripts: {
+    files: ['src/demo/scripts/**/*.js'],
+    tasks: ['jshint:demo', 'clean:demo_scripts', 'concat:demo', 'uglify:demo']
+  },
+
   plugin_scripts: {
     files: ['src/plugin/scripts/**/*.js'],
     tasks: ['jshint:plugin', 'clean:plugin_scripts', 'concat:plugin', 'uglify:plugin']

configs/settings.json

@@ -1,6 +1,4 @@
 {
-  "port": 8000,
-  "assetsPath": "../my-jquery-plugins-assets/",
-  "githubUsername": "martinmethod",
-  "analytics": "UA-4977149-10"
+  "analytics": "UA-4977149-10",
+  "pluginStyles": false
 }

package.json

@@ -58,14 +58,14 @@
     "grunt-contrib-watch": "^1.0.0",
     "grunt-conventional-changelog": "^6.1.0",
     "grunt-open": "^0.2.3",
-    "grunt-puglint": "^1.0.0",
     "grunt-sass": "^2.0.0",
     "grunt-sass-lint": "^0.2.2",
     "grunt-shell": "^2.1.0",
     "http-rewrite-middleware": "^0.1.6",
     "lib-sass-data-uri": "0.0.2",
     "load-grunt-config": "^0.19.2",
     "load-grunt-tasks": "^3.2.0",
+    "my-jquery-plugins-assets": " git://github.com/martinmethod/my-jquery-plugins-assets.git#v1.6.0",
     "node-sass-globbing": "0.0.23",
     "time-grunt": "^1.2.1"
   },

src/demo/markup/demo.html

@@ -0,0 +1,53 @@
+<h3>I. General initialization</h3>
+
+<p align="center">
+    <em class="stickme">I am just a simple note.</em>
+</p>
+
+<div class="example basic-init">
+    <p>This note above have<strong>&quot;stickme&quot;</strong> class which is the plugin&apos;s target by default. It will stick on the top of the viewport when initialize<strong>StickMe</strong>
+        in the most basic way:
+    <pre class=" language-javascript"><code class="javascript language-javascript">// like this
+    $.stickme();
+    // or like this
+    var stickedItems = $.stickme();</code></pre>
+    </p>
+
+    <input class="btn" id="btn-basic-init" type="button" value="Assign StickMe and scroll to check the result"/>
+</div>
+
+<div class="example basic-destroy">
+    <p>Now they can be unsticked by triggering the destroy method:
+    <pre class=" language-javascript"><code class="javascript language-javascript">// like this
+    $.stickme().destroy();
+      // or like this
+      stickedItems.destroy();</code></pre>
+    </p>
+
+    <input class="btn" id="btn-basic-destroy" type="button" value="Destroy StickMe and scroll to check the result"/>
+</div>
+
+<h3>II. Method initialization</h3>
+
+<p align="center">
+    <em id="method-note">I am a static note.</em>
+</p>
+
+<div class="example method-init">
+    <p>This note above has an ID called<strong>&quot;method-note&quot;</strong>
+        and we will use that name for the jQuery selector. We would like to stick the note 10px under the top of the viewport when it hits that position and also to change its text and background color in the context of its position mode.
+    <pre class=" language-javascript"><code class="javascript language-javascript">$('#method-note').stickme({
+      top: 10,
+    }).bind('onStick', function() {
+      $(this)
+        .addClass('orange')
+        .text('I am a fixed note.');
+    }).bind('onUnstick', function() {
+      $(this)
+        .removeClass('orange')
+        .text('I am a static note.');
+    });</code></pre>
+    </p>
+
+    <input class="btn" id="btn-method-init" type="button" value="Assign StickMe and scroll to check the result"/>
+</div>