From 9f19116d3e52d4a5e9599a811be149407b621203 Mon Sep 17 00:00:00 2001
From: Alex Grintsvayg <alex@grin.io>
Date: Wed, 17 Aug 2016 15:15:09 -0400
Subject: [PATCH 1/2] simplify setup process

---
 .travis.yml  | 10 ++++------
 LICENSE.md   |  1 +
 README.md    | 10 ++++------
 package.json | 27 +++++++++++++++++++++++++++
 watch.sh     | 20 +++++++++++++++-----
 5 files changed, 51 insertions(+), 17 deletions(-)
 create mode 100644 LICENSE.md
 create mode 100644 package.json

diff --git a/.travis.yml b/.travis.yml
index 734ac1899..882881d8c 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -2,15 +2,13 @@ language: node_js
 node_js: 5
 
 install:
-  - gem install sass
-  - npm install -g babel-cli
-  - npm install babel-preset-es2015 babel-preset-react
+  - npm install
 
 script:
   - mkdir -p dist/css dist/js
-  - sass scss/all.scss dist/css/all.css
-  - babel -V
-  - babel --presets es2015,react --out-dir dist/js js
+  - node_modules/.bin/node-sass scss/all.scss dist/css/all.css
+  - node_modules/.bin/babel -V
+  - node_modules/.bin/babel --presets es2015,react --out-dir dist/js js
   - mkdir upload
   - cd dist; zip -r ../upload/dist.zip *; cd -
   - .travis/echo_sha.sh > upload/data.json
diff --git a/LICENSE.md b/LICENSE.md
new file mode 100644
index 000000000..ee8b246ea
--- /dev/null
+++ b/LICENSE.md
@@ -0,0 +1 @@
+See https://github.com/lbryio/lbry/blob/master/LICENSE
diff --git a/README.md b/README.md
index bc667d41d..ffeec841b 100644
--- a/README.md
+++ b/README.md
@@ -8,10 +8,7 @@ These steps will get you to change-reload-see:
 
 - Install [LBRY](https://github.com/lbryio/lbry/releases)
 - Install node and npm ([this gist may be useful](https://gist.github.com/isaacs/579814))
-- Install babel (`npm install -g babel-cli`)
-- Install babel presets (`npm install babel-preset-es2015 babel-preset-react`)
-- Install [SASS](http://sass-lang.com/install)
-- Run `./watch.sh`
+- Run `./watch.sh` (this will `npm install` dependencies)
 - Run `lbrynet-daemon --ui=/full/path/to/dist/`
 - Changes made in `js` and `sass` will be auto compiled to `dist`
 - `lbrynet-daemon --branch=branchname` can be used to test remote branches
@@ -22,5 +19,6 @@ These steps will get you to change-reload-see:
 1. Error: Couldn't find preset "es2015" relative to directory "js"
 
 Fix with:
-npm install babel-preset-es2015 --save
-npm install babel-preset-react --save
+
+    npm install babel-preset-es2015 --save
+    npm install babel-preset-react --save
diff --git a/package.json b/package.json
new file mode 100644
index 000000000..66fb570e7
--- /dev/null
+++ b/package.json
@@ -0,0 +1,27 @@
+{
+  "name": "lbry-web-ui",
+  "version": "1.0.0",
+  "description": "LBRY web ui",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/lbryio/lbry-web-ui.git"
+  },
+  "keywords": [
+    "lbry"
+  ],
+  "author": "Alex Liebowitz <aliebowitz@lbry.io>",
+  "license": "SEE LICENSE IN LICENSE.md",
+  "bugs": {
+    "url": "https://github.com/lbryio/lbry-web-ui/issues"
+  },
+  "homepage": "https://github.com/lbryio/lbry-web-ui#readme",
+  "dependencies": {
+    "babel-cli": "^6.11.4",
+    "babel-preset-es2015": "^6.13.2",
+    "babel-preset-react": "^6.11.1",
+    "node-sass": "^3.8.0"
+  }
+}
diff --git a/watch.sh b/watch.sh
index 55fd5656f..387de6b02 100755
--- a/watch.sh
+++ b/watch.sh
@@ -1,9 +1,19 @@
 #!/bin/bash
 
-trap 'jobs -p | xargs kill' EXIT
+set -euo pipefail
+#set -x
 
-mkdir -p dist/css
-mkdir -p dist/js
+#trap 'kill $(jobs -p)' EXIT # IS THIS NECESSARY? on linux, it kills all child processes when you ctrl-c
 
-sass --watch scss:dist/css --sourcemap=none &
-babel --presets es2015,react --out-dir dist/js/ --watch js/
+DIR="$( cd "$( dirname "${BASH_SOURCE[0]}" )" && pwd )"
+
+mkdir -p $DIR/dist/css
+mkdir -p $DIR/dist/js
+
+if [ ! -d "$DIR/node_modules" ]; then
+  echo "Installing NPM modules"
+  npm install
+fi
+
+$DIR/node_modules/.bin/node-sass --output $DIR/dist/css --sourcemap=none --watch $DIR/scss/ &
+$DIR/node_modules/.bin/babel --presets es2015,react --out-dir $DIR/dist/js/ --watch $DIR/js/

From 7038f044b9ed786468d430bd3f679375b73924dc Mon Sep 17 00:00:00 2001
From: Alex Grintsvayg <alex@grin.io>
Date: Wed, 17 Aug 2016 16:27:53 -0400
Subject: [PATCH 2/2] node-sass is a bit dumb with --watch

---
 watch.sh | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/watch.sh b/watch.sh
index 387de6b02..0a5274047 100755
--- a/watch.sh
+++ b/watch.sh
@@ -15,5 +15,8 @@ if [ ! -d "$DIR/node_modules" ]; then
   npm install
 fi
 
+# run sass once without --watch to force update. then run with --watch to keep watching
+$DIR/node_modules/.bin/node-sass --output $DIR/dist/css --sourcemap=none $DIR/scss/
 $DIR/node_modules/.bin/node-sass --output $DIR/dist/css --sourcemap=none --watch $DIR/scss/ &
+
 $DIR/node_modules/.bin/babel --presets es2015,react --out-dir $DIR/dist/js/ --watch $DIR/js/