-# Protect against accidental local .gitignore deletion
+
+# no archive or temporary files
+*.tar
+*.tgz
+*.zip
+*.
+temp.*
**/scratchpad/*
!**/scratchpad/.gitignore
// Strict enforcement of the PascalCase namespace
if (target_module === 'Theme') {
- let saved_theme = localStorage.getItem('RT_theme_preference');
+ let saved_theme = localStorage.getItem('RT·theme_preference');
if (!saved_theme) {
saved_theme = 'dark_gold';
- localStorage.setItem('RT_theme_preference', saved_theme);
+ localStorage.setItem('RT·theme_preference', saved_theme);
}
target_module = 'Theme/' + saved_theme;
}
</script>
</head>
<body>
- <RT⋅theme-selector></RT⋅theme-selector>
+ <RT·theme-selector></RT·theme-selector>
- <RT⋅article>
+ <RT·article>
- <RT⋅title
+ <RT·title
author="Thomas Walker Lynch"
date="2026-06-25 15:37Z"
title="RT Style System: Reference Manual"
copyright="2026 Reasoning Technology">
- </RT⋅title>
+ </RT·title>
- <RT⋅TOC level="1-2"></RT⋅TOC>
+ <RT·TOC level="1-2"></RT·TOC>
<h1>Layout Environments</h1>
<p>
</thead>
<tbody>
<tr>
- <td><RT⋅code><RT⋅article></RT⋅code></td>
+ <td><RT·code><RT·article></RT·code></td>
<td>Standard technical document layout with dynamic pagination.</td>
</tr>
<tr>
- <td><RT⋅code><RT⋅memo></RT⋅code></td>
+ <td><RT·code><RT·memo></RT·code></td>
<td>Strict print layout (6.5 inch width, serif typography, monochrome).</td>
</tr>
<tr>
- <td><RT⋅code><RT⋅book></RT⋅code></td>
+ <td><RT·code><RT·book></RT·code></td>
<td>Multi chapter compilation layout (Upcoming).</td>
</tr>
</tbody>
<h2>Article Environment</h2>
<p>
- The <RT⋅code><RT⋅article></RT⋅code> container provides the standard toolset for technical documentation, whitepapers, and specifications. It utilizes dynamic soft limit pagination and responsive ink ratio balancing.
+ The <RT·code><RT·article></RT·code> container provides the standard toolset for technical documentation, whitepapers, and specifications. It utilizes dynamic soft limit pagination and responsive ink ratio balancing.
</p>
<h3>Section Generators</h3>
</thead>
<tbody>
<tr>
- <td><RT⋅code><RT⋅title></RT⋅code></td>
+ <td><RT·code><RT·title></RT·code></td>
<td>Constructs the standardized title block and metadata header.</td>
</tr>
<tr>
- <td><RT⋅code><RT⋅TOC></RT⋅code></td>
+ <td><RT·code><RT·TOC></RT·code></td>
<td>Compiles an automatic table of contents by scanning heading depths.</td>
</tr>
<tr>
- <td><RT⋅code><RT⋅term-index></RT⋅code></td>
+ <td><RT·code><RT·term-index></RT·code></td>
<td>Compiles an alphabetized glossary of terms defined within the document.</td>
</tr>
<tr>
- <td><RT⋅code><RT⋅endnotes></RT⋅code></td>
+ <td><RT·code><RT·endnotes></RT·code></td>
<td>Container for extracted bibliographic citations.</td>
</tr>
</tbody>
</thead>
<tbody>
<tr>
- <td><RT⋅code><RT⋅term></RT⋅code></td>
+ <td><RT·code><RT·term></RT·code></td>
<td>Standard technical term. Decorates first occurrence and establishes an anchor.</td>
</tr>
<tr>
- <td><RT⋅code><RT⋅term-em></RT⋅code></td>
+ <td><RT·code><RT·term-em></RT·code></td>
<td>Forces visual emphasis for a term subsequent to its first occurrence.</td>
</tr>
<tr>
- <td><RT⋅code><RT⋅neologism></RT⋅code></td>
+ <td><RT·code><RT·neologism></RT·code></td>
<td>Project specific vocabulary. Styled distinctly from conventional terms.</td>
</tr>
<tr>
- <td><RT⋅code><RT⋅neologism-em></RT⋅code></td>
+ <td><RT·code><RT·neologism-em></RT·code></td>
<td>Forces visual emphasis for a neologism subsequent to its first occurrence.</td>
</tr>
<tr>
- <td><RT⋅code><RT⋅code></RT⋅code></td>
+ <td><RT·code><RT·code></RT·code></td>
<td>Code span or pre formatted code block with theme aware borders.</td>
</tr>
<tr>
- <td><RT⋅code><RT⋅math></RT⋅code></td>
+ <td><RT·code><RT·math></RT·code></td>
<td>Inline or block mathematics evaluated by MathJax.</td>
</tr>
<tr>
- <td><RT⋅code><RT⋅symbol></RT⋅code></td>
+ <td><RT·code><RT·symbol></RT·code></td>
<td>Technical symbol wrapper enforcing strict font weight and character spacing.</td>
</tr>
<tr>
- <td><RT⋅code><RT⋅constraint></RT⋅code></td>
+ <td><RT·code><RT·constraint></RT·code></td>
<td>Highlights architectural limits or hard requirements in a distinct block.</td>
</tr>
</tbody>
</thead>
<tbody>
<tr>
- <td><RT⋅code><RT-counter⋅make></RT⋅code></td>
+ <td><RT·code><RT·Counter··make></RT·code></td>
<td>Declares an empty named counter sequence (e.g., figure, equation).</td>
</tr>
<tr>
- <td><RT⋅code><RT-counter⋅step></RT⋅code></td>
+ <td><RT·code><RT·Counter··step></RT·code></td>
<td>Advances the counter from empty or increments to the next ordinal address.</td>
</tr>
<tr>
- <td><RT⋅code><RT-counter⋅indent></RT⋅code></td>
+ <td><RT·code><RT·Counter··indent></RT·code></td>
<td>Pushes a new structural depth onto the tracking stack.</td>
</tr>
<tr>
- <td><RT⋅code><RT-counter⋅snapshot></RT⋅code></td>
+ <td><RT·code><RT·Counter··snapshot></RT·code></td>
<td>Deep copies the active count and styling parameters to a dictionary key.</td>
</tr>
<tr>
- <td><RT⋅code><RT-counter⋅read></RT⋅code></td>
+ <td><RT·code><RT·Counter··read></RT·code></td>
<td>Recalls a saved count or format parameter from the snapshot dictionary.</td>
</tr>
</tbody>
</thead>
<tbody>
<tr>
- <td><RT⋅code><RT⋅crossref></RT⋅code></td>
+ <td><RT·code><RT·crossref></RT·code></td>
<td>Context aware internal anchor link.</td>
</tr>
<tr>
- <td><RT⋅code><RT⋅ref></RT⋅code></td>
+ <td><RT·code><RT·ref></RT·code></td>
<td>Dynamic reference evaluating to a structural target.</td>
</tr>
<tr>
- <td><RT⋅code><RT⋅cite></RT⋅code></td>
+ <td><RT·code><RT·cite></RT·code></td>
<td>Bibliographic citation marker mapping to the endnotes block.</td>
</tr>
<tr>
- <td><RT⋅code><RT⋅footnote></RT⋅code></td>
+ <td><RT·code><RT·footnote></RT·code></td>
<td>Inline text extracted and appended to the bottom of the active page.</td>
</tr>
</tbody>
</thead>
<tbody>
<tr>
- <td><RT⋅code><RT⋅page></RT⋅code></td>
+ <td><RT·code><RT·page></RT·code></td>
<td>Automatically generated boundary container. Do not author manually.</td>
</tr>
<tr>
- <td><RT⋅code><RT⋅page-break></RT⋅code></td>
+ <td><RT·code><RT·page-break></RT·code></td>
<td>Explicit directive forcing subsequent content to the next page container.</td>
</tr>
</tbody>
<h2>Memo Environment</h2>
<p>
- The <RT⋅code><RT⋅memo></RT⋅code> container inherits all valid tags from the Article environment but overrides the global CSS to enforce a static, print ready monochrome aesthetic.
+ The <RT·code><RT·memo></RT·code> container inherits all valid tags from the Article environment but overrides the global CSS to enforce a static, print ready monochrome aesthetic.
</p>
<h2>Book Environment</h2>
<p>
- The <RT⋅code><RT⋅book></RT⋅code> container is reserved for multi chapter compilations. It introduces tags designed exclusively for macro level document orchestration.
+ The <RT·code><RT·book></RT·code> container is reserved for multi chapter compilations. It introduces tags designed exclusively for macro level document orchestration.
</p>
<h3>Book Specific Tags</h3>
</thead>
<tbody>
<tr>
- <td><RT⋅code><RT⋅chapter></RT⋅code></td>
+ <td><RT·code><RT·chapter></RT·code></td>
<td>Chapter heading. Implies a page break, inherits standard H1 typography, and registers as a top level division in the TOC.</td>
</tr>
</tbody>
</thead>
<tbody>
<tr>
- <td><RT⋅code><RT⋅theme-selector></RT⋅code></td>
+ <td><RT·code><RT·theme-selector></RT·code></td>
<td>Floating interactive widget permitting real time swapping of visual themes.</td>
</tr>
</tbody>
</table>
- </RT⋅article>
+ </RT·article>
</body>
</html>
/*
- Processes <RT-TOC> tags.
+ Processes <RT·TOC> tags.
Populates each with headings found below it.
Attributes:
window.RT.TOC = function(){
const debug = window.RT.debug || { log: function(){} };
- const TOC_seq = document.querySelectorAll('rt-toc');
+ const TOC_seq = document.querySelectorAll('rt·toc');
TOC_seq.forEach( (container ,TOC_index) => {
container.style.display = 'block';
a.style.color = 'inherit';
a.style.display = 'block';
- a.onmouseover = () => a.style.color = 'var(--rt-brand-primary)';
+ a.onmouseover = () => a.style.color = 'var(--RT·brand-primary)';
a.onmouseout = () => a.style.color = 'inherit';
li.appendChild(a);
/*
- Processes <RT-chapter> tags.
- Transforms the tag into an <RT-page-break> followed by an <h1> with the RT-chapter class.
+ Processes <RT·chapter> tags.
+ Transforms the tag into an <RT·page-break> followed by an <h1> with the RT·chapter class.
*/
window.RT = window.RT || {};
window.RT.chapter = function(){
const debug = window.RT.debug || { log: function(){} };
- document.querySelectorAll('RT-chapter').forEach( (el ,index) => {
+ document.querySelectorAll('RT·chapter').forEach( (el ,index) => {
if(debug.log) debug.log('chapter' ,`Processing chapter ${index + 1}`);
- const brk = document.createElement('RT-page-break');
+ const brk = document.createElement('RT·page-break');
const h1 = document.createElement('h1');
h1.innerHTML = el.innerHTML;
if(el.className){
h1.className = el.className;
}
- h1.classList.add('RT-chapter');
+ h1.classList.add('RT·chapter');
Array.from(el.attributes).forEach( (attr) => {
if(attr.name !== 'class'){
/*
- Processes <RT-CODE> tags.
+ Processes <RT·code> tags.
Uses the central config or CSS variables from the theme.
Removes common indent from lines of code.
const metrics = U.measure_ink_ratio('monospace');
- document.querySelectorAll('rt-code').forEach((el) => {
+ document.querySelectorAll('rt·code').forEach((el) => {
el.style.fontFamily = 'monospace';
const computed = window.getComputedStyle(el);
- const accent = computed.getPropertyValue('--rt-accent').trim() || 'gold';
+ const accent = computed.getPropertyValue('--RT·accent').trim() || 'gold';
const is_block = U.is_block_content(el);
const parentColor = computed.color;
window.RT = window.RT || {};
window.RT.constraint = function(){
- document.querySelectorAll('rt-constraint').forEach( (el) => {
+ document.querySelectorAll('rt·constraint').forEach( (el) => {
el.style.display = 'block';
- el.style.borderLeft = '4px solid var(--rt-state-warning)';
- el.style.backgroundColor = 'var(--rt-surface-1)';
+ el.style.borderLeft = '4px solid var(--RT·state-warning)';
+ el.style.backgroundColor = 'var(--RT·surface-1)';
el.style.padding = '1rem';
el.style.margin = '1.5rem 0';
- el.style.color = 'var(--rt-content-main)';
+ el.style.color = 'var(--RT·content-main)';
});
};
const tag = node.tagName.toLowerCase();
let pushed_name = null;
- if (tag === 'rt-counter_make') {
+ if (tag === 'RT·Counter··make') {
const name = node.getAttribute('counter');
if (name) {
const style = node.getAttribute('style') || 'Natural';
count: ''
};
}
- } else if (tag === 'rt-counter_indent') {
+ } else if (tag === 'RT·Counter··indent') {
const name = node.getAttribute('counter');
if (name && window.RT.dict_counter[name]) {
window.RT.dict_counter[name].stack.push(0);
window.RT.dict_counter[name].empty.push(true);
pushed_name = name;
}
- } else if (tag === 'rt-counter_step') {
+ } else if (tag === 'RT·Counter··step') {
const name = node.getAttribute('counter');
if (name && window.RT.dict_counter[name]) {
const state = window.RT.dict_counter[name];
state.count = count_str;
}
- } else if (tag === 'rt-counter_snapshot') {
+ } else if (tag === 'RT·Counter··snapshot') {
const counter_name = node.getAttribute('counter');
const snapshot_name = node.getAttribute('snapshot');
const depth = state.stack.length - 1;
if (state.empty[depth]) {
- console.error(`RT-Style Layout Error: Attempted to snapshot an empty counter '${counter_name}' at snapshot '${snapshot_name}'. A person must use <RT-counter_step> before taking a snapshot.`);
+ console.error(`RT-Style Layout Error: Attempted to snapshot an empty counter '${counter_name}' at snapshot '${snapshot_name}'. A person must use <RT·Counter··step> before taking a snapshot.`);
} else {
window.RT.dict_snapshot[snapshot_name] = clone_counter_state(state);
}
};
window.RT.counter_do_read = function (root_node) {
- const reads = root_node.querySelectorAll('rt-counter_read');
+ const reads = root_node.querySelectorAll('RT·Counter··read');
for (let i = 0; i < reads.length; i++) {
const snapshot_name = reads[i].getAttribute('snapshot');
const key = reads[i].getAttribute('key') || 'count';
reads[i].innerHTML = (value !== undefined) ? value : `[Missing key: ${key}]`;
} else {
reads[i].innerHTML = `[Unknown snapshot: ${snapshot_name}]`;
- console.error(`RT-Style Layout Error: <RT-counter_read> failed. No snapshot named '${snapshot_name}' found in the dictionary.`);
+ console.error(`RT-Style Layout Error: <RT·Counter··read> failed. No snapshot named '${snapshot_name}' found in the dictionary.`);
}
}
};
window.RT = window.RT || {};
window.RT.crossref = function(){
- document.querySelectorAll('rt-crossref').forEach( (el) => {
- el.style.color = 'var(--rt-brand-link)';
+ document.querySelectorAll('rt·crossref').forEach( (el) => {
+ el.style.color = 'var(--RT·brand-link)';
el.style.textDecoration = 'underline';
el.style.cursor = 'pointer';
el.style.fontWeight = '500';
window.RT = window.RT || {};
-window.RT.end_note = function(){
- const citations = document.querySelectorAll('rt-cite');
+window.RT.endnote = function(){
+ const citations = document.querySelectorAll('rt·cite');
if(citations.length === 0) return;
- const article = document.querySelector('rt-article');
+ const article = document.querySelector('rt·article');
if(!article) return;
// 1. Ensure the H1 is a direct child of the article so the TOC can see it
}
// 2. Locate or generate the endnotes list container
- let endnoteContainer = document.querySelector('rt-endnotes');
+ let endnoteContainer = document.querySelector('rt·endnotes');
if(!endnoteContainer) {
- endnoteContainer = document.createElement('rt-endnotes');
+ endnoteContainer = document.createElement('rt·endnotes');
article.appendChild(endnoteContainer);
}
cite.innerHTML = `<a href="#note-${refNum}" id="cite-${refNum}">[${refNum}]</a>`;
cite.style.cursor = 'pointer';
- cite.style.color = 'var(--rt-brand-link)';
+ cite.style.color = 'var(--RT·brand-link)';
cite.style.textDecoration = 'none';
// Append the corresponding entry into the endnotes list
// Style the container
endnoteContainer.style.display = 'block';
endnoteContainer.style.marginTop = '1rem';
- endnoteContainer.style.borderTop = '1px solid var(--rt-surface-3)';
+ endnoteContainer.style.borderTop = '1px solid var(--RT·surface-3)';
endnoteContainer.style.paddingTop = '1rem';
};
/*
- Processes <RT-MATH> tags.
+ Processes <RT·math> tags.
JavaScript: math()
- HTML Tag: <RT-MATH> (parsed as rt-math)
+ HTML Tag: <RT·math> (parsed as rt·math)
*/
function math(){
- // querySelector treats 'rt-math' as case-insensitive for the tag
- document.querySelectorAll('rt-math').forEach(el => {
+ // querySelector treats 'rt·math' as case-insensitive for the tag
+ document.querySelectorAll('rt·math').forEach(el => {
if (el.textContent.startsWith('$')) return;
const is_block = el.parentElement.tagName === 'DIV' ||
window.RT = window.RT || {};
window.RT.symbol = function(){
- document.querySelectorAll('rt-symbol').forEach( (el) => {
+ document.querySelectorAll('rt·symbol').forEach( (el) => {
el.style.fontFamily = '"Courier New", Courier, monospace';
el.style.fontWeight = '600';
el.style.padding = '0 0.1em';
/*
- Processes <RT-TERM> and <RT-NEOLOGISM> tags.
+ Processes <RT·term> and <RT·neologism> tags.
- Styles only the first occurrence of a unique term/neologism.
- - The "-em" variants (e.g., <RT-term-em>) are always styled.
+ - The "-em" variants (e.g., <RT·term-em>) are always styled.
- Automatically generates IDs for first occurrences for future indexing.
*/
el.style.fontStyle = 'italic';
el.style.fontWeight = is_neologism_b ? '600' : '500';
el.style.color = is_neologism_b
- ? 'var(--rt-brand-secondary)'
- : 'var(--rt-brand-primary)';
+ ? 'var(--RT·brand-secondary)'
+ : 'var(--RT·brand-primary)';
el.style.paddingRight = '0.1em'; // Compensation for italic slant
el.style.display = 'inline';
};
};
const selector_s = [
- 'rt-term'
- ,'rt-term-em'
- ,'rt-neologism'
- ,'rt-neologism-em'
+ 'rt·term'
+ ,'rt·term-em'
+ ,'rt·neologism'
+ ,'rt·neologism-em'
].join(',');
const tags_dpa = document.querySelectorAll(selector_s);
-class ThemeSelector extends HTMLElement{
- connectedCallback(){
+window.RT = window.RT || {};
+
+window.RT.theme_selector = function(){
+ document.querySelectorAll('rt·theme-selector').forEach( (el) => {
let current_theme = localStorage.getItem('RT_theme_preference');
if(!current_theme){
current_theme = 'dark_gold';
}
- this.innerHTML = `
- <div style="position:fixed; top:10px; right:10px; z-index:1000; background:#222; padding:10px; border:1px solid #555; color: white; font-family: sans-serif;">
- <b>Theme Selection</b><br>
- <label>
- <input type="radio" name="rt-theme" value="dark_gold" ${current_theme === 'dark_gold' ? 'checked' : ''}> Dark Gold
- </label><br>
- <label>
- <input type="radio" name="rt-theme" value="light_gold" ${current_theme === 'light_gold' ? 'checked' : ''}> Light Gold
- </label>
- </div>
+ const container = document.createElement('div');
+ container.style.position = 'fixed';
+ container.style.top = '10px';
+ container.style.right = '10px';
+ container.style.zIndex = '1000';
+ container.style.background = '#222';
+ container.style.padding = '10px';
+ container.style.border = '1px solid #555';
+ container.style.color = 'white';
+ container.style.fontFamily = 'sans-serif';
+
+ container.innerHTML = `
+ <b>Theme Selection</b><br>
+ <label>
+ <input type="radio" name="RT·theme" value="dark_gold" ${current_theme === 'dark_gold' ? 'checked' : ''}> Dark Gold
+ </label><br>
+ <label>
+ <input type="radio" name="RT·theme" value="light_gold" ${current_theme === 'light_gold' ? 'checked' : ''}> Light Gold
+ </label>
`;
- this.addEventListener( 'change' ,(e) => {
- localStorage.setItem('RT_theme_preference' ,e.target.value);
- location.reload();
- } );
- }
-}
+ container.addEventListener( 'change' ,(e) => {
+ if(e.target.name === 'RT·theme') {
+ localStorage.setItem('RT_theme_preference' ,e.target.value);
+ location.reload();
+ }
+ });
-customElements.define('rt-theme-selector' ,ThemeSelector);
+ el.replaceWith(container);
+ });
+};
/*
- Processes <RT-TITLE> tags.
+ Processes <RT·title> tags.
Generates a standard document header block.
Usage:
- <RT-title title="..." author="..." date="..." copyright="..."></RT-title>
+ <RT·title title="..." author="..." date="..." copyright="..."></RT·title>
*/
window.RT = window.RT || {};
window.RT.title = function() {
const debug = window.RT.debug || { log: function(){} };
- document.querySelectorAll('rt-title').forEach(el => {
+ document.querySelectorAll('rt·title').forEach(el => {
const title = el.getAttribute('title') || 'Untitled Document';
const author = el.getAttribute('author');
const date = el.getAttribute('date');
container.style.textAlign = 'center';
container.style.marginBottom = '3rem';
container.style.marginTop = '2rem';
- container.style.borderBottom = '1px solid var(--rt-border-default)';
+ container.style.borderBottom = '1px solid var(--RT·border-default)';
container.style.paddingBottom = '1.5rem';
// Main Title (H1)
h1.style.margin = '0 0 0.8rem 0';
h1.style.border = 'none'; // Override standard H1 border
h1.style.padding = '0';
- h1.style.color = 'var(--rt-brand-primary)';
+ h1.style.color = 'var(--RT·brand-primary)';
h1.style.fontSize = '2.5em';
h1.style.lineHeight = '1.1';
h1.style.letterSpacing = '-0.03em';
// Metadata Row (Author | Date)
if (author || date) {
const meta = document.createElement('div');
- meta.style.color = 'var(--rt-content-muted)';
+ meta.style.color = 'var(--RT·content-muted)';
meta.style.fontStyle = 'italic';
meta.style.fontSize = '1.1em';
meta.style.fontFamily = '"Georgia", "Times New Roman", serif'; // Classy serif
const parts = [];
- if (author) parts.push(`<span style="font-weight:600; color:var(--rt-brand-secondary)">${author}</span>`);
+ if (author) parts.push(`<span style="font-weight:600; color:var(--RT·brand-secondary)">${author}</span>`);
if (date) parts.push(date);
meta.innerHTML = parts.join(' — ');
// Copyright Row
if (copyright) {
const copy_div = document.createElement('div');
- copy_div.style.color = 'var(--rt-content-muted)';
+ copy_div.style.color = 'var(--RT·content-muted)';
copy_div.style.fontSize = '0.9em';
copy_div.style.marginTop = '0.5rem';
// Automatically injects the copyright symbol
-// debug messages don't work here, because core/utility isn't loaded until after the function runs.
(function(){
const RT = window.RT = window.RT || {};
const debug = RT.debug || { log: function(){} };
- debug.log('scroll', "1. Initializing script.");
+ // --- Shared State ---
+ let target_y = 0;
+ let is_reload = false;
+ let is_layout_locked = true;
+ let scroll_timer;
- // 1. Intercept native history restoration immediately
- if ('scrollRestoration' in history) {
- history.scrollRestoration = 'manual';
- debug.log('scroll', "2. history.scrollRestoration set to manual.");
- }
+ // ==========================================
+ // FUNCTION DEFINITIONS
+ // ==========================================
- // 2. Read coordinate from memory before any layout shifts occur
- const raw_target = sessionStorage.getItem('RT_saved_y');
- const target_y = raw_target !== null ? parseInt(raw_target, 10) : 0;
-
- // 3. Determine if the execution is a page reload
- let is_reload = false;
- if (window.performance) {
- const nav_entries = performance.getEntriesByType("navigation");
- if (nav_entries.length > 0) {
- is_reload = (nav_entries[0].type === "reload");
- } else if (performance.navigation) {
- is_reload = (performance.navigation.type === 1);
+ function configure_history(){
+ if ('scrollRestoration' in history) {
+ history.scrollRestoration = 'manual';
+ debug.log('scroll' ,"2. history.scrollRestoration set to manual.");
}
}
- debug.log('scroll', `3. Target Y: ${target_y} | Is Reload: ${is_reload}`);
+ function capture_scroll_target(){
+ const raw_target = sessionStorage.getItem('RT_saved_y');
+ target_y = raw_target !== null ? parseInt(raw_target ,10) : 0;
+
+ if (window.performance) {
+ const nav_entries = performance.getEntriesByType("navigation");
+ if (nav_entries.length > 0) {
+ is_reload = (nav_entries[0].type === "reload");
+ } else if (performance.navigation) {
+ is_reload = (performance.navigation.type === 1);
+ }
+ }
+ debug.log('scroll' ,`3. Target Y: ${target_y} | Is Reload: ${is_reload}`);
+ }
- // 4. The Lock
- let is_layout_locked = true;
+ function load_elements(){
+ debug.log('scroll' ,"4. Loading module dependencies.");
+ RT.load('Element/counter');
+ RT.load('Element/chapter');
+ RT.load('Element/endnote');
+ RT.load('Element/math');
+ RT.load('Element/code');
+ RT.load('Element/term');
+ RT.load('Element/TOC');
+ RT.load('Element/title');
+ RT.load('Element/symbol');
+ RT.load('Element/constraint');
+ RT.load('Element/crossref');
+
+ RT.load('Layout/paginate_by_element');
+ RT.load('Layout/page_fixed_glow');
+ }
- // Helper to ensure we only signal completion once
- function unlock_layout() {
- if (!is_layout_locked) return;
- is_layout_locked = false;
- debug.log('scroll', "10. Layout fully unlocked. Emitting completion signal.");
- document.dispatchEvent(new Event("RT_layout_complete"));
+ function apply_style_rule(selector ,rules){
+ document.querySelectorAll(selector).forEach( (el) => {
+ for (let prop in rules) {
+ if (typeof rules[prop] === 'string' && rules[prop].indexOf('!important') !== -1) {
+ const kebab_prop = prop.replace(/[A-Z]/g ,m => "-" + m.toLowerCase());
+ const value = rules[prop].replace(' !important' ,'');
+ el.style.setProperty(kebab_prop ,value ,'important');
+ } else {
+ el.style[prop] = rules[prop];
+ }
+ }
+ });
}
- // 5. Declare Dependencies
- RT.load('Element/counter');
- RT.load('Element/chapter');
- RT.load('Element/endnote');
- RT.load('Element/math');
- RT.load('Element/code');
- RT.load('Element/term');
- RT.load('Element/TOC');
- RT.load('Element/title');
- RT.load('Element/symbol');
- RT.load('Element/constraint');
- RT.load('Element/crossref');
-
- RT.load('Layout/paginate_by_element');
- RT.load('Layout/page_fixed_glow');
-
- // 6. The Typography Layout
- RT.article = function(){
+ function apply_style(){
+ debug.log('scroll' ,"5. Applying typography styles.");
+
RT.config = RT.config || {};
RT.config.article = {
- font_family: '"Noto Sans", "Segoe UI", "Helvetica Neue", sans-serif'
+ font_family: "'Noto Sans JP', Arial, sans-serif"
,line_height: "1.8"
,font_size: "16px"
,font_weight: "400"
- ,max_width: "820px"
+ ,max_width: "46.875rem"
,margin: "0 auto"
};
RT.config.article.font_weight = "600";
}
- const conf = RT.config.article;
- const article_seq = document.querySelectorAll("RT-article");
-
- if(article_seq.length === 0) return;
-
- for(let i = 0; i < article_seq.length; i++){
- let style = article_seq[i].style;
- style.display = "block";
- style.fontFamily = conf.font_family;
- style.fontSize = conf.font_size;
- style.lineHeight = conf.line_height;
- style.fontWeight = conf.font_weight;
- style.maxWidth = conf.max_width;
- style.margin = conf.margin;
- style.padding = "0 20px";
- style.color = "var(--rt-content-main)";
- }
-
window.RT = window.RT || {};
window.RT.config = window.RT.config || {};
window.RT.config.page = window.RT.config.page || {};
window.RT.config.page.height_limit = 900;
- const style_node = document.createElement("style");
- style_node.innerHTML = `
- body, html, rt-article {
- overflow-anchor: none !important;
- }
-
- rt-article {
- font-family: 'Noto Sans JP', Arial, sans-serif;
- background-color: var(--rt-surface-0);
- color: var(--rt-content-main);
- max-width: 46.875rem !important;
- box-sizing: border-box !important;
- }
-
- rt-article:not(:has(rt-page)) {
- padding: 3rem !important;
- }
-
- rt-article:has(rt-page) {
- padding: 0 !important;
- }
-
- rt-article rt-page {
- position: relative;
- display: block;
- padding: 3rem;
- margin: 1.25rem auto;
- background-color: var(--rt-surface-0);
- box-shadow: 0 0 0.625rem var(--rt-brand-primary);
- }
-
- rt-article h1 {
- font-size: 1.5rem;
- text-align: center;
- color: var(--rt-brand-primary);
- font-weight: 500;
- margin-top: 1.5rem;
- line-height: 1.15;
- }
- rt-article h2 {
- font-size: 1.25rem;
- color: var(--rt-brand-secondary);
- text-align: left;
- margin-top: 2rem;
- margin-left: 0;
- }
- rt-article h3 {
- font-size: 1.125rem;
- color: var(--rt-brand-tertiary);
- text-align: left;
- margin-top: 1.5rem;
- margin-left: 4ch;
- }
- rt-article h4 {
- font-size: 1.05rem;
- color: var(--rt-content-main);
- font-weight: 600;
- text-align: left;
- margin-top: 1.25rem;
- margin-left: 8ch;
- }
-
- rt-article p,
- rt-article ul,
- rt-article ol {
- color: var(--rt-content-main);
- text-align: justify;
- margin-bottom: 1rem;
- margin-left: 0;
- }
- rt-article li {
- margin-bottom: 0.5rem;
- }
-
- rt-article rt-code {
- font-family: 'Courier New', Courier, monospace;
- background-color: var(--rt-surface-code);
- padding: 0.125rem 0.25rem;
- color: var(--rt-content-main);
- }
+ const conf = RT.config.article;
- rt-article img {
- max-width: 100%;
- height: auto;
- display: block;
- margin: 1.5rem auto;
- }
- `;
- document.head.appendChild(style_node);
- };
+apply_style_rule('body, html, RT·article' ,{ overflowAnchor: "none !important" });
+
+ apply_style_rule('RT·article', {
+ display: "block",
+ fontFamily: conf.font_family,
+ fontSize: conf.font_size,
+ lineHeight: conf.line_height,
+ fontWeight: conf.font_weight,
+ maxWidth: conf.max_width + " !important",
+ margin: conf.margin,
+ backgroundColor: RT.config.theme.surface_0,
+ color: RT.config.theme.content_main,
+ boxSizing: "border-box !important"
+ });
+
+ apply_style_rule('RT·article:not(:has(RT·page))' ,{ padding: "3rem !important" });
+ apply_style_rule('RT·article:has(RT·page)' ,{ padding: "0 !important" });
+
+ apply_style_rule('RT·article RT·page' ,{
+ position: "relative",
+ display: "block",
+ padding: "3rem",
+ margin: "1.25rem auto",
+ backgroundColor: RT.config.theme.surface_0,
+ boxShadow: `0 0 0.625rem ${RT.config.theme.brand_primary}`
+ });
+
+ apply_style_rule('RT·article h1' ,{ fontSize: "1.5rem", textAlign: "center", color: RT.config.theme.brand_primary, fontWeight: "500", marginTop: "1.5rem", lineHeight: "1.15" });
+ apply_style_rule('RT·article h2' ,{ fontSize: "1.25rem", color: RT.config.theme.brand_secondary, textAlign: "left", marginTop: "2rem", marginLeft: "0" });
+ apply_style_rule('RT·article h3' ,{ fontSize: "1.125rem", color: RT.config.theme.brand_tertiary, textAlign: "left", marginTop: "1.5rem", marginLeft: "4ch" });
+ apply_style_rule('RT·article h4' ,{ fontSize: "1.05rem", color: RT.config.theme.content_main, fontWeight: "600", textAlign: "left", marginTop: "1.25rem", marginLeft: "8ch" });
+ apply_style_rule('RT·article p, RT·article ul, RT·article ol' ,{ color: RT.config.theme.content_main, textAlign: "justify", marginBottom: "1rem", marginLeft: "0" });
+ apply_style_rule('RT·article li' ,{ marginBottom: "0.5rem" });
+ apply_style_rule('RT·article RT·code' ,{ fontFamily: "'Courier New', Courier, monospace", backgroundColor: RT.config.theme.surface_code, padding: "0.125rem 0.25rem", color: RT.config.theme.content_main });
+ apply_style_rule('RT·article img' ,{ maxWidth: "100%", height: "auto", display: "block", margin: "1.5rem auto" });
+ }
- // 7. The Execution Sequence
- function run_semantics(){
- debug.log('scroll' ,`4. run_semantics starting.`);
+ function process_custom_elements(){
+ debug.log('scroll' ,`7. Processing custom elements.`);
+
if(RT.theme) RT.theme();
if(RT.endnote) RT.endnote();
- RT.article();
+
if(RT.counter_do_count){
RT.counter_do_count(document.body);
if(RT.counter_do_read) RT.counter_do_read(document.body);
}
+
if(RT.title) RT.title();
if(RT.term) RT.term();
if(RT.math) RT.math();
if(RT.crossref) RT.crossref();
if( window.MathJax && MathJax.Hub && MathJax.Hub.Queue ){
- MathJax.Hub.Queue( ["Typeset" ,MathJax.Hub] ,run_layout );
+ MathJax.Hub.Queue( ["Typeset" ,MathJax.Hub] ,execute_pagination_and_scroll );
}else{
- run_layout();
+ execute_pagination_and_scroll();
}
}
- function run_layout() {
- debug.log('scroll', `5. run_layout starting.`);
+ function execute_pagination_and_scroll(){
+ debug.log('scroll' ,`8. Pagination layout starting.`);
if(RT.chapter) RT.chapter();
if(RT.TOC) RT.TOC();
if(RT.paginate_by_element) RT.paginate_by_element();
if(RT.page) RT.page();
- debug.log('scroll', `6. Pagination complete.`);
+ debug.log('scroll' ,`9. Pagination complete.`);
let final_target = target_y;
let use_hash = false;
}
}
- debug.log('scroll', `7. Commencing viewport enforce loop. Mode: ${use_hash ? 'HASH' : 'Y-COORDINATE'}`);
- enforce_scroll(final_target, use_hash, 0);
+ debug.log('scroll' ,`10. Commencing viewport enforce loop. Mode: ${use_hash ? 'HASH' : 'Y-COORDINATE'}`);
+ enforce_scroll(final_target ,use_hash ,0);
}
- // 8. The Enforcer Logic
- function enforce_scroll(target, use_hash, attempts) {
+ function enforce_scroll(target ,use_hash ,attempts){
if (attempts > 15) {
- debug.log('scroll', "8. Scroll enforcement timed out. Unlocking.");
+ debug.log('scroll' ,"11. Scroll enforcement timed out. Unlocking.");
unlock_layout();
return;
}
const hash_target = document.getElementById(window.location.hash.substring(1));
if (hash_target) {
hash_target.scrollIntoView();
- debug.log('scroll', `8a. Attempt ${attempts}: Scrolled to Hash Target. Y is now ${window.scrollY}`);
}
} else {
- window.scrollTo(0, target);
- debug.log('scroll', `8b. Attempt ${attempts}: Scrolled to Y=${target}. Current Y is ${window.scrollY}`);
+ window.scrollTo(0 ,target);
}
- let is_successful = false;
- if (use_hash) {
- is_successful = true;
- } else {
- is_successful = (Math.abs(window.scrollY - target) < 5 || target === 0);
- }
+ let is_successful = use_hash ? true : (Math.abs(window.scrollY - target) < 5 || target === 0);
if (is_successful && document.body.scrollHeight > 1000) {
- debug.log('scroll', `9. Viewport anchored successfully.`);
-
+ debug.log('scroll' ,`12. Viewport anchored successfully.`);
setTimeout(() => {
if (!use_hash && Math.abs(window.scrollY - target) >= 5) {
- debug.log('scroll', `9a. Browser late-stage rebellion detected. Re-enforcing.`);
- enforce_scroll(target, use_hash, attempts + 1);
+ debug.log('scroll' ,`12a. Browser late-stage rebellion detected. Re-enforcing.`);
+ enforce_scroll(target ,use_hash ,attempts + 1);
} else {
unlock_layout();
}
}, 100);
} else {
- setTimeout(() => enforce_scroll(target, use_hash, attempts + 1), 50);
+ setTimeout(() => enforce_scroll(target ,use_hash ,attempts + 1) ,50);
}
}
- // 9. The Ledger
- let scroll_timer;
- window.addEventListener('scroll', () => {
- if (is_layout_locked) return;
- clearTimeout(scroll_timer);
- scroll_timer = setTimeout(() => {
- sessionStorage.setItem('RT_saved_y', window.scrollY);
- debug.log('scroll', `X. User stopped scrolling. Saved Y: ${window.scrollY}`);
- }, 200);
- }, { passive: true });
-
- window.addEventListener('beforeunload', () => {
- is_layout_locked = true;
- debug.log('scroll', "Y. Page unloading. Scroll listener locked.");
- });
+ function unlock_layout(){
+ if (!is_layout_locked) return;
+ is_layout_locked = false;
+ debug.log('scroll' ,"13. Layout fully unlocked. Emitting completion signal.");
+ document.dispatchEvent(new Event("RT_layout_complete"));
+ }
- // 10. Bind to DOM Ready
- document.addEventListener('DOMContentLoaded', run_semantics);
+ function bind_window_events(){
+ debug.log('scroll' ,"6. Binding passive lifecycle events.");
+
+ window.addEventListener('scroll' ,() => {
+ if (is_layout_locked) return;
+ clearTimeout(scroll_timer);
+ scroll_timer = setTimeout(() => {
+ sessionStorage.setItem('RT_saved_y' ,window.scrollY);
+ debug.log('scroll' ,`X. User stopped scrolling. Saved Y: ${window.scrollY}`);
+ }, 200);
+ }, { passive: true });
+
+ window.addEventListener('beforeunload' ,() => {
+ is_layout_locked = true;
+ debug.log('scroll' ,"Y. Page unloading. Scroll listener locked.");
+ });
+ }
-})();
+ // ==========================================
+ // THE EXECUTION OUTLINE
+ // ==========================================
+ debug.log('scroll' ,"1. Initializing script.");
+
+ // Synchronous tasks (execute immediately while head parses)
+ configure_history();
+ capture_scroll_target();
+ load_elements();
+ bind_window_events();
+
+ // Asynchronous tasks (wait for body elements to exist)
+ document.addEventListener('DOMContentLoaded', () => {
+ process_custom_elements(); // 1. Build the final DOM structure
+ apply_style(); // 2. Paint the assembled structure
+ });
+})();
</script>
</head>
<body>
- <RT-memo>
- </RT-memo>
+ <RT·memo>
+ </RT·memo>
</body>
*/
body.style.color = "black";
// Target the new semantic tag
- const memo_seq = document.querySelectorAll("RT-memo");
+ const memo_seq = document.querySelectorAll("RT·memo");
if(memo_seq.length === 0) return;
for(let i = 0; i < memo_seq.length; i++){
,padding: "3rem"
,margin: "4rem auto"
- ,bg_color: "var(--rt-surface-0)"
- ,border_color: "var(--rt-brand-primary)"
- ,text_color: "var(--rt-brand-primary)"
+ ,bg_color: "var(--RT·surface-0)"
+ ,border_color: "var(--RT·brand-primary)"
+ ,text_color: "var(--RT·brand-primary)"
- ,shadow: "drop-shadow(0px 0px 15px var(--rt-brand-primary))"
+ ,shadow: "drop-shadow(0px 0px 15px var(--RT·brand-primary))"
};
RT.config.page = Object.assign({}, defaults, RT.config.page || {});
const conf = RT.config.page;
- const style_id = 'rt-page-fixed-glow';
+ const style_id = 'RT·page-fixed-glow';
if (!document.getElementById(style_id)) {
const style_el = document.createElement('style');
style_el.textContent = `
/* Reset page counter on the article container */
- rt-article {
- counter-reset: rt-page-counter;
+ RT·article {
+ counter-reset: RT·page-counter;
}
- rt-page {
+ RT·page {
display: block;
position: relative;
box-sizing: border-box;
filter: ${conf.shadow};
/* Counter Increment */
- counter-increment: rt-page-counter;
+ counter-increment: RT·page-counter;
}
/* Page Numbering */
- rt-page::after {
- content: "Page " counter(rt-page-counter);
+ RT·page::after {
+ content: "Page " counter(RT·page-counter);
position: absolute;
bottom: 1.5rem;
right: 3rem;
function getMeasureContainer() {
if (measureContainer && measureContainer.parentNode) return measureContainer;
- const article = document.querySelector('RT-article');
+ const article = document.querySelector('RT·article');
if (!article) {
const temp = document.createElement('div');
temp.style.visibility = 'hidden';
// =========================================================
// STEP 1: PREPARE FOOTNOTES (Strip and tag)
// =========================================================
- const article_seq = document.querySelectorAll('RT-article');
+ const article_seq = document.querySelectorAll('RT·article');
if (article_seq.length === 0) {
- debug.error('pagination', 'No <RT-article> elements found. Pagination aborted.');
+ debug.error('pagination', 'No <RT·article> elements found. Pagination aborted.');
return;
}
Array.from(article_seq).forEach(article => {
// Bulletproof extraction: immune to XML/HTML case-sensitivity parsing quirks
const all_nodes = Array.from(article.querySelectorAll('*'));
- const raw_footnotes = all_nodes.filter(node => node.tagName.toLowerCase() === 'rt-footnote');
+ const raw_footnotes = all_nodes.filter(node => node.tagName.toLowerCase() === 'RT·footnote');
raw_footnotes.forEach(fn => {
const id = footnote_counter++;
}
// Replace with a zero-height marker that rides along with the text
- const marker = document.createElement('rt-fn-marker');
+ const marker = document.createElement('RT·fn-marker');
marker.setAttribute('data-id', id);
if (fn.parentNode) {
// =========================================================
function paginateArticle(article) {
const raw_element_seq = Array.from(article.children).filter(el =>
- !['SCRIPT', 'STYLE', 'RT-PAGE'].includes(el.tagName)
+ !['SCRIPT', 'STYLE', 'RT·PAGE'].includes(el.tagName)
);
if (raw_element_seq.length === 0) return;
}
} else {
if (current_batch_seq.length === 0) {
- const frame = document.createElement('rt-scroll-frame');
+ const frame = document.createElement('RT·scroll-frame');
frame.style.display = 'block';
frame.style.overflowY = 'auto';
frame.style.maxHeight = page_height_limit + 'px';
// --- Ordinary (non-splittable) element ---
const h = getElHeight(el);
- const is_RT_page_break = el.tagName && el.tagName.toLowerCase() === 'rt-page-break';
+ const is_RT_page_break = el.tagName && el.tagName.toLowerCase() === 'RT·page-break';
if( (is_RT_page_break || current_h + h > page_height_limit) && current_batch_seq.length > 0 ){
let backtrack_seq = [];
page_seq.push(current_batch_seq);
}
- // Rebuild article with <rt-page> wrappers
+ // Rebuild article with <RT·page> wrappers
article.innerHTML = '';
let p = 0;
while (p < page_seq.length) {
const batch = page_seq[p];
- const page_el = document.createElement('rt-page');
+ const page_el = document.createElement('RT·page');
page_el.id = `page-${p + 1}`;
batch.forEach(item => page_el.appendChild(item));
article.appendChild(page_el);
// STEP 3: RESOLVE FOOTNOTES & EXPAND PAGES
// =========================================================
Array.from(article_seq).forEach(article => {
- const rendered_pages = article.querySelectorAll('rt-page');
+ const rendered_pages = article.querySelectorAll('RT·page');
Array.from(rendered_pages).forEach(page => {
// Bulletproof extraction for the markers
const all_page_nodes = Array.from(page.querySelectorAll('*'));
- const markers = all_page_nodes.filter(node => node.tagName.toLowerCase() === 'rt-fn-marker');
+ const markers = all_page_nodes.filter(node => node.tagName.toLowerCase() === 'RT·fn-marker');
if (markers.length === 0) return;
// Construct the footer block for this page
const fn_container = document.createElement('div');
- fn_container.className = 'rt-footnote-container';
- fn_container.style.borderTop = '1px solid var(--rt-border-default)';
+ fn_container.className = 'RT·footnote-container';
+ fn_container.style.borderTop = '1px solid var(--RT·border-default)';
fn_container.style.marginTop = '2rem';
fn_container.style.paddingTop = '1rem';
fn_container.style.fontSize = '0.9em';
// Replace the invisible marker with the visible naked superscript link
const sup = document.createElement('sup');
- sup.innerHTML = `<a href="#fn-${id}" id="fn-ref-${id}" style="color: var(--rt-brand-link); text-decoration: none;">${id}</a>`;
+ sup.innerHTML = `<a href="#fn-${id}" id="fn-ref-${id}" style="color: var(--RT·brand-link); text-decoration: none;">${id}</a>`;
if (marker.parentNode) {
marker.parentNode.replaceChild(sup, marker);
--- /dev/null
+<!--
+ the variable names like:
+
+ --RT·content-main
+
+ are working with a cdot (multiply) not with an mdot (typography), exactly
+ backwards from what was expected
+
+-->
+
+
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <title>Comprehensive RT· Namespace Test</title>
+ <style>
+ /* 1. Testing CSS Variables */
+ :root {
+ --RT·content-main: #e0e0e0;
+ --RT·bg-color: #1a1a1a;
+ --RT·border-style: 1px solid #444;
+ }
+
+ body {
+ background-color: var(--RT·bg-color);
+ color: var(--RT·content-main);
+ font-family: sans-serif;
+ padding: 20px;
+ }
+
+ /* 2. Testing Custom Tag Selectors */
+ RT·chapter {
+ display: block;
+ margin-bottom: 20px;
+ padding: 10px;
+ border: var(--RT·border-style);
+ }
+
+ RT·page-break {
+ display: block;
+ height: 4px;
+ background-color: #555;
+ margin: 20px 0;
+ }
+
+ /* 3. Testing CSS Class Selectors */
+ .RT·highlight {
+ color: #ffd700;
+ font-weight: bold;
+ }
+ </style>
+ <script>
+ window.RT = window.RT || {};
+
+ window.RT.processChapters = function() {
+ const debug = window.RT.debug || { log: function(){} };
+
+ // 4. Testing JS Query Selectors
+ document.querySelectorAll('RT·chapter').forEach((el, index) => {
+ if (debug.log) debug.log('chapter', `Processing chapter ${index + 1}`);
+
+ // 5. Testing Element Creation
+ const brk = document.createElement('RT·page-break');
+ const h1 = document.createElement('h1');
+
+ h1.innerHTML = el.innerHTML;
+
+ if (el.className) {
+ h1.className = el.className;
+ }
+
+ // 6. Testing ClassList Manipulation
+ h1.classList.add('RT·processed-chapter');
+
+ Array.from(el.attributes).forEach((attr) => {
+ if (attr.name !== 'class') {
+ h1.setAttribute(attr.name, attr.value);
+ }
+ });
+
+ el.parentNode.insertBefore(brk, el);
+ el.replaceWith(h1);
+ });
+
+ // 7. Testing JS Variable Identifiers (Unicode support)
+ const RT·status = "DOM fully processed using center dot (multiply dot) namespace.";
+ console.log(RT·status);
+ };
+
+ document.addEventListener("DOMContentLoaded", window.RT.processChapters);
+ </script>
+</head>
+<body>
+
+ <p class="RT·highlight">Hello!</p>
+
+ <RT·chapter class="RT·highlight">Chapter 1: The Setup</RT·chapter>
+
+ <RT·chapter data-custom="valid">Chapter 2: The Execution</RT·chapter>
+
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <title>Comprehensive RT⋅ Namespace Test</title>
+ <style>
+ /* 1. Testing CSS Variables */
+ :root {
+ --RT⋅content-main: #e0e0e0;
+ --RT⋅bg-color: #1a1a1a;
+ --RT⋅border-style: 1px solid #444;
+ }
+
+ body {
+ background-color: var(--RT⋅bg-color);
+ color: var(--RT⋅content-main);
+ font-family: sans-serif;
+ padding: 20px;
+ }
+
+ /* 2. Testing Custom Tag Selectors */
+ RT⋅chapter {
+ display: block;
+ margin-bottom: 20px;
+ padding: 10px;
+ border: var(--RT⋅border-style);
+ }
+
+ RT⋅page-break {
+ display: block;
+ height: 4px;
+ background-color: #555;
+ margin: 20px 0;
+ }
+
+ /* 3. Testing CSS Class Selectors */
+ .RT⋅highlight {
+ color: #ffd700;
+ font-weight: bold;
+ }
+ </style>
+ <script>
+ window.RT = window.RT || {};
+
+ window.RT.processChapters = function() {
+ const debug = window.RT.debug || { log: function(){} };
+
+ // 4. Testing JS Query Selectors
+ document.querySelectorAll('RT⋅chapter').forEach((el, index) => {
+ if (debug.log) debug.log('chapter', `Processing chapter ${index + 1}`);
+
+ // 5. Testing Element Creation
+ const brk = document.createElement('RT⋅page-break');
+ const h1 = document.createElement('h1');
+
+ h1.innerHTML = el.innerHTML;
+
+ if (el.className) {
+ h1.className = el.className;
+ }
+
+ // 6. Testing ClassList Manipulation
+ h1.classList.add('RT⋅processed-chapter');
+
+ Array.from(el.attributes).forEach((attr) => {
+ if (attr.name !== 'class') {
+ h1.setAttribute(attr.name, attr.value);
+ }
+ });
+
+ el.parentNode.insertBefore(brk, el);
+ el.replaceWith(h1);
+ });
+
+ // 7. Testing JS Variable Identifiers (Unicode support)
+ const RT⋅status = "DOM fully processed using middle dot (for typography) namespace.";
+ console.log(RT⋅status);
+ };
+
+ document.addEventListener("DOMContentLoaded", window.RT.processChapters);
+ </script>
+</head>
+<body>
+
+ <p class="RT⋅highlight">Hello!</p>
+
+ <RT⋅chapter class="RT⋅highlight">Chapter 1: The Setup</RT⋅chapter>
+
+ <RT⋅chapter data-custom="valid">Chapter 2: The Execution</RT⋅chapter>
+
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <title>Comprehensive RT. Namespace Test</title>
+ <style>
+ /* 1. Testing CSS Variables */
+ :root {
+ --RT.content-main: #e0e0e0;
+ --RT.bg-color: #1a1a1a;
+ --RT.border-style: 1px solid #444;
+ }
+
+ body {
+ background-color: var(--RT.bg-color);
+ color: var(--RT.content-main);
+ font-family: sans-serif;
+ padding: 20px;
+ }
+
+ /* 2. Testing Custom Tag Selectors */
+ RT.chapter {
+ display: block;
+ margin-bottom: 20px;
+ padding: 10px;
+ border: var(--RT.border-style);
+ }
+
+ RT.page-break {
+ display: block;
+ height: 4px;
+ background-color: #555;
+ margin: 20px 0;
+ }
+
+ /* 3. Testing CSS Class Selectors */
+ .RT.highlight {
+ color: #ffd700;
+ font-weight: bold;
+ }
+ </style>
+ <script>
+ window.RT = window.RT || {};
+
+ window.RT.processChapters = function() {
+ const debug = window.RT.debug || { log: function(){} };
+
+ // 4. Testing JS Query Selectors
+ document.querySelectorAll('RT.chapter').forEach((el, index) => {
+ if (debug.log) debug.log('chapter', `Processing chapter ${index + 1}`);
+
+ // 5. Testing Element Creation
+ const brk = document.createElement('RT.page-break');
+ const h1 = document.createElement('h1');
+
+ h1.innerHTML = el.innerHTML;
+
+ if (el.className) {
+ h1.className = el.className;
+ }
+
+ // 6. Testing ClassList Manipulation
+ h1.classList.add('RT.processed-chapter');
+
+ Array.from(el.attributes).forEach((attr) => {
+ if (attr.name !== 'class') {
+ h1.setAttribute(attr.name, attr.value);
+ }
+ });
+
+ el.parentNode.insertBefore(brk, el);
+ el.replaceWith(h1);
+ });
+
+ // 7. Testing JS Variable Identifiers (Unicode support)
+ const RT.status = "DOM fully processed using center dot namespace.";
+ console.log(RT.status);
+ };
+
+ document.addEventListener("DOMContentLoaded", window.RT.processChapters);
+ </script>
+</head>
+<body>
+
+ <p class="RT.highlight">Hello!</p>
+
+ <RT.chapter class="RT.highlight">Chapter 1: The Setup</RT.chapter>
+
+ <RT.chapter data-custom="valid">Chapter 2: The Execution</RT.chapter>
+
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <title>Comprehensive RT_ Namespace Test</title>
+ <style>
+ /* 1. Testing CSS Variables */
+ :root {
+ --RT_content-main: #e0e0e0;
+ --RT_bg-color: #1a1a1a;
+ --RT_border-style: 1px solid #444;
+ }
+
+ body {
+ background-color: var(--RT_bg-color);
+ color: var(--RT_content-main);
+ font-family: sans-serif;
+ padding: 20px;
+ }
+
+ /* 2. Testing Custom Tag Selectors */
+ RT_chapter {
+ display: block;
+ margin-bottom: 20px;
+ padding: 10px;
+ border: var(--RT_border-style);
+ }
+
+ RT_page-break {
+ display: block;
+ height: 4px;
+ background-color: #555;
+ margin: 20px 0;
+ }
+
+ /* 3. Testing CSS Class Selectors */
+ .RT_highlight {
+ color: #ffd700;
+ font-weight: bold;
+ }
+ </style>
+ <script>
+ window.RT = window.RT || {};
+
+ window.RT.processChapters = function() {
+ const debug = window.RT.debug || { log: function(){} };
+
+ // 4. Testing JS Query Selectors
+ document.querySelectorAll('RT_chapter').forEach((el, index) => {
+ if (debug.log) debug.log('chapter', `Processing chapter ${index + 1}`);
+
+ // 5. Testing Element Creation
+ const brk = document.createElement('RT_page-break');
+ const h1 = document.createElement('h1');
+
+ h1.innerHTML = el.innerHTML;
+
+ if (el.className) {
+ h1.className = el.className;
+ }
+
+ // 6. Testing ClassList Manipulation
+ h1.classList.add('RT_processed-chapter');
+
+ Array.from(el.attributes).forEach((attr) => {
+ if (attr.name !== 'class') {
+ h1.setAttribute(attr.name, attr.value);
+ }
+ });
+
+ el.parentNode.insertBefore(brk, el);
+ el.replaceWith(h1);
+ });
+
+ // 7. Testing JS Variable Identifiers (Unicode support)
+ const RT_status = "DOM fully processed using center dot namespace.";
+ console.log(RT_status);
+ };
+
+ document.addEventListener("DOMContentLoaded", window.RT.processChapters);
+ </script>
+</head>
+<body>
+
+ <p class="RT_highlight">Hello!</p>
+
+ <RT_chapter class="RT_highlight">Chapter 1: The Setup</RT_chapter>
+
+ <RT_chapter data-custom="valid">Chapter 2: The Execution</RT_chapter>
+
+</body>
+</html>
projects / RT-Style / commitdiff