CORD GUI -- Bundle Icons added to git. Login/logout functionality added.
Change-Id: I291b8e3106db3f47c5a9d9b4d06403b35e53d635
diff --git a/apps/demo/cord-gui/src/main/webapp/app/view/common/common.css b/apps/demo/cord-gui/src/main/webapp/app/view/common/common.css
index a99a70e..5974749 100644
--- a/apps/demo/cord-gui/src/main/webapp/app/view/common/common.css
+++ b/apps/demo/cord-gui/src/main/webapp/app/view/common/common.css
@@ -18,6 +18,10 @@
display: none !important;
}
+html, body, div#frame, div#view {
+ height: 100%;
+}
+
head, body, footer,
h1, h2, h3, h4, h5, h6, p,
a, ul, li, div,
@@ -74,6 +78,10 @@
font-weight: lighter;
}
+div.container {
+ min-height: 100%;
+}
+
button,
input[type="button"],
input[type="reset"] {
diff --git a/apps/demo/cord-gui/src/main/webapp/app/view/home/home.css b/apps/demo/cord-gui/src/main/webapp/app/view/home/home.css
index 8f5002c..addb453 100644
--- a/apps/demo/cord-gui/src/main/webapp/app/view/home/home.css
+++ b/apps/demo/cord-gui/src/main/webapp/app/view/home/home.css
@@ -23,7 +23,7 @@
width: 42%;
}
#home div.move-down {
- margin-top: 10%;
+ margin-top: 5%;
}
#home div.image-holder {
diff --git a/apps/demo/cord-gui/src/main/webapp/app/view/home/home.html b/apps/demo/cord-gui/src/main/webapp/app/view/home/home.html
index a51ab18..bdab3fc 100644
--- a/apps/demo/cord-gui/src/main/webapp/app/view/home/home.html
+++ b/apps/demo/cord-gui/src/main/webapp/app/view/home/home.html
@@ -7,6 +7,7 @@
<div class="main-right">
<div class="move-down">
<div class="bundle-title">
+ <h4>Welcome {{shared.login}}!</h4>
<h5>You are subscribed to the</h5>
<h3>{{bundle}}</h3>
</div>
diff --git a/apps/demo/cord-gui/src/main/webapp/app/view/home/home.js b/apps/demo/cord-gui/src/main/webapp/app/view/home/home.js
index dc027e6..72b37a5 100644
--- a/apps/demo/cord-gui/src/main/webapp/app/view/home/home.js
+++ b/apps/demo/cord-gui/src/main/webapp/app/view/home/home.js
@@ -20,7 +20,9 @@
var urlSuffix = '/rs/dashboard';
function randomDate(start, end) {
- return new Date(start.getTime() + Math.random() * (end.getTime() - start.getTime()));
+ return new Date(
+ start.getTime() + Math.random() * (end.getTime() - start.getTime())
+ );
}
angular.module('cordHome', [])
@@ -38,12 +40,13 @@
if ($.isEmptyObject($scope.shared.userActivity)) {
$scope.users.forEach(function (user) {
- var date = randomDate(new Date(2015, 0, 1), new Date());
+ var date = randomDate(new Date(2015, 0, 1),
+ new Date());
- $scope.shared.userActivity[user.id] = $filter('date')(date, 'mediumTime');
+ $scope.shared.userActivity[user.id] =
+ $filter('date')(date, 'mediumTime');
});
}
-
},
// error
function () {
diff --git a/apps/demo/cord-gui/src/main/webapp/app/view/login/login.css b/apps/demo/cord-gui/src/main/webapp/app/view/login/login.css
index 3fde6f8..3202930 100644
--- a/apps/demo/cord-gui/src/main/webapp/app/view/login/login.css
+++ b/apps/demo/cord-gui/src/main/webapp/app/view/login/login.css
@@ -14,6 +14,11 @@
* limitations under the License.
*/
+div#login{
+ /*background: url("/imgs/login.png") no-repeat;*/
+ height: 100%;
+}
+
div#login-wrapper {
text-align: center;
}
@@ -28,21 +33,10 @@
top: -140px;
}
-div#login-logo {
- margin-top: 13%;
- width: 217px;
-}
-div#login-logo, div#login-form {
+div#login-form {
display: inline-block;
}
-#login-logo use.glyph.bird {
- fill: #CE5650;
-}
-#login-logo circle {
- fill: none;
-}
-
#login div.outline {
position: absolute;
border: 1px solid rgba(115, 115, 115, 0.7);
@@ -57,12 +51,13 @@
margin-left: 2.5%;
position: relative;
width: 255px;
+ margin-top: 30%;
}
#login-form form {
line-height: 250%;
-
}
+
#login-form input {
display: block;
height: 40px;
@@ -112,3 +107,8 @@
color: white;
background-color: rgb(122, 188, 229);
}
+
+#login-form input.ng-invalid.ng-touched {
+ background-color: #CE5650;
+ color: white;
+}
diff --git a/apps/demo/cord-gui/src/main/webapp/app/view/login/login.html b/apps/demo/cord-gui/src/main/webapp/app/view/login/login.html
index cc22598..34c188d 100644
--- a/apps/demo/cord-gui/src/main/webapp/app/view/login/login.html
+++ b/apps/demo/cord-gui/src/main/webapp/app/view/login/login.html
@@ -1,19 +1,13 @@
<!-- Login page partial html -->
<div id="login" class="container">
<div id="login-wrapper">
- <div id="login-logo">
- <icon size="125" id="bird"></icon>
- </div>
-
<div id="login-form">
<div class="outline"></div>
<h2>Subscriber Portal</h2>
<form>
- <input ng-model="email" type="text" placeholder="email">
- <input type="password" placeholder="password">
- <a href="#/home">
- <input ng-click="login()" type="button" value="Log In">
- </a>
+ <input ng-model="email" type="text" placeholder="email" required>
+ <input ng-model="password" type="password" placeholder="password" required>
+ <input ng-click="login()" type="button" value="Log In">
</form>
</div>
</div>
diff --git a/apps/demo/cord-gui/src/main/webapp/app/view/login/login.js b/apps/demo/cord-gui/src/main/webapp/app/view/login/login.js
index fb54f0a..b4d92ff 100644
--- a/apps/demo/cord-gui/src/main/webapp/app/view/login/login.js
+++ b/apps/demo/cord-gui/src/main/webapp/app/view/login/login.js
@@ -19,20 +19,28 @@
var urlSuffix = '/rs/login';
angular.module('cordLogin', [])
- .controller('CordLoginCtrl', ['$log', '$scope', '$resource',
- function ($log, $scope, $resource) {
+ .controller('CordLoginCtrl',
+ ['$log', '$scope', '$resource', '$location', '$window',
+ function ($log, $scope, $resource, $location, $window) {
var LoginData, resource;
$scope.page.curr = 'login';
- $scope.login = function () {
- var email;
- if (!$scope.email) {
- email = 'mom@user.org';
- } else {
- email = $scope.email;
- }
+ function getResource(email) {
LoginData = $resource($scope.shared.url + urlSuffix + '/' + email);
- resource = LoginData.get();
+ resource = LoginData.get({},
+ function () {
+ $location.url('/home');
+ $window.location.href = $location.absUrl();
+ });
+ }
+
+ $scope.login = function () {
+
+ if ($scope.email && $scope.password) {
+ getResource($scope.email);
+ }
+
+ $scope.shared.login = $scope.email;
};
$log.debug('Cord Login Ctrl has been created.');