feat: new pipeline

* better folder structure * better pipeline for assets * now serving minified app * npm run app now shows fake logs for development
kilianc · May 29, 2015 · 45bba8c · 45bba8c
1 parent 4051f97
commit 45bba8c
Show file tree

Hide file tree

Showing 54 changed files with 216 additions and 92 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,2 +1,3 @@
-webapp/css/*.css
-webapp/scripts/*.js
+app/css/*
+app/*.js
+dist
diff --git a/webapp/scripts/app.js → app/app.ejs b/webapp/scripts/app.js → app/app.ejs
@@ -13,19 +13,25 @@ angular
     var $sce = $injector.get('$sce')
     var $moment = $injector.get('moment')
     var $localForage = $injector.get('$localForage')
+    var $window = $injector.get('$window')
     var $streamLines = $('.stream-lines')
-    var ctrl = this
     var BUFFER_SIZE = 100
+    var ctrl = this
 
     ctrl.paused = false
-    ctrl.version = '0.2.0'
+    ctrl.version = '<%= version %>'
     ctrl.lines = []
 
     /**
      * Socket stuff
      */
 
-    ctrl.socket = io(document.location.origin, { path: document.location.pathname + 'socket.io' })
+    // handle development mode
+    if ($window.localStorage.development) {
+      ctrl.socket = io(document.location.origin)
+    } else {
+      ctrl.socket = io(document.location.origin, { path: document.location.pathname + 'socket.io' })
+    }
 
     ctrl.socket.on('streams', function (streams) {
       ctrl.streams = streams
@@ -68,12 +74,15 @@ angular
     }
 
     function formatLine(line) {
-      // for object just format JSON
-      if ('object' === line.type) {
+      if (!line.content) {
+        // handle empty line
+        line.html = $sce.trustAsHtml('')
+      } else if ('object' === line.type) {
+        // for object just format JSON
         line.html = $sce.trustAsHtml('<pre>' + JSON.stringify(line.content, null, '  ') + '</pre>')
       } else {
-        // for log lines format ansi format
-        line.html = ansi_up.ansi_to_html(line.content || line.line, { use_classes: true })
+        // for log lines use ansi format
+        line.html = ansi_up.ansi_to_html(line.content, { use_classes: true })
         line.html = $sce.trustAsHtml(line.html)
       }
 
@@ -170,4 +179,10 @@ angular
     $localForage.getItem('streamDirection').then(function (streamDirection) {
       ctrl.streamDirection = undefined === streamDirection ? true : streamDirection
     })
+
+    /**
+     * Tell UI we're ready to roll
+     */
+
+    ctrl.loaded = true
   })
diff --git a/webapp/images/common/btn-fav-off.svg → app/images/common/btn-fav-off.svg b/webapp/images/common/btn-fav-off.svg → app/images/common/btn-fav-off.svg
diff --git a/webapp/images/common/btn-fav-on.svg → app/images/common/btn-fav-on.svg b/webapp/images/common/btn-fav-on.svg → app/images/common/btn-fav-on.svg
diff --git a/webapp/images/common/favicon-16x16.png → app/images/common/favicon-16x16.png b/webapp/images/common/favicon-16x16.png → app/images/common/favicon-16x16.png
diff --git a/webapp/images/common/favicon-32x32.png → app/images/common/favicon-32x32.png b/webapp/images/common/favicon-32x32.png → app/images/common/favicon-32x32.png
diff --git a/webapp/images/common/favicon-96x96.png → app/images/common/favicon-96x96.png b/webapp/images/common/favicon-96x96.png → app/images/common/favicon-96x96.png
diff --git a/webapp/images/common/icn-filter.svg → app/images/common/icn-filter.svg b/webapp/images/common/icn-filter.svg → app/images/common/icn-filter.svg
diff --git a/webapp/images/common/icn-resume.svg → app/images/common/icn-resume.svg b/webapp/images/common/icn-resume.svg → app/images/common/icn-resume.svg
diff --git a/webapp/images/common/logo-rtail.svg → app/images/common/logo-rtail.svg b/webapp/images/common/logo-rtail.svg → app/images/common/logo-rtail.svg
diff --git a/webapp/images/dark/btn-github.svg → app/images/dark/btn-github.svg b/webapp/images/dark/btn-github.svg → app/images/dark/btn-github.svg
diff --git a/webapp/images/dark/btn-info.svg → app/images/dark/btn-info.svg b/webapp/images/dark/btn-info.svg → app/images/dark/btn-info.svg
diff --git a/webapp/images/dark/btn-json-collapse.svg → app/images/dark/btn-json-collapse.svg b/webapp/images/dark/btn-json-collapse.svg → app/images/dark/btn-json-collapse.svg
diff --git a/webapp/images/dark/btn-json-expand.svg → app/images/dark/btn-json-expand.svg b/webapp/images/dark/btn-json-expand.svg → app/images/dark/btn-json-expand.svg
diff --git a/webapp/images/dark/btn-settings.svg → app/images/dark/btn-settings.svg b/webapp/images/dark/btn-settings.svg → app/images/dark/btn-settings.svg
diff --git a/webapp/images/dark/icn-close-date.svg → app/images/dark/icn-close-date.svg b/webapp/images/dark/icn-close-date.svg → app/images/dark/icn-close-date.svg
diff --git a/webapp/images/dark/icn-font-decrease.svg → app/images/dark/icn-font-decrease.svg b/webapp/images/dark/icn-font-decrease.svg → app/images/dark/icn-font-decrease.svg
diff --git a/webapp/images/dark/icn-font-increase.svg → app/images/dark/icn-font-increase.svg b/webapp/images/dark/icn-font-increase.svg → app/images/dark/icn-font-increase.svg
diff --git a/webapp/images/dark/icn-font-reset.svg → app/images/dark/icn-font-reset.svg b/webapp/images/dark/icn-font-reset.svg → app/images/dark/icn-font-reset.svg
diff --git a/webapp/images/dark/icn-search.svg → app/images/dark/icn-search.svg b/webapp/images/dark/icn-search.svg → app/images/dark/icn-search.svg
diff --git a/webapp/images/dark/icn-sort-asc.svg → app/images/dark/icn-sort-asc.svg b/webapp/images/dark/icn-sort-asc.svg → app/images/dark/icn-sort-asc.svg
diff --git a/webapp/images/dark/icn-sort-desc.svg → app/images/dark/icn-sort-desc.svg b/webapp/images/dark/icn-sort-desc.svg → app/images/dark/icn-sort-desc.svg
diff --git a/webapp/images/dark/icn-theme-dark.svg → app/images/dark/icn-theme-dark.svg b/webapp/images/dark/icn-theme-dark.svg → app/images/dark/icn-theme-dark.svg
diff --git a/webapp/images/dark/icn-theme-light.svg → app/images/dark/icn-theme-light.svg b/webapp/images/dark/icn-theme-light.svg → app/images/dark/icn-theme-light.svg
diff --git a/webapp/images/dark/logo-lukibear.svg → app/images/dark/logo-lukibear.svg b/webapp/images/dark/logo-lukibear.svg → app/images/dark/logo-lukibear.svg
diff --git a/webapp/images/dark/logo-rtail-info.svg → app/images/dark/logo-rtail-info.svg b/webapp/images/dark/logo-rtail-info.svg → app/images/dark/logo-rtail-info.svg
diff --git a/webapp/images/light/btn-github.svg → app/images/light/btn-github.svg b/webapp/images/light/btn-github.svg → app/images/light/btn-github.svg
diff --git a/webapp/images/light/btn-info.svg → app/images/light/btn-info.svg b/webapp/images/light/btn-info.svg → app/images/light/btn-info.svg
diff --git a/webapp/images/light/btn-json-collapse.svg → app/images/light/btn-json-collapse.svg b/webapp/images/light/btn-json-collapse.svg → app/images/light/btn-json-collapse.svg
diff --git a/webapp/images/light/btn-json-expand.svg → app/images/light/btn-json-expand.svg b/webapp/images/light/btn-json-expand.svg → app/images/light/btn-json-expand.svg
diff --git a/webapp/images/light/btn-settings.svg → app/images/light/btn-settings.svg b/webapp/images/light/btn-settings.svg → app/images/light/btn-settings.svg
diff --git a/webapp/images/light/icn-close-date.svg → app/images/light/icn-close-date.svg b/webapp/images/light/icn-close-date.svg → app/images/light/icn-close-date.svg
diff --git a/webapp/images/light/icn-font-decrease.svg → app/images/light/icn-font-decrease.svg b/webapp/images/light/icn-font-decrease.svg → app/images/light/icn-font-decrease.svg
diff --git a/webapp/images/light/icn-font-increase.svg → app/images/light/icn-font-increase.svg b/webapp/images/light/icn-font-increase.svg → app/images/light/icn-font-increase.svg
diff --git a/webapp/images/light/icn-font-reset.svg → app/images/light/icn-font-reset.svg b/webapp/images/light/icn-font-reset.svg → app/images/light/icn-font-reset.svg
diff --git a/webapp/images/light/icn-search.svg → app/images/light/icn-search.svg b/webapp/images/light/icn-search.svg → app/images/light/icn-search.svg
diff --git a/webapp/images/light/icn-sort-asc.svg → app/images/light/icn-sort-asc.svg b/webapp/images/light/icn-sort-asc.svg → app/images/light/icn-sort-asc.svg
diff --git a/webapp/images/light/icn-sort-desc.svg → app/images/light/icn-sort-desc.svg b/webapp/images/light/icn-sort-desc.svg → app/images/light/icn-sort-desc.svg
diff --git a/webapp/images/light/icn-theme-dark.svg → app/images/light/icn-theme-dark.svg b/webapp/images/light/icn-theme-dark.svg → app/images/light/icn-theme-dark.svg
diff --git a/webapp/images/light/icn-theme-light.svg → app/images/light/icn-theme-light.svg b/webapp/images/light/icn-theme-light.svg → app/images/light/icn-theme-light.svg
diff --git a/webapp/images/light/logo-lukibear.svg → app/images/light/logo-lukibear.svg b/webapp/images/light/logo-lukibear.svg → app/images/light/logo-lukibear.svg
diff --git a/webapp/images/light/logo-rtail-info.svg → app/images/light/logo-rtail-info.svg b/webapp/images/light/logo-rtail-info.svg → app/images/light/logo-rtail-info.svg
diff --git a/webapp/index.html → app/index.html b/webapp/index.html → app/index.html
@@ -1,22 +1,22 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="app" ng-controller="MainController as ctrl">
 <head>
   <meta charset="utf-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <title>rTail</title>
-
-  <!-- stlyles -->
+  <title ng-if="!ctrl.loaded">rTail : loading ...</title>
+  <title ng-if="ctrl.loaded">rTail : {{ctrl.activeStream}}</title>
+  <!-- build:css(app) css/bundle.min.css -->
   <link href="css/main.css" rel="stylesheet" type="text/css">
   <link href="css/dark-theme.css" rel="stylesheet" type="text/css">
   <link href="css/light-theme.css" rel="stylesheet" type="text/css">
-  <link href='http://fonts.googleapis.com/css?family=Source+Code+Pro|Roboto+Mono|Inconsolata|Anonymous+Pro|Ubuntu+Mono|Droid+Sans+Mono|Nunito:300' rel='stylesheet' type='text/css'>
-
+  <!-- endbuild -->
+  <link href='//fonts.googleapis.com/css?family=Source+Code+Pro|Roboto+Mono|Inconsolata|Anonymous+Pro|Ubuntu+Mono|Droid+Sans+Mono|Nunito:300' rel='stylesheet' type='text/css'>
   <!-- favicon -->
   <link rel="icon" href="images/common/favicon-16x16.png" sizes="16x16">
   <link rel="icon" href="images/common/favicon-32x32.png" sizes="32x32">
   <link rel="icon" href="images/common/favicon-96x96.png" sizes="96x96">
 </head>
-<body class="{{ctrl.theme}} font-family-{{ctrl.fontFamily}} font-size-{{ctrl.fontSize}}" ng-app="app" ng-controller="MainController as ctrl">
+<body class="{{ctrl.theme}} font-family-{{ctrl.fontFamily}} font-size-{{ctrl.fontSize}}">
 
   <header>
     <div class="rtail-logo"></div>
@@ -156,17 +156,18 @@ <h4>Theme</h4>
     </div>
   </script>
 
-  <!-- scripts -->
-  <script src="socket.io/socket.io.js"></script>
-  <script src="scripts/jquery.js"></script>
-  <script src="scripts/moment.js"></script>
-  <script src="scripts/localforage.js"></script>
-  <script src="scripts/ansi_up.js"></script>
-  <script src="scripts/angular.js"></script>
-  <script src="scripts/angular-animate.js"></script>
-  <script src="scripts/angular-moment.js"></script>
-  <script src="scripts/angular-localForage.js"></script>
-  <script src="scripts/angular-rt-popup.js"></script>
-  <script src="scripts/app.js"></script>
+  <!-- build:js(app) bundle.min.js -->
+  <script src="../node_modules/socket.io/node_modules/socket.io-client/socket.io.js"></script>
+  <script src="../node_modules/jquery/dist/jquery.js"></script>
+  <script src="../node_modules/moment/moment.js"></script>
+  <script src="../node_modules/localforage/dist/localforage.js"></script>
+  <script src="../node_modules/ansi_up/ansi_up.js"></script>
+  <script src="../node_modules/angular/angular.js"></script>
+  <script src="../node_modules/angular-animate/angular-animate.js"></script>
+  <script src="../node_modules/angular-moment/angular-moment.js"></script>
+  <script src="../node_modules/angular-localforage/dist/angular-localForage.js"></script>
+  <script src="../node_modules/angular-rt-popup/dist/angular-rt-popup.js"></script>
+  <script src="app.js"></script>
+  <!-- endbuild -->
 </body>
 </html>
diff --git a/webapp/css/_ansi.scss → app/scss/_ansi.scss b/webapp/css/_ansi.scss → app/scss/_ansi.scss
diff --git a/webapp/css/_fonts.scss → app/scss/_fonts.scss b/webapp/css/_fonts.scss → app/scss/_fonts.scss
diff --git a/webapp/css/_theme.scss → app/scss/_theme.scss b/webapp/css/_theme.scss → app/scss/_theme.scss
diff --git a/webapp/css/dark-theme.scss → app/scss/dark-theme.scss b/webapp/css/dark-theme.scss → app/scss/dark-theme.scss
diff --git a/webapp/css/light-theme.scss → app/scss/light-theme.scss b/webapp/css/light-theme.scss → app/scss/light-theme.scss
diff --git a/webapp/css/main.scss → app/scss/main.scss b/webapp/css/main.scss → app/scss/main.scss
diff --git a/lib/webapp.js → cli/lib/webapp.js b/lib/webapp.js → cli/lib/webapp.js
diff --git a/lib/server.js → cli/rtail-server.js b/lib/server.js → cli/rtail-server.js
@@ -17,7 +17,7 @@ const http = require('http').Server(app)
 const io = require('socket.io')(http)
 const yargs = require('yargs')
 const debug = require('debug')('rtail:server')
-const webapp = require('./webapp')
+const webapp = require('./lib/webapp')
 const updateNotifier = require('update-notifier')
 const pkg = require('../package')
 
@@ -124,7 +124,10 @@ io.on('connection', function (socket) {
  */
 
 if (!argv.webVersion) {
-  app.use(serve(__dirname + '/../webapp'))
+  app.use(serve(__dirname + '/../dist'))
+} else if ('development' === argv.webVersion) {
+  app.use('/app', serve(__dirname + '/../app'))
+  app.use('/node_modules', serve(__dirname + '/../node_modules'))
 } else {
   app.use(webapp({
     s3: 'http://rtail.s3-website-us-east-1.amazonaws.com/' + argv.webVersion,

diff --git a/lib/client.js → cli/rtail.js b/lib/client.js → cli/rtail.js