@@ -698,7 +698,7 @@ export default {
- {{ spot.lang('track_'+hikeType) }}
+ {{ lang.get('track_'+hikeType) }}
@@ -709,7 +709,7 @@ export default {
diff --git a/src/components/projectMapLink.vue b/src/components/projectMapLink.vue
index 8bb947c..6619aaf 100644
--- a/src/components/projectMapLink.vue
+++ b/src/components/projectMapLink.vue
@@ -3,15 +3,15 @@ export default {
props: {
options: Object
},
- inject: ['spot']
+ inject: ['lang']
}
{{ options.lat_dms+' '+options.lon_dms }}
-
\ No newline at end of file
+
diff --git a/src/components/projectMediaLink.vue b/src/components/projectMediaLink.vue
index 603e63b..05e4aff 100644
--- a/src/components/projectMediaLink.vue
+++ b/src/components/projectMediaLink.vue
@@ -16,7 +16,7 @@ export default {
title:''
}
},
- inject: ['spot'],
+ inject: ['lang'],
mounted() {
this.title =
(this.$refs.comment?this.$refs.comment.outerHTML:'') +
@@ -47,7 +47,7 @@ export default {
:src="options.thumb_path"
:width="options.width"
:height="options.height"
- :title="spot.lang((options.subtype == 'video')?'click_watch':'click_zoom')"
+ :title="lang.get((options.subtype == 'video')?'click_watch':'click_zoom')"
class="clickable"
/>
@@ -64,4 +64,4 @@ export default {
-
\ No newline at end of file
+
diff --git a/src/components/projectPopup.vue b/src/components/projectPopup.vue
index 0bbcb88..928f0c2 100644
--- a/src/components/projectPopup.vue
+++ b/src/components/projectPopup.vue
@@ -18,7 +18,7 @@ export default {
medias: Array,
project: Object
},
- inject: ['spot'],
+ inject: ['spot', 'lang'],
computed: {
timeIcon() {
return (this.type == 'media')?'image-shot':'time';
@@ -31,7 +31,7 @@ export default {
-
\ No newline at end of file
+
diff --git a/src/components/projectPost.vue b/src/components/projectPost.vue
index 7c1001b..b60294e 100644
--- a/src/components/projectPost.vue
+++ b/src/components/projectPost.vue
@@ -29,7 +29,7 @@
absTimeLocal: this.options.formatted_time_local,
timeDiff: (this.options.formatted_time && this.options.formatted_time_local != this.options.formatted_time),
anchorVisible: ['message', 'media', 'post'].includes(this.options.type),
- anchorTitle: this.spot.lang('copy_to_clipboard'),
+ anchorTitle: this.lang.get('copy_to_clipboard'),
anchorIcon: 'link',
popupRequested: false,
postMessage: '',
@@ -49,7 +49,7 @@
return this.options.subtype || this.options.type;
},
displayedId() {
- return this.options.displayed_id?(this.spot.lang('counter', this.options.displayed_id)):'';
+ return this.options.displayed_id?(this.lang.get('counter', this.options.displayed_id)):'';
},
anchorLink() {
return '#'+[this.hash.page, this.hash.items[0], this.options.type, this.options.id].join(this.spot.consts.hash_sep);
@@ -69,14 +69,14 @@
}
},
- inject: ['spot', 'project', 'user', 'map', 'hash'],
+ inject: ['spot', 'lang', 'project', 'user', 'map', 'hash'],
methods: {
copyAnchor() {
copyTextToClipboard(this.spot.consts.server+this.anchorLink);
- this.anchorTitle = this.spot.lang('link_copied');
+ this.anchorTitle = this.lang.get('link_copied');
this.anchorIcon = 'copied';
setTimeout(()=>{ //TODO animation
- this.anchorTitle = this.spot.lang('copy_to_clipboard');
+ this.anchorTitle = this.lang.get('copy_to_clipboard');
this.anchorIcon = 'link';
}, 5000);
},
@@ -146,9 +146,9 @@
-
@@ -183,13 +183,13 @@
diff --git a/src/components/projectRelTime.vue b/src/components/projectRelTime.vue
index e94cc45..d8deb3d 100644
--- a/src/components/projectRelTime.vue
+++ b/src/components/projectRelTime.vue
@@ -13,10 +13,10 @@ export default {
icon: String,
iconClasses: String
},
- inject: ['spot'],
+ inject: ['lang'],
computed: {
title() {
- if(this.localTime != this.siteTime) return this.spot.lang('your_time', this.siteTime.slice(-5)) + ((this.offset != '0')?' ('+this.spot.lang('unit_d')+this.offset+')':'');
+ if(this.localTime != this.siteTime) return this.lang.get('your_time', this.siteTime.slice(-5)) + ((this.offset != '0')?' ('+this.lang.get('unit_d')+this.offset+')':'');
},
spotIconClasses() {
return this.iconClasses || 'fa-fw fa-lg';
@@ -28,4 +28,4 @@ export default {
{{ localTime }}
-
\ No newline at end of file
+
diff --git a/src/components/upload.vue b/src/components/upload.vue
index 7339f8d..ea8080f 100644
--- a/src/components/upload.vue
+++ b/src/components/upload.vue
@@ -10,7 +10,7 @@ import SpotButton from './spotButton.vue';
export default {
name: 'upload',
components: { SpotButton, SpotIcon },
- inject: ['spot', 'projects', 'consts', 'user'],
+ inject: ['spot', 'lang', 'projects', 'consts', 'user'],
data() {
return {
project: this.projects[this.spot.vars('default_project_codename')],
@@ -24,7 +24,7 @@ export default {
this.spot.addPage('upload', {});
if(!this.project.editable) {
- this.logs = [this.spot.lang('upload_mode_archived', [this.project.name])];
+ this.logs = [this.lang.get('upload_mode_archived', [this.project.name])];
return;
}
@@ -67,13 +67,13 @@ export default {
const uploadedFiles = response?.body?.files || [];
uploadedFiles.forEach((uploadedFile) => {
const hasError = Object.prototype.hasOwnProperty.call(uploadedFile, 'error');
- this.logs.push(hasError ? uploadedFile.error : this.spot.lang('upload_success', [uploadedFile.name]));
+ this.logs.push(hasError ? uploadedFile.error : this.lang.get('upload_success', [uploadedFile.name]));
if(!hasError) this.files.push({...uploadedFile, content: ''});
});
});
this.uppy.on('upload-error', (file, error, response) => {
- const message = response?.body?.error || error?.message || this.spot.lang('error');
+ const message = response?.body?.error || error?.message || this.lang.get('error');
this.logs.push(message);
});
@@ -88,8 +88,8 @@ export default {
},
addComment(oFile) {
this.spot.get2('add_comment', {id: oFile.id, content: oFile.content})
- .then((asData) => {this.logs.push(this.spot.lang('media_comment_update', asData.filename));})
- .catch((sMsgId) => {this.logs.push(this.spot.lang(sMsgId));});
+ .then((asData) => {this.logs.push(this.lang.get('media_comment_update', asData.filename));})
+ .catch((sMsgId) => {this.logs.push(this.lang.get(sMsgId));});
},
addPosition() {
if(navigator.geolocation) {
@@ -98,8 +98,8 @@ export default {
(position) => {
this.logs.push('Sending position...');
this.spot.get2('add_position', {'latitude':position.coords.latitude, 'longitude':position.coords.longitude, 'timestamp':Math.round(position.timestamp / 1000)})
- .then((asData) => {this.logs.push(this.spot.lang('success'));})
- .catch((sMsgId) => {this.logs.push(this.spot.lang(sMsgId));});
+ .then((asData) => {this.logs.push(this.lang.get('success'));})
+ .catch((sMsgId) => {this.logs.push(this.lang.get(sMsgId));});
},
(error) => {
this.logs.push(error.message);
@@ -113,8 +113,8 @@ export default {
-
-
{{ spot.lang('upload_media_title') }}
+
+
{{ lang.get('upload_media_title') }}
{{ this.project.name }}
-
{{ spot.lang('upload_pos_title') }}
-
-
-
+
{{ lang.get('upload_pos_title') }}
+
+
+
diff --git a/src/scripts/app.js b/src/scripts/app.js
index 3b1f8a9..3156d10 100644
--- a/src/scripts/app.js
+++ b/src/scripts/app.js
@@ -1,29 +1,21 @@
-import Css from './../styles/spot.scss';
-
-//Masks
+//Librairies
+import Lang from './lang.js';
import Spot from './spot.js';
-//import Project from './page.project.js';
-//import Upload from './page.upload.js';
-//import Admin from './page.admin.js';
-
-//let oProject = new Project(oSpot);
-//oSpot.addPage('project', oProject);
-
-//let oUpload = new Upload(oSpot);
-//oSpot.addPage('upload', oUpload);
-
-//let oAdmin = new Admin(oSpot);
-//oSpot.addPage('admin', oAdmin);
-
-//$(() => {oSpot.init();});
-
import { createApp } from 'vue';
import SpotVue from '../Spot.vue';
-const appConfigElement = document.getElementById('app-config');
-const appConfig = appConfigElement ? JSON.parse(appConfigElement.textContent || '{}') : {};
-const oSpot = new Spot(appConfig);
+//Style
+import Css from './../styles/spot.scss';
+//App Configuration from PHP
+const appConfig = JSON.parse(document.getElementById('app-config').textContent);
+
+//Instances
+const oLang = new Lang({translations: appConfig.consts.lang, prefix: appConfig.consts.lang_prefix});
+const oSpot = new Spot(appConfig, oLang);
+
+//Mount app
const oSpotVue = createApp(SpotVue);
oSpotVue.provide('spot', oSpot);
+oSpotVue.provide('lang', oLang);
oSpotVue.mount('#container');
diff --git a/src/scripts/lang.js b/src/scripts/lang.js
index 20ea059..a613b81 100644
--- a/src/scripts/lang.js
+++ b/src/scripts/lang.js
@@ -5,7 +5,7 @@ export default class Lang {
this.prefix = prefix;
}
- lang(key = '', params = []) {
+ get(key = '', params = []) {
if(key === '') return '';
const normalizedParams = Array.isArray(params) ? params : [params];
@@ -24,7 +24,7 @@ export default class Lang {
parse(message = '') {
if(this.prefix && typeof message === 'string' && message.startsWith(this.prefix)) {
- return this.lang(message.slice(this.prefix.length));
+ return this.get(message.slice(this.prefix.length));
}
return message;
}
diff --git a/src/scripts/spot.js b/src/scripts/spot.js
index 2fcc06c..2de5a70 100755
--- a/src/scripts/spot.js
+++ b/src/scripts/spot.js
@@ -1,19 +1,14 @@
import { copyArray, getElem, setElem } from './common.js';
-import Lang from './lang.js';
export default class Spot {
- constructor(asGlobals) {
+ constructor(asGlobals, oLang) {
this.consts = asGlobals.consts;
this.consts.hash_sep = '-';
this.consts.title = 'Spotty';
this.consts.default_page = 'project';
//this.consts.timezone = Intl.DateTimeFormat().resolvedOptions().timeZone || this.consts.default_timezone;
-
- this.translator = new Lang({
- translations: this.consts.lang || {},
- prefix: this.consts.lang_prefix || ''
- });
+ this.lang = oLang;
this.pages = {};
@@ -112,7 +107,7 @@ export default class Spot {
else {
let oResponse = await oRequest.json();
bLoading = false;
- oResponse.desc = this.translator.parse(oResponse.desc);
+ oResponse.desc = this.lang.parse(oResponse.desc);
if(oResponse.result == this.consts.error) return Promise.reject(oResponse.desc);
else return oResponse.data;
@@ -124,10 +119,6 @@ export default class Spot {
}
}
- lang(sKey, asParams = []) {
- return this.translator.lang(sKey, asParams);
- }
-
isMobile() {
const mobileElem = document.getElementById('mobile');
return !!mobileElem && getComputedStyle(mobileElem).display !== 'none';
@@ -295,8 +286,8 @@ export default class Spot {
iTimeMinutes = Math.floor(iHours * 4) * 15; //Round down to the closest 15 minutes
}
return '~ '
- +(iTimeDays>0?(iTimeDays+(iTimeDays%2==0?'':'½')+' '+this.lang(iTimeDays>1?'unit_days':'unit_day')):'') //Days
- +((iTimeHours>0 || iTimeDays==0)?iTimeHours+this.lang('unit_hour'):'') //Hours
+ +(iTimeDays>0?(iTimeDays+(iTimeDays%2==0?'':'½')+' '+this.lang.get(iTimeDays>1?'unit_days':'unit_day')):'') //Days
+ +((iTimeHours>0 || iTimeDays==0)?iTimeHours+this.lang.get('unit_hour'):'') //Hours
+((iTimeDays>0 || iTimeMinutes==0)?'':iTimeMinutes) //Minutes
}