Implement WebGL page reserve navigation

public/js/markup-parser-module.js

@@ -24,6 +24,7 @@ class MarkupParserModule extends BaseModule {
             'parseImageOptions',
             'parseSfxOptions',
             'parseMusicOptions',
+            'parsePageReserveDirective',
             'markdownToHtml',
             'markdownToPlainText',
             'smartypants',
@@ -178,11 +179,14 @@ class MarkupParserModule extends BaseModule {
     }
 
     parseParagraph(rawText) {
-        const inline = this.parseInline(this.normalizeParagraph(rawText));
+        const normalized = this.normalizeParagraph(rawText);
+        const reserveDirective = this.parsePageReserveDirective(normalized);
+        const inline = this.parseInline(reserveDirective.text);
         return {
             text: this.markdownToPlainText(inline.text),
             layoutText: this.markdownToHtml(inline.text),
-            cueMarkers: inline.cueMarkers
+            cueMarkers: inline.cueMarkers,
+            pageReserve: reserveDirective.directive
         };
     }
 
@@ -193,12 +197,34 @@ class MarkupParserModule extends BaseModule {
             layoutText: paragraph.layoutText,
             cueMarkers: paragraph.cueMarkers,
             role,
+            metadata: {
+                ...(paragraph.pageReserve ? { pageReserve: paragraph.pageReserve } : {})
+            },
             isFirstParagraphInChapter: role === 'chapter-first' || role === 'textblock-first',
             dropCap: role === 'chapter-first',
             addTopSpace: role === 'textblock-first'
         };
     }
 
+    parsePageReserveDirective(text) {
+        const source = String(text || '');
+        const match = source.match(/#pagereserve\[\s*([0-9]+(?:\.[0-9]+)?)\s*(%)?\s*\]/i);
+        if (!match) {
+            return { text: source, directive: null };
+        }
+        const value = Number(match[1]);
+        const directive = Number.isFinite(value)
+            ? {
+                value,
+                unit: match[2] === '%' ? 'percent' : 'pages'
+            }
+            : null;
+        return {
+            text: source.replace(match[0], '').replace(/\s{2,}/g, ' ').trim(),
+            directive
+        };
+    }
+
     parseInline(text) {
         return {
             text: String(text || '').replace(/\s{2,}/g, ' ').trim(),