diff --git a/README.md b/README.md index 6003e81..a9107e9 100644 --- a/README.md +++ b/README.md @@ -19,24 +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.5) +## Screen (v0.6) -- Pure #000000 AMOLED background, large 50px clock, no swipe hint -- Prayer names above their times, in fixed 104px native list rows -- After scrolling stops, the nearest-center prayer gets a 60px time and 28px - label; other rows use 30px times and 20px labels -- No font resizing or row-array replacement during gesture/inertial scrolling -- Duplicate stop notifications do not repaint unchanged focus; periodic refresh - defers while scrolling and resumes normally after hiding/showing the app -- Scroll viewport 320×264 at x73/y101 (center y233); 80px end spacers -- Fixed countdown below the list; lavender next-prayer highlight -- Normal system back exits; calculation logic unchanged +- Restores the exact native list markup, row styles and page logic from v0.3, + which the user confirmed scrolled smoothly on their watch +- Removes ALL scroll handlers, zoom logic and dynamic font-style bindings +- Fixed 28px prayer names and 36px times, side by side in 80px rows +- Pure black background; enlarged 50px header clock; no swipe hint +- Next-prayer countdown above the list; normal system back exits -User reported watch lag in v0.4. A 500-event VM replay measured 500 row-array -replacements in v0.4 versus zero during scrolling in v0.5. This verifies reduced -update work, NOT device frame rate. All automated tests and release build pass; -on-watch smoothness still needs confirmation. `preview-0.4.png` remains an -illustrative static layout mock; the settled appearance is unchanged. +The user reported v0.4 and v0.5 lag during swiping (not only when stopping). +`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 @@ -62,8 +57,7 @@ npm run release node tests/prayer.cjs node tests/page.cjs node tests/amoled.cjs -node tests/focus.cjs -node tests/scroll-performance.cjs +node tests/native-scroll.cjs ``` ## Install diff --git a/src/manifest.json b/src/manifest.json index b7d592f..b0072a3 100644 --- a/src/manifest.json +++ b/src/manifest.json @@ -2,8 +2,8 @@ "package": "com.ilias.salah", "name": "SALAH", "icon": "/common/icon.png", - "versionName": "0.5", - "versionCode": 5, + "versionName": "0.6", + "versionCode": 6, "minAPILevel": 1, "deviceTypeList": [ "watch" diff --git a/src/pages/index/index.ux b/src/pages/index/index.ux index 4f08e3e..59d907e 100644 --- a/src/pages/index/index.ux +++ b/src/pages/index/index.ux @@ -6,11 +6,11 @@ {{ nextName }} in {{ countdown }} - +
- {{ row.label }} - {{ row.time }} + {{ row.label }} + {{ row.time }}
@@ -46,7 +46,6 @@ export default { }, onInit() {}, onShow() { - this._scrolling = false this.update() this.timer = setInterval(() => this.update(), 15000) // 15s cadence }, @@ -56,35 +55,7 @@ export default { onDestroy() { clearInterval(this.timer) }, - onScroll(event) { - if (!event || typeof event.scrollY !== 'number' || !isFinite(event.scrollY)) return - // Non-template bookkeeping only while the native list is moving. - this._scrollY = Math.max(0, Math.min(520, event.scrollY)) - this._scrolling = event.scrollState !== 0 - if (event.scrollState === 0) this.onScrollEnd() - }, - onScrollEnd() { - this._scrolling = false - this.applyFocus() - }, - applyFocus() { - const focused = Math.round((this._scrollY || 0) / 104) - let changed = false - const rows = this.rows.map((row, index) => { - const timeSize = index === focused ? '60px' : '30px' - const nameSize = index === focused ? '28px' : '20px' - if (row.timeStyle && row.timeStyle.fontSize === timeSize && - row.nameStyle && row.nameStyle.fontSize === nameSize) return row - changed = true - return Object.assign({}, row, { - timeStyle: { fontSize: timeSize }, - nameStyle: { fontSize: nameSize } - }) - }) - if (changed) this.rows = rows - }, update() { - if (this._scrolling) return const now = new Date() const hh = String(now.getHours()).padStart(2, '0') const mm = String(now.getMinutes()).padStart(2, '0') @@ -105,7 +76,6 @@ export default { passed: t[key] < nowMin, rowStyle: { width: ROW_WIDTHS[i] + 'px' } })) - this.applyFocus() } } @@ -113,15 +83,15 @@ export default { .page { width: 466px; height: 466px; background-color: #000000; } .city { position: absolute; top: 12px; left: 103px; width: 260px; height: 26px; color: #aaa5b5; font-size: 20px; 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: 383px; left: 53px; width: 360px; height: 36px; background-color: #000000; flex-direction: row; justify-content: center; align-items: 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; } -.prayers { position: absolute; top: 101px; left: 73px; width: 320px; height: 264px; flex-direction: column; background-color: #000000; } +.prayers { position: absolute; top: 146px; left: 73px; width: 320px; height: 240px; flex-direction: column; background-color: #000000; } .spacer { width: 320px; height: 80px; background-color: #000000; } -.row { width: 320px; height: 104px; background-color: #000000; flex-direction: column; justify-content: center; align-items: center; padding-left: 10px; padding-right: 10px; } +.row { width: 320px; height: 80px; background-color: #000000; flex-direction: row; justify-content: space-between; align-items: center; padding-left: 10px; padding-right: 10px; } .rowNext { border-width: 1px; border-color: #a779ef; border-radius: 18px; } -.rowName { width: 298px; height: 30px; text-align: center; color: #d0cbd6; font-size: 28px; } +.rowName { color: #d0cbd6; font-size: 28px; } .nameNext { color: #c5a3ff; font-weight: bold; } -.rowTime { width: 298px; height: 70px; text-align: center; color: #ffffff; font-size: 60px; } +.rowTime { color: #ffffff; font-size: 36px; } .timeNext { color: #c5a3ff; font-weight: bold; } diff --git a/tests/focus.cjs b/tests/focus.cjs deleted file mode 100644 index 1dedfa2..0000000 --- a/tests/focus.cjs +++ /dev/null @@ -1,40 +0,0 @@ -const assert = require('node:assert/strict') -const fs = require('node:fs') -const vm = require('node:vm') -const src = fs.readFileSync('src/pages/index/index.ux', 'utf8') -const body = src.match(/