Merge pull request #7 from TranscendComputing/port-to-backbone

Port to backbone

Author: huxoll

.gitignore

@@ -13,6 +13,7 @@ public/docs/*.html
 public/docs/images/
 public/docs/js/
 public/docs/*
+public/vendor
 lib/bundler/man
 pkg
 rdoc

Rakefile

@@ -16,6 +16,7 @@ task :jslint do
   paths = paths.reject{|path| path =~ /public\/js\/console.*/}
   paths = paths.reject{|path| path =~ /public\/js\/enc-base64-min.*/}
   paths = paths.reject{|path| path =~ /public\/js\/hmac-sha256.*/}
+  paths = paths.reject{|path| path =~ /public\/vendor\/.*/}
   paths.each do |fname|
     cmd = "jslint #{fname}"
     results = %x{#{cmd}}

app/editor.rb

@@ -8,7 +8,7 @@ class EditorApp < Sinatra::Base
   end
 
   get '/' do
-    @bottom_js = ["main","editor"]
+    @require_main = "editor"
     @editor = true
     erb :editor
   end

app/views/editor.erb

@@ -1,3 +1,4 @@
+<div id="editor_all">
 <div id="editor_frame">
 <div id="editor"># Create some instances on AWS
 
@@ -125,31 +126,8 @@ end
 </div>
 </div>
 </div><%# /control_panel_frame %>
+</div><%# /editor_all %>
 <script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.1.01/ace.js" type="text/javascript" charset="utf-8"></script>
-<script>
-    var editor = ace.edit("editor");
-    editor.setTheme("ace/theme/vibrant_ink");
-    editor.getSession().setMode("ace/mode/ruby");
-    editor.on("guttermousedown", function(e){
-    var target = e.domEvent.target;
-      if (target.className.indexOf("ace_gutter-cell") == -1) {
-          var row = e.getDocumentPosition().row;
-          e.editor.session.clearBreakpoint(row);
-          return;
-      }
-      if (e.clientX > 25 + target.getBoundingClientRect().left) {
-          return;
-      }
-      var row = e.getDocumentPosition().row;
-      if (target.className.indexOf("breakpoint") == -1) {
-          e.editor.session.setBreakpoint(row, " breakpoint");
-          e.stop();
-      } else {
-          e.editor.session.clearBreakpoint(row);
-          return;
-      }
-	});
-</script>
 <script src="/js/annyang.min.js" type="text/javascript"></script>
 <script>
 if (annyang) {
@@ -163,5 +141,5 @@ if (annyang) {
 
 }</script>
 <script src="//cdnjs.cloudflare.com/ajax/libs/spin.js/1.2.7/spin.min.js"></script>
-<script src="//cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.0/backbone-min.js"></script>
+
 

app/views/layout.erb

@@ -16,6 +16,7 @@
     <!-- link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" -->
     <link href="/css/bootstrap.css" rel="stylesheet" media="screen">
     <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/3.2.1/css/font-awesome.min.css">
+    <link href="/css/opentip.css" rel="stylesheet" type="text/css" />
     <style>
       body {
         padding-top: 60px; /* 60px to make the container go all the way to the bottom of the topbar */
@@ -65,14 +66,22 @@
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
     <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
     <script src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/2.0.0/lodash.min.js"></script>
+    <script src="//cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.0/backbone-min.js"></script>
     <script src="/js/console.js"></script>
     <script src="/js/hmac-sha256.js" type="text/javascript"></script>
     <script src="/js/enc-base64-min.js" type="text/javascript"></script>
     <script src="/js/auth.js" type="text/javascript"></script>
+    <script src="//cdn.jsdelivr.net/opentip/2.4.6/opentip-jquery-excanvas.min.js"></script>
 <% if @bottom_js %>
   <% @bottom_js.each do |script| %>
     <%= "<script src=\"/js/#{script}.js\"></script>" %>
   <% end %>
 <% end %>
+<% if @require_main %>
+<script src="/vendor/require.js"></script>
+<script>
+  require(['js/<%= "#{@require_main}" %>'], function (app) {});
+</script>
+<% end %>
 </body>
 </html>

bower.json

@@ -73,6 +73,11 @@ map "/swagger-ui" do
     run Rack::Directory.new("./bower_components/swagger-ui/dist")
 end
 
+# Serve swagger-ui from bower directory
+map "/bower_components" do
+    run Rack::Directory.new("./bower_components")
+end
+
 map '/' do
   run RootApp
 end

config.ru

@@ -0,0 +1,41 @@
+{
+  "name": "harp-runtime",
+  "version": "0.1.0",
+  "devDependencies": {
+  },
+  "readmeFilename": "README.md",
+  "description": "Cloud orchestration platform",
+  "main": "Gruntfile.js",
+  "bugs": "https://github.com/TranscendComputing/harp-runtime/issues",
+  "directories": {
+    "js": "public/js"
+  },
+  "dependencies": {
+  },
+  "scripts": {
+    "test": "rake spec"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/TranscendComputing/harp-runtime.git"
+  },
+  "keywords": [
+    "cloud",
+    "managment",
+    "ec2",
+    "openstack",
+    "aws"
+  ],
+  "author": "Transcend Computing",
+  "license": "Apache2",
+  "jam": {
+    "packageDir": "public/vendor",
+    "baseUrl": "public/js",
+    "dependencies": {
+      "jquery": "2.0.0",
+      "backbone.babysitter": null,
+      "backbone-relational-shim": null,
+      "backbone.epoxy": null
+    }
+  }
+}

package.json

@@ -4,8 +4,8 @@ body {
 body {
     overflow: hidden;
 }
-    
-#editor { 
+
+#editor {
     margin: 0;
     position: absolute;
     top: 60px;
@@ -20,17 +20,17 @@ body {
     bottom: 0px;
     left: 20px;
     right: 0;
-    height: 200px;   
-    border-top: 1px solid gray; 
+    height: 200px;
+    border-top: 1px solid gray;
 }
 #control_panel_frame {
     margin: 0;
     position: absolute;
     bottom: 0px;
     left: 0;
     right: 0;
-    height: 200px;   
-    border-top: 1px solid gray; 
+    height: 200px;
+    border-top: 1px solid gray;
 }
 
 .breakpoint:after {
@@ -58,3 +58,17 @@ body {
     height: 80%;
     z-index: 1000;
 }
+
+.ace_snippet-buble {
+    box-sizing: border-box;
+    background: none repeat scroll 0 0 rgba(160, 193, 241, 0.26);
+    border: 1px solid rgba(119, 116, 139, 0.08);
+    border-radius: 3px 3px 3px 3px;
+    position: absolute;
+    pointer-events: auto;
+    cursor: pointer;
+    z-index:10
+}
+.ace_snippet-buble:hover {
+    background: rgba(94, 136, 147, 0.21);
+}

public/css/main.css

@@ -0,0 +1,14 @@
+/*global define*/
+define([
+  'underscore',
+  'backbone',
+  'js/models/play'
+], function (_, Backbone, HarpPlay) {
+  'use strict';
+
+  var HarpPlays = Backbone.Collection.extend({
+    model: HarpPlay
+  });
+
+  return HarpPlays;
+});