Removing old "user settings" screen and putting in new MU "users settings" screen and updating functional test cases.

Fixes #3078
- new "users" resource, with matching controller and template
- fetching real data from /ghost/api/v0.1/users/
- updated "user" route to accept a :slug as a URL parameter
- updated labels everywhere (from "user" to "users")
- updated "profile" link to header to point to proper "users/:slug" route
- updated core/client/.jshintrc to recognize moment as a valid global function
- adjusted DOM selector used in Casper to properly identify the new screen
- adding "slug" as a new property of the user data used during the Casper functional tests

ghost/admin/.jshintrc

@@ -30,6 +30,7 @@
         "validator": true,
         "ic": true,
         "_": true,
-        "NProgress": true
+        "NProgress": true,
+        "moment": true
     }
 }

ghost/admin/controllers/settings/users/index.js

@@ -0,0 +1,18 @@
+/*global alert */
+var UsersIndexController = Ember.ArrayController.extend({
+    activeUsers: function () {
+        return this.content.filterBy('status', 'active');
+    }.property('model'),
+
+    invitedUsers: function () {
+        return this.content.filterBy('status', 'invited');
+    }.property('model'),
+
+    actions: {
+        addUser: function () {
+            alert('@TODO: needs to show the "add user" modal - see issue #3079 on GitHub');
+        }
+    }
+});
+
+export default UsersIndexController;

ghost/admin/controllers/settings/users/user.js

@@ -3,7 +3,10 @@ var SettingsUserController = Ember.ObjectController.extend({
 
     user: Ember.computed.alias('model'),
 
+    email: Ember.computed.readOnly('user.email'),
+
     coverDefault: '/shared/img/user-cover.png',
+
     cover: function () {
         // @TODO: add {{asset}} subdir path
         var cover = this.get('user.cover');
@@ -19,10 +22,31 @@ var SettingsUserController = Ember.ObjectController.extend({
 
     image: function () {
         // @TODO: add {{asset}} subdir path
-        return 'background-image: url(' + this.getWithDefault('user.image', '/shared/img/user-image.png') + ')';
+        return  'background-image: url(' + this.getWithDefault('user.image', '/shared/img/user-image.png') + ')';
     }.property('user.image'),
 
+    imageUrl: function () {
+        // @TODO: add {{asset}} subdir path
+        return  this.getWithDefault('user.image', '/shared/img/user-image.png');
+    }.property('user.image'),
+
+    last_login: function () {
+        return moment(this.get('user.last_login')).fromNow();
+    }.property('user.last_login'),
+
+    created_at: function () {
+        return moment(this.get('user.created_at')).fromNow();
+    }.property('user.created_at'),
+
     actions: {
+        revoke: function () {
+            alert('@TODO: revoke users invitation');
+        },
+
+        resend: function () {
+            alert('@TODO: resend users invitation');
+        },
+
         save: function () {
             var user = this.get('user'),
                 self = this;

ghost/admin/router.js

@@ -30,7 +30,9 @@ Router.map(function () {
     });
     this.resource('settings', function () {
         this.route('general');
-        this.route('user');
+        this.resource('settings.users', { path: '/users' }, function () {
+            this.route('user', { path: '/:slug' });
+        });
         this.route('apps');
     });
     this.route('debug');

ghost/admin/routes/settings/users.js

@@ -0,0 +1,3 @@
+var UsersRoute = Ember.Route.extend(Ember.SimpleAuth.AuthenticatedRouteMixin);
+
+export default UsersRoute;

ghost/admin/routes/settings/users/index.js

@@ -0,0 +1,8 @@
+var UsersIndexRoute = Ember.Route.extend(Ember.SimpleAuth.AuthenticatedRouteMixin, {
+
+    model: function () {
+        return this.store.find('user');
+    }
+});
+
+export default UsersIndexRoute;

ghost/admin/templates/-navbar.hbs

@@ -18,7 +18,7 @@
                     <span class="name">{{session.user.name}}</span>
                 {{/gh-popover-button}}
                 {{#gh-popover tagName="ul" classNames="overlay" name="user-menu" closeOnClick="true"}}
-                        <li class="usermenu-profile">{{#link-to "settings.user"}}Your Profile{{/link-to}}</li>
+                        <li class="usermenu-profile">{{#link-to "settings.users.user" session.user.slug}}Your Profile{{/link-to}}</li>
                         <li class="divider"></li>
                         <li class="usermenu-help"><a href="http://support.ghost.org/">Help / Support</a></li>
                         <li class="divider"></li>

ghost/admin/templates/settings.hbs

@@ -9,7 +9,7 @@
             {{/view}}
 
             {{#view "item-view" tagName="li" class="users"}}
-            {{#link-to "settings.user"}}User{{/link-to}}
+            {{#link-to "settings.users"}}Users{{/link-to}}
             {{/view}}
 
             {{#if showApps}}

ghost/admin/templates/settings/users/index.hbs

@@ -0,0 +1,63 @@
+<header class="fade-in">
+    <button class="button-back">Back</button>
+    <h2 class="title">Users</h2>
+    <section class="page-actions">
+        <a class="button-add" href="#" {{action "addUser"}} >New&nbsp;User</a>
+    </section>
+</header>
+
+<section class="content fade-in settings-users">
+    <section class="object-list">
+
+        <h4 class="object-list-title">Invited users</h4>
+
+        {{#each invitedUsers itemController="settings/users/user"}}
+            <div class="object-list-item">
+                <span class="object-list-item-icon icon-mail">ic</span>
+
+                <div class="object-list-item-body">
+                    <span class="name">{{email}}</span><br>
+                    <span class="description">Invitation sent: {{created_at}}</span>
+                </div>
+                <aside class="object-list-item-aside">
+                    <a class="object-list-action" href="#" {{action "revoke"}}>Revoke</a>
+                    <a class="object-list-action" href="#" {{action "resend"}}>Resend</a>
+                </aside>
+            </div>
+        {{else}}
+            <div class="object-list-item">
+                No invited users.
+            </div>
+        {{/each}}
+
+
+    </section>
+
+    <section class="object-list">
+
+        <h4 class="object-list-title">Active users</h4>
+
+
+        {{#each activeUsers itemController="settings/users/user"}}
+            <div class="object-list-item">
+                <img class="object-list-item-figure"
+                     src="{{unbound imageUrl}}"
+                     alt="Photo of {{unbound name}}" />
+
+                <div class="object-list-item-body">
+                    {{#link-to 'settings.users.user' slug class="ember-view name" }}
+                        {{user.name}}
+                    {{/link-to}}
+                    <br>
+                    <span class="description">Last seen: {{unbound last_login}}</span>
+                </div>
+                <!-- @TODO: replace these with real access level once API and data model are updated -->
+                <aside class="object-list-item-aside">
+                    <span class="role-label editor">Editor</span>
+                    <span class="role-label owner">Owner</span>
+                </aside>
+            </div>
+        {{/each}}
+
+    </section>
+</section>