Ssmith has uploaded a new change for review.

  https://gerrit.wikimedia.org/r/177463

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, 45 insertions(+), 21 deletions(-)


  git pull ssh://gerrit.wikimedia.org:29418/wikimedia/fundraising/dash 
refs/changes/63/177463/1

diff --git a/src/components/app-content/app-content.html 
b/src/components/app-content/app-content.html
index 4606be5..df8f32d 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" data-bind="visible: 
!loggedIn()"><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..6dcd170 100644
--- a/src/components/app-content/app-content.js
+++ b/src/components/app-content/app-content.js
@@ -18,6 +18,17 @@
                 return value === e;
             };
         };
+
+        self.loggedIn = ko.observable(false);
+        self.welcome = ko.observable('');
+        $.get('/user/info', function(userInfo) {
+            if (userInfo) {
+                var name = userInfo.name;
+                self.welcome(userInfo['name'].charAt(0).toUpperCase() + 
userInfo['name'].slice(1));
+            } else {
+                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..9b6db58 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..a273622 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: newchange
Gerrit-Change-Id: Ib7c443cbcbd00050ee3c0faef2c3cedc5bf076b8
Gerrit-PatchSet: 1
Gerrit-Project: wikimedia/fundraising/dash
Gerrit-Branch: master
Gerrit-Owner: Ssmith <ssm...@wikimedia.org>

_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits

Reply via email to