diff --git a/app/Http/Controllers/JavascriptController.php b/app/Http/Controllers/JavascriptController.php
new file mode 100644
index 0000000000..17bda42062
--- /dev/null
+++ b/app/Http/Controllers/JavascriptController.php
@@ -0,0 +1,117 @@
+<?php
+/**
+ * JavascriptController.php
+ * Copyright (c) 2017 thegrumpydictator@gmail.com
+ * This software may be modified and distributed under the terms of the Creative Commons Attribution-ShareAlike 4.0 International License.
+ *
+ * See the LICENSE file for details.
+ */
+
+declare(strict_types = 1);
+
+namespace FireflyIII\Http\Controllers;
+
+use Amount;
+use FireflyIII\Exceptions\FireflyException;
+use Navigation;
+use Preferences;
+use Session;
+
+/**
+ * Class JavascriptController
+ *
+ * @package FireflyIII\Http\Controllers
+ */
+class JavascriptController extends Controller
+{
+
+    /**
+     *
+     */
+    public function variables()
+    {
+
+        $viewRange = Preferences::get('viewRange', '1M')->data;
+        $start     = Session::get('start');
+        $end       = Session::get('end');
+        $linkTitle = sprintf('%s - %s', $start->formatLocalized($this->monthAndDayFormat), $end->formatLocalized($this->monthAndDayFormat));
+        $firstDate = session('first')->format('Y-m-d');
+        $prevStart = clone $start;
+        $prevEnd   = clone $start;
+        $nextStart = clone $end;
+        $nextEnd   = clone $end;
+        if ($viewRange === 'custom') {
+            $days = $start->diffInDays($end);
+            $prevStart->subDays($days);
+            $nextEnd->addDays($days);
+            unset($days);
+        }
+
+        if ($viewRange !== 'custom') {
+            $prevStart = Navigation::subtractPeriod($start, $viewRange);// subtract for previous period
+            $prevEnd   = Navigation::endOfPeriod($prevStart, $viewRange);
+            $nextStart = Navigation::addPeriod($start, $viewRange, 0); // add for previous period
+            $nextEnd   = Navigation::endOfPeriod($nextStart, $viewRange);
+        }
+
+        $ranges             = [];
+        $ranges['current']  = [$start->format('Y-m-d'), $end->format('Y-m-d')];
+        $ranges['previous'] = [$prevStart->format('Y-m-d'), $prevEnd->format('Y-m-d')];
+        $ranges['next']     = [$nextStart->format('Y-m-d'), $nextEnd->format('Y-m-d')];
+
+        switch ($viewRange) {
+            default:
+                throw new FireflyException('The date picker does not yet support "' . $viewRange . '".');
+            case '1D':
+            case 'custom':
+                $format = (string)trans('config.month_and_day');
+                break;
+            case '3M':
+                $format = (string)trans('config.quarter_in_year');
+                break;
+            case '6M':
+                $format = (string)trans('config.half_year');
+                break;
+            case '1Y':
+                $format = (string)trans('config.year');
+                break;
+            case '1M':
+                $format = (string)trans('config.month');
+                break;
+            case '1W':
+                $format = (string)trans('config.week_in_year');
+                break;
+        }
+
+        $current                   = $start->formatLocalized($format);
+        $next                      = $nextStart->formatLocalized($format);
+        $prev                      = $prevStart->formatLocalized($format);
+        $localeconv                = localeconv();
+        $accounting                = Amount::getJsConfig($localeconv);
+        $localeconv                = localeconv();
+        $defaultCurrency           = Amount::getDefaultCurrency();
+        $localeconv['frac_digits'] = $defaultCurrency->decimal_places;
+        $pref                      = Preferences::get('language', config('firefly.default_language', 'en_US'));
+        $lang                      = $pref->data;
+        $data                      = [
+            'dpStart'        => $start->format('Y-m-d'),
+            'dpEnd'          => $end->format('Y-m-d'),
+            'dpCurrent'      => $current,
+            'dpPrevious'     => $prev,
+            'dpNext'         => $next,
+            'dpRanges'       => $ranges,
+            'linkTitle'      => $linkTitle,
+            'firstDate'      => $firstDate,
+            'currencyCode'   => Amount::getCurrencyCode(),
+            'currencySymbol' => Amount::getCurrencySymbol(),
+            'accounting'     => $accounting,
+            'localeconv'     => $localeconv,
+            'language'       => $lang,
+        ];
+
+        return response()
+            ->view('javascript.variables', $data, 200)
+            ->header('Content-Type', 'text/javascript');
+    }
+
+}
\ No newline at end of file
diff --git a/app/Http/Middleware/Range.php b/app/Http/Middleware/Range.php
index 4371d473d7..fdf5322a4d 100644
--- a/app/Http/Middleware/Range.php
+++ b/app/Http/Middleware/Range.php
@@ -72,9 +72,6 @@ class Range
             // set view variables.
             $this->configureView();
 
-            // get variables for date range:
-            $this->datePicker();
-
             // set more view variables:
             $this->configureList();
         }
@@ -96,7 +93,6 @@ class Range
     {
         $pref = Preferences::get('language', config('firefly.default_language', 'en_US'));
         $lang = $pref->data;
-
         App::setLocale($lang);
         Carbon::setLocale(substr($lang, 0, 2));
         $locale = explode(',', trans('config.locale'));
@@ -105,94 +101,15 @@ class Range
         setlocale(LC_TIME, $locale);
         setlocale(LC_MONETARY, $locale);
 
+
         // save some formats:
-        $monthFormat       = (string)trans('config.month');
         $monthAndDayFormat = (string)trans('config.month_and_day');
         $dateTimeFormat    = (string)trans('config.date_time');
         $defaultCurrency   = Amount::getDefaultCurrency();
-        $localeconv        = localeconv();
-        $accounting        = Amount::getJsConfig($localeconv);
 
-        // decimal places is overruled by TransactionCurrency
-        $localeconv['frac_digits'] = $defaultCurrency->decimal_places;
-
-        View::share('monthFormat', $monthFormat);
         View::share('monthAndDayFormat', $monthAndDayFormat);
         View::share('dateTimeFormat', $dateTimeFormat);
-        View::share('language', $lang);
-        View::share('localeconv', $localeconv);
         View::share('defaultCurrency', $defaultCurrency);
-        View::share('accountingConfig', $accounting);
-    }
-
-    /**
-     * @throws FireflyException
-     */
-    private function datePicker()
-    {
-        $viewRange = Preferences::get('viewRange', '1M')->data;
-        /** @var Carbon $start */
-        $start = Session::get('start');
-        /** @var Carbon $end */
-        $end = Session::get('end');
-
-        $prevStart = clone $start;
-        $prevEnd   = clone $start;
-        $nextStart = clone $end;
-        $nextEnd   = clone $end;
-        if ($viewRange === 'custom') {
-            $days = $start->diffInDays($end);
-            $prevStart->subDays($days);
-            $nextEnd->addDays($days);
-            unset($days);
-        }
-
-        if ($viewRange !== 'custom') {
-            $prevStart = Navigation::subtractPeriod($start, $viewRange);// subtract for previous period
-            $prevEnd   = Navigation::endOfPeriod($prevStart, $viewRange);
-            $nextStart = Navigation::addPeriod($start, $viewRange, 0); // add for previous period
-            $nextEnd   = Navigation::endOfPeriod($nextStart, $viewRange);
-        }
-
-        $ranges             = [];
-        $ranges['current']  = [$start->format('Y-m-d'), $end->format('Y-m-d')];
-        $ranges['previous'] = [$prevStart->format('Y-m-d'), $prevEnd->format('Y-m-d')];
-        $ranges['next']     = [$nextStart->format('Y-m-d'), $nextEnd->format('Y-m-d')];
-
-        switch ($viewRange) {
-            default:
-                throw new FireflyException('The date picker does not yet support "' . $viewRange . '".');
-            case '1D':
-            case 'custom':
-                $format = (string)trans('config.month_and_day');
-                break;
-            case '3M':
-                $format = (string)trans('config.quarter_in_year');
-                break;
-            case '6M':
-                $format = (string)trans('config.half_year');
-                break;
-            case '1Y':
-                $format = (string)trans('config.year');
-                break;
-            case '1M':
-                $format = (string)trans('config.month');
-                break;
-            case '1W':
-                $format = (string)trans('config.week_in_year');
-                break;
-        }
-
-
-        $current = $start->formatLocalized($format);
-        $next    = $nextStart->formatLocalized($format);
-        $prev    = $prevStart->formatLocalized($format);
-        View::share('dpStart', $start->format('Y-m-d'));
-        View::share('dpEnd', $end->format('Y-m-d'));
-        View::share('dpCurrent', $current);
-        View::share('dpPrevious', $prev);
-        View::share('dpNext', $next);
-        View::share('dpRanges', $ranges);
     }
 
     /**
diff --git a/resources/views/javascript/variables.twig b/resources/views/javascript/variables.twig
new file mode 100644
index 0000000000..ae6873096d
--- /dev/null
+++ b/resources/views/javascript/variables.twig
@@ -0,0 +1,29 @@
+// date range picker configuration:
+var dateRangeConfig = {
+    startDate: moment("{{ dpStart }}"),
+    endDate: moment("{{ dpEnd }}"),
+    linkTitle: "{{ linkTitle }}",
+    URL: "{{ route('daterange') }}",
+    firstDate: moment("{{ firstDate }}"),
+    currentPeriod: "{{ dpCurrent }}",
+    previousPeriod: "{{ dpPrevious }}",
+    nextPeriod: "{{ dpNext }}",
+    everything: '{{ 'everything'|_|escape }}',
+    customRangeLabel: '{{ 'customRange'|_|escape }}',
+    applyLabel: '{{ 'apply'|_|escape }}',
+    cancelLabel: '{{ 'cancel'|_|escape }}',
+    fromLabel: '{{ 'from'|_|escape }}',
+    toLabel: '{{ 'to'|_|escape }}',
+    ranges: {{ dpRanges|json_encode|raw }}
+};
+
+var language = "{{ language|escape }}";
+var currencyCode = '{{ currencyCode|escape('js') }}';
+var currencySymbol = '{{ currencySymbol|escape('js') }}';
+var mon_decimal_point = "{{ localeconv.mon_decimal_point|escape('js') }}";
+var mon_thousands_sep = "{{ localeconv.mon_thousands_sep|escape('js') }}";
+var frac_digits = {{ localeconv.frac_digits }};
+var noDataForChart = '{{ trans('firefly.no_data_for_chart')|escape }}';
+var showFullList = '{{ trans('firefly.show_full_list') }}';
+var showOnlyTop = '{{ trans('firefly.show_only_top',{number:listLength}) }}';
+var accountingConfig = {{ accounting|json_encode|raw }};
\ No newline at end of file
diff --git a/resources/views/layout/default.twig b/resources/views/layout/default.twig
index 85b8f95e3b..16a8c2f4e9 100644
--- a/resources/views/layout/default.twig
+++ b/resources/views/layout/default.twig
@@ -177,42 +177,7 @@
 <script src="lib/adminlte/js/app.min.js" type="text/javascript"></script>
 <script type="text/javascript" src="js/lib/accounting.min.js"></script>
 <script src="js/lib/bootstrap-tour.min.js" type="text/javascript"></script>
-
-<script type="text/javascript">
-
-    // date range picker configuration:
-    var dateRangeConfig = {
-        startDate: moment("{{ dpStart }}"),
-        endDate: moment("{{ dpEnd }}"),
-        linkTitle: "{{ Session.get('start').formatLocalized(monthAndDayFormat) }} - {{ Session.get('end').formatLocalized(monthAndDayFormat) }}",
-        URL: "{{ route('daterange') }}",
-        firstDate: moment("{{ Session.get('first').format('Y-m-d') }}"),
-        currentPeriod: "{{ dpCurrent }}",
-        previousPeriod: "{{ dpPrevious }}",
-        nextPeriod: "{{ dpNext }}",
-        everything: '{{ 'everything'|_|escape }}',
-        customRangeLabel: '{{ 'customRange'|_|escape }}',
-        applyLabel: '{{ 'apply'|_|escape }}',
-        cancelLabel: '{{ 'cancel'|_|escape }}',
-        fromLabel: '{{ 'from'|_|escape }}',
-        toLabel: '{{ 'to'|_|escape }}',
-        ranges: {{ dpRanges|json_encode|raw }}
-    };
-    
-    var language = "{{ language|escape }}";
-    var currencyCode = '{{ getCurrencyCode()|escape('js') }}';
-    var currencySymbol = '{{ getCurrencySymbol()|escape('js') }}';
-    var mon_decimal_point = "{{ localeconv.mon_decimal_point|escape('js') }}";
-    var mon_thousands_sep = "{{ localeconv.mon_thousands_sep|escape('js') }}";
-    var frac_digits = {{ localeconv.frac_digits }};
-    var noDataForChart = '{{ trans('firefly.no_data_for_chart')|escape }}';
-    var showFullList = '{{ trans('firefly.show_full_list') }}';
-    var showOnlyTop = '{{ trans('firefly.show_only_top',{number:listLength}) }}';
-    var accountingConfig = {{ accountingConfig|json_encode|raw }};
-
-
-</script>
-
+<script src="javascript/variables.js" type="text/javascript"></script>
 <script type="text/javascript" src="js/ff/firefly.js"></script>
 <script type="text/javascript" src="js/ff/help.js"></script>
 {% block scripts %}{% endblock %}
diff --git a/resources/views/preferences/index.twig b/resources/views/preferences/index.twig
index 65080962ba..bf15783830 100644
--- a/resources/views/preferences/index.twig
+++ b/resources/views/preferences/index.twig
@@ -24,7 +24,7 @@
                             <div class="row">
                                 <!-- general settings column A -->
                                 <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
-                                    <!-- language -->
+                                    {# language #}
                                     <div class="preferences-box">
                                         <h3>{{ 'pref_languages'|_ }}</h3>
                                         <p class="text-info">{{ 'pref_languages_help'|_ }}</p>
diff --git a/routes/web.php b/routes/web.php
index 71793df647..04835588af 100755
--- a/routes/web.php
+++ b/routes/web.php
@@ -49,6 +49,7 @@ Route::group(
 
 /**
  * For the two factor routes, the user must be logged in, but NOT 2FA. Account confirmation does not matter here.
+ *
  * @deprecated
  */
 Route::group(
@@ -364,6 +365,15 @@ Route::group(
 }
 );
 
+/**
+ * Budget Controller
+ */
+Route::group(
+    ['middleware' => 'user-full-auth', 'prefix' => 'javascript', 'as' => 'javascript.'], function () {
+    Route::get('variables.js', ['uses' => 'JavascriptController@variables', 'as' => 'variables']);
+}
+);
+
 /**
  * JSON Controller
  */
@@ -382,7 +392,7 @@ Route::group(
     Route::get('trigger', ['uses' => 'JsonController@trigger', 'as' => 'trigger']);
     Route::get('action', ['uses' => 'JsonController@action', 'as' => 'action']);
 
-    Route::post('end-tour', ['uses' => 'JsonController@endTour','as' => 'end-tour']);
+    Route::post('end-tour', ['uses' => 'JsonController@endTour', 'as' => 'end-tour']);
 
 }
 );