Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/arverma/Bihar-Police-Notebook/llms.txt

Use this file to discover all available pages before exploring further.

Bihar Police Notebook ships two print-ready A4 templates that share the same editor shell. Letter is a plain multi-page text document; Diary is a structured FIR case diary with a fixed header block and two-column pages. Switching between them starts a fresh document of the chosen type after flushing any pending autosave.
TemplateModuleContent shape
Lettereditor/js/paged-sheet.jsPlain text that spills across page cards automatically
Diaryeditor/js/diary-sheet.jsFIR header + pages each with a 20 % left column and 80 % right column

A4 Geometry Constants

Both templates derive all measurements from a shared set of constants so that screen preview and print output remain pixel-perfect:
ConstantValueMeaning
PAGE_W_MM210A4 page width in millimetres
PAGE_H_MM297A4 page height in millimetres
MARGIN_MM12.7Page margin — half of Google Docs’ default 1 inch margin
FONT_PX15Base body font size in CSS pixels
LINE_HEIGHT_PX24Line height in CSS pixels
LEFT_COL_PCT20Diary left column width as a percentage of the page content area
HEADER_BLOCK_H_PX140FIR header block height in CSS pixels
TITLES_ROW_H_PX72Column-titles row height in CSS pixels
TABLE_BORDER_H_PX4Combined table border height consumed from the page content area
All box heights in the Diary template snap to whole multiples of LINE_HEIGHT_PX (24 px). This guarantees that no line of Devanagari text is ever split across a page boundary.

Letter Template

The Letter template (paged-sheet.js) renders a sequence of .letter-page card elements, each containing a <textarea class="letter-page-input">. When a textarea overflows its fixed-height page card, content spills automatically to the next page card.
1

User types in a page card

Each keystroke fires an input event that paged-sheet.js listens to via the onChange callback passed from main.js.
2

Overflow detection

paged-sheet.js measures scrollHeight vs the page card’s fixed height. If the text overflows, a new page card is created and excess content is moved there.
3

Autosave debounce

main.js receives the onChange callback and calls scheduleSave(), which debounces the IndexedDB write by 600 ms.
4

Page indicator update

The onPageFocus callback updates #pageIndicator with the current and total page count.

Diary Template

The Diary template (diary-sheet.js) manages a richer data model: a top-level header object plus an array of pages, each page holding left-column and right-column content.

Structural Layout

┌─────────────────────────────────────────────┐
│  FIR Header block (140 px)                  │
│  Titles row      (72 px)                    │
├──────────┬──────────────────────────────────┤
│ Left col │ Right col                        │
│  (20 %)  │  (80 %)                          │
│          │                                  │
└──────────┴──────────────────────────────────┘
The header block is exactly 140 px tall (HEADER_BLOCK_H_PX); the titles row is 72 px (TITLES_ROW_H_PX). Both values are multiples of LINE_HEIGHT_PX so the first body line of the diary aligns cleanly to the 24 px grid. A 4 px table border (TABLE_BORDER_H_PX) is also deducted when computing the usable text area height.

Diary-Specific Controls

Add Page

Appends a new blank page object to the model and re-renders the diary pages container.

Delete Page

Removes the selected page from the model (minimum one page is always retained).

Hide / Show Header

Toggles the FIR header visibility per page. Useful when printing continuation pages that do not need the header repeated.

Content Model

The diary content is stored as JSON in IndexedDB:
{
  "header": {
    "fir_number": "123/2024",
    "case_diary_no": "456",
    "police_station": "Patna Sadar",
    "district": "Patna"
  },
  "pages": [
    {
      "left": "पृष्ठ सं. 1",
      "right": "विवरण...",
      "hideHeader": false
    }
  ]
}

Screen vs Print

The same A4 geometry drives both the on-screen preview and the printed output, but the two rendering paths are independent:
Pages are rendered into the DOM as styled <div> elements and then scaled visually to fit the viewport using a CSS transform applied by page-scale.js. The scale is purely cosmetic — it does not affect layout dimensions, so paginating logic always operates on full A4 pixels.See Page Preview for scaling details.

PDF button click  ──►  runPdfExport()

                ┌──────────▼──────────┐
                │ getActiveTemplate() │
                └──────────┬──────────┘
              letter ◄─────┴─────► diary
                 │                    │
    letterPagesHtml(pages)   diaryPagesHtml(model)
                 │                    │
                 └─────────┬──────────┘

                  Build print HTML + CSS

                  window.open('', '_blank')

                  document.fonts.ready.then(print)

                   window.print() → PDF
1

Collect content

runPdfExport() reads letterSheet.getPages() or diarySheet.getModel() depending on getActiveTemplate().
2

Generate HTML

letterPagesHtml(pages) or diaryPagesHtml(model) returns a string of <div class="page"> elements with inline content at real A4 pixel dimensions.
3

Apply print CSS

letterPrintCss() / diaryPrintCss() returns a <style> block that sets @page { size: A4; margin: 12.7mm; }, loads Noto Sans Devanagari from Google Fonts, and disables any transforms.
4

Open print window

window.open('', '_blank') creates the print target. If pop-ups are blocked an alert prompts the user to allow them.
5

Wait for fonts, then print

The export waits for document.fonts.ready before calling window.print(). If the Fonts API is unavailable it falls back to a 500 ms setTimeout.
Pop-up blockers will prevent the print window from opening. Users must allow pop-ups from the app’s origin. The export button does not silently fail — it shows an alert() when the window cannot be created.
Ctrl/Cmd+P is intercepted by main.js and calls runPdfExport() instead of the browser’s native print dialog. This ensures the correct print CSS and font preloading are always applied.

Build docs developers (and LLMs) love