System page added, with link to logs

UI/Content/base.less

@@ -114,3 +114,9 @@ th {
   margin   : 50px auto 0px auto;
   display  : block;
 }
+
+a {
+  i {
+    cursor: pointer;
+  }
+}

UI/Controller.js

@@ -13,16 +13,18 @@ define(
         'Calendar/CalendarLayout',
         'Logs/Layout',
         'Release/Layout',
+        'System/Layout',
         'Shared/NotFoundView',
         'Shared/Modal/Region'
     ], function (App, Marionette, HistoryLayout, SettingsLayout, AddSeriesLayout, SeriesIndexLayout, SeriesDetailsLayout, MissingLayout, SeriesModel, CalendarLayout,
-        LogsLayout, ReleaseLayout, NotFoundView) {
+        LogsLayout, ReleaseLayout, SystemLayout, NotFoundView) {
         return Marionette.Controller.extend({
 
             series       : function () {
                 this._setTitle('NzbDrone');
                 App.mainRegion.show(new SeriesIndexLayout());
             },
+
             seriesDetails: function (query) {
 
                 var self = this;
@@ -74,12 +76,16 @@ define(
                 App.mainRegion.show(new LogsLayout());
             },
 
+            system: function () {
+                this._setTitle('system');
+                App.mainRegion.show(new SystemLayout());
+            },
+
             notFound: function () {
                 this._setTitle('Not Found');
                 App.mainRegion.show(new NotFoundView(this));
             },
 
-
             _setTitle: function (title) {
                 //$('#title-region').html(title);
 

UI/Router.js

@@ -23,6 +23,7 @@ require(
                 'history'                   : 'history',
                 'logs'                      : 'logs',
                 'rss'                       : 'rss',
+                'system'                    : 'system',
                 ':whatever'                 : 'notFound'
             }
         });

UI/System/About/View.js

@@ -0,0 +1,9 @@
+'use strict';
+define(
+    [
+        'marionette'
+    ], function (Marionette) {
+        return Marionette.ItemView.extend({
+            template: 'System/About/ViewTemplate'
+        });
+    });

UI/System/About/ViewTemplate.html

@@ -0,0 +1,8 @@
+<dl class="dl-horizontal">
+    <dt>Version</dt>
+        <dd>{{version}}</dd>
+    <dt>AppData directory</dt>
+        <dd>{{appData}}</dd>
+    <dt>Startup directory</dt>
+        <dd>{{startupPath}}</dd>
+</dl>

UI/System/Layout.js

@@ -0,0 +1,74 @@
+'use strict';
+define(
+    [
+        'app',
+        'marionette',
+        'System/StatusModel',
+        'System/About/View',
+        'Logs/Layout',
+        'Shared/Toolbar/ToolbarLayout',
+        'Shared/LoadingView'
+    ], function (App,
+                 Marionette,
+                 StatusModel,
+                 AboutView,
+                 LogsLayout,
+                 ToolbarLayout,
+                 LoadingView) {
+        return Marionette.Layout.extend({
+            template: 'System/LayoutTemplate',
+
+            regions: {
+                toolbar : '#toolbar',
+                about   : '#about',
+                loading : '#loading'
+            },
+
+            leftSideButtons: {
+                type      : 'default',
+                storeState: false,
+                items     :
+                    [
+                        {
+                            title: 'Logs',
+                            icon : 'icon-book',
+                            route: 'logs'
+                        },
+//                        {
+//                            title         : 'Restart',
+//                            icon          : 'icon-repeat',
+//                            command       : 'restart',
+//                            successMessage: 'NzbDrone restart has been triggered',
+//                            errorMessage  : 'Failed to restart NzbDrone'
+//                        },
+//                        {
+//                            title         : 'Shutdown',
+//                            icon          : 'icon-power-off',
+//                            command       : 'shutdown',
+//                            successMessage: 'NzbDrone shutdown has started',
+//                            errorMessage  : 'Failed to shutdown NzbDrone'
+//                        }
+                    ]
+            },
+
+            initialize: function () {
+                this.statusModel = StatusModel;
+            },
+
+            onRender: function () {
+                this._showToolbar();
+                this.about.show(new AboutView({ model: this.statusModel }));
+            },
+
+            _showToolbar: function () {
+                this.toolbar.show(new ToolbarLayout({
+                    left   :
+                        [
+                            this.leftSideButtons
+                        ],
+                    context: this
+                }));
+            }
+        });
+    });
+

UI/System/LayoutTemplate.html

@@ -0,0 +1,17 @@
+<div class="row">
+    <div class="span12">
+        <div id="toolbar"></div>
+    </div>
+</div>
+
+<div class="row">
+    <div class="span12">
+        <div id="about"></div>
+    </div>
+</div>
+
+<div class="row">
+    <div class="span12">
+        <div id="loading"></div>
+    </div>
+</div>

UI/System/StatusModel.js

@@ -1,12 +1,11 @@
 'use strict';
 define(
     [
-        'backbone',
-        'constants'
+        'backbone'
     ], function (Backbone) {
 
         var model = Backbone.Model.extend({
-            url: Constants.ApiRoot + '/system/status'
+            url: window.ApiRoot + '/system/status'
         });
 
 

UI/index.html

@@ -66,6 +66,13 @@
                             Settings
                         </a>
                     </li>
+                    <li>
+                        <a href="system">
+                            <i class="icon-laptop"></i>
+                            <br>
+                            System
+                        </a>
+                    </li>
                     <li>
                         <a href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=KRTE52U3XJDSQ" target="_blank">
                             <i class="icon-heart"></i>