cloudstack-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From bfede...@apache.org
Subject [09/10] git commit: updated refs/heads/ui-angularjs-test-concept to 666fa15
Date Fri, 28 Feb 2014 00:06:05 GMT
WIP


Project: http://git-wip-us.apache.org/repos/asf/cloudstack/repo
Commit: http://git-wip-us.apache.org/repos/asf/cloudstack/commit/0abfb3e9
Tree: http://git-wip-us.apache.org/repos/asf/cloudstack/tree/0abfb3e9
Diff: http://git-wip-us.apache.org/repos/asf/cloudstack/diff/0abfb3e9

Branch: refs/heads/ui-angularjs-test-concept
Commit: 0abfb3e9583b76c74cbfc15c2313dd9292aadb40
Parents: 56684a5
Author: Brian Federle <brian.federle@citrix.com>
Authored: Thu Feb 27 15:57:23 2014 -0800
Committer: Brian Federle <brian.federle@citrix.com>
Committed: Thu Feb 27 16:03:33 2014 -0800

----------------------------------------------------------------------
 ui/cloudstack-angular/_list.html                |    17 +
 ui/cloudstack-angular/app.js                    |    53 +
 ui/cloudstack-angular/cloudStack.js             |    54 +
 ui/cloudstack-angular/index.html                |    19 +
 ui/cloudstack-angular/lib/angular.js            | 20874 +++++++++++++++++
 .../lib/bootstrap/css/bootstrap-theme.css       |   347 +
 .../lib/bootstrap/css/bootstrap-theme.css.map   |     1 +
 .../lib/bootstrap/css/bootstrap-theme.min.css   |     7 +
 .../lib/bootstrap/css/bootstrap.css             |  5785 +++++
 .../lib/bootstrap/css/bootstrap.css.map         |     1 +
 .../lib/bootstrap/css/bootstrap.min.css         |     7 +
 .../fonts/glyphicons-halflings-regular.eot      |   Bin 0 -> 20335 bytes
 .../fonts/glyphicons-halflings-regular.svg      |   229 +
 .../fonts/glyphicons-halflings-regular.ttf      |   Bin 0 -> 41280 bytes
 .../fonts/glyphicons-halflings-regular.woff     |   Bin 0 -> 23320 bytes
 .../lib/bootstrap/js/bootstrap.js               |  1951 ++
 .../lib/bootstrap/js/bootstrap.min.js           |     6 +
 ui/cloudstack-angular/lib/jquery.js             |  9789 ++++++++
 18 files changed, 39140 insertions(+)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/cloudstack/blob/0abfb3e9/ui/cloudstack-angular/_list.html
----------------------------------------------------------------------
diff --git a/ui/cloudstack-angular/_list.html b/ui/cloudstack-angular/_list.html
new file mode 100644
index 0000000..993c97f
--- /dev/null
+++ b/ui/cloudstack-angular/_list.html
@@ -0,0 +1,17 @@
+<table class="table">
+  <thead>
+    <tr>
+      <th ng-repeat="field in fields">{{ field.label }}</th>
+      <th class="actions">Actions</th>
+    </tr>
+  </thead>
+  <tbody class="table-striped">
+    <tr ng-repeat="item in data" ng-class="{active: item.pending == true}">
+      <td ng-class="field.id" ng-repeat="field in fields">{{ item[field.id] }}</td>
+      <td class="actions">
+        <button ng-repeat="action in actions"
+                ng-click="action.action($parent.$index, item)">{{ action.label }}</button>
+      </td>
+    </tr>
+  </tbody>
+</table>

http://git-wip-us.apache.org/repos/asf/cloudstack/blob/0abfb3e9/ui/cloudstack-angular/app.js
----------------------------------------------------------------------
diff --git a/ui/cloudstack-angular/app.js b/ui/cloudstack-angular/app.js
new file mode 100644
index 0000000..e594bac
--- /dev/null
+++ b/ui/cloudstack-angular/app.js
@@ -0,0 +1,53 @@
+(function (cloudStack) {
+    var app = angular.module('cloudStack', []);
+
+    app.directive('list', function () {
+        return {
+            restrict: 'E',
+            templateUrl: '_list.html',
+            replace: true,
+            controller: 'ListController'
+        };
+    });
+
+    app.controller('ListController', function ($scope, $element) {
+        var section = $element.attr('path');
+        var listView = cloudStack.sections[section].listView;
+
+        $scope.fields = listView.fields;
+        $scope.actions = [];
+        $scope.data = [];
+
+        // Load data
+        listView.dataProvider({
+            response: {
+                success: function (args) {
+                    $(args.data).each(function () {
+                        $scope.data.push(this);
+                    });
+                }
+            }
+        });
+
+        // Build actions
+        for (action in listView.actions) {
+            var targetAction = listView.actions[action];
+
+            $scope.actions.push({
+                id: targetAction.id,
+                label: targetAction.label,
+                action: function ($index) {
+                    targetAction.action({
+                        response: {
+                            success: function () {
+                                if (targetAction.id == 'remove') {
+                                    $scope.data.splice($index, 1);
+                                }
+                            }
+                        }
+                    })
+                }
+            });
+        }
+    })
+}(window.cloudStack));
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/cloudstack/blob/0abfb3e9/ui/cloudstack-angular/cloudStack.js
----------------------------------------------------------------------
diff --git a/ui/cloudstack-angular/cloudStack.js b/ui/cloudstack-angular/cloudStack.js
new file mode 100644
index 0000000..9e4f0cc
--- /dev/null
+++ b/ui/cloudstack-angular/cloudStack.js
@@ -0,0 +1,54 @@
+window.clientApiUrl = '/client/api';
+window.g_sessionKey = '';
+
+// Login
+$.ajax({
+    type: 'POST',
+    url: clientApiUrl,
+    dataType: 'json',
+    async: false,
+    success: function(json) {
+        g_sessionKey = json.loginresponse.sessionkey;
+    },
+    data: {
+        command: 'login',
+        domain: '/',
+        username: 'admin',
+        password: 'password',
+        response: 'json'
+    }
+});
+
+// Dummy app structure
+window.cloudStack = {
+    sections: {
+        instances: {
+            listView: {
+                fields: [
+                    { id: 'name', label: 'Name' },
+                    { id: 'zone', label: 'Zone' },
+                    { id: 'state', label: 'State' }
+                ],
+                actions: [
+                    {
+                        id: 'remove', label: 'X',
+                        action: function(args) {
+                            args.response.success();
+                        }
+                    }
+                ],
+                dataProvider: function(args) {
+                    $.ajax({
+                        url: createURL('listVirtualMachines'),
+                        dataType: 'json',
+                        success: function(json) {
+                            args.response.success({
+                                data: json.listvirtualmachinesresponse.virtualmachine
+                            });
+                        }
+                    })
+                }
+            }
+        }
+    }
+};

http://git-wip-us.apache.org/repos/asf/cloudstack/blob/0abfb3e9/ui/cloudstack-angular/index.html
----------------------------------------------------------------------
diff --git a/ui/cloudstack-angular/index.html b/ui/cloudstack-angular/index.html
new file mode 100644
index 0000000..dd4cdb8
--- /dev/null
+++ b/ui/cloudstack-angular/index.html
@@ -0,0 +1,19 @@
+<!doctype html>
+<html>
+<head>
+    <title>AngularJS Tutorial</title>
+    <link href="lib/bootstrap/css/bootstrap.css" rel="stylesheet" />
+</head>
+<body>
+<div ng-app="cloudStack">
+    <list path="instances"></list>
+</div>
+
+<script>window.cloudStack = {};</script>
+<script src="lib/jquery.js"></script>
+<script src="../scripts/sharedFunctions.js"></script>
+<script src="cloudStack.js"></script>
+<script src="lib/angular.js"></script>
+<script src="app.js"></script>
+</body>
+</html>


Mime
View raw message