Experimental implementation of travis-cmd

app/components/travis-cmd.js

@@ -0,0 +1,84 @@
+import Ember from 'ember';
+import config from 'travis/config/environment';
+
+let Component = Ember.Component.extend({
+  keyboard: Ember.inject.service(),
+  auth: Ember.inject.service(),
+
+  classNameBindings: ['visible'],
+  classNames: ['travis-cmd'],
+
+  didInsertElement() {
+    this.get('keyboard').bind('t', this.show.bind(this));
+    this.get('keyboard').bind('esc', 'cmd', this.hide.bind(this));
+  },
+
+  show() {
+    this.loadSlugs();
+    this.set('visible', true);
+    this.get('keyboard').setScope('cmd');
+  },
+
+  hide() {
+    this.set('visible', false);
+    this.get('keyboard').setScope(null);
+    this.set('matches', null);
+    this.set('filterString', null);
+    this.set('results', null);
+  },
+
+  loadSlugs() {
+    this.set('loading', true);
+
+    $.ajax(config.apiEndpoint + '/repos/slugs', {
+      headers: {
+        Authorization: 'token ' + this.get('auth').token(),
+        Accept: 'application/json; version=2'
+      }
+    }).then((data) => {
+      this.set('loading', false);
+      this.set('repos', data.repositories);
+      this.onLoad();
+    });
+  },
+
+  onLoad() {
+    setTimeout( () => {
+      this.$('.input').focus();
+    }, 10);
+  },
+
+  actions: {
+    filterChanged(value) {
+      let list = this.get('repos');
+
+      let options = {
+          pre: '<strong>'
+        , post: '</strong>'
+        , extract: function(el) { return el.slug; }
+      };
+
+      let results = fuzzy.filter(value, list, options);
+      let matches = results.map(function(el) { return el.string; });
+      this.set('matches', matches.slice(0, 10).join('<br/>'));
+      this.set('results', results);
+      this.set('filterString', value);
+    },
+
+    keypress(event) {
+      if(event.keyCode === 27) {
+        this.hide();
+      } else if(event.keyCode === 13) {
+        let results;
+        if(results = this.get('results')) {
+          if(results[0]) {
+            let slug = results[0].original.slug;
+            console.log(slug);
+          }
+        }
+      }
+    }
+  }
+});
+
+export default Component;

app/services/keyboard.js

@@ -0,0 +1,13 @@
+import Ember from 'ember';
+
+let KeyboardService = Ember.Service.extend({
+  bind(keyName, scope, callback) {
+    key(...arguments);
+  },
+
+  setScope(scope) {
+    key.setScope(scope);
+  }
+});
+
+export default KeyboardService;

app/styles/app.scss

@@ -66,3 +66,4 @@
 @import "app/layouts/missing-notice";
 @import "app/layouts/settings";
 
+@import "fuzzy";

app/styles/fuzzy.scss

@@ -0,0 +1,35 @@
+.travis-cmd {
+  opacity:    0.3;
+  background: #000;
+  width:      100%;
+  height:     100%;
+  z-index:    10;
+  top:        0;
+  left:       0;
+  position:   fixed;
+  display: none;
+
+  .content {
+    opacity: 1;
+  }
+
+  &.visible {
+    display: block;
+  }
+
+  .content {
+    width: 400px;
+    min-height: 60px;
+    background-color: white;
+    border-radius: 10px;
+    position: fixed;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+  }
+
+  .content, .input {
+    color: black;
+    font-size: 20px;
+  }
+}

app/templates/application.hbs

@@ -1 +1,3 @@
 {{outlet}}
+
+{{travis-cmd}}

app/templates/components/travis-cmd.hbs

@@ -0,0 +1,15 @@
+<div class="content">
+  {{#if loading}}
+    {{loading-indicator}}
+  {{else}}
+
+    <input type="text" class="input" value={{filterString}}
+           oninput={{action "filterChanged" value="target.value"}}
+           onkeydown={{action "keypress"}}>
+
+    <div class="matches">
+      {{{matches}}}
+    </div>
+
+  {{/if}}
+</div>

app/views/application.coffee

@@ -4,6 +4,7 @@ View = BasicView.extend
   popup: Ember.inject.service()
 
   classNames: ['application']
+
   click: (event) ->
     # TODO: this solves the case of closing menus and popups,
     #       but I would like to rewrite it later, not sure how

bower.json

@@ -17,6 +17,8 @@
     "jquery-timeago": "~1.4.1",
     "pusher": "~2.2.3",
     "pretender": "0.1.0",
-    "ember-resolver": "~0.1.20"
+    "ember-resolver": "~0.1.20",
+    "keymaster": "~1.6.3",
+    "fuzzy": "~0.1.1"
   }
 }

config/environment.js

@@ -20,10 +20,10 @@ module.exports = function(environment) {
     },
 
     // defaults for running travis-web
-    apiEndpoint: 'https://api.travis-ci.org',
+    apiEndpoint: 'https://api-staging.travis-ci.org',
     sourceEndpoint: 'https://github.com',
     pusher: {
-      key: '5df8ac576dcccf4fd076',
+      key: 'dd3f11c013317df48b50',
       host: 'ws.pusherapp.com'
     },
     pro: false,

ember-cli-build.js

@@ -32,6 +32,8 @@ module.exports = function(defaults) {
 
   app.import('bower_components/pusher/dist/pusher.js');
   app.import('bower_components/jquery-timeago/jquery.timeago.js');
+  app.import('bower_components/keymaster/keymaster.js');
+  app.import('bower_components/fuzzy/fuzzy-min.js');
   app.import('bower_components/visibilityjs/lib/visibility.core.js');
   app.import('bower_components/visibilityjs/lib/visibility.timers.js');
   app.import('bower_components/JavaScript-MD5/js/md5.js');