refactor(misc): add misc updates

* restore orange logo text color
* use externals also for lunr dep as we do with jquery
* rename main.js to doc.js to be consistent with doc.css
* use babel-loader to compile jsx and es6 to es5

Author: rbarilani

LICENSE

@@ -113,7 +113,7 @@ SOFTWARE.
 --------------------------------------------------------------------------------
 
 NOTICE for:
-- source/scripts/main.js contains the following third-party libraries:
+- source/scripts/doc.js contains the following third-party libraries:
   - react
   - react-dom
   - url-join

banner.js

@@ -12,7 +12,7 @@ const banner = ` /*!
 
 const files = [
   'source/style/doc.css',
-  'source/script/main.js'
+  'source/script/doc.js',
 ];
 
 files.forEach(writeBanner(banner));

layout/layout.ejs

@@ -31,7 +31,7 @@
     <script src="//cdnjs.cloudflare.com/ajax/libs/lunr.js/2.1.0/lunr.min.js"></script>
 
     <!-- js source  -->
-    <script src="<%- url_for('script/main.js') %>"></script>
+    <script src="<%- url_for('script/doc.js') %>"></script>
 
   </body>
 </html>

lib/browser/search/__tests__/load.test.js

@@ -9,6 +9,14 @@ const mockSearcher = () => {
 
 jest.mock('../../../nodejs/search/searcher', () => mockSearcher);
 
+const mockLunr = {
+  Index: {
+    load: (index) => index
+  }
+};
+
+jest.mock('lunr', () => mockLunr);
+
 const mockResponse = () => {
   return {
     json: () => Promise.resolve({
@@ -22,12 +30,6 @@ const mockFetch = jest.fn().mockReturnValue(Promise.resolve(mockResponse()));
 
 global.fetch = mockFetch;
 
-global.lunr = {
-  Index: {
-    load: (index) => index
-  }
-};
-
 describe('browser.search.load', () => {
   const load = require('../load');
 

lib/browser/search/load.js

@@ -1,4 +1,4 @@
-/* global lunr */
+const lunr = require('lunr');
 const searcher = require('../../nodejs/search/searcher');
 
 module.exports = function load (url) {

package.json

@@ -59,6 +59,7 @@
     "url-join": "^2.0.2"
   },
   "devDependencies": {
+    "babel-loader": "^7.1.2",
     "conventional-changelog-cli": "^1.3.3",
     "dress-code": "2.1.1",
     "enzyme": "2.8.0",
@@ -69,7 +70,6 @@
     "hexo-renderer-ejs": "^0.3.0",
     "jest": "^20.0.4",
     "jest-junit": "^2.1.0",
-    "jsx-loader": "^0.13.2",
     "node-sass": "^4.5.3",
     "react-addons-test-utils": "15.4.2",
     "webpack": "^3.0.0"

source/script/main.js source/script/doc.js

@@ -21,7 +21,7 @@ $doc-color-darkest: #333;
 $doc-navbar-height: 50px;
 $doc-navbar-background-color: $doc-color-lightest;
 $doc-navbar-border-color: #e1e1e1;
-$doc-navbar-logo-text-color: $doc-color-primary;
+$doc-navbar-logo-text-color: #ff5d00;
 $doc-navbar-width-collapsed: $doc-navbar-height;
 
 // sidebar

source/style/_doc/vars.scss

@@ -1,19 +1,28 @@
 'use strict';
-
 const path = require('path');
 
 module.exports = {
-  entry: './lib/browser/index.js',
   externals: {
-    jquery: '$'
+    jquery: '$',
+    lunr: true,
+  },
+  entry:  {
+    'doc': './lib/browser/index.js',
   },
   output: {
-    path: path.resolve('source/script'),
-    filename: 'main.js'
+    path: path.resolve(__dirname, 'source/script'),
+    filename: '[name].js'
   },
   module: {
     loaders: [
-      { test: /\.jsx$/, exclude: /node_modules/, loader: 'jsx-loader' }
+      {
+        test: /.jsx?$/,
+        loader: 'babel-loader',
+        exclude: /node_modules/,
+        query: {
+          presets: ['es2015', 'react']
+        }
+      }
     ]
   }
 };