concat and minify css and js files

Gruntfile.js

@@ -2,10 +2,12 @@
 
 module.exports = function(grunt) {
 
-
   //Load NPM tasks
   grunt.loadNpmTasks('grunt-contrib-watch');
   grunt.loadNpmTasks('grunt-contrib-jshint');
+  grunt.loadNpmTasks('grunt-contrib-uglify');
+  grunt.loadNpmTasks('grunt-contrib-concat');
+  grunt.loadNpmTasks('grunt-css');
   grunt.loadNpmTasks('grunt-mocha-test');
   grunt.loadNpmTasks('grunt-nodemon');
   grunt.loadNpmTasks('grunt-concurrent');
@@ -48,19 +50,67 @@ module.exports = function(grunt) {
     },
     jshint: {
       all: {
-        src: ['Gruntfile.js', 'insight.js', 'app/**/*.js', 'public/js/**','lib/*.js'],
+        src: ['Gruntfile.js', 'insight.js', 'app/**/*.js', 'public/src/js/**/*.js','lib/*.js'],
         options: {
           jshintrc: true
         }
       }
     },
+    concat: {
+      options: {
+        banner: '\'use strict\';\n',
+        process: function(src, filepath) {
+          return '// Source: ' + filepath + '\n' +
+            src.replace(/(^|\n)[ \t]*('use strict'|"use strict");?\s*/g, '$1');
+        }
+      },
+      vendors: {
+        src: ['public/lib/momentjs/min/moment.min.js', 'public/lib/qrcode-generator/js/qrcode.js', 'public/lib/zeroclipboard/ZeroClipboard.min.js'],
+        dest: 'public/js/vendors.js'
+      },
+      angular: {
+        src: ['public/lib/angular/angular.min.js', 'public/lib/angular-resource/angular-resource.min.js', 'public/lib/angular-route/angular-route.min.js', 'public/lib/angular-qrcode/qrcode.js', 'public/lib/angular-animate/angular-animate.min.js', 'public/lib/angular-bootstrap/ui-bootstrap.min.js', 'public/lib/angular-bootstrap/ui-bootstrap-tpls.min.js', 'public/lib/angular-ui-utils/ui-utils.min.js'],
+        dest: 'public/js/angularjs-all.js'
+      },
+      main: {
+        src: ['public/src/js/app.js', 'public/src/js/controllers/*.js', 'public/src/js/services/*.js', 'public/src/js/directives.js', 'public/src/js/filters.js', 'public/src/js/config.js', 'public/src/js/init.js'],
+        dest: 'public/js/main.js'
+      },
+      css: {
+        src: ['public/src/css/**/*.css'],
+        dest: 'public/css/main.css'
+      }
+    },
+    uglify: {
+      options: {
+        banner: '/*! <%= pkg.name %> <%= pkg.version %> */\n',
+        mangle: false
+      },
+      vendors: {
+        src: 'public/js/vendors.js',
+        dest: 'public/js/vendors.min.js'
+      },
+      angular: {
+        src: 'public/js/angularjs-all.js',
+        dest: 'public/js/angularjs-all.min.js'
+      },
+      main: {
+        src: 'public/js/main.js',
+        dest: 'public/js/main.min.js'
+      }
+    },
+    cssmin: {
+      css: {
+        src: 'public/css/main.css',
+        dest: 'public/css/main.min.css'
+      }
+    },
     mochaTest: {
       options: {
         reporter: 'spec',
       },
       src: ['test/**/*.js'],
     },
-
     nodemon: {
       dev: {
         script: 'insight.js',
@@ -93,7 +143,7 @@ module.exports = function(grunt) {
   grunt.option('force', true);
 
   //Default task(s).
-  grunt.registerTask('default', ['jshint','concurrent']);
+  grunt.registerTask('default', ['jshint', 'concat', 'uglify', 'cssmin', 'concurrent']);
 
   //Test task.
   grunt.registerTask('test', ['env:test', 'mochaTest']);

app/views/includes/foot.jade

@@ -1,46 +1,11 @@
 #footer(data-ng-include="'/views/includes/footer.html'", role='navigation')
 
+//Vendors
 script(type='text/javascript', src='/socket.io/socket.io.js')
-script(type='text/javascript', src='/lib/momentjs/min/moment.min.js')
-script(type='text/javascript', src='/lib/qrcode-generator/js/qrcode.js')
-script(type='text/javascript', src='/lib/zeroclipboard/ZeroClipboard.min.js')
+script(type='text/javascript', src='/js/vendors.min.js')
 
 //AngularJS
-script(type='text/javascript', src='/lib/angular/angular.min.js')
-script(type='text/javascript', src='/lib/angular-resource/angular-resource.min.js')
-script(type='text/javascript', src='/lib/angular-route/angular-route.min.js')
-script(type='text/javascript', src='/lib/angular-qrcode/qrcode.js')
-script(type='text/javascript', src='/lib/angular-animate/angular-animate.min.js')
-
-//Angular UI
-script(type='text/javascript', src='/lib/angular-bootstrap/ui-bootstrap.min.js')
-script(type='text/javascript', src='/lib/angular-bootstrap/ui-bootstrap-tpls.min.js')
-script(type='text/javascript', src='/lib/angular-ui-utils/ui-utils.min.js')
+script(type='text/javascript', src='/js/angularjs-all.min.js')
 
 //Application Init
-script(type='text/javascript', src='/js/app.js')
-script(type='text/javascript', src='/js/config.js')
-script(type='text/javascript', src='/js/directives.js')
-script(type='text/javascript', src='/js/filters.js')
-
-//Application Services
-script(type='text/javascript', src='/js/services/global.js')
-script(type='text/javascript', src='/js/services/status.js')
-script(type='text/javascript', src='/js/services/address.js')
-script(type='text/javascript', src='/js/services/transactions.js')
-script(type='text/javascript', src='/js/services/blocks.js')
-script(type='text/javascript', src='/js/services/socket.js')
-script(type='text/javascript', src='/js/services/currency.js')
-
-//Application Controllers
-script(type='text/javascript', src='/js/controllers/index.js')
-script(type='text/javascript', src='/js/controllers/header.js')
-script(type='text/javascript', src='/js/controllers/search.js')
-script(type='text/javascript', src='/js/controllers/blocks.js')
-script(type='text/javascript', src='/js/controllers/transactions.js')
-script(type='text/javascript', src='/js/controllers/address.js')
-script(type='text/javascript', src='/js/controllers/status.js')
-script(type='text/javascript', src='/js/controllers/footer.js')
-script(type='text/javascript', src='/js/controllers/connection.js')
-script(type='text/javascript', src='/js/controllers/currency.js')
-script(type='text/javascript', src='/js/init.js')
+script(type='text/javascript', src='/js/main.min.js')

app/views/includes/head.jade

@@ -13,4 +13,4 @@ head
 
   link(rel='stylesheet', href='//fonts.googleapis.com/css?family=Ubuntu:300,400,500,700,400italic')
   link(rel='stylesheet', href='/lib/bootstrap/dist/css/bootstrap.min.css')
-  link(rel='stylesheet', href='/css/common.css')
+  link(rel='stylesheet', href='/css/main.min.css')

package.json

@@ -84,9 +84,12 @@
   "devDependencies": {
     "grunt-contrib-watch": "latest",
     "grunt-contrib-jshint": "latest",
+    "grunt-contrib-concat": "~0.3.0",
+    "grunt-contrib-uglify": "~0.3.2",
     "grunt-nodemon": "latest",
     "grunt-concurrent": "latest",
     "grunt-mocha-test": "latest",
-    "should": "latest"
+    "should": "latest",
+    "grunt-css": "~0.5.4"
   }
 }

public/css/main.css

@@ -0,0 +1,480 @@
+'use strict';
+// Source: public/src/css/common.css
+/* Sticky footer styles
+-------------------------------------------------- */
+html,
+body {
+  color: #373D42;
+  font-family: 'Ubuntu', sans-serif;
+  height: 100%;
+  /* The html and body elements cannot have any padding or margin. */
+}
+
+h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
+  color: #373D42;
+  font-family: 'Ubuntu', sans-serif;
+}
+
+/* Wrapper for page content to push down footer */
+#wrap {
+  min-height: 100%;
+  height: auto;
+  /* Negative indent footer by its height */
+  margin: 0 auto -51px;
+  /* Pad bottom by footer height */
+  padding: 0 0 75px;
+}
+
+.m10h { margin: 0 10px; }
+.m20h { margin: 0 20px; }
+.m5v { margin: 5px 0; }
+.m20v { margin: 20px 0; }
+.m10v { margin: 10px 0; }
+.m50v { margin: 50px 0; }
+.m10b { margin-bottom: 10px; }
+
+.vm { vertical-align: middle; }
+
+.navbar-default {
+  background-color: #8DC429;
+  border-bottom: 4px solid #64920F;
+}
+
+.navbar-default .navbar-nav>li>a {
+  color: #F4FBE8;
+  font-family: 'Ubuntu', sans-serif;
+}
+
+.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>li>a:hover  {
+  background-color: #fff;
+  -webkit-box-shadow: 0px 4px 0px 0px rgba(55,61,56,1);
+  -moz-box-shadow:    0px 4px 0px 0px rgba(55,61,56,1);
+  box-shadow:         0px 4px 0px 0px rgba(55,61,56,1);
+  color: #373D42;
+}
+
+.navbar-form .form-group {
+  display: block;
+}
+
+.navbar-form {
+  width: 35%;
+}
+
+@media (max-width: 991px) {
+  .status {
+    margin: 0;
+  }
+  .navbar-form {
+    width: 25%;
+  }
+}
+
+@media (max-width: 768px) {
+  .navbar-form {
+    width: auto;
+  }
+}
+
+.nav-tabs.nav-justified>li>a:hover {
+  cursor: pointer;
+}
+
+.insight {
+  font-family: 'Ubuntu', sans-serif;
+  font-size: 34px;
+  font-style: italic;
+  font-weight: 400;
+}
+
+.navbar-default .navbar-brand:hover, .navbar-default .navbar-brand:focus {
+  color: #fffffe;
+}
+
+.navbar-default .navbar-brand {
+  color: #FFFFFF;
+}
+
+.navbar-form .form-control {
+  background-color: #7CAD23;
+  border-radius: 3px;
+  -webkit-border-radius: 3px;
+  -moz-border-radius: 3px;
+  border: 0;
+  -webkit-box-shadow: 1px 1px 0px 0px rgba(255,255,255,0.41), inset 1px 1px 3px 0px rgba(0,0,0,0.10);
+  -moz-box-shadow:    1px 1px 0px 0px rgba(255,255,255,0.41), inset 1px 1px 3px 0px rgba(0,0,0,0.10);
+  box-shadow:         1px 1px 0px 0px rgba(255,255,255,0.41), inset 1px 1px 3px 0px rgba(0,0,0,0.10);
+}
+
+#search {
+  color: #fff;
+  font-family: 'Ubuntu', sans-serif;
+}
+
+#search::-webkit-input-placeholder {
+  color: #BCDF7E;
+  font-family: 'Ubuntu', sans-serif;
+  font-size: 14px;
+  font-style: italic;
+  font-weight: 100;
+}
+
+#search::-moz-placeholder {
+  color: #BCDF7E;
+  font-family: 'Ubuntu', sans-serif;
+  font-size: 14px;
+  font-weight: 100;
+}
+
+.status {
+  -moz-border-radius: 3px;
+  -webkit-border-radius: 3px;
+  background-color: #597338;
+  border-radius: 3px;
+  margin: 8px 0;
+  padding: 8px 10px;
+  font-size: 12px;
+  color: #eee;
+  text-align: center;
+}
+
+.status .tooltip {
+  margin: 0;
+}
+
+.col-gray {
+  -moz-border-radius: 5px;
+  -webkit-border-radius: 5px;
+  background-color: #F4F4F4;
+  border-radius: 5px;
+  padding: 14px;
+}
+
+.col-gray-responsive {
+  width: auto;
+}
+
+.col-gray-fixed {
+  position: fixed;
+  width: 250px;
+}
+
+@media (max-width: 768px) {
+  .col-gray-fixed {
+    width:100%;
+  }
+}
+
+@media (max-width: 995px) {
+  .col-gray-fixed {
+    position:static;
+    width: 100%;
+  }
+}
+
+@media (min-width: 1200px) {
+  .col-gray-fixed {
+    width: 280px;
+  }
+}
+
+.ellipsis {
+  display: block;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.line20 {
+  border: 1px solid #D4D4D4;
+  margin-bottom: 15px;
+}
+
+.line10 {
+  border: 1px solid #EAEAEA;
+  margin: 10px 0;
+}
+
+.block-id {
+  background-color: #373D42;
+  border: 3px solid #FFFFFF;
+  margin: 0 auto;
+  width: 165px;
+  color: #fff;
+  text-align: center;
+  font-size: 80px;
+}
+
+.block-id span {
+  margin-top: 10px;
+}
+
+.block-id h2 {
+  color: #FFFFFF;
+  font-weight: bold;
+  line-height: 30px;
+  font-size: 24px;
+  margin-top: 0;
+  margin-bottom: 10px;
+}
+
+.icon-block {
+  color: #FFFFFF;
+  font-size: 35px;
+  margin-top:  10px;
+}
+
+.icon-block h3 {
+  color: #fff;
+}
+
+.block-tx {
+  -moz-border-radius: 2px;
+  -webkit-border-radius: 2px;
+  background-color: #F4F4F4;
+  border-radius: 2px;
+  margin: 20px 0 10px;
+  overflow: hidden;
+  padding: 15px;
+  border: 1px solid #ccc;
+}
+
+.btn {
+  border-radius: 2px;
+}
+.btn-primary {
+  background-color: #8DC429;
+  border: 2px solid #76AF0F;
+}
+
+.btn-primary:hover, .btn-primary:focus, .btn-primary:active,
+.btn-primary.active, .open .dropdown-toggle.btn-primary,
+.btn-success:hover, .btn-success:focus, .btn-success:active,
+.btn-success.active, .open .dropdown-toggle.btn-success,
+.btn-danger:hover, .btn-danger:focus, .btn-danger:active,
+.btn-danger.active, .open .dropdown-toggle.btn-danger {
+  background-color: #fff;
+  border: 2px solid #ccc;
+  color: #373D42;
+}
+
+.btn-default {
+  background-color: #E7E7E7;
+  border: 2px solid #DCDCDC;
+}
+
+.btn-success {
+  background-color: #2FA4D7;
+  border: 2px solid #237FA7;
+}
+
+.btn-danger {
+  background-color: #AC0015;
+  border: 2px solid #6C0000;
+}
+
+.label {
+  padding: .7em 2em;
+  font-size: 13px;
+  text-transform: uppercase;
+  font-weight:100;
+}
+
+.label-primary {
+  background-color: #8DC429;
+}
+
+.label-default {
+  background-color: #ffffff;
+  color: #333;
+}
+
+.label-success {
+  background-color: #2FA4D7;
+}
+
+.label-danger {
+  background-color: #AC0015;
+}
+
+.progress-bar-info { background-color: #8DC429; }
+
+/* Set the fixed height of the footer here */
+#footer {
+  background-color: #373D42;
+  border-top: 4px solid #656E76;
+  color: #fff;
+  height: 51px;
+  overflow: hidden;
+}
+
+.currency a.active {
+  color: #000;
+  text-decoration: underline;
+  cursor: default;
+}
+
+#footer a.insight {
+  font-size: 20px;
+  text-decoration: none;
+  color: #fff;
+}
+
+#footer a.insight:hover {
+  color: #fffffe;
+}
+
+#footer a.insight small { font-size: 11px; }
+.line-footer { border-top: 2px dashed #ccc; }
+
+.line-bot {
+  border-bottom: 2px solid #EAEAEA;
+  padding: 0 0 10px 0;
+}
+.line-mid { padding: 15px 0;}
+.line-top {
+  border-top: 1px solid #EAEAEA;
+  padding: 15px 0 0 0;
+}
+
+/* Custom page CSS
+-------------------------------------------------- */
+/* Not required for template or sticky footer method. */
+
+#wrap > .container { padding: 60px 15px 0; }
+
+.container .text-muted a { color: #eee; }
+
+#footer > .container { padding: auto 15px; }
+
+.code { font-size: 80%; }
+
+.address { font-size: 11px; }
+
+.no_matching {
+  -moz-border-radius-bottomleft: 2px;
+  -moz-border-radius-bottomright: 2px;
+  -webkit-border-bottom-left-radius: 2px;
+  -webkit-border-bottom-right-radius: 2px;
+  background-color: #FFFFFF;
+  border-bottom-left-radius: 2px;
+  border-bottom-right-radius: 2px;
+  border-top: none;
+  border: 1px solid #64920F;
+  padding: 10px 20px;
+  position: absolute;
+  text-align: center;
+  top: 45px;
+  width: 300px;
+}
+
+/*Animations*/
+.fader.ng-enter {
+  opacity: 0;
+  -webkit-transition: opacity 1s;
+  -moz-transition: opacity 1s;
+  -o-transition: opacity 1s;
+  transition: opacity 1s;
+}
+
+.fader.ng-enter-active { opacity: 1; }
+
+.tx-bg {
+  background-color: #F4F4F4;
+  left: 0;
+  min-height: 340px;
+  position: absolute;
+  top: 0;
+  width: 100%;
+  z-index: -9999;
+}
+
+.badge {
+  -moz-border-radius: 9px;
+  -webkit-border-radius: 9px;
+  background-color: #999999;
+  border-radius: 9px;
+  color: #ffffff;
+  font-size: 12.025px;
+  font-weight: bold;
+  padding: 1px 9px 2px;
+  white-space: nowrap;
+}
+
+.badge:hover {
+  color: #ffffff;
+  text-decoration: none;
+  cursor: pointer;
+}
+
+.badge-error { background-color: #b94a48; }
+.badge-error:hover { background-color: #953b39; }
+.badge-warning { background-color: #f89406; }
+.badge-warning:hover { background-color: #c67605; }
+.badge-success { background-color: #468847; }
+.badge-success:hover { background-color: #356635; }
+.badge-info { background-color: #3a87ad; }
+.badge-info:hover { background-color: #2d6987; }
+.badge-inverse { background-color: #333333; }
+.badge-inverse:hover { background-color: #1a1a1a; }
+
+.status .t {
+  color: white;
+}
+
+.status .text-danger { background: red; }
+
+.status .text-warning {
+  background: yellow;
+  color: black;
+}
+
+.btn-copy, .btn-expand {
+  -moz-border-radius: 2px;
+  -webkit-border-radius: 2px;
+  background-color: #FFFFFF;
+  border-radius: 2px;
+  border: 2px solid #E4E4E4;
+  color: #9b9b9b;
+  display: inline-block;
+  height: 25px;
+  outline: none;
+  text-align: center;
+  width: 30px;
+}
+.btn-copy { margin-left: 5px; }
+.btn-copy .tooltip {
+  display: inline-block;
+  margin-left: 10px;
+  margin-top: -2px;
+  opacity: 0;
+}
+.btn-copy.zeroclipboard-is-hover { color: #2a6496; }
+.btn-copy.zeroclipboard-is-active .tooltip { opacity: 1; }
+.btn-expand { margin-right: 5px; }
+
+@media (max-width: 991px) {
+  .btn-copy {
+    display: none; 
+  }
+}
+
+.txid {
+  line-height: 26px;
+}
+
+.tx-id {
+  background-color: #373D42;
+  border: 3px solid #FFFFFF;
+  margin: 0 auto;
+  width: 165px;
+  color: #FFFFFF;
+  font-size: 80px;
+  text-align: center;
+}
+
+.transaction-vin-vout .ellipsis { margin-bottom: 10px; }
+.transaction-vin-vout .btc-value { margin-left: 15px; }
+
+.page-header { margin-top: 0; }
+

public/src/js/config.js

@@ -1,5 +1,3 @@
-'use strict';
-
 //Setting up route
 angular.module('insight').config(function($routeProvider) {
   $routeProvider.