Ejegg has submitted this change and it was merged.
Change subject: Change the way unlogged-in screen looks
......................................................................
Change the way unlogged-in screen looks
Change-Id: Ib7c443cbcbd00050ee3c0faef2c3cedc5bf076b8
---
M src/components/app-content/app-content.html
M src/components/app-content/app-content.js
M src/components/nav-bar/nav-bar.html
M src/components/nav-bar/nav-bar.js
M src/css/style.css
M src/index.html
6 files changed, 43 insertions(+), 21 deletions(-)
Approvals:
Ejegg: Looks good to me, approved
jenkins-bot: Verified
diff --git a/src/components/app-content/app-content.html
b/src/components/app-content/app-content.html
index 4606be5..e2a6390 100644
--- a/src/components/app-content/app-content.html
+++ b/src/components/app-content/app-content.html
@@ -1,4 +1,8 @@
-<div class="container-fluid">
+<section id="navbar">
+ <nav-bar params="welcome: welcome, loggedIn: loggedIn"></nav-bar>
+</section>
+
+<div class="container-fluid" data-bind='visible: loggedIn'>
<div class="row">
<div data-bind="component: 'bigEnglishBoard'"
class="col-md-12"></div>
</div>
@@ -6,3 +10,12 @@
<div data-bind="component: 'fraud-gauge'" class="col-md-4
firstWidget"></div>
</div>
</div>
+
+<div class="container-fluid" data-bind='visible: !loggedIn()'>
+ <div class="row">
+ <div class="jumbotron">
+ <h1>Welcome To Dash.</h1>
+ <h3>Please <a href="/auth/drupal"><button class="btn
btn-info">Log in</button></a> to continue.</h3>
+ </div>
+ </div>
+</div>
diff --git a/src/components/app-content/app-content.js
b/src/components/app-content/app-content.js
index 4a5558c..42816ac 100644
--- a/src/components/app-content/app-content.js
+++ b/src/components/app-content/app-content.js
@@ -18,6 +18,15 @@
return value === e;
};
};
+
+ self.loggedIn = ko.observable(false);
+ self.welcome = ko.observable('');
+ $.get('/user/info', function(userInfo) {
+ if (userInfo) {
+ self.welcome(userInfo['name'].charAt(0).toUpperCase() +
userInfo['name'].slice(1));
+ self.loggedIn(true);
+ };
+ });
}
return { viewModel: AppContent, template: templateMarkup };
diff --git a/src/components/nav-bar/nav-bar.html
b/src/components/nav-bar/nav-bar.html
index 2504971..69844bc 100644
--- a/src/components/nav-bar/nav-bar.html
+++ b/src/components/nav-bar/nav-bar.html
@@ -24,10 +24,9 @@
<span id="navCollapseArrows"><i
class="fa fa-angle-double-left"></i></span>
</ul>
</div>
- <div class="row-fluid text-center logoutBtn">
- <a href="/auth/drupal"
data-bind="visible: showLogIn"><button class="btn btn-block btn-info">Log
in</button></a>
- <p data-bind="text: welcome"></p>
- <a href="/logout" data-bind="visible:
!showLogIn()"><button class="btn btn-block btn-info">Log out</button></a>
+ <div class="row-fluid text-center logoutBtn"
data-bind="visible: loggedIn">
+ <a href="/logout"><button class="btn
btn-block btn-info">Log out</button></a>
+ <p class="loginWelcome"><i class="fa
fa-user"></i> <span data-bind="text: welcome"></span></p>
</div>
</div>
</div>
diff --git a/src/components/nav-bar/nav-bar.js
b/src/components/nav-bar/nav-bar.js
index 4f498e4..6f08632 100644
--- a/src/components/nav-bar/nav-bar.js
+++ b/src/components/nav-bar/nav-bar.js
@@ -6,8 +6,8 @@
function NavBarViewModel( params ){
var self = this;
-
- self.route = params.route;
+ self.loggedIn = ko.observable(params.loggedIn()),
+ self.welcome = ko.observable(params.welcome());
self.hideNav = function(){
//make the nav menu fold out of view.
@@ -22,16 +22,6 @@
$('#dashApp').css('padding-left', '175px');
}, 200);
};
-
- self.showLogIn = ko.observable(false);
- self.welcome = ko.observable('');
- $.get('/user/info', function(userInfo) {
- if (userInfo) {
- self.welcome('Welcome, ' + userInfo.name);
- } else {
- self.showLogIn(true);
- }
- });
}
return { viewModel: NavBarViewModel, template: template };
diff --git a/src/css/style.css b/src/css/style.css
index 2298c52..e60c807 100644
--- a/src/css/style.css
+++ b/src/css/style.css
@@ -105,6 +105,19 @@
border-bottom: 1px #555 solid;
}
+.loginWelcome > i {
+ padding: 0 3px;
+}
+
+.loginWelcome {
+ width: 100px;
+ padding: 3px;
+ background-color: rgba(255,255,255,0.4);
+ overflow-wrap: break-word;
+ padding: 3px;
+ font-size: .8em;
+}
+
.titlebrand, .titlebrandToggle {
background-color: #d9534f;
overflow: hidden;
diff --git a/src/index.html b/src/index.html
index e8c5e44..7c2acc6 100644
--- a/src/index.html
+++ b/src/index.html
@@ -18,13 +18,11 @@
</head>
<body>
-<section id="navbar">
-<nav-bar params="route: route"></nav-bar>
-</section>
<section id="dashApp">
-<app-content></app-content>
+ <app-content></app-content>
</section>
+
</body>
</html>
\ No newline at end of file
--
To view, visit https://gerrit.wikimedia.org/r/177463
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: Ib7c443cbcbd00050ee3c0faef2c3cedc5bf076b8
Gerrit-PatchSet: 2
Gerrit-Project: wikimedia/fundraising/dash
Gerrit-Branch: master
Gerrit-Owner: Ssmith <[email protected]>
Gerrit-Reviewer: Awight <[email protected]>
Gerrit-Reviewer: Ejegg <[email protected]>
Gerrit-Reviewer: jenkins-bot <>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
