Update 1.0.1

config.xml

@@ -1,7 +1,7 @@
 <?xml version='1.0' encoding='utf-8'?>
 <widget
         id="com.artifriends.frontle"
-        version="1.0.0"
+        version="1.0.1"
         xmlns="http://www.w3.org/ns/widgets"
         xmlns:cdv="http://cordova.apache.org/ns/1.0"
         xmlns:android="http://schemas.android.com/apk/res/android"

package.json

@@ -1,7 +1,7 @@
 {
   "name": "frontle-example-app",
   "description": "The easiest multi-platform SPA framework",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "author": "Artifriends, Inc. <[email protected]>",
   "contributors": [
     "Yun HyeongJun <[email protected]>",
@@ -40,7 +40,7 @@
     }
   },
   "dependencies": {
-    "@frontle/frontle-core": "^1.0.0",
+    "@frontle/frontle-core": "^1.0.1",
     "jquery": "^3.6.1"
   }
 }

www/version/@/app/main/main.css.js

@@ -1,21 +1,19 @@
-const mainCSS = () => {
+const css = () => {
   return /* css */ `
-    .mainLogo {
+    .logo {
       position: absolute;
-
+      width: 30vw;
       top: 50%;
       left: 50%;
       transform: translate(-50%, -50%);
-
-      width: 25vw;
     }
 
     @media screen and (max-width: 640px) {
-      .mainLogo {
-        width: 45vw;
+      .logo {
+        width: 60vw;
       }
     }
   `;
 };
 
-export default mainCSS;
+export default { css };

www/version/@/app/main/main.html.js

@@ -1,11 +1,21 @@
-import mainCSS from "./main.css.js";
+import mainCss from "./main.css.js";
+import { jquery } from "../../browser_modules/jquery/module.js"; // "frontle install jquery"
+const $ = jquery;
 
-const mainHTML = () => {
-  return /* html */ `
-    <style>${mainCSS()}</style>
-    
-    <img src="@/assets/img/Logo1.svg" class="mainLogo" />
+const render = () => {
+  document.getElementById("app").innerHTML = /* html */ `
+    <style>${mainCss.css()}</style>
+    <img class="logo" src="@/assets/img/Logo1.svg" />
   `;
 };
 
-export default mainHTML;
+// Changing the logo depending on whether the index is even or odd
+const changeLogo = (isIndexEven) => {
+  const src = isIndexEven ? "@/assets/img/Logo1.svg" : "@/assets/img/Logo2.svg";
+  $(".logo").attr("src", src);
+};
+
+export default {
+  render,
+  changeLogo,
+};

www/version/@/app/main/main.js

@@ -1,16 +1,26 @@
 import { frontle } from "../../browser_modules/@frontle/frontle-core/index.js";
-import mainHTML from "./main.html.js";
+import mainHtml from "./main.html.js";
 
 const main = (params) => {
-  // Add Page
-  document.getElementById("app").innerHTML = mainHTML();
+  const index = params.index || 0;
+  const isEvenNumber = index % 2 === 0;
 
-  // Go to demo page
-  setTimeout(() => {
-    frontle.util.pageMove("demo", {
-      testParams: "test1234",
-    });
-  }, 3000);
+  // Rendering
+  mainHtml.render();
+  mainHtml.changeLogo(isEvenNumber);
+
+  // Move the page and pass the "index" parameter
+  const timeout = setTimeout(() => {
+    frontle.util.pageMove("main", { index: index + 1 });
+  }, 5000);
+
+  // Clear setTimeout when back or forward buttons are pressed
+  const listener = () => {
+    clearTimeout(timeout);
+    return true; // Execute history.back or history.forward if listener returns true
+  };
+  frontle.event.back.addListener(listener);
+  frontle.event.forward.addListener(listener);
 };
 
 export default main;