Allow Cachet setup not to be at server's root

Cachet may be installed at the root of its vhost or in a subdirectory,
for example in "/" or under "/status".

The URI we found pointing to some assets were usually not prefixed with
the path, so if Cachet was installed under "/status" the asset
URI pointed to the server root like "/my-asset.js".
It is a problem because that means the behaviour is broken in this case.
The problem was present from the setup, it was not possible to fill the
setup since the path to the scripts and CSS weres wrong.

The "asset" helper is now used and resolves the URI.

See: cachethq#3618

public/build/rev-manifest.json

@@ -1,4 +1,4 @@
 {
   "dist/css/all.css": "dist/css/all-2812406e36.css",
-  "dist/js/all.js": "dist/js/all-b2c62d4294.js"
-}
+  "dist/js/all.js": "dist/js/all-83303e6904.js"
+}

resources/assets/js/app.js

@@ -289,6 +289,8 @@ $(function() {
         // Only validate going forward. If current group is invalid, do not go further
         if (next > current) {
             var url = '/setup/step' + current;
+            var currentUrl = window.location.href.replace(/step\d/, '');
+            var url = currentUrl + '/step' + current;
             $.post(url, $form.serializeObject())
                 .done(function(response) {
                     goToStep(current, next);

resources/views/layout/master.blade.php

@@ -7,8 +7,8 @@
     <meta name="env" content="{{ app('env') }}">
     <meta name="token" content="{{ csrf_token() }}">
 
-    <link rel="alternate" type="application/atom+xml" href="/atom" title="{{ $site_title }} - Atom Feed">
-    <link rel="alternate" type="application/rss+xml" href="/rss" title="{{ $site_title }} - RSS Feed">
+    <link rel="alternate" type="application/atom+xml" href="{{ asset('/atom') }}" title="{{ $site_title }} - Atom Feed">
+    <link rel="alternate" type="application/rss+xml" href="{{ asset('/rss') }}" title="{{ $site_title }} - RSS Feed">
 
     <!-- Mobile friendliness -->
     <meta name="HandheldFriendly" content="True">
@@ -19,35 +19,35 @@
 
     <meta property="og:type" content="website">
     <meta property="og:title" content="{{ $site_title }}">
-    <meta property="og:image" content="/img/ogimage.png">
+    <meta property="og:image" content="{{ asset('/img/ogimage.png') }}">
     <meta property="og:description" content="{{ trans('cachet.description', ['app' => $app_name]) }}">
 
     <!-- Mobile IE allows us to activate ClearType technology for smoothing fonts for easy reading -->
     <meta http-equiv="cleartype" content="on">
 
     <meta name="msapplication-TileColor" content="{{ $theme_greens }}" />
-    <meta name="msapplication-TileImage" content="/img/favicon.png" />
+    <meta name="msapplication-TileImage" content="{{ asset('/img/favicon.png') }} " />
 
     @if (isset($favicon))
-    <link rel="icon" type="image/png" href="/img/{{ $favicon }}.ico">
-    <link rel="shortcut icon" href="/img/{{ $favicon }}.png" type="image/x-icon">
+    <link rel="icon" type="image/png" href="{{ asset('/img/' ~ $favicon ~ '.ico') }}">
+    <link rel="shortcut icon" href="{{ asset('/img/' ~ $favicon ~ '.png') }}" type="image/x-icon">
     @else
-    <link rel="icon" type="image/png" href="/img/favicon.ico">
-    <link rel="shortcut icon" href="/img/favicon.png" type="image/x-icon">
+    <link rel="icon" type="image/png" href="{{ asset('/img/favicon.ico') }}">
+    <link rel="shortcut icon" href="{{ asset('/img/favicon.png') }}" type="image/x-icon">
     @endif
 
-    <link rel="apple-touch-icon" href="/img/apple-touch-icon.png">
-    <link rel="apple-touch-icon" sizes="57x57" href="/img/apple-touch-icon-57x57.png">
-    <link rel="apple-touch-icon" sizes="72x72" href="/img/apple-touch-icon-72x72.png">
-    <link rel="apple-touch-icon" sizes="114x114" href="/img/apple-touch-icon-114x114.png">
-    <link rel="apple-touch-icon" sizes="120x120" href="/img/apple-touch-icon-120x120.png">
-    <link rel="apple-touch-icon" sizes="144x144" href="/img/apple-touch-icon-144x144.png">
-    <link rel="apple-touch-icon" sizes="152x152" href="/img/apple-touch-icon-152x152.png">
+    <link rel="apple-touch-icon" href="{{ asset('/img/apple-touch-icon.png') }}">
+    <link rel="apple-touch-icon" sizes="57x57" href="{{ asset('/img/apple-touch-icon-57x57.png') }}">
+    <link rel="apple-touch-icon" sizes="72x72" href="{{ asset('/img/apple-touch-icon-72x72.png') }}">
+    <link rel="apple-touch-icon" sizes="114x114" href="{{ asset('/img/apple-touch-icon-114x114.png') }}">
+    <link rel="apple-touch-icon" sizes="120x120" href="{{ asset('/img/apple-touch-icon-120x120.png') }}">
+    <link rel="apple-touch-icon" ssizes="144x144" href="{{ asset('/img/apple-touch-icon-144x144.png') }}">
+    <link rel="apple-touch-icon" sizes="152x152" href="{{ asset('/img/apple-touch-icon-152x152.png') }}">
 
     <title>{{ $site_title }}</title>
 
     <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,700&subset={{ $font_subset }}" rel="stylesheet" type="text/css">
-    <link rel="stylesheet" href="{{ elixir('dist/css/all.css') }}">
+    <link rel="stylesheet" href="{{ asset(elixir('dist/css/all.css')) }}">
 
     @include('partials.stylesheet')
 
@@ -63,7 +63,7 @@
         var Global = {};
         Global.locale = '{{ $app_locale }}';
     </script>
-    <script src="{{ elixir('dist/js/all.js') }}"></script>
+    <script src="{{ asset(elixir('dist/js/all.js')) }}"></script>
 </head>
 <body class="status-page @yield('bodyClass')">
     @yield('outer-content')

resources/views/partials/head.blade.php

@@ -7,21 +7,21 @@
     <meta name="env" content="{{ app('env') }}">
     <meta name="token" content="{{ csrf_token() }}">
 
-    <link rel="icon" type="image/png" href="/img/favicon.ico">
-    <link rel="shortcut icon" href="/img/favicon.png" type="image/x-icon">
+    <link rel="icon" type="image/png" href="{{ asset('/img/favicon.ico') }}">
+    <link rel="shortcut icon" href="{{ asset('/img/favicon.png') }}" type="image/x-icon">
 
-    <link rel="apple-touch-icon" href="/img/apple-touch-icon.png">
-    <link rel="apple-touch-icon" sizes="57x57" href="/img/apple-touch-icon-57x57.png">
-    <link rel="apple-touch-icon" sizes="72x72" href="/img/apple-touch-icon-72x72.png">
-    <link rel="apple-touch-icon" sizes="114x114" href="/img/apple-touch-icon-114x114.png">
-    <link rel="apple-touch-icon" sizes="120x120" href="/img/apple-touch-icon-120x120.png">
-    <link rel="apple-touch-icon" sizes="144x144" href="/img/apple-touch-icon-144x144.png">
-    <link rel="apple-touch-icon" sizes="152x152" href="/img/apple-touch-icon-152x152.png">
+    <link rel="apple-touch-icon" href="{{ asset('/img/apple-touch-icon.png') }}">
+    <link rel="apple-touch-icon" sizes="57x57" href="{{ asset('/img/apple-touch-icon-57x57.png') }}">
+    <link rel="apple-touch-icon" sizes="72x72" href="{{ asset('/img/apple-touch-icon-72x72.png') }}">
+    <link rel="apple-touch-icon" sizes="114x114" href="{{ asset('/img/apple-touch-icon-114x114.png') }}">
+    <link rel="apple-touch-icon" sizes="120x120" href="{{ asset('/img/apple-touch-icon-120x120.png') }}">
+    <link rel="apple-touch-icon" sizes="144x144" href="{{ asset('/img/apple-touch-icon-144x144.png') }}">
+    <link rel="apple-touch-icon" sizes="152x152" href="{{ asset('/img/apple-touch-icon-152x152.png') }}">
 
     <title>{{ $page_title or $site_title }}</title>
 
     <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,700&subset={{ $font_subset }}" rel="stylesheet" type="text/css">
-    <link rel="stylesheet" href="{{ elixir('dist/css/all.css') }}">
+    <link rel="stylesheet" href="{{ asset(elixir('dist/css/all.css')) }}">
     @yield('css')
 
     @include('partials.crowdin')
@@ -30,5 +30,5 @@
         var Global = {};
         Global.locale = '{{ $app_locale }}';
     </script>
-    <script src="{{ elixir('dist/js/all.js') }}"></script>
+    <script src="{{ asset(elixir('dist/js/all.js')) }}"></script>
 </head>

resources/views/setup.blade.php

@@ -5,7 +5,7 @@
 @section('content')
 <div class="setup-page">
     <div class="text-center">
-        <img class="logo" height="50" src="/img/cachet-logo.svg" alt="Cachet">
+        <img class="logo" height="50" src="{{ asset('/img/cachet-logo.svg') }}" alt="Cachet">
         <h4>{{ trans('setup.title') }}</h4>
         <br>
     </div>