feat(staging): added transfer for data from settings app(part 2)

app-side/index.js

@@ -1,13 +1,16 @@
+import { BaseSideService } from "@zeppos/zml/base-side"
+
 AppSideService(
+  BaseSideService(
     {
       onInit(){
-        settings.settingsStorage.addListener('change', async ({ key, newValue, oldValue }) => {
+
-             console.log(key)
+      },
-             console.log(newValue)
+      onRequest(req, res){
-             const totps = settings.settingsStorage.getItem('TOTPs')
+        if(req.method === 'totps'){
-             const dataBuffer = Buffer.from(totps)
+          res(null, settings.settingsStorage.getItem('TOTPs'))
-             messaging.peerSocket.send(dataBuffer.buffer)
+        }
-        })
       }
     }
   )
+)

app.js

@@ -1,25 +1,15 @@
+import { BaseApp } from "@zeppos/zml/base-app"
 import { TOTP } from "./lib/totp-quickjs"
-import { LocalStorage } from "@zos/storage"
 
-const localStorage = new LocalStorage()
+App(
-App({
+  BaseApp(
+    {
       globalData: {
-    TOTPS: localStorage.getItem('TOTPs') || []
+        TOTPS: []
       },
-  onCreate(options) {
+      onCreate() {
-    //  localStorage.setItem('TOTPs', [
-    //   new TOTP('JBSWY3DPEHPK3PXP', 'totp.danhersam.com', 'I1122222222', 6, 30, 0, 'SHA-1'),
-    //   new TOTP('JBSWY3DPEHPK3PXP', 'totp.danhersam.com', 'I2', 6, 30, 5, 'SHA-1'),
-    //   new TOTP('JBSWY3DPEHPK3PXP', 'totp.danhersam.com', 'I3', 6, 30, -5, 'SHA-1'),
-    //   new TOTP('JBSWY3DPEHPK3PXP', 'totp.danhersam.com', 'I4', 6, 30, 0, 'SHA-1'),
-    //   new TOTP('JBSWY3DPEHPK3PXP', 'totp.danhersam.com', 'I5', 6, 30, 0, 'SHA-1'),
-    //   new TOTP('JBSWY3DPEHPK3PXP', 'totp.danhersam.com', 'I6', 6, 30, 0, 'SHA-1'),
-    //   new TOTP('JBSWY3DPEHPK3PXP', 'totp.danhersam.com', 'I7', 6, 30, 0, 'SHA-1'),
-    //   new TOTP('JBSWY3DPEHPK3PXP', 'totp.danhersam.com', 'I8', 6, 30, 0, 'SHA-1')
-    // ])
       },    
-
+      onDestroy() {
-  onDestroy(options) {
-    console.log('app on destroy invoke')
       }
-})
+    })
+)

app.json

@@ -18,9 +18,9 @@
   ],
   "runtime": {
     "apiVersion": {
-      "compatible": "3.5.0",
+      "compatible": "3.0.0",
-      "target": "3.5.0",
+      "target": "3.0.0",
-      "minVersion": "3.5"
+      "minVersion": "3.0"
     }
   },
   "targets": {

page/index.js

@@ -1,23 +1,47 @@
-import { setStatusBarVisible } from '@zos/ui'
 import { RenderAddButton } from './render/totpRenderer'
 import { initLoop } from './render/index/renderer'
+import { BasePage } from '@zeppos/zml/base-page'
+import { LocalStorage } from "@zos/storage"
 
+const localStorage = new LocalStorage()
 const app = getApp()
-
+let waitForFetch = true;
-Page({
+Page(
+	BasePage({
 		onInit() {
-		//If app has no saved TOTPs
+			this.getTOTPData().then((x) => {
-		if (app._options.globalData.TOTPS.length < 1)
+				console.log(x)
-			setStatusBarVisible(true)
+				localStorage.setItem('TOTPs', x)
-		else
+				app._options.globalData.TOTPS = x
-			setStatusBarVisible(false)
+				this.initPage();
+			})
+			.catch((x) => {
+			 	app._options.globalData.TOTPS = localStorage.getItem('TOTPs')
+				this.initPage()
+			 })
 		},
 		build() {
+			let fetch = setInterval(() => {
+				if(waitForFetch)
+					return;
+
+				clearInterval(fetch);
 				const buffer = app._options.globalData.TOTPS
-		if (buffer.length < 1)
+				if (buffer.length < 1){
 					RenderAddButton('page/tip')
-		else{
+				}
+				else {
 					initLoop(buffer)
 				}
+			}, 100);
+		},
+		initPage() {
+			waitForFetch = false;
+		},
+		getTOTPData() {
+			return this.request({
+				method: 'totps'
+			})
 		}
-})
+	})
+)

page/render/index/renderer.js

@@ -1,6 +1,6 @@
-import { deleteWidget, prop } from "@zos/ui";
+import { prop } from "@zos/ui";
 import { TOTP } from "../../../lib/totp-quickjs";
-import { RenderAddButton, RenderExpireBar, RenderOTPValue, RenderTOTPContainer } from '../totpRenderer'
+import { RenderExpireBar, RenderOTPValue, RenderTOTPContainer } from '../totpRenderer'
 
 /**
  * 

page/render/totpRenderer.js

@@ -12,6 +12,7 @@ const containerRadius = 20 //Corner radius of container
 
 const textColor = 0xa0a0a0 //Color of TOTP description text
 const textSize = 24 //Size of TOTP description text
+const statusBarPading = 65
 
 /** Function for render box container for TOTP values
  * 
@@ -112,4 +113,4 @@ export function RenderAddButton(pagePath) {
     })
 }
 
-function getYPos(position) { return position * (buttonHeight + 10) }
+function getYPos(position) { return position * (buttonHeight + 10) + statusBarPading }

page/tip.js

@@ -2,18 +2,20 @@ import { createWidget, widget, align } from "@zos/ui";
 import { getDeviceInfo } from "@zos/device";
 import { onGesture, GESTURE_LEFT } from '@zos/interaction'
 import { back } from "@zos/router";
-Page({
+import { BasePage } from "@zeppos/zml/base-page";
-    onInit(){
+Page(
+    BasePage({
+        onInit() {
             onGesture({
                 callback(event) {
-                if(event === GESTURE_LEFT){
+                    if (event === GESTURE_LEFT) {
                         back()
                     }
                 }
             })
         },
         build() {
-        const {width, height} = getDeviceInfo()
+            const { width, height } = getDeviceInfo()
             createWidget(widget.TEXT, {
                 x: 0,
                 w: width,
@@ -25,4 +27,5 @@ Page({
                 text: 'To add TOTP record open\n settings on Zepp app'
             })
         }
-})
+    })
+)