Istruzioni per installare l'APP: Android, iOS

.env.development

@@ -1,4 +1,4 @@
-APP_VERSION="0.5.60"
+APP_VERSION="0.5.61"
 SERVICE_WORKER_FILE="service-worker.js"
 APP_ID="13"
 DIRECTORY_LOCAL="newfreeplanet"

.env.example.production

@@ -1,4 +1,4 @@
-APP_VERSION="0.5.60"
+APP_VERSION="0.5.61"
 SERVICE_WORKER_FILE="service-worker.js"
 APP_ID="13"
 DIRECTORY_LOCAL=newfreeplanet

_ALL_SITES/riso.app/.env.development

@@ -1,4 +1,4 @@
-APP_VERSION="0.5.60"
+APP_VERSION="0.5.61"
 SERVICE_WORKER_FILE="service-worker.js"
 APP_ID="13"
 DIRECTORY_LOCAL="newfreeplanet"

_ALL_SITES/riso.app/.env.production

@@ -1,4 +1,4 @@
-APP_VERSION="0.5.60"
+APP_VERSION="0.5.61"
 SERVICE_WORKER_FILE="service-worker.js"
 APP_ID="13"
 DIRECTORY_LOCAL=newfreeplanet

_ALL_SITES/terradellavisione.app/.env.development

@@ -1,4 +1,4 @@
-APP_VERSION="0.5.60"
+APP_VERSION="0.5.61"
 SERVICE_WORKER_FILE="service-worker.js"
 APP_ID="14"
 DIRECTORY_LOCAL="newfreeplanet"

package.json

@@ -123,15 +123,7 @@
     "crypto": false
   },
   "browserslist": [
-    "last 30 Chrome versions",
+    "defaults"
-    "last 30 Firefox versions",
-    "last 4 Edge versions",
-    "last 30 Safari versions",
-    "last 30 Android versions",
-    "last 30 ChromeAndroid versions",
-    "last 30 FirefoxAndroid versions",
-    "last 18 iOS versions",
-    "last 11 Opera versions"
   ],
   "engines": {
     "node": ">= 16.14.0",

quasar.conf.js

@@ -310,9 +310,11 @@ module.exports = configure((ctx) => ({
       description: 'Siamo la Rete Italiana di Scambio Orizzontale, abbiamo creato questa piattaforma per metterla al servizio di chi vuole riscoprire il valore della condivisione e della cooperazione. Valori semplici e profondi che ci aiutano a ritrovare il Senso della Vita, perduto in questa società consumista, e riporti quei Sani Pricìpi Naturali ed Umani di Fratellanza che intere popolazioni antiche conoscevano bene.',
       display: 'standalone',
       orientation: 'portrait',
-      background_color: '#ffffff',
+      background_color: '#fff',
       theme_color: '#027be3',
-      start_url: '/',
+      scope: "/",
+      id: "/?homescreen=1",
+      start_url: "/?homescreen=1",
       icons: [
         {
           src: 'images/riso-android-icon-512x512.png',
@@ -360,6 +362,10 @@ module.exports = configure((ctx) => ({
           type: 'image/png',
         },
       ],
+      related_applications: [{
+        "platform": "webapp",
+        "url": "https://test.riso.app/manifest.json"
+      }]
     },
   },
 

src/App.ts

@@ -28,6 +28,7 @@ export default {
     const $q = useQuasar()
     const userStore = useUserStore()
     const $router = useRouter()
+    const $route = useRoute()
     const globalStore = useGlobalStore()
     const { t } = useI18n();
 
@@ -82,6 +83,8 @@ export default {
       console.log('app mounted')
       darkcookie.value = tools.getCookie('darkmode', false, false, false) === '-1'
 
+      globalStore.homescreen = $route.query.homescreen ? $route.query.homescreen : ''
+
       scroll()
     }
 

src/components/CCheckAppRunning/CCheckAppRunning.ts

@@ -24,6 +24,11 @@ export default defineComponent({
     const finishLoading = computed(() => globalStore.finishLoading)
 
     const deferredPrompt = computed(() => globalStore.deferredPrompt)
+    const homescreen = computed(() => globalStore.homescreen)
+
+
+    const viewiOS = ref(false)
+    const viewAndroid = ref(false)
 
     function installApp() {
       if (globalStore.deferredPrompt) {
@@ -56,6 +61,9 @@ export default defineComponent({
       installApp,
       isAppRunning,
       deferredPrompt,
+      viewiOS,
+      viewAndroid,
+      homescreen,
     }
   }
 })

src/components/CCheckAppRunning/CCheckAppRunning.vue

@@ -2,11 +2,14 @@
   <div v-if="tools.isDebugOn()" class="bg-red text-white">
     <span> isAppRunning: {{ isAppRunning }} - </span>
     <span> deferredPrompt: {{ deferredPrompt }} - </span>
-    <span> finishLoading: {{finishLoading}} - </span>
+    <span> homescreen: {{ homescreen }} </span>
   </div>
-  <div v-if="finishLoading && !isAppRunning && deferredPrompt" class="row justify-center">
+  <div v-if="finishLoading" class="row justify-center">
+    <div v-if="!isAppRunning" class="q-ma-sm">
+      <!-- App not running -->
 
       <q-btn
+        v-if="deferredPrompt"
         glossy
         size="xl"
         label="Installa App"
@@ -14,7 +17,80 @@
         icon="fas fa-mobile-alt"
         color="green"
         text-color="white"
-    />
+      ></q-btn>
+      <div v-else>
+        <div v-if="$q.platform.is.ios && $q.platform.is.safari">
+          <q-btn
+            glossy
+            size="xl"
+            label="Installa App su iOS"
+            @click="viewiOS = !viewiOS"
+            icon="fab fa-apple"
+            color="green"
+            text-color="white"
+          ></q-btn>
+
+          <q-slide-transition>
+            <!-- Mostra spiegazione per iOS -->
+            <div v-if="viewiOS">
+              <q-img
+                src="images/install_app_on_ios_1.png"
+                fit="contain"
+                style="min-width: 350px"
+                class="q-my-sm"
+              ></q-img
+              ><br />
+
+              <q-img
+                src="images/install_app_on_ios_1b.jpg"
+                class="q-mb-md"
+              ></q-img
+              ><br />
+
+              <q-img
+                src="images/install_app_on_ios_2.jpg"
+                fit="contain"
+              ></q-img>
+            </div>
+          </q-slide-transition>
+        </div>
+        <div v-if="$q.platform.is.android">
+          <q-btn
+            glossy
+            size="lg"
+            label="Installa App su Android"
+            @click="viewAndroid = !viewAndroid"
+            icon="fab fa-android"
+            color="green"
+            text-color="white"
+          ></q-btn>
+
+          <q-slide-transition>
+            <!-- Mostra spiegazione per Android -->
+            <div v-if="viewAndroid">
+              <div class="q-ma-sm text-h6"> 1) Cliccare sui 3 puntini verticali<br>
+              2) Cliccare su 'Installa App' o 'Schermata Home'
+              </div>
+              <q-img
+                src="images/install_app_on_android_1.jpg"
+                fit="contain"
+                style="min-width: 350px"
+                class="q-my-sm"
+              ></q-img
+              ><br />
+              <q-img
+                src="images/install_app_on_android_2.jpg"
+                fit="contain"
+                style="min-width: 350px"
+                class="q-my-sm"
+              ></q-img
+              ><br />
+            </div>
+          </q-slide-transition>
+        </div>
+      </div>
+
+    </div>
   </div>
   <!--<div class="row justify-center">
     <CBigBtn

src/components/MyHeader/MyHeader.ts

@@ -76,8 +76,14 @@ export default defineComponent({
       // if (tools.isDebug()) return 'bg-info'
       if (globalStore.site && globalStore.site.confpages?.col_toolbar)
         return 'bg-' + globalStore.site.confpages?.col_toolbar
-      else
+      else {
+        if (globalStore.homescreen) {
+          return 'bg-blue'
+        } else {
           return 'bg-light-blue'
+        }
+      }
+
     })
 
     const getColorText = computed(() => {

src/model/GlobalStore.ts

@@ -459,8 +459,9 @@ export interface IGlobalState {
   editOn?: boolean,
   myselector: ISelector,
   addNewRecord: string,
-  isAppRunning: boolean
+  isAppRunning: boolean,
-  deferredPrompt: any
+  deferredPrompt: any,
+  homescreen: any,
 }
 
 export interface IMenuList {

src/statics/lang/it.js

@@ -618,7 +618,7 @@ const msg_it = {
         code_resetpwd_error: 'Il codice inserito non è corretto.',
         duplicate_email: 'l\'Email è già stata registrata',
         invalid_email: 'l\'Email non è valida',
-        invalid_email_micro: 'Questa tipo di email non è funzionante sui nostri server. Si consiglia di usare Gmail o altra casella.',
+        invalid_email_micro: 'Questa tipo di email non è funzionante sui nostri server. Si consiglia di usare Gmail o un\'altra email.',
         user_already_exist: 'La registrazione con questi dati (nome, cognome e cellulare) è stata già effettuata. Per accedere al sito, cliccare sul bottone LOGIN dalla HomePage.',
         user_extralist_not_found: 'Utente in archivio non trovato, inserire il Nome, Cognome e numero di cellulare comunicato nella lista nel 2019. Se questa è una nuova registrazione, dovete registrarvi tramite il LINK di chi vi sta invitando.',
         user_aportador_not_valid: 'Il link di registrazione non sembra risultare valido.',

src/store/Modules/tools.ts

@@ -7554,8 +7554,8 @@ export const tools = {
   },
 
   checkApp() {
-    console.log('checkApp')
     const globalStore = useGlobalStore()
+    console.log('checkApp (homescreen=', globalStore.homescreen)
 
     try {
       let displayMode = 'browser'
@@ -7569,7 +7569,7 @@ export const tools = {
       // prova altro 2
       console.log('displayMode = ', displayMode)
 
-      globalStore.isAppRunning = displayMode === 'standalone'
+      globalStore.isAppRunning = displayMode === 'standalone' || globalStore.homescreen
     } catch (e) {
       console.log('error navigator.standalone ?!')
     }

src/store/globalStore.ts

@@ -186,6 +186,7 @@ export const useGlobalStore = defineStore('GlobalStore', {
     addNewRecord: '',
     isAppRunning: false,
     deferredPrompt: null,
+    homescreen: '',
   }),
 
   getters: {