diff --git a/.babelrc b/.babelrc index 671ce3f..b8f7eab 100644 --- a/.babelrc +++ b/.babelrc @@ -22,15 +22,6 @@ "loose": false, "useBuiltIns": "usage" } - ], - [ - "@babel/preset-stage-2", - { - "modules": false, - "loose": false, - "useBuiltIns": true, - "decoratorsLegacy": true - } ] ], "plugins": [ diff --git a/.env.development b/.env.development index e032ebc..211e8d9 100644 --- a/.env.development +++ b/.env.development @@ -1,4 +1,4 @@ -APP_VERSION="DEV 0.0.27" +APP_VERSION="0.0.47" SERVICE_WORKER_FILE='service-worker.js' APP_ID='1' APP_URL='https://freeplanet.app' @@ -7,8 +7,10 @@ LANG_DEFAULT='it' PAO_APP_ID='KKPPAA5KJK435J3KSS9F9D8S9F8SD98F9SDF' MASTER_KEY='KKPPSS5KJK435J3KSS9F9D8S9F8SD3CR3T' MONGODB_HOST='http://localhost:3000' -LOGO_REG='freeplanet-logo-full.svg' +LOGO_REG="freeplanet-logo-full.svg" TEST_EMAIL='paolo.arena77@gmail.com' TEST_USERNAME='paoloar77' TEST_PASSWORD='mypassword@1A' PUBLICKEY_PUSH='BGxRrFWnPoa_ImUaWXmeEOFVI9VNKVKaAPsvsM1XY6wn24yxp9MyOQ4crNYCJKxSXV65Y1GblW5_VLoamedcZ1I' +IN_CONSTRUCTION='0' +DEBUG='1' diff --git a/.gitignore b/.gitignore index b327f0b..de79285 100644 --- a/.gitignore +++ b/.gitignore @@ -2,6 +2,7 @@ .DS_Store .thumbs.db .env +.env.development .env.production .env.production.bak .env.prod.bak @@ -12,7 +13,6 @@ node_modules /src-cordova/platforms /src-cordova/plugins /src-cordova/www -/src-pwa /src-ssr npm-debug.log* yarn-debug.log* @@ -34,3 +34,8 @@ deploy.sh deploy_on_production.sh deploy_on_test_server.sh send_to_production.sh +compileandserve.sh +deploy_all.sh +deploy_frontend.sh +mongodb_delete_pc_locale_paolo.sh +serve_on_localhost.sh diff --git a/docs/docs.txt b/docs/docs.txt index a795997..4f522d8 100644 --- a/docs/docs.txt +++ b/docs/docs.txt @@ -4,3 +4,31 @@ md 992px Medium-sized window lg 1200px Large sized window xl Infinite Extra large sized window + +-------------------------------------------------------- +https://alligator.io/vuejs/progressive-image-rendering/ +--- lOADING LAZY IMAGES: +-------------------------------------------------------- + + + + + + diff --git a/src/components/categories/category/category.ts b/src/components/categories/category/category.ts index eec08f6..5278fcd 100644 --- a/src/components/categories/category/category.ts +++ b/src/components/categories/category/category.ts @@ -121,7 +121,7 @@ export default class Category extends Vue { async deleteCategory(myarrobj) { - await myarrobj.forEach(myobj => { + for (const myobj of myarrobj) { if (myobj.id !== undefined) { console.log('KEY = ', myobj.id) @@ -141,7 +141,7 @@ export default class Category extends Vue { return deleteCount } } - }) + } } diff --git a/src/components/categories/tabledata/tabledata.ts b/src/components/categories/tabledata/tabledata.ts index b27f197..b04297c 100644 --- a/src/components/categories/tabledata/tabledata.ts +++ b/src/components/categories/tabledata/tabledata.ts @@ -2,6 +2,7 @@ import Vue from 'vue' import { Component, Watch } from 'vue-property-decorator' import { ICategory } from '@src/model' +import globalroutines from "@src/globalroutines" @Component({ }) @@ -116,7 +117,7 @@ export default class Tabledata extends Vue { async deleteCategory(myarrobj) { - await myarrobj.forEach(myobj => { + for (const myobj of myarrobj) { if (myobj.id !== undefined) { console.log('KEY = ', myobj.id) @@ -136,7 +137,7 @@ export default class Tabledata extends Vue { return deleteCount } } - }) + } } diff --git a/src/components/logo/logo.scss b/src/components/logo/logo.scss index 5307147..ec2591e 100644 --- a/src/components/logo/logo.scss +++ b/src/components/logo/logo.scss @@ -1,9 +1,11 @@ -.svgclass{ + +.svgclass { color: white; transform: translateY(0px); } + .svgclass_animate { transform: translateY(-70px); color: red; @@ -14,16 +16,24 @@ } -@keyframes gravity{ - 0%{ +#logoimg { + height: 150px; + width: auto; + @media screen and (max-width: 600px) { + } +} + +@keyframes gravity { + 0% { transform: rotateY(0deg); } - 100%{ + 100% { transform: rotateY(360deg); } } -#smile{ +#smile { opacity: 0.1 !important; fill: red; } + diff --git a/src/components/offline/offline.ts b/src/components/offline/offline.ts index c76d173..1a3cd52 100644 --- a/src/components/offline/offline.ts +++ b/src/components/offline/offline.ts @@ -13,7 +13,7 @@ export default class Offline extends Vue { logoimg: string = '' created() { - this.logoimg = 'statics/images/' + process.env.LOGO_REG + this.logoimg = '/statics/images/' + process.env.LOGO_REG this.animate() } diff --git a/src/components/offline/offline.vue b/src/components/offline/offline.vue index 21c6646..471a9ec 100644 --- a/src/components/offline/offline.vue +++ b/src/components/offline/offline.vue @@ -1,6 +1,6 @@ - - - - - - - + + + + + + + + + - +
diff --git a/src/js/storage.js b/src/js/storage.js index 9905be7..81d7077 100644 --- a/src/js/storage.js +++ b/src/js/storage.js @@ -15,6 +15,7 @@ export let idbKeyval = (() => { openreq.onupgradeneeded = () => { // First time setup: create an empty object store openreq.result.createObjectStore('todos', { keyPath: '_id' }); + openreq.result.createObjectStore('categories', { keyPath: '_id' }); openreq.result.createObjectStore('sync_todos', { keyPath: '_id' }); openreq.result.createObjectStore('sync_todos_patch', { keyPath: '_id' }); openreq.result.createObjectStore('delete_todos', { keyPath: '_id' }); @@ -56,7 +57,7 @@ export let idbKeyval = (() => { let req; await withStore('readonly', table, store => { - console.log('getdata', table, key) + // console.log('getdata', table, key) req = store.get(key); }); diff --git a/src/layouts/drawer/drawer.scss b/src/layouts/drawer/drawer.scss new file mode 100644 index 0000000..b0b04f7 --- /dev/null +++ b/src/layouts/drawer/drawer.scss @@ -0,0 +1,50 @@ +.background-red { + background-color: red; + padding: 2px; +} + +.fixed-bottom { + margin-bottom: 1%; +} + +.fixed-bottom a img { + width: 25px; + height: 25px; +} + +#avatar { + padding: 20px; +} + +#profile { + height: 130px; + background-color: #009688; +} + +#user-name { + left: 90px; + bottom: 77px; + position: relative; + width: 159px; +} + +#user-actions { + left: 90px; + bottom: 71px; + position: relative; + width: 171px; +} + +#menu-collapse { + margin-top: 5%; +} + +.fixed-left:hover { + cursor: ew-resize; +} + +footer { + small { + color: red; + } +} diff --git a/src/layouts/drawer/drawer.ts b/src/layouts/drawer/drawer.ts new file mode 100644 index 0000000..3e5cecb --- /dev/null +++ b/src/layouts/drawer/drawer.ts @@ -0,0 +1,127 @@ +import menuOne from './menuOne.vue' + +import Vue from 'vue' +import { Component, Watch, Prop } from 'vue-property-decorator' +import { Store } from 'vuex' +import { UserStore } from '@modules' +import { GlobalStore } from '@modules' +import { ITodoList } from '../../model' + + +@Component({ + components: { + menuOne + } +}) + +export default class Drawer extends Vue { + public $q + $t: any + public arrlista = GlobalStore.state.listatodo + photo = '' + user = null + links + + created() { + let listatodo = [] + + this.arrlista.forEach((elem: ITodoList) => { + let item = { + route: '/todo/' + elem.namecat, + faIcon: 'fa fa-list-alt', + materialIcon: 'todo', + name: 'pages.' + elem.description + } + listatodo.push(item) + + }) + + if (UserStore.state.isAdmin) { + this.links = { + Dashboard: { + routes: [ + { route: '/', faIcon: 'fa fa-home', materialIcon: 'home', name: 'pages.home' }, + { + route: '/todo', faIcon: 'fa fa-list-alt', materialIcon: 'todo', name: 'pages.Todo', + routes2: listatodo + }, + { route: '/category', faIcon: 'fa fa-list-alt', materialIcon: 'category', name: 'pages.Category' }, + // { route: '/signup', faIcon: 'fa fa-registered', materialIcon: 'home', name: 'pages.SignUp' }, + { route: '/admin/cfgserv', faIcon: 'fa fa-database', materialIcon: 'admin', name: 'pages.Admin' }, + { route: '/admin/testp1/par1', faIcon: 'fa fa-database', materialIcon: 'admin', name: 'pages.Test1' }, + { route: '/admin/testp1/par2', faIcon: 'fa fa-database', materialIcon: 'admin', name: 'pages.Test2' }, + // { route: '/signin', faIcon: 'fa fa-anchor', materialIcon: 'home', name: 'pages.SignIn' }, + /* {route: '/vreg?idlink=aaa', faIcon: 'fa fa-login', materialIcon: 'login', name: 'pages.vreg'},*/ + ], + show: true + } + } + } else { + // PRODUCTION USER: + if (process.env.PROD) { + this.links = { + Dashboard: { + routes: [ + { route: '/', faIcon: 'fa fa-home', materialIcon: 'home', name: 'pages.home' }, + ], + show: true, + } + } + } else { + // SERVER TEST + this.links = { + Dashboard: { + routes: [ + { route: '/', faIcon: 'fa fa-home', materialIcon: 'home', name: 'pages.home' }, + { + route: '/todo', faIcon: 'fa fa-list-alt', materialIcon: 'todo', name: 'pages.Todo', + routes2: listatodo + }, + { route: '/category', faIcon: 'fa fa-list-alt', materialIcon: 'category', name: 'pages.Category' } + // { route: '/signup', faIcon: 'fa fa-registered', materialIcon: 'home', name: 'pages.SignUp' }, + // { route: '/signin', faIcon: 'fa fa-anchor', materialIcon: 'home', name: 'pages.SignIn' }, + /* {route: '/vreg?idlink=aaa', faIcon: 'fa fa-login', materialIcon: 'login', name: 'pages.vreg'},*/ + ], + show: true, + } + } + + } + } + + + } + + + get MenuCollapse() { + return GlobalStore.state.menuCollapse + // return true + } + + get Username() { + return UserStore.state.username + } + + get Verificato() { + return UserStore.state.verified_email + } + + get Email() { + return UserStore.state.email + } + + logoutHandler() { + UserStore.actions.logout() + .then(() => { + this.$router.replace('/logout') + + const mythis = this + setTimeout(function () { + mythis.$router.replace('/') + }, 1000) + + this.$q.notify(this.$t('logout.uscito')) + }) + } +} + diff --git a/src/layouts/drawer/drawer.vue b/src/layouts/drawer/drawer.vue index b40dec6..c22c031 100644 --- a/src/layouts/drawer/drawer.vue +++ b/src/layouts/drawer/drawer.vue @@ -17,154 +17,22 @@ + -
- Powered by Perseo -
+ + + - - diff --git a/src/middleware/auth.js b/src/middleware/auth.js new file mode 100644 index 0000000..b01c5cf --- /dev/null +++ b/src/middleware/auth.js @@ -0,0 +1,12 @@ +import { tools } from "../store/Modules/tools"; + +import { RouteNames } from '../router/route-names' + +export default function auth({ next, router }) { + const tok = tools.getItemLS(tools.localStorage.token) + if (!tok) { + return router.push({ name: RouteNames.login }); + } + + return next(); +} diff --git a/src/model/GlobalStore.ts b/src/model/GlobalStore.ts index ee9ebc8..6504e23 100644 --- a/src/model/GlobalStore.ts +++ b/src/model/GlobalStore.ts @@ -2,8 +2,32 @@ export interface IPost { title: string } +export interface IConnData { + downloading_server: number + downloading_indexeddb: number + uploading_server: number + uploading_indexeddb: number +} + +export interface ICfgServer { + chiave: string + userId: string + valore: string +} + +export interface ITestp1 { + contatore: number + mioarray: ICfgServer[] +} + export type StateConnection = 'online' | 'offline' +export interface IConfig { + _id: string, + key?: string, + value: string +} + export interface IGlobalState { conta: number wasAlreadySubOnDb: boolean @@ -15,8 +39,13 @@ export interface IGlobalState { leftDrawerOpen: boolean category: string stateConnection: string + networkDataReceived: boolean + cfgServer: ICfgServer[] + testp1: ITestp1 + connData: IConnData posts: IPost[] listatodo: ITodoList[] + arrConfig: IConfig[] } diff --git a/src/model/Todos.ts b/src/model/Todos.ts index 0634125..79a4e7e 100644 --- a/src/model/Todos.ts +++ b/src/model/Todos.ts @@ -1,28 +1,47 @@ export interface ITodo { _id?: any, - userId: string + userId?: string category?: string descr?: string, - priority: number, - completed: boolean, - created_at: Date, - modify_at: Date, - completed_at: Date, - expiring_at: Date, + priority?: number, + completed?: boolean, + created_at?: Date, + modify_at?: Date, + completed_at?: Date, + expiring_at?: Date, enableExpiring?: boolean, id_prev?: string, - id_next?: string, modified?: boolean, pos?: number, + order?: number, progress?: number } +export interface IParamTodo { + categorySel?: string + checkPending?: boolean + id?: string + objtodo?: ITodo + atfirst?: boolean +} + +export interface IDrag { + field?: string + idelemtochange?: string + prioritychosen?: number + oldIndex?: number + newIndex?: number + category: string + atfirst?: boolean +} + export interface ITodosState { - visuOnlyUncompleted: boolean - networkDataReceived: boolean - todos: ITodo[] - todos_changed: number + showtype: number + todos: {} + categories: string[] + // todos_changed: number reload_fromServer: number testpao: String insidePending: boolean + visuLastCompleted: number } diff --git a/src/model/UserStore.ts b/src/model/UserStore.ts index 3e483e8..39a3dc8 100644 --- a/src/model/UserStore.ts +++ b/src/model/UserStore.ts @@ -28,4 +28,5 @@ export interface IUserState { resStatus?: number x_auth_token?: string isLogged?: boolean + isAdmin?: boolean } diff --git a/src/myconfig/index.ts b/src/myconfig/index.ts index fd4ea46..44e11b2 100644 --- a/src/myconfig/index.ts +++ b/src/myconfig/index.ts @@ -1,10 +1,6 @@ export default { // apiGraphQL: 'http://localhost:8000/graphql', i18n: { - languages: [ - { code: 'it', name: 'Italiano', active: true }, - { code: 'en-uk', name: 'English', active: true } - ], default: 'it', fallbackTo: 'it' }, diff --git a/src/plugins/dragula.js b/src/plugins/dragula.js new file mode 100644 index 0000000..76abac7 --- /dev/null +++ b/src/plugins/dragula.js @@ -0,0 +1,10 @@ +import Vue from 'vue' +import { Vue2Dragula } from 'vue2-dragula' + +export default ({ Vue }) => { + Vue.use(Vue2Dragula, { + logging: { + service: false // to only log methods in service (DragulaService) + } + }) +} diff --git a/src/plugins/guard.js b/src/plugins/guard.js index 1dc69bc..45dde93 100644 --- a/src/plugins/guard.js +++ b/src/plugins/guard.js @@ -8,8 +8,47 @@ export default ({ app, router, store, Vue }) => { // *** Per non permettere di accedere alle pagine in cui è necessario essere Loggati ! *** // ****************************************** - /* + // Creates a `nextMiddleware()` function which not only +// runs the default `next()` callback but also triggers +// the subsequent Middleware function. + function nextFactory(context, middleware, index) { + const subsequentMiddleware = middleware[index] + // If no subsequent Middleware exists, + // the default `next()` callback is returned. + if (!subsequentMiddleware) return context.next + + return (...parameters) => { + // Run the default Vue Router `next()` callback first. + context.next(...parameters) + // Then run the subsequent Middleware with a new + // `nextMiddleware()` callback. + const nextMiddleware = nextFactory(context, middleware, index + 1) + subsequentMiddleware({ ...context, next: nextMiddleware }) + }; + } + router.beforeEach((to, from, next) => { + if (to.meta.middleware) { + const middleware = Array.isArray(to.meta.middleware) + ? to.meta.middleware + : [to.meta.middleware]; + + const context = { + from, + next, + router, + to, + }; + const nextMiddleware = nextFactory(context, middleware, 1) + + return middleware[0]({ ...context, next: nextMiddleware }) + } + + return next() + }) + + + /*router.beforeEach((to, from, next) => { var accessToken = store.state.session.userSession.accessToken // ESTANDO LOGEADO if (accessToken) { @@ -45,6 +84,6 @@ export default ({ app, router, store, Vue }) => { next('/') } } - }) - */ + })*/ + } diff --git a/src/plugins/i18n.js b/src/plugins/i18n.js index fc70103..8ca36c0 100644 --- a/src/plugins/i18n.js +++ b/src/plugins/i18n.js @@ -1,10 +1,28 @@ // src/plugins/i18n.js import VueI18n from 'vue-i18n'; import messages from 'src/statics/i18n'; +import { tools } from "../store/Modules/tools"; export default ({ app, store, Vue }) => { Vue.use(VueI18n); - Vue.config.lang = process.env.LANG_DEFAULT; + // Vue.config.lang = process.env.LANG_DEFAULT; + + let mylang = tools.getItemLS(tools.localStorage.lang) + + if ((navigator) && (mylang === '')) { + mylang = navigator.language + console.log(`LANG NAVIGATOR ${mylang}`) + } + + if (mylang === '') + mylang = process.env.LANG_DEFAULT; + + if (mylang.toLowerCase() === 'es-es') + mylang = 'esEs' + + console.log('MYLANG2=', mylang) + console.log('process.env.LANG_DEFAULT=', process.env.LANG_DEFAULT) + Vue.config.lang = mylang // console.log("PLUGINS INIT...."); @@ -13,8 +31,9 @@ export default ({ app, store, Vue }) => { // Set i18n instance on app app.i18n = new VueI18n({ - locale: process.env.LANG_DEFAULT, - fallbackLocale: process.env.LANG_DEFAULT, + locale: mylang, + fallbackLocale: mylang, messages }) } + diff --git a/src/root/home/home.scss b/src/root/home/home.scss index 6580a26..365d49a 100644 --- a/src/root/home/home.scss +++ b/src/root/home/home.scss @@ -1,3 +1,219 @@ .mycard { visibility: hidden; } + +.landing { + background: #000 url(../../statics/images/cover.jpg) no-repeat 50% fixed; + background-size: cover +} + +.landing > section { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + padding: 0 16px +} + +.landing > section.padding { + padding: 180px 16px +} + +.landing > section > div { + position: relative; + max-width: 1040px; + width: 100% +} + +.landing__toolbar { + background: -webkit-gradient(linear, left top, left bottom, from(#000), to(transparent)); + background: linear-gradient(180deg, #000, transparent); + padding: 0 !important +} + +.landing__toolbar .q-btn { + border-radius: 0 0 5px 5px; + -ms-flex-item-align: stretch; + align-self: stretch +} + +.landing__hero { + min-height: 100vh +} + +.landing__header { + height: 18vh +} + +.landing__arrow { + bottom: 8px; + opacity: .4 +} + +.landing__front { + background: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(15%, rgba(0, 0, 0, .6))); + background: linear-gradient(180deg, transparent, rgba(0, 0, 0, .6) 15%) +} + +.landing__logo { + width: 150px; + height: 150px; + margin-top: 21px; + -webkit-animation: logo-rotate 240s linear infinite; + animation: logo-rotate 240s linear infinite +} + +.landing__features .q-icon { + font-size: 64px +} + +.landing__features h4, .landing__features h6 { + margin: 26px 0 +} + +.landing__features p { + opacity: .6; + font-size: 16px +} + +.landing__footer { + background: -webkit-gradient(linear, left top, left bottom, color-stop(65%, rgba(0, 0, 0, .1)), to(#000)); + background: linear-gradient(180deg, rgba(0, 0, 0, .1) 65%, #000); + padding-top: 72px !important; + //padding-bottom: 72px !important +} + +.landing__footer .doc-link { + color: #fff +} + +.landing__footer .doc-link:hover { + opacity: .8 +} + +.landing__swirl-bg { + background-repeat: no-repeat !important; + background-position: top; + background-size: contain !important; + background-image: url(https://cdn.quasar-framework.org/img/landing_first_section.png) !important +} + +@media (max-width: 718px) { + .landing__hero { + text-align: center + } + .landing__header { + height: 9vh + } + .landing__hero .text-h1 { + font-size: 3rem; + line-height: 3.05rem; + margin-bottom: 24px + } + .landing > section.padding { + padding-top: 50px; + //padding-bottom: 90px + } + .landing .feature-item { + text-align: center + } + .landing__hero-content { + //padding-bottom: 180px + } + .landing__hero-btns { + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center + } +} + +body.mobile .landing { + background: unset +} + +body.mobile .landing:before { + content: ""; + position: fixed; + top: 0; + height: 100vh; + left: 0; + right: 0; + bottom: 0; + z-index: -1; + background: #000 url(../../statics/images/cover.jpg) 50%; + background-size: cover +} + +@-webkit-keyframes logo-rotate { + to { + -webkit-transform: rotate(-1turn); + transform: rotate(-1turn) + } +} + +@keyframes logo-rotate { + to { + -webkit-transform: rotate(-1turn); + transform: rotate(-1turn) + } +} + + + + +.home { + //background-color: rgb(250, 250, 250); + padding: 5px; + display: flex; + //flex-wrap: nowrap; + flex-direction: column; + align-items: center; + justify-content: space-between; +} + +.btn-start { + margin: 5px; +} + +.shadow { + //color: white; + text-shadow: 2px 2px 4px #000000; +} + +.shadow-max { + //color: white; + text-shadow: 4px 4px 8px #000000; +} + + +.text-h1 { + font-size: 6rem; + font-weight: 300; + line-height: 6rem; + letter-spacing: -.01562em; +} + +.text-weight-bold { + font-weight: 700; +} + +.text-subtitle1 { + font-size: 1.25rem; + font-weight: 400; + line-height: 1.75rem; + letter-spacing: .00937em; + &.big { + font-size: 1.5rem; + } +} +.text-subtitle2 { + + font-size: 1rem; + font-weight: 400; + line-height: 1.75rem; + letter-spacing: .00937em; +} + + diff --git a/src/root/home/home.ts b/src/root/home/home.ts index 8f62da5..20508b3 100644 --- a/src/root/home/home.ts +++ b/src/root/home/home.ts @@ -1,6 +1,6 @@ import Vue from 'vue' import { Component } from 'vue-property-decorator' -import { GlobalStore } from '@store' +import { GlobalStore, UserStore } from '@store' import { Logo } from '../../components/logo' @@ -26,9 +26,29 @@ export default class Home extends Vue { created() { // console.log('Home created...') + GlobalStore.actions.prova() } + get isLogged(){ + return UserStore.state.isLogged + } + + + meta() { + return { + keywords: { name: 'keywords', content: 'Quasar website' }, + // meta tags + meta: { + mykey: { name: 'mykey', content: 'Key 1' }, + description: { name: 'description', content: 'Page 1' }, + keywords: { name: 'keywords', content: 'Quasar website' }, + equiv: { 'http-equiv': 'Content-Type', content: 'text/html; charset=UTF-8' } + } + } + } + + mystilecard() { return { visibility: this.cardvisible, @@ -43,10 +63,10 @@ export default class Home extends Vue { set conta(valore) { GlobalStore.actions.setConta(valore) let my = this.$q.i18n.lang - this.showNotification(String(my)) + this.showNotif(String(my)) } - showNotification(message: string, color = 'primary', icon = '') { + showNotif(message: string, color = 'primary', icon = '') { this.$q.notify({ color, icon, @@ -66,23 +86,35 @@ export default class Home extends Vue { } + get isInCostruction () { + return process.env.IN_CONSTRUCTION === '1' + } + getPermission() { return Notification.permission } - NotServiceWorker () { + NotServiceWorker() { return (!('serviceWorker' in navigator)) } + PagLogin () { + this.$router.replace('/signin') + } + + PagReg () { + this.$router.replace('/signup') + } + displayConfirmNotification() { let options = null if ('serviceWorker' in navigator) { options = { body: 'You successfully subscribed to our Notification service!', icon: '/statics/icons/app-icon-96x96.png', - image: '/src/images/sf-boat.jpg', + image: '/statics/images/sf-boat.jpg', dir: 'ltr', - lang: 'en-US', // BCP 47, + lang: 'enUs', // BCP 47, vibrate: [100, 50, 200], badge: '/statics/icons/app-icon-96x96.png', tag: 'confirm-notification', @@ -139,7 +171,7 @@ export default class Home extends Vue { icon: '/statics/icons/android-chrome-192x192.png', image: '/statics/images/freeplanet.png', dir: 'ltr', - lang: 'en-US', // BCP 47, + lang: 'enUs', // BCP 47, vibrate: [100, 50, 200], badge: '/statics/icons/android-chrome-192x192.png', tag: 'confirm-notification', @@ -157,16 +189,18 @@ export default class Home extends Vue { } } + + askfornotification() { - this.showNotification(this.$t('notification.waitingconfirm'), 'positive', 'notifications') + this.showNotif(this.$t('notification.waitingconfirm'), 'positive', 'notifications') let mythis = this Notification.requestPermission(function (result) { console.log('User Choice', result) if (result === 'granted') { - mythis.showNotification(mythis.$t('notification.confirmed'), 'positive', 'notifications') + mythis.showNotif(mythis.$t('notification.confirmed'), 'positive', 'notifications') } else { - mythis.showNotification(mythis.$t('notification.denied'), 'negative', 'notifications') + mythis.showNotif(mythis.$t('notification.denied'), 'negative', 'notifications') // displayConfirmNotification(); } diff --git a/src/root/home/home.vue b/src/root/home/home.vue index 7813d58..5c6cb7c 100644 --- a/src/root/home/home.vue +++ b/src/root/home/home.vue @@ -1,31 +1,106 @@ -