Removing gulp dependency, making file hierarchy easier to understand.

browser/main.js

@@ -10,12 +10,6 @@ var app = require('app');
 var BrowserWindow = require('browser-window');
 var ipc = require('ipc');
 
-var argv = require('minimist')(process.argv);
-
-if (argv.test) {
-  console.log('Running tests');
-}
-
 process.env.NODE_PATH = __dirname + '/../node_modules';
 process.chdir(path.join(__dirname, '..'));
 
@@ -38,12 +32,7 @@ app.on('ready', function() {
 
   mainWindow = new BrowserWindow(windowOptions);
   mainWindow.hide();
-
-  if (argv.test) {
-    mainWindow.loadUrl('file://' + __dirname + '/../build/specs.html');
-  } else {
-    mainWindow.loadUrl('file://' + __dirname + '/../build/index.html');
-  }
+  mainWindow.loadUrl('file://' + __dirname + '/../build/index.html');
 
   process.on('uncaughtException', app.quit);
 

deps

@@ -3,8 +3,18 @@
 BASE="$( cd "$( dirname "${BASH_SOURCE[0]}" )" && pwd )"
 export BOOT2DOCKER_CLI_VERSION=$(node -pe "JSON.parse(process.argv[1])['boot2docker-version']" "$(cat $BASE/package.json)")
 export BOOT2DOCKER_CLI_VERSION_FILE=boot2docker-$BOOT2DOCKER_CLI_VERSION
+export ATOM_SHELL_VERSION=$(node -pe "JSON.parse(process.argv[1])['atom-shell-version']" "$(cat $BASE/package.json)")
+export ATOM_SHELL_VERSION_FILE=atom-shell-v$ATOM_SHELL_VERSION-darwin-x64.zip
 
 mkdir -p $BASE/cache
+pushd $BASE/cache > /dev/null
+if [ ! -f $ATOM_SHELL_VERSION_FILE ]; then
+  echo "-----> Downloading atom-shell..."
+  rm -rf atom-shell-*
+  curl -L -o $ATOM_SHELL_VERSION_FILE https://github.com/atom/atom-shell/releases/download/v$ATOM_SHELL_VERSION/atom-shell-v$ATOM_SHELL_VERSION-darwin-x64.zip
+  unzip $ATOM_SHELL_VERSION_FILE
+fi
+popd > /dev/null
 
 pushd $BASE/resources > /dev/null
 

gulpfile.js

@@ -1,204 +0,0 @@
-var gulp = require('gulp');
-var source = require('vinyl-source-stream'); // Used to stream bundle for further handling
-var browserify = require('browserify');
-var watchify = require('watchify');
-var reactify = require('reactify');
-var gulpif = require('gulp-if');
-var uglify = require('gulp-uglifyjs');
-var notify = require('gulp-notify');
-var concat = require('gulp-concat');
-var less = require('gulp-less');
-var livereload = require('gulp-livereload');
-var cssmin = require('gulp-cssmin');
-var imagemin = require('gulp-imagemin');
-var gutil = require('gulp-util');
-var shell = require('gulp-shell');
-var plumber = require('gulp-plumber');
-var sourcemaps = require('gulp-sourcemaps');
-var glob = require('glob');
-var runSequence = require('run-sequence');
-var ecstatic = require('ecstatic');
-var downloadatomshell = require('gulp-download-atom-shell');
-var packagejson = require('./package.json');
-var http = require('http');
-var react = require('gulp-react');
-var fs = require('fs');
-
-var dependencies = Object.keys(packagejson.dependencies);
-var devDependencies = Object.keys(packagejson.devDependencies);
-var options = {
-  dev: process.argv.indexOf('release') === -1 && process.argv.indexOf('test') === -1,
-  test: process.argv.indexOf('test') !== -1,
-  filename: 'Kitematic.app',
-  name: 'Kitematic'
-};
-
-gulp.task('js', function () {
-  gulp.src('./app/**/*.js')
-    .pipe(plumber(function(error) {
-      gutil.log(gutil.colors.red('Error (' + error.plugin + '): ' + error.message));
-      // emit the end event, to properly end the task
-      this.emit('end');
-    }))
-    .pipe(react())
-    .pipe(gulp.dest(options.dev ? './build' : './dist/osx/' + options.filename + '/Contents/Resources/app/build'))
-    .pipe(gulpif(options.dev, livereload()));
-});
-
-gulp.task('specs', function () {
-  var bundler = browserify({
-    entries: glob.sync('./specs/**/*-spec.js'),
-    debug: true, // Gives us sourcemapping
-    transform: [reactify],
-    cache: {}, packageCache: {}, fullPaths: true // Requirement of watchify
-  });
-
-  dependencies.forEach(function (dep) {
-    bundler.external(dep);
-  });
-
-  devDependencies.forEach(function (dep) {
-    bundler.external(dep);
-  });
-
-  bundler.external('./app');
-
-  bundler.bundle()
-    .on('error', gutil.log)
-    .pipe(source('specs.js'))
-    .pipe(gulp.dest('./build'));
-
-  gulp.src('./specs/specs.html')
-    .pipe(gulp.dest('./build'));
-});
-
-gulp.task('images', function() {
-  return gulp.src('./app/images/*')
-    .pipe(imagemin({
-      progressive: true,
-      interlaced: true,
-      svgoPlugins: [{removeViewBox: false}]
-    }))
-    .pipe(gulp.dest(options.dev ? './build' : './dist/osx/' + options.filename + '/Contents/Resources/app/build'))
-    .pipe(gulpif(options.dev, livereload()));
-});
-
-gulp.task('styles', function () {
-  return gulp.src('app/styles/main.less')
-    .pipe(plumber(function(error) {
-      gutil.log(gutil.colors.red('Error (' + error.plugin + '): ' + error.message));
-      // emit the end event, to properly end the task
-      this.emit('end');
-    }))
-    .pipe(gulpif(options.dev, sourcemaps.init()))
-    .pipe(less())
-    .pipe(gulpif(options.dev, sourcemaps.write()))
-    .pipe(gulp.dest(options.dev ? './build' : './dist/osx/' + options.filename + '/Contents/Resources/app/build'))
-    .pipe(gulpif(!options.dev, cssmin()))
-    .pipe(concat('main.css'))
-    .pipe(gulpif(options.dev && !options.test, livereload()));
-});
-
-gulp.task('download', function (cb) {
-  downloadatomshell({
-    version: packagejson['atom-shell-version'],
-    outputDir: 'cache'
-  }, cb);
-});
-
-gulp.task('copy', function () {
-  gulp.src('./app/index.html')
-    .pipe(gulp.dest(options.dev ? './build' : './dist/osx/' + options.filename + '/Contents/Resources/app/build'))
-    .pipe(gulpif(options.dev, livereload()));
-
-  gulp.src('./app/fonts/**')
-    .pipe(gulp.dest(options.dev ? './build' : './dist/osx/' + options.filename + '/Contents/Resources/app/build'))
-    .pipe(gulpif(options.dev, livereload()));
-});
-
-gulp.task('dist', function (cb) {
-  var stream = gulp.src('').pipe(shell([
-    'rm -Rf ./dist',
-    'mkdir -p ./dist/osx',
-    'cp -R ./cache/Atom.app ./dist/osx/<%= filename %>',
-    'mv ./dist/osx/<%= filename %>/Contents/MacOS/Atom ./dist/osx/<%= filename %>/Contents/MacOS/<%= name %>',
-    'mkdir -p ./dist/osx/<%= filename %>/Contents/Resources/app',
-    'cp -R browser dist/osx/<%= filename %>/Contents/Resources/app',
-    'cp package.json dist/osx/<%= filename %>/Contents/Resources/app/',
-    'mkdir -p dist/osx/<%= filename %>/Contents/Resources/app/resources',
-    'cp -v resources/* dist/osx/<%= filename %>/Contents/Resources/app/resources/ || :',
-    'cp kitematic.icns dist/osx/<%= filename %>/Contents/Resources/atom.icns',
-    '/usr/libexec/PlistBuddy -c "Set :CFBundleVersion <%= version %>" dist/osx/<%= filename %>/Contents/Info.plist',
-    '/usr/libexec/PlistBuddy -c "Set :CFBundleDisplayName <%= name %>" dist/osx/<%= filename %>/Contents/Info.plist',
-    '/usr/libexec/PlistBuddy -c "Set :CFBundleName <%= name %>" dist/osx/<%= filename %>/Contents/Info.plist',
-    '/usr/libexec/PlistBuddy -c "Set :CFBundleIdentifier <%= bundle %>" dist/osx/<%= filename %>/Contents/Info.plist',
-    '/usr/libexec/PlistBuddy -c "Set :CFBundleExecutable <%= name %>" dist/osx/<%= filename %>/Contents/Info.plist'
-    ], {
-      templateData: {
-        filename: options.filename,
-        name: options.name,
-        version: packagejson.version,
-        bundle: 'com.kitematic.app'
-      }
-  }));
-
-  dependencies.forEach(function (d) {
-    stream = stream.pipe(shell([
-      'cp -R node_modules/' + d + ' dist/osx/<%= filename %>/Contents/Resources/app/node_modules/'
-    ], {
-      templateData: {
-        filename: options.filename
-      }
-    }));
-  });
-
-  return stream;
-});
-
-gulp.task('sign', function () {
-  try {
-    var signing_identity = fs.readFileSync('./identity', 'utf8').trim();
-    return gulp.src('').pipe(shell([
-      'codesign --deep --force --verbose --sign "' + signing_identity + '" ' + options.filename
-    ], {
-      cwd: './dist/osx/'
-    }));
-  } catch (error) {
-    gutil.log(gutil.colors.red('Error: ' + error.message));
-  }
-});
-
-gulp.task('zip', function () {
-  return gulp.src('').pipe(shell([
-    'ditto -c -k --sequesterRsrc --keepParent ' + options.filename + ' ' + options.name + '-' + packagejson.version + '.zip'
-  ], {
-    cwd: './dist/osx/'
-  }));
-});
-
-gulp.task('release', function () {
-  runSequence('download', 'dist', ['copy', 'images', 'js', 'styles'], 'sign', 'zip');
-});
-
-gulp.task('test', ['download', 'copy', 'js', 'images', 'styles', 'specs'], function () {
-  var env = process.env;
-  env.NODE_ENV = 'development';
-  gulp.src('').pipe(shell(['./cache/Atom.app/Contents/MacOS/Atom . --test'], {
-    env: env
-  }));
-});
-
-gulp.task('default', ['download', 'copy', 'js', 'images', 'styles'], function () {
-  gulp.watch('./app/**/*.js', ['js']);
-  gulp.watch('./app/**/*.html', ['copy']);
-  gulp.watch('./app/styles/**/*.less', ['styles']);
-  gulp.watch('./app/images/**', ['images']);
-
-  livereload.listen();
-
-  var env = process.env;
-  env.NODE_ENV = 'development';
-  gulp.src('').pipe(shell(['./cache/Atom.app/Contents/MacOS/Atom .'], {
-    env: env
-  }));
-});

index.html

@@ -7,5 +7,6 @@
   </head>
   <body>
     <script src="main.js"></script>
+    <script src="http://localhost:35729/livereload.js"></script>
   </body>
 </html>

package.json

@@ -11,10 +11,10 @@
   },
   "bugs": "https://github.com/kitematic/kitematic/issues",
   "scripts": {
-    "start": "gulp",
+    "start": "rsync ./index.html ./build/ && rsync ./fonts/* ./build/ && rsync ./images/* ./build && jsx --watch src/ build/ & wess -w -m -i ./styles/main.less -o ./build/main.css & wiper -w ./build/**/*.* & ./cache/Atom.app/Contents/MacOS/Atom .",
     "preinstall": "./deps",
-    "test": "gulp test",
-    "release": "gulp release"
+    "test": "jest",
+    "release": "./release"
   },
   "licenses": [
     {
@@ -22,8 +22,14 @@
       "url": "https://raw.githubusercontent.com/kitematic/kitematic/master/LICENSE"
     }
   ],
+  "jest": {
+    "scriptPreprocessor": "spec/support/preprocessor.js",
+    "unmockedModulePathPatterns": [
+      "node_modules/react"
+    ]
+  },
   "boot2docker-version": "1.3.2",
-  "atom-shell-version": "0.20.6",
+  "atom-shell-version": "0.21.0",
   "dependencies": {
     "ansi-to-html": "0.2.0",
     "async": "^0.9.0",
@@ -33,7 +39,6 @@
     "gulp-react": "^2.0.0",
     "jquery": "^2.1.3",
     "minimist": "^1.1.0",
-    "moment": "2.8.1",
     "node-uuid": "1.4.1",
     "object-assign": "^2.0.0",
     "open": "0.0.5",
@@ -41,37 +46,18 @@
     "react-bootstrap": "^0.13.2",
     "react-retina-image": "^1.1.2",
     "react-router": "^0.11.6",
-    "request": "2.42.0",
+    "request": "^2.51.0",
     "request-progress": "0.3.1",
     "retina.js": "^1.1.0",
     "underscore": "^1.7.0"
   },
   "devDependencies": {
-    "browserify": "^6.2.0",
     "ecstatic": "^0.5.8",
     "glob": "^4.0.6",
-    "gulp": "^3.8.10",
-    "gulp-atom": "0.0.5",
-    "gulp-concat": "^2.3.4",
-    "gulp-cssmin": "^0.1.6",
-    "gulp-download-atom-shell": "0.0.4",
-    "gulp-if": "^1.2.4",
-    "gulp-imagemin": "^2.0.0",
-    "gulp-less": "^2.0.1",
-    "gulp-livereload": "^2.1.1",
-    "gulp-notify": "^1.4.2",
-    "gulp-plumber": "^0.6.6",
-    "gulp-shell": "^0.2.11",
-    "gulp-sourcemaps": "^1.2.8",
-    "gulp-streamify": "0.0.5",
-    "gulp-uglify": "^0.3.1",
-    "gulp-uglifyjs": "^0.5.0",
-    "gulp-util": "^3.0.0",
+    "jasmine-reporters": "^1.0.1",
     "jasmine-tagged": "^1.1.2",
-    "livereload-js": "^2.2.1",
-    "reactify": "^0.15.2",
-    "run-sequence": "^1.0.2",
-    "vinyl-source-stream": "^0.1.1",
-    "watchify": "^2.1.1"
+    "react-tools": "^0.12.2",
+    "wess": "^0.2.2",
+    "wiper": "^1.0.2"
   }
 }

release

@@ -0,0 +1,35 @@
+#!/bin/bash
+BASE="$( cd "$( dirname "${BASH_SOURCE[0]}" )" && pwd )"
+export NAME=$(node -pe "JSON.parse(process.argv[1])['name']" "$(cat $BASE/package.json)")
+export VERSION=$(node -pe "JSON.parse(process.argv[1])['version']" "$(cat $BASE/package.json)")
+export FILENAME=$NAME.app
+export BUNDLE=com.kitematic.app
+
+rm -Rf ./dist
+mkdir -p ./dist/osx
+cp -R ./cache/Atom.app ./dist/osx/$FILENAME
+mv ./dist/osx/$FILENAME/Contents/MacOS/Atom ./dist/osx/$FILENAME/Contents/MacOS/$NAME
+mkdir -p ./dist/osx/$FILENAME/Contents/Resources/app
+cp -R browser dist/osx/$FILENAME/Contents/Resources/app
+cp package.json dist/osx/$FILENAME/Contents/Resources/app/
+mkdir -p dist/osx/$FILENAME/Contents/Resources/app/resources
+mkdir -p dist/osx/$FILENAME/Contents/Resources/app/node_modules
+cp -v resources/* dist/osx/$FILENAME/Contents/Resources/app/resources/ || :
+cp kitematic.icns dist/osx/$FILENAME/Contents/Resources/atom.icns
+/usr/libexec/PlistBuddy -c "Set :CFBundleVersion $VERSION" dist/osx/$FILENAME/Contents/Info.plist
+/usr/libexec/PlistBuddy -c "Set :CFBundleDisplayName $NAME" dist/osx/$FILENAME/Contents/Info.plist
+/usr/libexec/PlistBuddy -c "Set :CFBundleName $NAME" dist/osx/$FILENAME/Contents/Info.plist
+/usr/libexec/PlistBuddy -c "Set :CFBundleIdentifier $BUNDLE" dist/osx/$FILENAME/Contents/Info.plist
+/usr/libexec/PlistBuddy -c "Set :CFBundleExecutable $NAME" dist/osx/$FILENAME/Contents/Info.plist
+
+rsync ./index.html ./dist/osx/$FILENAME/Contents/Resources/app/build/
+rsync ./fonts/* ./dist/osx/$FILENAME/Contents/Resources/app/build/
+rsync ./images/* ./dist/osx/$FILENAME/Contents/Resources/app/build/
+jsx src/ ./dist/osx/$FILENAME/Contents/Resources/app/build/
+wess -m -i ./styles/main.less -o ./dist/osx/$FILENAME/Contents/Resources/app/build/main.css
+
+if [ -f $BASE/identity ]; then
+  codesign --deep --force --verbose --sign "$(cat $BASE/identity)" ./dist/osx/$FILENAME
+fi
+
+ditto -c -k --sequesterRsrc --keepParent ./dist/osx/$FILENAME ./dist/osx/$NAME-$VERSION.zip

specs/App-spec.js

@@ -1,11 +0,0 @@
-var Containers = require('./../app/Containers.react.js');
-var TestUtils = require('react/addons').TestUtils;
-var jasmine = require('jasmine-node');
-
-describe('Containers', function() {
-  it('should be wrapped with a div', function() {
-    // var app = TestUtils.renderIntoDocument(App());
-    expect(true).toEqual(true);
-  });
-
-});

specs/specs.html

@@ -1,9 +0,0 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <link rel="stylesheet" href="main.css"/>
-  </head>
-  <body>
-    <script src="specs.js"></script>
-  </body>
-</html>

src/ContainerDetails.react.js

@@ -12,6 +12,7 @@ var ContainerUtil = require('./ContainerUtil');
 var docker = require('./docker');
 var boot2docker = require('./boot2docker');
 var ProgressBar = require('react-bootstrap/ProgressBar');
+var Popover = require('react-bootstrap/Popover');
 
 var ContainerDetails = React.createClass({
   mixins: [Router.State, Router.Navigation],
@@ -34,8 +35,6 @@ var ContainerDetails = React.createClass({
   componentWillReceiveProps: function () {
     this.init();
   },
-  componentWillMount: function () {
-  },
   componentDidMount: function () {
     this.init();
     ContainerStore.on(ContainerStore.SERVER_PROGRESS_EVENT, this.updateProgress);

src/ContainerStore.js

@@ -226,14 +226,14 @@ var ContainerStore = assign(EventEmitter.prototype, {
     // If the event is delete, remove the container
     if (data.status === 'destroy') {
       var container = _.findWhere(_.values(_containers), {Id: data.id});
-      if (!container) {
-        return;
+      if (container) {
+        delete _containers[container.Name];
+        if (!_muted[container.Name]) {
+          this.emit(this.SERVER_CONTAINER_EVENT, container.Name, data.status);
+        }
+      } else {
+        this.emit(this.SERVER_CONTAINER_EVENT, data.status);
       }
-      delete _containers[container.Name];
-      if (_muted[container.Name]) {
-        return;
-      }
-      this.emit(this.SERVER_CONTAINER_EVENT, container.Name, data.status);
     } else {
       this.fetchContainer(data.id, function (err) {
         if (err) {

src/main.js

@@ -28,14 +28,6 @@ Bugsnag.releaseStage = process.env.NODE_ENV === 'development' ? 'development' :
 Bugsnag.notifyReleaseStages = [];
 Bugsnag.appVersion = app.getVersion();
 
-if (process.env.NODE_ENV === 'development') {
-  var script = document.createElement('script');
-  script.type = 'text/javascript';
-  script.src = 'http://localhost:35729/livereload.js';
-  var head = document.getElementsByTagName('head')[0];
-  head.appendChild(script);
-}
-
 if (!window.location.hash.length || window.location.hash === '#/') {
   router.run(function (Handler) {
     React.render(<Handler/>, document.body);

src/virtualbox.js

@@ -49,7 +49,7 @@ var VirtualBox = {
       callback('VirtualBox not installed.');
       return;
     }
-    exec('list runningvms | sed -E \'s/.*\\{(.*)\\}/\\1/\' | xargs -L1 -I {} VBoxManage controlvm {} savestate', function (stderr, stdout, code) {
+    exec('/usr/bin/VBoxManage list runningvms | sed -E \'s/.*\\{(.*)\\}/\\1/\' | xargs -L1 -I {} /usr/bin/VBoxManage controlvm {} savestate', function (stderr, stdout, code) {
       if (code) {
         callback(stderr);
       } else {
@@ -84,7 +84,7 @@ var VirtualBox = {
     VirtualBox.vmState(name, function (err, state) {
       // No VM found
       if (err) { callback(null, false); return; }
-      VirtualBox.exec('controlvm ' + name + ' acpipowerbutton', function (stderr, stdout, code) {
+      exec('/usr/bin/VBoxManage controlvm ' + name + ' acpipowerbutton', function (stderr, stdout, code) {
         if (code) { callback(stderr, false); return; }
         var state = null;
 
@@ -97,7 +97,7 @@ var VirtualBox = {
             setTimeout(callback, 250);
           });
         }, function (err) {
-          VirtualBox.exec('unregistervm ' + name + ' --delete', function (stderr, stdout, code) {
+          exec('/usr/bin/VBoxManage unregistervm ' + name + ' --delete', function (stderr, stdout, code) {
             if (code) { callback(err); return; }
             callback();
           });