FIX: Wizard didn't work with subfolders

app/assets/javascripts/discourse-common/lib/get-url.js.es6

@@ -0,0 +1,20 @@
+let baseUri;
+
+export default function getURL(url) {
+  if (!url) return url;
+
+  if (!baseUri) {
+    baseUri = $('meta[name="discourse-base-uri"]').attr('content') || '';
+  }
+
+  // if it's a non relative URL, return it.
+  if (url !== '/' && !/^\/[^\/]/.test(url)) return url;
+
+  const found = url.indexOf(baseUri);
+
+  if (found >= 0 && found < 3) return url;
+  if (url[0] !== "/") url = "/" + url;
+
+  return baseUri + url;
+}
+

app/assets/javascripts/discourse/components/global-notice.js.es6

@@ -18,7 +18,8 @@ export default Ember.Component.extend(StringBuffer, {
     }
 
     if (this.site.get('wizard_required')) {
-      notices.push([I18n.t('wizard_required'), 'alert-wizard']);
+      const requiredText = I18n.t('wizard_required', {url: Discourse.getURL('/wizard')});
+      notices.push([requiredText, 'alert-wizard']);
     }
 
     if (this.currentUser && this.currentUser.get('staff') && this.siteSettings.bootstrap_mode_enabled) {

app/assets/javascripts/wizard/components/wizard-field-image.js.es6

@@ -1,3 +1,4 @@
+import getUrl from 'discourse-common/lib/get-url';
 import computed from 'ember-addons/ember-computed-decorators';
 import { getToken } from 'wizard/lib/ajax';
 
@@ -20,7 +21,7 @@ export default Ember.Component.extend({
     const id = this.get('field.id');
 
     $upload.fileupload({
-      url: "/uploads.json",
+      url: getUrl("/uploads.json"),
       formData: { synchronous: true,
                   type: `wizard_${id}`,
                   authenticity_token: getToken() },

app/assets/javascripts/wizard/components/wizard-step.js.es6

@@ -1,3 +1,4 @@
+import getUrl from 'discourse-common/lib/get-url';
 import { default as computed, observes } from 'ember-addons/ember-computed-decorators';
 
 jQuery.fn.wiggle = function (times, duration) {
@@ -37,7 +38,7 @@ export default Ember.Component.extend({
   @computed('step.banner')
   bannerImage(src) {
     if (!src) { return; }
-    return `/images/wizard/${src}`;
+    return getUrl(`/images/wizard/${src}`);
   },
 
   @observes('step.id')
@@ -91,7 +92,7 @@ export default Ember.Component.extend({
 
   actions: {
     quit() {
-      document.location = "/";
+      document.location = getUrl("/");
     },
 
     backStep() {

app/assets/javascripts/wizard/controllers/step.js.es6

@@ -1,3 +1,5 @@
+import getUrl from 'discourse-common/lib/get-url';
+
 export default Ember.Controller.extend({
   wizard: null,
   step: null,
@@ -6,7 +8,7 @@ export default Ember.Controller.extend({
     goNext(response) {
       const next = this.get('step.next');
       if (response.refresh_required) {
-        document.location = `/wizard/steps/${next}`;
+        document.location = getUrl(`/wizard/steps/${next}`);
       } else {
         this.transitionToRoute('step', next);
       }

app/assets/javascripts/wizard/lib/ajax.js.es6

@@ -1,3 +1,4 @@
+import getUrl from 'discourse-common/lib/get-url';
 
 let token;
 
@@ -14,6 +15,7 @@ export function ajax(args) {
     args.headers = { 'X-CSRF-Token': getToken() };
     args.success = data => Ember.run(null, resolve, data);
     args.error = xhr => Ember.run(null, reject, xhr);
+    args.url = getUrl(args.url);
     Ember.$.ajax(args);
   });
 }

app/assets/javascripts/wizard/lib/preview.js.es6

@@ -1,4 +1,5 @@
 /*eslint no-bitwise:0 */
+import getUrl from 'discourse-common/lib/get-url';
 
 export const LOREM = `
 Lorem ipsum dolor sit amet, consectetur adipiscing elit.
@@ -190,8 +191,10 @@ export function createPreviewComponent(width, height, obj) {
 }
 
 function loadImage(src) {
+  if (!src) { return Ember.RSVP.Promise.resolve(); }
+
   const img = new Image();
-  img.src = src;
+  img.src = getUrl(src);
   return new Ember.RSVP.Promise(resolve => img.onload = () => resolve(img));
 };
 

app/assets/javascripts/wizard/router.js.es6

@@ -1,5 +1,7 @@
+import getUrl from 'discourse-common/lib/get-url';
+
 const Router = Ember.Router.extend({
-  rootURL: '/wizard',
+  rootURL: getUrl('/wizard'),
   location: Ember.testing ? 'none': 'history'
 });
 

app/assets/javascripts/wizard/templates/application.hbs

@@ -7,6 +7,6 @@
     {{outlet}}
   </div>
   <div class='wizard-footer'>
-    <img src="/images/wizard/discourse.png" class="logo">
+    <div class='discourse-logo'></div>
   </div>
 </div>

app/assets/stylesheets/wizard.scss

@@ -5,7 +5,7 @@
 
 body.wizard {
   background-color: #fff;
-  background-image: url('/images/wizard/bubbles.png');
+  background-image: asset-url('/images/wizard/bubbles.png');
   background-repeat: repeat;
   background-position: left top;
 
@@ -14,6 +14,14 @@ body.wizard {
   line-height: 1.4em;
 }
 
+.discourse-logo {
+  background-image: asset-url('/images/wizard/discourse.png');
+  height: 30px;
+  width: 110px;
+  background-size: 110px 30px;
+  background-repeat: no-repeat;
+}
+
 .wizard-warning {
   font-family: sans-serif,
 
@@ -119,9 +127,6 @@ body.wizard {
     border-top: 1px solid #ccc;
     background-color: #eee;
     padding: 0.5em;
-    img.logo {
-      height: 30px;
-    }
   }
 
   .wizard-progress {

app/views/layouts/application.html.erb

@@ -30,7 +30,7 @@
     <%= script "application" %>
 
     <%- if staff? %>
-      <script src="/extra-locales/admin"></script>
+      <script src="<%= Discourse.base_uri %>/extra-locales/admin"></script>
       <%= script "admin" %>
     <%- end %>
 

app/views/wizard/index.html.erb

@@ -6,9 +6,11 @@
     <%= script 'wizard-application' %>
     <%= script "locales/#{I18n.locale}" %>
     <%= render partial: "common/special_font_face" %>
-    <script src="/extra-locales/wizard"></script>
+    <script src="<%= Discourse.base_uri %>/extra-locales/wizard"></script>
     <%= csrf_meta_tags %>
 
+    <meta name="discourse-base-uri" content="<%= Discourse.base_uri %>">
+
     <%= render partial: "layouts/head" %>
     <title><%= t 'wizard.title' %></title>
   </head>

config/locales/client.en.yml

@@ -165,7 +165,7 @@ en:
 
     topic_admin_menu: "topic admin actions"
 
-    wizard_required: "It's time to configure your forum! <a href='/wizard/' data-auto-route='true'>Start the Setup Wizard</a>!"
+    wizard_required: "It's time to configure your forum! <a href='%{url}' data-auto-route='true'>Start the Setup Wizard</a>!"
     emails_are_disabled: "All outgoing email has been globally disabled by an administrator. No email notifications of any kind will be sent."
 
     bootstrap_mode_enabled: "To make launching your new site easier, you are in bootstrap mode. All new users will be granted trust level 1 and have daily email digest updates enabled. This will be automatically turned off when total user count exceeds %{min_users} users."