lumpiajs 1.0.12 → 1.0.14

package/be-tester/app/controllers/HomeController.lmp

@@ -0,0 +1,14 @@
+import { Controller } from 'lumpiajs';
+
+export default class HomeController extends Controller {
+    mengko index() {
+        // Pake Bahasa Semarangan, Lur!
+        paten pesen = 'Sugeng Rawuh di Website Statis!';
+        
+        // 'aku' menggantikan 'this'
+        balek aku->tampil('home', { 
+            message: pesen,
+            info: 'Dibuat dengan LumpiaJS'
+        });
+    }
+}

package/be-tester/app/controllers/ProductController.lmp

@@ -0,0 +1,20 @@
+import { Controller } from 'lumpiajs';
+
+export default class ProductController extends Controller {
+    mengko tampilBarang() {
+        // Contoh API
+        ono data = [];
+        
+        jajal {
+            paten respon = nteni fetch('https://fakestoreapi.com/products?limit=3');
+            data = nteni respon.json();
+            kandani('Data sukses!');
+        } gagal (e) {
+            kandani(e);
+        }
+
+        balek aku->tampil('product', { 
+            daftar: data.map(i => '<li>' + i.title + '</li>').join('')
+        });
+    }
+}

package/be-tester/aset/css/style.css

@@ -0,0 +1 @@
+@tailwind base; @tailwind components; @tailwind utilities;

package/be-tester/config.lmp

@@ -0,0 +1,3 @@
+{
+  "klambi": "tailwindcss"
+}

package/be-tester/dist/.htaccess

@@ -0,0 +1,7 @@
+<IfModule mod_rewrite.c>
+RewriteEngine On
+RewriteRule ^index\.html$ - [L]
+RewriteCond %{REQUEST_FILENAME} !-f
+RewriteCond %{REQUEST_FILENAME} !-d
+RewriteRule . index.html [L]
+</IfModule>

package/be-tester/dist/app/controllers/HomeController.js

@@ -0,0 +1,14 @@
+import { Controller } from 'lumpiajs';
+
+export default class HomeController extends Controller {
+    async index() {
+        // Pake Bahasa Semarangan, Lur!
+        const pesen = 'Sugeng Rawuh di Website Statis!';
+        
+        // 'aku' menggantikan 'this'
+        return this.tampil('home', { 
+            message: pesen,
+            info: 'Dibuat dengan LumpiaJS'
+        });
+    }
+}

package/be-tester/dist/app/controllers/ProductController.js

@@ -0,0 +1,20 @@
+import { Controller } from 'lumpiajs';
+
+export default class ProductController extends Controller {
+    async tampilBarang() {
+        // Contoh API
+        let data = [];
+        
+        try {
+            const respon = await fetch('https://fakestoreapi.com/products?limit=3');
+            data = await respon.json();
+            console.log('Data sukses!');
+        } catch(e) {
+            console.log(e);
+        }
+
+        return this.tampil('product', { 
+            daftar: data.map(i => '<li>' + i.title + '</li>').join('')
+        });
+    }
+}

package/be-tester/dist/core/lumpia.js

@@ -0,0 +1,54 @@
+
+export class Controller {
+    constructor() { this.params={}; }
+    async tampil(viewName, data={}) {
+        try {
+            // Fetch view must be relative to root of dist.
+            // Since we use Import Map, we are modernized. 
+            // Better to assume deployment at known base or use explicit relative if possible.
+            // But fetch('views/...') is relative to current page URL.
+            // If current page is /2025/lumpiajs/produk, fetch('views/home.lmp') -> /2025/lumpiajs/views/home.lmp (Works!)
+            // Wait, if /produk is virtual path, browser thinks we are in folder /lumpiajs/.
+            // If /produk/detail/1 -> browser thinks folder is /lumpiajs/produk/detail/.
+            // Fetch 'views/...' will fail (404).
+            
+            // SOLUSI: Selalu fetch dari ROOT relative (pakai Window Base yang kita set di index.html)
+            const basePath = window.LUMPIA_BASE || '';
+            // Ensure slash
+            const url = basePath + '/views/' + viewName + '.lmp';
+            
+            const res = await fetch(url.replace('//', '/')); // simple cleanup
+            if(!res.ok) throw new Error('View 404: ' + viewName);
+            let html = await res.text();
+            
+            const matchKulit = html.match(/<kulit>([\s\S]*?)<\/kulit>/);
+            const matchIsi = html.match(/<isi>([\s\S]*?)<\/isi>/); 
+            const matchKlambi = html.match(/<klambi>([\s\S]*?)<\/klambi>/);
+            
+            let body = matchKulit?matchKulit[1]:'', script=matchIsi?matchIsi[1]:'', css=matchKlambi?matchKlambi[1]:'';
+
+            for(const [k,v] of Object.entries(data)) {
+                let s = typeof v === 'object' ? JSON.stringify(v) : v;
+                body = body.replace(new RegExp('{{\\s*'+k+'\\s*}}','g'), s);
+            }
+            
+            document.getElementById('app').innerHTML = body;
+            if(css && !document.getElementById('css-'+viewName)) {
+                const s = document.createElement('style'); s.id='css-'+viewName; s.textContent=css;
+                document.head.appendChild(s);
+            }
+            
+            if(script) {
+                const kamus = [
+                    {f:/paten\s/g,t:'const '}, {f:/ono\s/g,t:'let '}, {f:/fungsi\s/g,t:'function '},
+                    {f:/nteni\s/g,t:'await '}, {f:/mengko\s/g,t:'async '}, {f:/balek\s/g,t:'return '},
+                    {f:/yen\s*\(/g,t:'if('}, {f:/liyane\s/g,t:'else '}, {f:/kandani\(/g,t:'console.log('},
+                    {f:/aku->/g,t:'this.'}, {f:/aku\./g,t:'this.'}
+                ];
+                kamus.forEach(r => script = script.replace(r.f, r.t));
+                try { new Function(script)(); } catch(e){ console.error(e); }
+            }
+        } catch(e) { document.getElementById('app').innerHTML = e.message; }
+    }
+}
+export const Jalan = { routes:[], get:(p,a)=>Jalan.routes.push({p,a}) };

package/be-tester/dist/index.html

@@ -0,0 +1,84 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width,initial-scale=1.0">
+    <title>LumpiaJS</title>
+    <!-- IMPORT MAP: KUNCI SUKSES LOAD MODULE DI SUBFOLDER -->
+    <script type="importmap">
+    {
+        "imports": {
+            "lumpiajs": "./core/lumpia.js"
+        }
+    }
+    </script>
+    <link rel="stylesheet" href="public/css/style.css">
+    <script>
+        // DETEKSI BASE PATH DENGAN LEBIH AMAN (Via current script location fallback)
+        // Kita ambil lokasi index.html ini sebagai 'Source of Truth' root aplikasi.
+        window.LUMPIA_BASE = window.location.pathname
+            .replace(new RegExp('/index\\.html$'), '')
+            .replace(new RegExp('/$'), '');
+        // console.log('Base:', window.LUMPIA_BASE);
+    </script>
+</head>
+<body>
+    <div id="app">Loading...</div>
+    
+    <script type="module">
+        // Import Map makes this work:
+        import { Jalan } from './routes/web.js';
+        
+        async function navigate() {
+            let currentPath = window.location.pathname;
+            
+            // Normalize: Strip Base Path
+            if (window.LUMPIA_BASE && currentPath.startsWith(window.LUMPIA_BASE)) {
+                currentPath = currentPath.substring(window.LUMPIA_BASE.length);
+            }
+            if (!currentPath || currentPath === '/index.html') currentPath = '/';
+
+            let m = null, args = {};
+            for(let r of Jalan.routes) {
+                let regexStr = '^' + r.p.replace(/{([a-zA-Z0-9_]+)}/g, '([^/]+)') + '$';
+                let reg = new RegExp(regexStr);
+                let res = currentPath.match(reg);
+                if(res){ m=r; args=res.slice(1); break; }
+            }
+
+            if(m) {
+                const [cName, fName] = m.a.split('@');
+                try {
+                    // Import Relative to index.html (selalu root dist)
+                    const mod = await import('./app/controllers/'+cName+'.js?'+Date.now());
+                    const C = mod.default; const i = new C(); i.params=args;
+                    await i[fName](...args);
+                } catch(e) { 
+                    console.error(e); 
+                    document.getElementById('app').innerHTML='<h1>Error</h1><pre>'+e.message+'</pre>'; 
+                }
+            } else { 
+                document.getElementById('app').innerHTML='<h1>404 Not Found</h1><p>Route: '+currentPath+'</p>'; 
+            }
+        }
+
+        window.addEventListener('popstate', navigate);
+        
+        // SPA LINK INTERCEPTOR (SAT SET MODE)
+        document.body.addEventListener('click', e => {
+            // Cari elemen <a> (bisa jadi klik di span dalam a)
+            const link = e.target.closest('a');
+            if (link && link.href.startsWith(window.location.origin)) {
+                // Ignore if target blank or control click
+                if (link.target === '_blank' || e.ctrlKey) return;
+
+                e.preventDefault(); 
+                history.pushState(null, '', link.href); 
+                navigate();
+            }
+        });
+        
+        navigate();
+    </script>
+</body>
+</html>

package/be-tester/dist/public/css/style.css

@@ -0,0 +1 @@
+*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/*! tailwindcss v3.4.19 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}

package/be-tester/dist/routes/web.js

@@ -0,0 +1,4 @@
+import { Jalan } from 'lumpiajs';
+
+Jalan.get('/', 'HomeController@index');
+Jalan.get('/toko', 'ProductController@tampilBarang');

package/be-tester/dist/views/home.lmp

@@ -0,0 +1,12 @@
+<lump>
+  <klambi>
+      h1 { color: #d35400; text-align: center; }
+  </klambi>
+  <kulit>
+    <div style="text-align: center; font-family: sans-serif; margin-top: 50px;">
+      <h1>{{ message }}</h1>
+      <p>{{ info }}</p>
+      <a href="/toko">Cek Toko Sebelah</a>
+    </div>
+  </kulit>
+</lump>

package/be-tester/dist/views/product.lmp

@@ -0,0 +1,9 @@
+<lump>
+  <kulit>
+    <div style="padding: 20px; font-family: sans-serif;">
+      <h1>Daftar Barang</h1>
+      <ul>{{ daftar }}</ul>
+      <a href="/">Balik Omah</a>
+    </div>
+  </kulit>
+</lump>