Salah 0.6: restore user-confirmed smooth v0.3 native list

README.md

@@ -19,18 +19,19 @@ Morocco (Ministry of Habous), matching AlAdhan `method=21`:
 All computation happens **on the watch** — no GPS, no network. Pure solar math
 (same Meeus approach as the sundial) lives in `src/common/prayer.js`.
 
-## Screen (v0.3)
+## Screen (v0.6)
 
-- Pure #000000 AMOLED background, including the list and prayer rows
+- Restores the exact native list markup, row styles and page logic from v0.3,
-- Larger 42px clock, 28px prayer names and 36px times
+  which the user confirmed scrolled smoothly on their watch
-- Native vertically swipe-scrollable list: 80px rows in a 320×240px viewport
+- Removes ALL scroll handlers, zoom logic and dynamic font-style bindings
-- Top/bottom spacers let the first and last prayers scroll to the center
+- Fixed 28px prayer names and 36px times, side by side in 80px rows
-- Fixed next-prayer countdown; lavender outline/text highlight the next prayer
+- Pure black background; enlarged 50px header clock; no swipe hint
-- Normal system back button exits; no crown support assumed
+- Next-prayer countdown above the list; normal system back exits
-- 15s refresh; no changes to prayer calculations
 
-Build and automated tests pass; v0.3 scrolling/rendering needs an on-watch check.
+The user reported v0.4 and v0.5 lag during swiping (not only when stopping).
-`preview-0.3.png` is a static layout mock with illustrative times, not a watch screenshot.
+`tests/native-scroll.cjs` verifies parity with the smooth v0.3 baseline and
+absence of the zoom path. v0.6 tests/build pass; device smoothness still needs
+confirmation. Old preview images document earlier releases, not v0.6.
 
 ## Project layout
 
@@ -56,6 +57,7 @@ npm run release
 node tests/prayer.cjs
 node tests/page.cjs
 node tests/amoled.cjs
+node tests/native-scroll.cjs
 ```
 
 ## Install

src/manifest.json

@@ -2,8 +2,8 @@
   "package": "com.ilias.salah",
   "name": "SALAH",
   "icon": "/common/icon.png",
-  "versionName": "0.3",
+  "versionName": "0.6",
-  "versionCode": 3,
+  "versionCode": 6,
   "minAPILevel": 1,
   "deviceTypeList": [
     "watch"

src/pages/index/index.ux

@@ -14,7 +14,6 @@
       </list-item>
       <list-item type="spacer" class="spacer"><div></div></list-item>
     </list>
-    <text class="hint">SWIPE TO SCROLL</text>
   </div>
 </template>
 <script>
@@ -82,8 +81,8 @@ export default {
 </script>
 <style>
 .page { width: 466px; height: 466px; background-color: #000000; }
-.city { position: absolute; top: 26px; left: 103px; width: 260px; height: 26px; color: #aaa5b5; font-size: 20px; text-align: center; }
+.city { position: absolute; top: 12px; left: 103px; width: 260px; height: 26px; color: #aaa5b5; font-size: 20px; text-align: center; }
-.clock { position: absolute; top: 52px; left: 103px; width: 260px; height: 48px; color: #ffffff; font-size: 42px; text-align: center; }
+.clock { position: absolute; top: 35px; left: 103px; width: 260px; height: 56px; color: #ffffff; font-size: 50px; text-align: center; }
 .banner { position: absolute; top: 104px; left: 53px; width: 360px; height: 36px; background-color: #000000; flex-direction: row; justify-content: center; align-items: center; }
 .bannerLabel { color: #c5a3ff; font-size: 24px; margin-right: 8px; }
 .bannerTime { color: #ffffff; font-size: 26px; font-weight: bold; }
@@ -95,5 +94,4 @@ export default {
 .nameNext { color: #c5a3ff; font-weight: bold; }
 .rowTime { color: #ffffff; font-size: 36px; }
 .timeNext { color: #c5a3ff; font-weight: bold; }
-.hint { position: absolute; top: 403px; left: 103px; width: 260px; height: 24px; color: #aaa5b5; font-size: 18px; text-align: center; }
 </style>

tests/native-scroll.cjs

@@ -0,0 +1,15 @@
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const {execFileSync} = require('node:child_process')
+const src = fs.readFileSync('src/pages/index/index.ux','utf8')
+const baseline = execFileSync('git',['show','8e660f4:src/pages/index/index.ux'],{encoding:'utf8'})
+assert.ok(!/onscroll|onScroll|applyFocus|timeStyle|nameStyle|_scrolling|_scrollY/.test(src), 'remove the entire scroll-driven zoom path')
+assert.equal(src.match(/<list\b[\s\S]*?<\/list>/)[0], baseline.match(/<list\b[\s\S]*?<\/list>/)[0], 'native list markup matches user-confirmed smooth v0.3')
+assert.equal(src.match(/<script>[\s\S]*?<\/script>/)[0], baseline.match(/<script>[\s\S]*?<\/script>/)[0], 'page logic matches smooth v0.3')
+for(const name of ['prayers','spacer','row','rowName','rowTime','rowNext','nameNext','timeNext']) {
+ const re = new RegExp('\\.'+name+'\\s*\\{[^}]+}')
+ assert.equal(src.match(re)[0],baseline.match(re)[0],name+' uses proven static styling')
+}
+assert.ok(!src.includes('SWIPE TO SCROLL'))
+assert.match(src,/font-size: 50px;/,'keep enlarged header clock')
+console.log('Exact v0.3 list, row styles and script parity verified; zoom code absent; larger clock and no hint retained')