Subdir support for admin interface

refs #527

core/client/assets/lib/uploader.js

@@ -47,7 +47,7 @@
                         .attr({'src': '', "width": 'auto', "height": 'auto'});
 
                     $progress.animate({"opacity": 0}, 250, function () {
-                        $dropzone.find('span.media').after('<img class="fileupload-loading"  src="/ghost/img/loadingcat.gif" />');
+                        $dropzone.find('span.media').after('<img class="fileupload-loading"  src="' + Ghost.paths.ghostRoot + '/ghost/img/loadingcat.gif" />');
                         if (!settings.editor) {$progress.find('.fileupload-loading').css({"top": "56px"}); }
                     });
                     $dropzone.trigger("uploadsuccess", [result]);
@@ -62,7 +62,7 @@
                 var self = this;
 
                 $dropzone.find('.js-fileupload').fileupload().fileupload("option", {
-                    url: '/ghost/upload/',
+                    url: Ghost.paths.ghostRoot + '/ghost/upload/',
                     headers: {
                         'X-CSRF-Token': $("meta[name='csrf-param']").attr('content')
                     },

core/client/init.js

@@ -2,6 +2,16 @@
 (function () {
     'use strict';
 
+    function ghostPaths() {
+        var path = window.location.pathname,
+            root = path.substr(0, path.search('/ghost/'));
+
+        return {
+            ghostRoot: root,
+            apiRoot: root + '/ghost/api/v0.1'
+        };
+    }
+
     var Ghost = {
         Layout      : {},
         Views       : {},
@@ -9,9 +19,7 @@
         Models      : {},
         Validate    : new Validator(),
 
-        settings: {
+        paths: ghostPaths(),
-            apiRoot: '/ghost/api/v0.1'
-        },
 
         // This is a helper object to denote legacy things in the
         // middle of being transitioned.
@@ -46,7 +54,7 @@
         Backbone.history.start({
             pushState: true,
             hashChange: false,
-            root: '/ghost'
+            root: Ghost.paths.ghostRoot + '/ghost'
         });
     };
 

core/client/models/post.js

@@ -50,7 +50,7 @@
         nextPage: 0,
         prevPage: 0,
 
-        url: Ghost.settings.apiRoot + '/posts/',
+        url: Ghost.paths.apiRoot + '/posts/',
         model: Ghost.Models.Post,
 
         parse: function (resp) {

core/client/models/settings.js

@@ -3,7 +3,7 @@
     'use strict';
     //id:0 is used to issue PUT requests
     Ghost.Models.Settings = Ghost.ProgressModel.extend({
-        url: Ghost.settings.apiRoot + '/settings/?type=blog,theme',
+        url: Ghost.paths.apiRoot + '/settings/?type=blog,theme',
         id: '0',
         parse: function (resp) {
             resp.permalinks = resp.permalinks === "/:slug/" ? "" : "1";

core/client/models/tag.js

@@ -3,6 +3,6 @@
     'use strict';
 
     Ghost.Collections.Tags = Ghost.ProgressCollection.extend({
-        url: Ghost.settings.apiRoot + '/tags/'
+        url: Ghost.paths.apiRoot + '/tags/'
     });
 }());

core/client/models/themes.js

@@ -3,7 +3,7 @@
     'use strict';
 
     Ghost.Models.Themes = Backbone.Model.extend({
-        url: Ghost.settings.apiRoot + '/themes'
+        url: Ghost.paths.apiRoot + '/themes'
     });
 
-}());
+}());

core/client/models/user.js

@@ -3,11 +3,11 @@
     'use strict';
 
     Ghost.Models.User = Ghost.ProgressModel.extend({
-        url: Ghost.settings.apiRoot + '/users/me/'
+        url: Ghost.paths.apiRoot + '/users/me/'
     });
 
 //    Ghost.Collections.Users = Backbone.Collection.extend({
-//        url: Ghost.settings.apiRoot + '/users/'
+//        url: Ghost.paths.apiRoot + '/users/'
 //    });
 
 }());

core/client/models/widget.js

@@ -36,8 +36,8 @@
     });
 
     Ghost.Collections.Widgets = Ghost.ProgressCollection.extend({
-        // url: Ghost.settings.apiRoot + '/widgets/', // What will this be?
+        // url: Ghost.paths.apiRoot + '/widgets/', // What will this be?
         model: Ghost.Models.Widget
     });
 
-}());
+}());

core/client/router.js

@@ -60,7 +60,7 @@
 
         editor: function (id) {
             var post = new Ghost.Models.Post();
-            post.urlRoot = Ghost.settings.apiRoot + '/posts';
+            post.urlRoot = Ghost.paths.apiRoot + '/posts';
             if (id) {
                 post.id = id;
                 post.fetch({ data: {status: 'all'}}).then(function () {

core/client/views/base.js

@@ -205,7 +205,7 @@
                     headers: {
                         'X-CSRF-Token': $("meta[name='csrf-param']").attr('content')
                     },
-                    url: Ghost.settings.apiRoot + '/notifications/' + $(self).find('.close').data('id')
+                    url: Ghost.paths.apiRoot + '/notifications/' + $(self).find('.close').data('id')
                 }).done(function (result) {
                     /*jslint unparam:true*/
                     bbSelf.$el.slideUp(250, function () {
@@ -239,7 +239,7 @@
                 headers: {
                     'X-CSRF-Token': $("meta[name='csrf-param']").attr('content')
                 },
-                url: Ghost.settings.apiRoot + '/notifications/' + $(self).data('id')
+                url: Ghost.paths.apiRoot + '/notifications/' + $(self).data('id')
             }).done(function (result) {
                 /*jslint unparam:true*/
                 var height = bbSelf.$('.js-notification').outerHeight(true),

core/client/views/blog.js

@@ -214,7 +214,7 @@
             e.preventDefault();
             // for now this will disable "open in new tab", but when we have a Router implemented
             // it can go back to being a normal link to '#/ghost/editor/X'
-            window.location = '/ghost/editor/' + this.model.get('id') + '/';
+            window.location = Ghost.paths.ghostRoot + '/ghost/editor/' + this.model.get('id') + '/';
         },
 
         toggleFeatured: function (e) {

core/client/views/login.js

@@ -35,7 +35,7 @@
                 Ghost.Validate.handleErrors();
             } else {
                 $.ajax({
-                    url: '/ghost/signin/',
+                    url: Ghost.paths.ghostRoot + '/ghost/signin/',
                     type: 'POST',
                     headers: {
                         'X-CSRF-Token': $("meta[name='csrf-param']").attr('content')
@@ -100,7 +100,7 @@
                 Ghost.Validate.handleErrors();
             } else {
                 $.ajax({
-                    url: '/ghost/signup/',
+                    url: Ghost.paths.ghostRoot + '/ghost/signup/',
                     type: 'POST',
                     headers: {
                         'X-CSRF-Token': $("meta[name='csrf-param']").attr('content')
@@ -157,7 +157,7 @@
                 Ghost.Validate.handleErrors();
             } else {
                 $.ajax({
-                    url: '/ghost/forgotten/',
+                    url: Ghost.paths.ghostRoot + '/ghost/forgotten/',
                     type: 'POST',
                     headers: {
                         'X-CSRF-Token': $("meta[name='csrf-param']").attr('content')
@@ -224,7 +224,7 @@
             this.$('input, button').prop('disabled', true);
 
             $.ajax({
-                url: '/ghost/reset/' + this.token + '/',
+                url: Ghost.paths.ghostRoot + '/ghost/reset/' + this.token + '/',
                 type: 'POST',
                 headers: {
                     'X-CSRF-Token': $("meta[name='csrf-param']").attr('content')

core/client/views/post-settings.js

@@ -211,7 +211,7 @@
                                     }).then(function () {
                                         // Redirect to content screen if deleting post from editor.
                                         if (window.location.pathname.indexOf('editor') > -1) {
-                                            window.location = '/ghost/content/';
+                                            window.location = Ghost.paths.ghostRoot + '/ghost/content/';
                                         }
                                         Ghost.notifications.addItem({
                                             type: 'success',

core/server/helpers/index.js

@@ -113,6 +113,35 @@ coreHelpers.url = function (options) {
     return output;
 };
 
+// ### Asset helper
+//
+// *Usage example:*
+// `{{asset src="css/screen.css"}}`
+// `{{asset src="css/screen.css" ghost="true"}}`
+//
+// Returns the path to the specified asset. The ghost
+// flag outputs the asset path for the Ghost admin
+coreHelpers.asset = function (context, options) {
+    var output = '',
+        subDir = coreHelpers.ghost.blogGlobals().path,
+        isAdmin = options && options.hash && options.hash.ghost;
+
+    if (subDir === '/') {
+        output += '/';
+    } else {
+        output += subDir + '/';
+    }
+
+    if (isAdmin) {
+        output += 'ghost/';
+    } else {
+        output += 'assets/';
+    }
+
+    output += context;
+    return new hbs.handlebars.SafeString(output);
+};
+
 // ### Author Helper
 //
 // *Usage example:*
@@ -540,47 +569,49 @@ registerHelpers = function (ghost, config) {
     // And expose config
     coreHelpers.config = config;
 
-    ghost.registerThemeHelper('date', coreHelpers.date);
+    ghost.registerThemeHelper('asset', coreHelpers.asset);
-
-    ghost.registerThemeHelper('encode', coreHelpers.encode);
-
-    ghost.registerThemeHelper('pageUrl', coreHelpers.pageUrl);
-
-    ghost.registerThemeHelper('url', coreHelpers.url);
 
     ghost.registerThemeHelper('author', coreHelpers.author);
 
-    ghost.registerThemeHelper('tags', coreHelpers.tags);
-
     ghost.registerThemeHelper('content', coreHelpers.content);
 
+    ghost.registerThemeHelper('date', coreHelpers.date);
+
+    ghost.registerThemeHelper('e', coreHelpers.e);
+
+    ghost.registerThemeHelper('encode', coreHelpers.encode);
+
     ghost.registerThemeHelper('excerpt', coreHelpers.excerpt);
 
     ghost.registerThemeHelper('fileStorage', coreHelpers.fileStorage);
 
-    ghost.registerThemeHelper('ghostScriptTags', coreHelpers.ghostScriptTags);
-
-    ghost.registerThemeHelper('e', coreHelpers.e);
-
-    ghost.registerThemeHelper('json', coreHelpers.json);
-
     ghost.registerThemeHelper('foreach', coreHelpers.foreach);
 
-    ghost.registerThemeHelper('helperMissing', coreHelpers.helperMissing);
+    ghost.registerThemeHelper('ghostScriptTags', coreHelpers.ghostScriptTags);
 
     ghost.registerThemeHelper('has_tag', coreHelpers.has_tag);
 
+    ghost.registerThemeHelper('helperMissing', coreHelpers.helperMissing);
+
+    ghost.registerThemeHelper('json', coreHelpers.json);
+
+    ghost.registerThemeHelper('pageUrl', coreHelpers.pageUrl);
+
+    ghost.registerThemeHelper('tags', coreHelpers.tags);
+
+    ghost.registerThemeHelper('url', coreHelpers.url);
+
     ghost.registerAsyncThemeHelper('body_class', coreHelpers.body_class);
 
-    ghost.registerAsyncThemeHelper('post_class', coreHelpers.post_class);
+    ghost.registerAsyncThemeHelper('ghost_foot', coreHelpers.ghost_foot);
-
-    ghost.registerAsyncThemeHelper('meta_title', coreHelpers.meta_title);
-
-    ghost.registerAsyncThemeHelper('meta_description', coreHelpers.meta_description);
 
     ghost.registerAsyncThemeHelper('ghost_head', coreHelpers.ghost_head);
 
-    ghost.registerAsyncThemeHelper('ghost_foot', coreHelpers.ghost_foot);
+    ghost.registerAsyncThemeHelper('meta_description', coreHelpers.meta_description);
+
+    ghost.registerAsyncThemeHelper('meta_title', coreHelpers.meta_title);
+
+    ghost.registerAsyncThemeHelper('post_class', coreHelpers.post_class);
 
     paginationHelper = ghost.loadTemplate('pagination').then(function (templateFn) {
         coreHelpers.paginationTemplate = templateFn;

core/server/middleware/index.js

@@ -187,7 +187,7 @@ module.exports = function (server) {
     server.use(express.session({
         store: new BSStore(ghost.dataProvider),
         secret: ghost.dbHash,
-        cookie: { path: '/ghost', maxAge: 12 * 60 * 60 * 1000 }
+        cookie: { path: root + '/ghost', maxAge: 12 * 60 * 60 * 1000 }
     }));
 
     //enable express csrf protection

core/server/views/content.hbs

@@ -5,7 +5,7 @@
           <section class="content-filter">
               <small>All Posts</small>
           </section>
-          <a href="/ghost/editor/" class="button button-add" title="New Post"><span class="hidden">New Post</span></a>
+          <a href="{{url}}/ghost/editor/" class="button button-add" title="New Post"><span class="hidden">New Post</span></a>
       </header>
       <section class="content-list-content">
           <ol></ol>
@@ -14,4 +14,4 @@
 
     <section class="content-preview js-content-preview">
     </section>
-</section>
+</section>

core/server/views/debug.hbs

@@ -20,12 +20,12 @@
                 <fieldset>
                     <div class="form-group">
                         <label>Export</label>
-                        <a href="/ghost/api/v0.1/db/" class="button-save">Export</a>
+                        <a href="{{url}}/ghost/api/v0.1/db/" class="button-save">Export</a>
                         <p>Export the blog settings and data.</p>
                     </div>
                 </fieldset>
             </form>
-            <form id="settings-import" method="post" action="/ghost/api/v0.1/db/" enctype="multipart/form-data">
+            <form id="settings-import" method="post" action="{{url}}/ghost/api/v0.1/db/" enctype="multipart/form-data">
                 <input type="hidden" name="_csrf" value="{{csrfToken}}" />
                 <fieldset>
                     <div class="form-group">
@@ -38,4 +38,4 @@
             </form>
         </section>
     </section>
-</div>
+</div>

core/server/views/default.hbs

@@ -15,20 +15,20 @@
     <meta http-equiv="cleartype" content="on">
     <meta name="apple-mobile-web-app-capable" content="yes" />
 
-    <link rel="shortcut icon" href="/favicon.ico">
+    <link rel="shortcut icon" href="{{asset "favicon.ico"}}">
-    <link rel="apple-touch-icon-precomposed" href="/ghost/img/touch-icon-iphone.png" />
+    <link rel="apple-touch-icon-precomposed" href="{{asset "img/touch-icon-iphone.png" ghost="true"}}" />
-    <link rel="apple-touch-icon-precomposed" sizes="76x76" href="/ghost/img/touch-icon-ipad.png" />
+    <link rel="apple-touch-icon-precomposed" sizes="76x76" href="{{asset "img/touch-icon-ipad.png" ghost="true"}}" />
-    <link rel="apple-touch-icon-precomposed" sizes="120x120" href="/ghost/img/small.png" />
+    <link rel="apple-touch-icon-precomposed" sizes="120x120" href="{{asset "img/small.png" ghost="true"}}" />
-    <link rel="apple-touch-icon-precomposed" sizes="152x152" href="/ghost/img/medium.png" />
+    <link rel="apple-touch-icon-precomposed" sizes="152x152" href="{{asset "img/medium.png" ghost="true"}}" />
 
     <meta name="application-name" content="Ghost"/>
     <meta name="msapplication-TileColor" content="#ffffff"/>
-    <meta name="msapplication-square70x70logo" content="/ghost/img/small.png"/>
+    <meta name="msapplication-square70x70logo" content="{{asset "img/small.png" ghost="true"}}" />
-    <meta name="msapplication-square150x150logo" content="/ghost/img/medium.png"/>
+    <meta name="msapplication-square150x150logo" content="{{asset "img/medium.png" ghost="true"}}" />
-    <meta name="msapplication-square310x310logo" content="/ghost/img/large.png"/>
+    <meta name="msapplication-square310x310logo" content="{{asset "img/large.png" ghost="true"}}" />
 
     <link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Open+Sans:400,300,700">
-    <link rel="stylesheet" href="/ghost/css/screen.css">
+    <link rel="stylesheet" href="{{asset "css/screen.css" ghost="true"}}">
     {{{block "pageStyles"}}}
 </head>
 <body class="{{bodyClass}}">

core/server/views/error.hbs

@@ -2,7 +2,7 @@
 <section class="error-content error-404 js-error-container">
     <section class="error-details">
         <figure class="error-image">
-            <img class="error-ghost" src="/ghost/img/404-ghost@2x.png" srcset="/ghost/img/404-ghost.png 1x, /ghost/img/404-ghost@2x.png 2x"/>
+            <img class="error-ghost" src="{{asset "img/404-ghost@2x.png" ghost="true"}} srcset="{{asset "img/404-ghost.png" ghost="true"}} 1x, {{asset "img/404-ghost@2x.png" ghost="true"}} 2x"/>
         </figure>
         <section class="error-message">
             <h1 class="error-code">{{code}}</h1>
@@ -24,4 +24,4 @@
             {{/foreach}}
         </ul>
     </section>
-{{/if}}
+{{/if}}

core/server/views/partials/navbar.hbs

@@ -3,20 +3,20 @@
     <nav id="global-nav" role="navigation">
         <ul id="main-menu" >
             {{#each adminNav}}
-                <li class="{{navClass}}{{#if selected}} active{{/if}}"><a href="/ghost{{path}}">{{name}}</a></li>
+                <li class="{{navClass}}{{#if selected}} active{{/if}}"><a href="{{url}}/ghost{{path}}">{{name}}</a></li>
             {{/each}}
 
             <li id="usermenu" class="subnav">
                 <a href="#" data-toggle="ul" class="dropdown">
-                    <img class="avatar" src="{{#if currentUser.image}}{{currentUser.image}}{{else}}/shared/img/user-image.png{{/if}}" alt="Avatar" />
+                    <img class="avatar" src="{{#if currentUser.image}}{{currentUser.image}}{{else}}{{asset "shared/img/user-image.png"}}{{/if}}" alt="Avatar" />
                     <span class="name">{{#if currentUser.name}}{{currentUser.name}}{{else}}{{currentUser.email}}{{/if}}</span>
                 </a>
                 <ul class="overlay">
-                    <li class="usermenu-profile"><a href="/ghost/settings/user/">Your Profile</a></li>
+                    <li class="usermenu-profile"><a href="{{url}}/ghost/settings/user/">Your Profile</a></li>
                     <li class="divider"></li>
                     <li class="usermenu-help"><a href="http://ghost.org/forum/">Help / Support</a></li>
                     <li class="divider"></li>
-                    <li class="usermenu-signout"><a href="/ghost/signout/">Sign Out</a></li>
+                    <li class="usermenu-signout"><a href="{{url}}/ghost/signout/">Sign Out</a></li>
                 </ul>
             </li>
         </ul>

core/server/views/user-error.hbs

@@ -17,7 +17,7 @@
 		<meta http-equiv="cleartype" content="on">
 
 		<link rel="stylesheet" type='text/css' href='//fonts.googleapis.com/css?family=Open+Sans:400,300,700'>
-		<link rel="stylesheet" href="/ghost/css/screen.css">
+		<link rel="stylesheet" href="{{asset "css/screen.css" ghost="true"}}">
 		{{{block "pageStyles"}}}
 	</head>
 	<body class="{{bodyClass}}">
@@ -27,8 +27,8 @@
 					<figure class="error-image">
 						<img
 							class="error-ghost"
-							src="/ghost/img/404-ghost@2x.png"
+							src="{{asset "img/404-ghost@2x.png" ghost="true"}}"
-							srcset="/ghost/img/404-ghost.png 1x, /ghost/img/404-ghost@2x.png 2x"/>
+							srcset="{{asset "img/404-ghost.png" ghost="true"}} 1x, {{asset "img/404-ghost@2x.png" ghost="true"}} 2x"/>
 					</figure>
 					<section class="error-message">
 						<h1 class="error-code">{{code}}</h1>
@@ -53,4 +53,4 @@
 			{{/if}}
 		</main>
 	</body>
-</html>
+</html>