DEV Community

Cover image for NaN Bug Fix
Weird Codes
Weird Codes

Posted on • Originally published at weirdcodes.itch.io

NaN Bug Fix

#javascript #gamedev

मोक्ष Devlog — शास्त्र-ग्रंथ अपडेट + NaN Bug Fix

Series: मोक्ष Devlog — Building a Vedic Karma Game
Tags: bugfix content shaashtra vanilla-js html5-canvas

संक्षेप

इस पैच में दो काम हुए:

  1. NaN Bug Fix — शास्त्र-ग्रंथ के हर page पर श्लोक की जगह "NaN" दिख रहा था। एक पुराना diff marker (+) accidentally source code में रह गया था — JavaScript उसे unary + operator मान रहा था।
  2. शास्त्र-ग्रंथ Content Update — नए mechanics (Gyroscope steering, Mobile touch controls, Chakravaata physics, Punarjanma types) जो implement तो हो गए थे, लेकिन शास्त्र में documented नहीं थे — वो भी जोड़े।

🐛 Bug Fix — श्लोक की जगह NaN

क्या दिख रहा था

शास्त्र खोलने पर — हर page पर — श्लोक की जगह:

NaN
— गीता ४.३७
Enter fullscreen mode Exit fullscreen mode

Punya/Paap/Prarabdha sab theek tha, sirf shlok block broken tha.

Root Cause

src/shaashtra.js के renderShaashtraPage() function में श्लोक-render block इस तरह था:

// ❌ BUGGY — diff markers (+) column-0 पर accidentally रह गए
html += `<p style="text-align:center;margin:14px 0;">`
     +  `<em style="color:#ffecb4;">`
+                    // बहु-पंक्ति श्लोक — '\n' को <br> बनाएँ
+                    escapeHtml(sh.text).replace(/\n/g, '<br>')
+                    `</em>`;
Enter fullscreen mode Exit fullscreen mode

क्यों NaN?

Column-0 पर + को JavaScript unary + operator मानता है, binary concatenation नहीं:

"<p...><em...>"  +  ( +"ज्ञानाग्निः सर्वकर्माणि..." )
                        ↑
                   unary + on string = NaN
Enter fullscreen mode Exit fullscreen mode

Result: "<p...><em...>" + NaN + "</em>" → HTML में NaN render होता है।

Fix 

// ✅ FIXED — proper indentation, diff markers हटाए
html += `<p style="text-align:center;margin:14px 0;">`
     +  `<em style="color:#ffecb4;">`
     // बहु-पंक्ति श्लोक — '\n' को <br> बनाएँ (escape के बाद, सुरक्षित)
     +  escapeHtml(sh.text).replace(/\n/g, '<br>')
     +  `</em>`;
Enter fullscreen mode Exit fullscreen mode

सीख: Diff review में हमेशा column-0 पर +/- markers को double-check करें — कभी-कभी ये operator बन जाते हैं।

📜 शास्त्र-ग्रंथ Content Updates

1. Stale Comments हटाए

SHAASHTRA_PAGES export के ऊपर दो पुराने TODO comments थे जो v0.0.6 से relevant नहीं रहे:

// ❌ OLD
// ⚠️ PAGE_2, PAGE_3 अगले पैच में जुड़ेंगे।
// ⚠️ PAGE_3 अगले पैच में जुड़ेगा।
export const SHAASHTRA_PAGES = [PAGE_1, PAGE_2, PAGE_3];

// ✅ NEW
export const SHAASHTRA_PAGES = [PAGE_1, PAGE_2, PAGE_3];
Enter fullscreen mode Exit fullscreen mode

2. Page 1 — पुनर्जन्म: पवित्र बनाम अपवित्र

खिलाड़ी को नहीं पता था कि R key कब काम करती है और कब नहीं।

Added (HI):

♻️ पुनर्जन्म — पवित्र बनाम अपवित्र :
जब समय शून्य पर कर्म-भार शेष हो — पुनर्जन्म होता है।
पवित्र पुनर्जन्म (R key) तभी संभव है जब शुभकर्म, अशुभकर्म और प्रारब्ध
— तीनों शून्य हों। यदि कोई भी शेष हो तो आत्मा "अपवित्र" रूप में पुनः आती है।
Enter fullscreen mode Exit fullscreen mode

Added (EN):

♻️ Punarjanma — Pure vs Impure :
When Samaya reaches zero with karma remaining, rebirth follows. A Pure Rebirth
(R key) is only possible when Punya, Paapa, and Praarabdha are all zero.
If any remains, the soul returns in an "impure" form.
Enter fullscreen mode Exit fullscreen mode

शास्त्र-संदर्भ: engine.js → let isApavitra = (shuvhaKarma > 0 || ashuvhaKarma > 0 || prarabdha > 0)

3. Page 2 Controls — Gyroscope + Mobile Touch

v0.0.9 में touch.js → TouchControls (virtual buttons) और GyroscopeControls (gamma-axis tilt) implement हुए थे, लेकिन शास्त्र में mention नहीं था।

Added after steering line (HI):

📱 Mobile: स्क्रीन पर virtual buttons (ॐ 🌿 🙏 💀 ♻️ 🐚 🪔) |
🔄 Gyroscope: device बाईं/दाईं झुकाएँ — iOS 13+ पर permission dialog।
Enter fullscreen mode Exit fullscreen mode

Added after steering line (EN):

📱 Mobile: on-screen virtual buttons (ॐ 🌿 🙏 💀 ♻️ 🐚 🪔) |
🔄 Gyroscope: tilt device left/right — iOS 13+ shows a permission dialog.
Enter fullscreen mode Exit fullscreen mode

4. Page 2 — Chakravaata Mechanics Section

Chakravaata (माया-तूफ़ान) implement था, README में documented था — लेकिन शास्त्र में इसकी mechanics missing थीं। खिलाड़ी को नहीं पता था कि यह खींचता है, और इसे कैसे नष्ट करें।

Added new section (HI):

🌀 चक्रवात — माया का भय-रूप

🌀 चक्रवात : माया का भय-रूप — 160px range में player को स्वयं की ओर खींचता है।
             अन्य शुभ/अशुभ माया को भी खींचता है।

ॐ नाम-मार्ग : नाम-जाप वलय चक्रवात को भस्म करती है — नाम सर्वशक्तिमान है।

🐚 यंत्र-मार्ग : शंख-वलय (Y) भी चक्रवात नष्ट करती है — जब नाम संचित न हो।

⚠️ सीधे टकराने पर +1 अशुभ कर्म — नाम या शंख ही एकमात्र रक्षा।
Enter fullscreen mode Exit fullscreen mode

Added new section (EN):

🌀 Chakravaata — The face of fear in Maya

🌀 Chakravaata  : The storm of Samsara — pulls the player toward itself within
                  a 160px range. Also drags nearby Shuvha and Ashuvha Maya.

ॐ Naama-Maarga  : The Naama-Japa ring burns the Chakravaata — Naama is all-powerful.

🐚 Yantra-Maarga : The Shankha ring (Y) also destroys the Chakravaata —
                   for when no Naama is available.

⚠️ A direct collision adds +1 Ashuvha Karma — only Naama or Shankha can protect you.
Enter fullscreen mode Exit fullscreen mode

📁 Files Changed

File Changes
src/shaashtra.js NaN bugfix (unary + removed); stale comments cleaned; Page 1 HI+EN: Punarjanma types added; Page 2 HI+EN: Gyroscope/Mobile note added; Page 2 HI+EN: Chakravaata section added

Before / After

Before — शास्त्र Page 1 (screenshot)

ज्ञानाग्निः सर्वकर्माणि भस्मसात् कुरुते

NaN          ← 🐛 श्लोक की जगह NaN
— गीता ४.३७
Enter fullscreen mode Exit fullscreen mode

After — शास्त्र Page 1

ज्ञानाग्निः सर्वकर्माणि भस्मसात् कुरुते   ← ✅ सही render
— गीता ४.३७

♻️ पुनर्जन्म — पवित्र बनाम अपवित्र :     ← ✅ नया section
...
Enter fullscreen mode Exit fullscreen mode

After — शास्त्र Page 2 (Chakravaata section)

🌀 चक्रवात — माया का भय-रूप 🌀           ← ✅ नया section

🌀 चक्रवात : माया का भय-रूप — 160px range में player को खींचता है।
ॐ नाम-मार्ग : नाम-जाप वलय चक्रवात को भस्म करती है।
🐚 यंत्र-मार्ग : शंख-वलय (Y) भी चक्रवात नष्ट करती है।
⚠️ सीधे टकराने पर +1 अशुभ कर्म।
Enter fullscreen mode Exit fullscreen mode

🔗 Links

Top comments (0)