Closes #7

dist/mix-manifest.json

@@ -0,0 +1,4 @@
+{
+    "/js/field.js": "/js/field.js",
+    "/css/field.css": "/css/field.css"
+}

mix-manifest.json

@@ -1,4 +1,4 @@
 {
-    "/dist/js/field.js": "/dist/js/field.js",
+    "/C:/dist/js/field.js": "/C:/dist/js/field.js",
     "/dist/css/field.css": "/dist/css/field.css"
 }

resources/js/components/FormField.vue

@@ -1,13 +1,9 @@
 <template>
     <default-field :field="field">
         <template slot="field">
-            <input :id="field.name" type="text"
-                class="w-full form-control form-input form-input-bordered"
-                :class="errorClasses"
-                :placeholder="field.name"
-                v-model="value"
-            />
-
+            <select :id="field.name" v-model="currentLocal"  class="w-full form-control form-select" :class="errorClasses" :placeholder="field.name" v-on:change="changeLocal">
+                <option v-for="(value, key) in locals" :value="key">{{ value }}</option>
+            </select>
             <p v-if="hasError" class="my-2 text-danger">
                 {{ firstError }}
             </p>
@@ -23,12 +19,23 @@ export default {
 
     props: ['resourceName', 'resourceId', 'field'],
 
+    data: function () {
+        return {
+            currentLocal: window.config.currentLocal,
+            locals: window.config.locals
+        }
+    },
+
     methods: {
+
+        changeLocal() {
+            window.location = this.replaceUrlParam(window.location.href, 'lang', this.currentLocal);
+        },
         /*
          * Set the initial, internal value for the field.
          */
         setInitialValue() {
-          this.value = this.field.value || ''
+          this.value = this.currentLocal || ''
         },
 
         /**
@@ -43,6 +50,19 @@ export default {
          */
         handleChange(value) {
           this.value = value
+        },
+
+        replaceUrlParam(url, paramName, paramValue)
+        {
+            if (paramValue == null) {
+                paramValue = '';
+            }
+            var pattern = new RegExp('\\b('+paramName+'=).*?(&|#|$)');
+            if (url.search(pattern)>=0) {
+                return url.replace(pattern,'$1' + paramValue + '$2');
+            }
+            url = url.replace(/[?#]$/,'');
+            return url + (url.indexOf('?')>0 ? '&' : '?') + paramName + '=' + paramValue;
         }
     }
 }

resources/js/components/LanguageSelector.vue

@@ -0,0 +1,86 @@
+<template>
+    <div class="p-3">
+        <select v-model="currentLocal"  class="w-full form-control form-select"
+                v-on:change="changeLocal">
+            <option v-for="(value, key) in locals" :value="key">
+                {{ value }}
+            </option>
+        </select>
+    </div>
+</template>
+
+<script>
+
+    import {
+        Minimum
+    } from 'laravel-nova'
+
+export default {
+
+    data: function () {
+        return {
+            currentLocal: window.config.currentLocal,
+            locals: window.config.locals
+        }
+    },
+    methods: {
+        changeLocal() {
+            window.location = this.replaceUrlParam(window.location.href, 'lang', this.currentLocal);
+        },
+
+        async initializeComponent() {
+            await this.getCurrentLocal()
+        },
+
+        getLocals() {
+            return Minimum(
+                Nova.request().get('/nova-vendor/multilingual-nova/locals')
+            )
+                .then(({ data }) => {
+                    this.locals = data
+                })
+                .catch(error => {
+
+                })
+        },
+
+        getCurrentLocal() {
+            return Minimum(
+                Nova.request().get('/nova-vendor/multilingual-nova/current-local')
+            )
+                .then(({ data }) => {
+                    this.currentLocal = data
+                    this.loading = false
+                })
+                .catch(error => {
+
+                })
+        },
+
+
+        replaceUrlParam(url, paramName, paramValue)
+        {
+            if (paramValue == null) {
+                paramValue = '';
+            }
+            var pattern = new RegExp('\\b('+paramName+'=).*?(&|#|$)');
+            if (url.search(pattern)>=0) {
+                return url.replace(pattern,'$1' + paramValue + '$2');
+            }
+            url = url.replace(/[?#]$/,'');
+            return url + (url.indexOf('?')>0 ? '&' : '?') + paramName + '=' + paramValue;
+        }
+
+    },
+    created() {
+
+    },
+    mounted() {
+        // this.initializeComponent()
+    },
+}
+</script>
+
+<style>
+/* Scoped Styles */
+</style>

resources/js/components/Tool.vue

@@ -0,0 +1,79 @@
+<template>
+    <div>
+        <heading class="mb-6">Nova Language Tool</heading>
+
+        <card class="flex  p-3">
+            <div class="flex border-b border-40 w-full" >
+                <div class="w-1/4 py-6 px-8">
+                    <label class="inline-block text-80 pt-2 leading-tight" for="language">Select Language</label>
+                </div>
+                <div class="py-6 px-8 w-1/2">
+                    <select v-model="currentLocal" id="language"  dusk="language"  placeholder="Select Language" class="w-full form-control form-select">
+                        <option v-for="(value, key) in locals" :value="key">
+                            {{ value }}
+                        </option>
+                    </select>
+                    <div class="help-text help-text mt-2">  </div>
+                </div>
+                <div class="py-6 px-2 w-1/4">
+                    <button type="button" class="btn btn-default btn-primary inline-flex items-center relative ml-auto mr-3" dusk="change-language-button" @click="changeLocal">
+                        <span class="">Change Language</span>
+                    </button>
+                </div>
+            </div>
+        </card>
+    </div>
+</template>
+
+<script>
+
+    import {
+        Minimum
+    } from 'laravel-nova'
+
+export default {
+
+    data: function () {
+        return {
+            initialLoading: true,
+            currentLocal: window.config.currentLocal,
+            locals: window.config.locals
+        }
+    },
+    methods: {
+        changeLocal() {
+            window.location = Nova.config.base + "/nova-language-tool?lang=" + this.currentLocal;
+        },
+
+        async initializeComponent() {
+            await this.getCurrentLocal()
+
+            this.initialLoading = false
+        },
+
+        getCurrentLocal() {
+            return Minimum(
+                Nova.request().get('/nova-vendor/multilingual-nova/current-local')
+            )
+                .then(({ data }) => {
+                    this.currentLocal = data
+                    this.loading = false
+                })
+                .catch(error => {
+
+                })
+        },
+
+    },
+    created() {
+
+    },
+    mounted() {
+        // this.initializeComponent()
+    },
+}
+</script>
+
+<style>
+/* Scoped Styles */
+</style>

resources/js/field.js

@@ -13,6 +13,16 @@ Nova.booting((Vue, router) => {
     Vue.component('detail-multilingual-nova', require('./components/DetailField'));
     Vue.component('form-multilingual-nova', require('./components/FormField'));
 
+    Vue.component('language-selector', require('./components/LanguageSelector'));
+
+    router.addRoutes([
+        {
+            name: 'nova-language-tool',
+            path: '/nova-language-tool',
+            component: require('./components/Tool'),
+        },
+    ])
+
     let lang = getParameterByName('lang');
     if (lang) {
         Nova.request().defaults.headers['lang'] = lang;

resources/views/navigation.blade.php

@@ -0,0 +1,6 @@
+<router-link tag="h3" :to="{name: 'nova-language-tool'}" class="cursor-pointer flex items-center font-normal dim text-white mb-6 text-base no-underline">
+    <svg class="sidebar-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path fill="var(--sidebar-icon)" d="M3 1h4c1.1045695 0 2 .8954305 2 2v4c0 1.1045695-.8954305 2-2 2H3c-1.1045695 0-2-.8954305-2-2V3c0-1.1045695.8954305-2 2-2zm0 2v4h4V3H3zm10-2h4c1.1045695 0 2 .8954305 2 2v4c0 1.1045695-.8954305 2-2 2h-4c-1.1045695 0-2-.8954305-2-2V3c0-1.1045695.8954305-2 2-2zm0 2v4h4V3h-4zM3 11h4c1.1045695 0 2 .8954305 2 2v4c0 1.1045695-.8954305 2-2 2H3c-1.1045695 0-2-.8954305-2-2v-4c0-1.1045695.8954305-2 2-2zm0 2v4h4v-4H3zm10-2h4c1.1045695 0 2 .8954305 2 2v4c0 1.1045695-.8954305 2-2 2h-4c-1.1045695 0-2-.8954305-2-2v-4c0-1.1045695.8954305-2 2-2zm0 2v4h4v-4h-4z"/></svg>
+    <span class="sidebar-label">
+        Language
+    </span>
+</router-link>

routes/api.php

@@ -0,0 +1,17 @@
+<?php
+
+use Illuminate\Http\Request;
+use Illuminate\Support\Facades\Route;
+
+/*
+|--------------------------------------------------------------------------
+| Tool API Routes
+|--------------------------------------------------------------------------
+|
+| Here is where you may register API routes for your tool. These routes
+| are loaded by the ServiceProvider of your tool. They are protected
+| by your tool's "Authorize" middleware by default. Now, go build!
+|
+*/
+
+ Route::get('/current-local', 'Digitalcloud\MultilingualNova\Http\Controllers\LanguageController@currentLocal');

src/FieldServiceProvider.php

@@ -2,6 +2,9 @@
 
 namespace Digitalcloud\MultilingualNova;
 
+use Digitalcloud\MultilingualNova\Http\Middleware\Authorize;
+use Illuminate\Support\Facades\App;
+use Illuminate\Support\Facades\Route;
 use Laravel\Nova\Nova;
 use Laravel\Nova\Events\ServingNova;
 use Illuminate\Support\ServiceProvider;
@@ -15,11 +18,14 @@ class FieldServiceProvider extends ServiceProvider
      */
     public function boot()
     {
+        $this->loadViewsFrom(__DIR__.'/../resources/views', 'nova-language-tool');
+
         $lang = request('lang', request()->header('lang'));
 
         if ($lang) app()->setLocale($lang);
 
         Nova::serving(function (ServingNova $event) {
+            Nova::provideToScript(['locals' => $this->getSupportLocales(), 'currentLocal' => App::getLocale()]);
             Nova::script('multilingual-nova', __DIR__ . '/../dist/js/field.js');
             Nova::style('multilingual-nova', __DIR__ . '/../dist/css/field.css');
         });
@@ -28,6 +34,11 @@ public function boot()
         $this->publishes([
             __DIR__ . '/../config/multilingual.php' => config_path('multilingual.php'),
         ], 'multilingual-nova');
+
+        $this->app->booted(function () {
+            $this->routes();
+        });
+
     }
 
     /**
@@ -38,4 +49,34 @@ public function boot()
     public function register()
     {
     }
+
+    protected function routes()
+    {
+        if ($this->app->routesAreCached()) {
+            return;
+        }
+
+        Route::middleware(['nova', Authorize::class])
+            ->prefix('nova-vendor/multilingual-nova')
+            ->group(__DIR__.'/../routes/api.php');
+    }
+
+
+    private function getSupportLocales()
+    {
+        if (config('multilingual.source') == 'array') return config('multilingual.locales');
+
+        if (config('multilingual.source') == 'database') {
+            $model = config('multilingual.database.model');
+            $code = config('multilingual.database.code_field');
+            $label = config('multilingual.database.label_field');
+
+            $locales = ($model)::all()->mapWithKeys(function ($item) use ($code, $label) {
+                return [$item->$code => $item->$label];
+            });
+            return $locales->toArray();
+        }
+
+        return ['en' => 'EN'];
+    }
 }

src/Http/Controllers/Controller.php

@@ -0,0 +1,13 @@
+<?php
+
+namespace Digitalcloud\MultilingualNova\Http\Controllers;
+
+use Illuminate\Foundation\Bus\DispatchesJobs;
+use Illuminate\Routing\Controller as BaseController;
+use Illuminate\Foundation\Validation\ValidatesRequests;
+use Illuminate\Foundation\Auth\Access\AuthorizesRequests;
+
+class Controller extends BaseController
+{
+    use AuthorizesRequests, DispatchesJobs, ValidatesRequests;
+}

src/Http/Controllers/LanguageController.php

@@ -0,0 +1,19 @@
+<?php
+
+namespace Digitalcloud\MultilingualNova\Http\Controllers;
+
+use Illuminate\Support\Facades\App;
+
+class LanguageController extends Controller {
+
+    public function index() {
+
+    }
+    public function currentLocal() {
+        return App::getLocale();
+    }
+
+    public function locals() {
+        return App::getLocale();
+    }
+}