lagHitp--web-page-dialect
sensorial-concept-Mcs (lagHitp)
Html5.Id.Toc.Preview--Html-Css-Js--language
with Html5, Ids, Table-of-contents, link-Preview

overview of lagHitp

description::
lagHitp (html5.id.toc.preview) is a-WEBPAGE-Html-Css-JS-DIALECT (format|method|framework) for publishing WEBPAGES of title-content-tree structured-documents with these advantages:
1) Html5: no need for special programs to read them, as all machines have the needed browser (= html reader). Also html5-elements structure the-text for humans and machines.
2) Id: anyone can-refer to ANY PART of them, because all their html-elements have IDs.
3) Toc: automatically created expandable table-of-contents makes reading EASY.
4) Preview: same domain link-preview makes reading FAST.

With these attributes and by connecting the-NAMES of the-sentences with their DEFINITIONS using preview-links, we can-create our electronic-documents subjectively MONOSEMOUS, easily readable by humans and machines.
Knowledge of Html, Css, Browser-javascript is a-must to read the-rest of this page.

Artificial-intelligence will never succeed to understand today's POLYsemous unstructured-info[1] (only a portion of it will manage), for the simple fact it[1] is polysemous and some times ZEROsemous (= meaningless)!!!
The-creation of MONOsemous-structured-documents is a-prerequisite to manage the enormous quantity of human-information with the-help of machines.

· lagHitp is a-document-computer-language.

name::
* McsEngl.McsTchInf000008.last.html!⇒lagHitp,
* McsEngl.dirTchInf/McsTchInf000008.last.html!⇒lagHitp,
* McsEngl.Hitp!⇒lagHitp,
* McsEngl.Html5IdTocPreview!⇒lagHitp,
* McsEngl.Html5.id.toc.preview!⇒lagHitp,
* McsEngl.Html5.id.toc.preview--web-page-format!⇒lagHitp,
* McsEngl.Html5.id.toc.preview--page-format!⇒lagHitp,
* McsEngl.Html5IdTocPreview--web-page-format!⇒lagHitp,
* McsEngl.Lhp!⇒lagHitp, {2020-05-06},
* McsEngl.Lhitp!⇒lagHitp, {2020-05-06}, /el-hitp/,
* McsEngl.generic-specific-pair--web-page!⇒lagHitp, {2013.09.01}
* McsEngl.lagHitp, {2019-07-05},
* McsEngl.lagHitp'(McsTchInf000008)!⇒lagHitp,
* McsEngl.lagHitp'(Html5.Id.Toc.Preview--web-page-language)!⇒lagHitp,
* McsEngl.lagHitp-(Html5.Id.Toc.Preview)!⇒lagHitp,
* McsEngl.lagHitp-dialect!⇒lagHitp,
* McsEngl.lagHitp-language!⇒lagHitp,
* McsEngl.lagHitp--web-language!⇒lagHitp, {2018-10-27},
* McsEngl.lagHitp--web-page-format!⇒lagHitp,
* McsEngl.lagHitp--web-page-format!⇒lagHitp,
* McsEngl.lagHitp--web-page-dialect!⇒lagHitp,
* McsEngl.lagHitp--web-page-application-format!⇒lagHitp,
* McsEngl.lagHitp--page-format!⇒lagHitp,
* McsEngl.title-content-tree--document---web-page-format!⇒lagHitp,

01_machine of lagHitp

name::
* McsEngl.lagHitp'01_machine,
* McsEngl.lagHitp'machine,

description::
· ALL machines understand lagHitp.

02_archetype (input) of lagHitp

description::
Archetype is the-entity we want to model with a-language.
A-lagHitp-archetype is a-document (= recorded information) with a title-content-tree structure.

name::
* McsEngl.lagHitp'02_archetype!⇒lagHitp'archo,
* McsEngl.lagHitp'archetype!⇒lagHitp'archo,
* McsEngl.archo-doc-of-lagHitp!⇒lagHitp'archo,
* McsEngl.archodoc-of-lagHitp!⇒lagHitp'archo,
* McsEngl.document-archetype--of-lagHitp!⇒lagHitp'archo,
* McsEngl.lagHitp'archetype'title-content-tree-document!⇒lagHitp'archo,
* McsEngl.lagHitp'archetype-document!⇒lagHitp'archo,
* McsEngl.lagHitp'archo, {2019-02-21},
* McsEngl.lagHitp'archo-doc!⇒lagHitp'archo,
* McsEngl.lagHitp'structured-document!⇒lagHitp'archo,
* McsEngl.lagHitp-archo!⇒lagHitp'archo!⇒lagHitp'archo,
* McsEngl.title-content-document--of-lagHitp!⇒lagHitp'archo,
* McsEngl.title-content-tree-document--of-lagHitp!⇒lagHitp'archo,

lagHitp-archo'title-content-tree--document

definition.recursive::
START-CONDITION:
A-title-content-tree-document is a-document with a-whole-part-tree--structure of
1) INFO-TITLE: the-parent-node and
2) INFO-CONTENT: an order-set of info-doc-units and part title-content-tree--docs (subtree-docs), the-children-nodes.
END-CONDITION:
Leaf-title-content-tree--docs consist of 1) a-title and 2) an order-set of info-doc-units.

name::
* McsEngl.document.title-content-tree,
* McsEngl.lagHitp'archo'title-content-tree--document,
* McsEngl.Tctd,
* McsEngl.title-content-tree--document,

part::
title,
content,
node,
level,
depth,

specific::
bottom-tree,
leaf-tree,
root-tree,
subtree,

TCTree-doc.BOTTOM

Definition.specific::
Bottom-tree is a-tree whose content contains bottom-nodes.

name::
* McsEngl.lagHitp'archo'bottom-tree,
* McsEngl.lagHitp'archo'tree.bottom,
* McsEngl.title-content-tree--document.bottom,

TCTree-doc.LEAF

Definition.specific::
Leaf-tree is a-tree whose content contains only doc-units.

name::
* McsEngl.lagHitp'archo'tree.leaf,
* McsEngl.lagHitp'archo'leaf-tree,
* McsEngl.title-content-tree--document.leaf,

TCTree-doc.ROOT

Definition.specific::
Root-tree is the outermost tree in a-title-content-tree-document.
Its title, the-root-title, has no parent.

name::
* McsEngl.lagHitp'archo'tree.root,
* McsEngl.lagHitp'archo'root-tree,
* McsEngl.title-content-tree--document.root,

TCTree-doc.SUBTREE

Definition.specific::
Subtree is a-tree which is part of the-content of another tree.

name::
* McsEngl.lagHitp'archo'tree.subtree,
* McsEngl.lagHitp'archo'subtree,
* McsEngl.title-content-tree--document.subtree,

lagHitp-archo'title

description::
An-archo-title is text (a-name or a-phrase) that describes an-archo-content.
Sometimes, a-title is generic-information and a-content specific.

name::
* McsEngl.lagHitp'archo'info-title,
* McsEngl.lagHitp'archo'title,
* McsEngl.title-content-tree--document'title,

lagHitp-archo'title.Root

description::
Root-title is-called the outermost title-node in the-archetype-tree.

name::
* McsEngl.lagHitp'archo'root-title,
* McsEngl.lagHitp'archo'root-node,
* McsEngl.title-content-tree--document'title.root,

lagHitp-archo'content

description::
Archo-content[1] is the-children of an-archo-title.
It[1] is an order-set of doc-units and title-content-tree--docs.

name::
* McsEngl.lagHitp'archo'info-content,
* McsEngl.lagHitp'archo'content,
* McsEngl.title-content-tree--document'content,

lagHitp-archo'doc-unit

description::
lagHitp-archo-unit is
- a-paragraph-with-sentences: an order-set of sentences, or
- a-paragraph-with-subparagraphs: an order-set of group of sentences separated with empty lines, or
- a paragraph-with-nonsentences: a-paragraph plus images, audios, videos, lists, tables, trees.

name::
* McsEngl.lagHitp'archo'info-doc-unit,
* McsEngl.lagHitp'archo'doc-unit,
* McsEngl.title-content-tree--document'doc-unit,

lagHitp-archo'node

description::
The-nodes of the-archo-tree are of two types: archo-doc-units or archo-titles.

name::
* McsEngl.lagHitp'archo'node,

specific::
• ancestor-node,
bottom-node,
• child-node,
• descendant-node,
leaf-node,
• parent-node,
root-node,
• sibling-node,
top-node,

Archo-node'number

description::
Every node has 2 numbers that denote its distance from the-top (root) and the-bottom of the-tree.

name::
* McsEngl.lagHitp'archo'number-of-node,
* McsEngl.lagHitp'archo'node-number,
* McsEngl.lagHitp'number-of-archo-node,

specific::
root-number-of-node,
bottom-number-of-node,

Archo-node'number.ΒΟΤΤΟΜ

description::
Bottom-number of a-node is its distance from the-bottom.
The-bottom-node has 0 bottom-number.
The-root-node has the-highest bottom-number.

name::
* McsEngl.lagHitp'archo'bottom-number-of-node,
* McsEngl.lagHitp'archo'node-bottom-number,
* McsEngl.lagHitp'height-number-of-archo-node,
* McsEngl.lagHitp'bottom-number-of-archo-node,

Archo-node'number.ROOT

description::
Root-number of a-node is its distance from the-top (root).
The-root has 0 root-number.
A-bottom-node has the-highest root-number.

name::
* McsEngl.lagHitp'archo'root-number-of-node,
* McsEngl.lagHitp'archo'node-root-number,
* McsEngl.lagHitp'depth-number-of-archo-node,
* McsEngl.lagHitp'root-number-of-archo-node,

Archo-node.BOTTOM

description::
Bottom-node is a-node with the-highest root-number.

name::
* McsEngl.lagHitp'archo'bottom-node,
* McsEngl.lagHitp'archo'node.bottom,

Archo-node.LEAF

description::
Leaf-node is a-node without children.

name::
* McsEngl.lagHitp'archo'leaf-node,
* McsEngl.lagHitp'archo'node.leaf,

lagHitp-archo'level

description::
Level-of--lagHitp-archetype is the-set of nodes with the-same number.

name::
* McsEngl.lagHitp'archo'level,

lagHitp-archo'depth|height

description::
Depth|height-of--lagHitp-archetype is the-number of its levels.

name::
* McsEngl.lagHitp'archo'depth,
* McsEngl.lagHitp'archo'height,

lagHitp-archo'table-of-contents

description::
Archetype-table-of-contents is a-whole-part-tree with nodes the-titles of the-archo-doc.

name::
* McsEngl.lagHitp'archo'table-of-contents,
* McsEngl.lagHitp'archo'Toc,

03_web-page (output) of lagHitp

description::
A-lagHitp-web-page (lagHitp-doc) is A-DOCUMENT which maps|represents|denotes|models an-archo-title-content-tree-doc.
It is structured for humans and machines.
It contains and extra information apart of the archo-doc representation, such as meta-info and site-info.
It is-written in 3 computer-languages, because it is a-web-application:
Html: for the-structure of the-information,
Css: for its presentation,
Browser-javascript (Jsbr): for its processing.
The-Html-doc is the most whole container which includes the-Css-doc and the-Jsbr-doc.
[HmnSgm.2017-09-23]

name::
* McsEngl.lagHitp'03_web-page!⇒Hitppage,
* McsEngl.lagHitp'web-page!⇒Hitppage, {2019-02-21},
* McsEngl.Hitppage, /el-hitp-yueb-pé-ij/, {2020-05-09},
* McsEngl.lagHitp'output!⇒Hitppage,
* McsEngl.lagHitp'page!⇒Hitppage, {2019-02-23},
* McsEngl.lagHitp-code!⇒Hitppage,
* McsEngl.lagHitp-doc!⇒Hitppage,
* McsEngl.lagHitp-model!⇒Hitppage,
* McsEngl.lagHitp-webpage!⇒Hitppage, {2019-06-15},
* McsEngl.web-page.lagHitp!⇒Hitppage,

browser-compatibility of Hitppage

description::
• lagHitp-docs are-tested on modern {2016} browsers on win10: Chrome, Firefox, Safari, Edge, IE11.

name::
* McsEngl.Hitppage'browser-compatibility,
* McsEngl.lagHitp'browser-compatibility,
* McsEngl.lagHitp'browser-support,

download of Hitppage

name::
* McsEngl.lagHitp'download,
* McsEngl.Hitppage'download,
* McsEngl.lagHitp-download,

GitHub-site:
Since version.10.2014-08-05.valuenames I published the-code on GitHub.
https://github.com/synagonism/hitp/.

To use the online files, use the-latest-files on the-project-page on GitHub.
https://synagonism.github.io/hitp/hitp.html.
https://synagonism.github.io/hitp/hitp.css.
https://synagonism.github.io/hitp/hitp.js.

Synagonism-site:
lagHitp.18.2021-05-25.module,
lagHitp.17.2018-09-15.search-scalability,
lagHitp.16.2017-06-05.Searching,
lagHitp.15.2016-10-27.any-machine,
lagHitp.14.2016-06-09.title-content-tree,
lagHitp.12.2016-01-24.Toc-icons,
lagHitp.11.2015-10-26.preferences,
lagHitp.10.2014-08-05.valuenames,
lagHitp.08.2014-01-09.Toc,
lagHitp.07.2013-11-06.tabs,
lagHitp.05.2013-07-15.Toc-algo,
lagHitp.04.2013-06-27.html5.id.toc.preview,
lagHitp.03.2013-04-14.preview,
lagHitp.02.2013-04-01.Toc,
lagHitp.01.2011-02-17.html5.id,

file of Hitppage

Every lagHitp-web-page is comprised of:
• one Html-file the main container,
• one Css-file,
• one Jsbr-file,
• one optional directory with all other needed files such as pictures, audio, video, Css, etc.
The-name of the-directory is the-same with the-name of the-html-file plus the '.files' extension.

name::
* McsEngl.lagHitp'file, {2019-02-23},
* McsEngl.lagHitp'syntax-tree!⇒lagHitp'file,
* McsEngl.Hitppage'file!⇒lagHitp'file,
* McsEngl.lagHitp-file!⇒lagHitp'file,

specific::
* Html-file,
* Css-file,
* javascript-file,
* config.json,
* filSite-structure.html,
=== McsHitp:
* namidx.lagRoot.json,
* namidx.lagEng00.json,
* namidx.lagEng01.json, ..,

directory of Hitppage

description::
Optionally, the-lagHitp-doc has a-directory with all extra files needed such as images, specific Css or Jsbr code, anything.
Its name is the-name of the-lagHitp-Html-file plus '.files'.

name::
* McsEngl.lagHitp'directory,
* McsEngl.lagHitp-directory,
* McsEngl.Hitppage'directory,

style of Hitppage

description::
· the-style of a-page is-created mainly with the-lagHitp-Css-doc, with html-elements and the-javascript-doc.

name::
* McsEngl.Hitppage'style!⇒lagHitp-style,
* McsEngl.lagHitp-style, {2019-06-15},

lagHitp-style.TEXT

name::
* McsEngl.lagHitp-style.text,
* McsEngl.lagHitp--text-style,

text-style.LINE

name::
* McsEngl.lagHitp--text-style.line,

text-style.line.THROUGH

description::
· with the-Html-element <del>.

name::
* McsEngl.lagHitp--text-style.line.through,

Html-doc of Hitppage

description::
The-Html-language models the-structure of a-lagHitp-web-page and stores the-content of the-archo-doc.
The-Html-doc is the most whole CONTAINER of the-web-page.
It contains the-Css-doc and the-Jsbr-doc.

name::
* McsEngl.lagHitp'Html!⇒Hitphml, {2019-02-21},
* McsEngl.Hitphml, {2020-05-08},
* McsEngl.Hitphml'(lagHitp-Html-doc)!⇒Hitphml,
* McsEngl.Hitphml-code!⇒Hitphml,
* McsEngl.Hitphml-doc!⇒Hitphml,
* McsEngl.Hitppage'Html-doc!⇒Hitphml,
* McsEngl.Html-code--of-lagHitp!⇒Hitphml,
* McsEngl.Html-doc--of-lagHitp!⇒Hitphml,
* McsEngl.lagHitp-Html!⇒Hitphml,

Hitphml'Html5

description::
We use the-Html5-elements section, header, footer to create the-parts of a-lagHitp-page that maps a-title-content-tree-doc.

name::
* McsEngl.Hitphml'Html5,
* McsEngl.Hitphml5,
* McsEngl.lagHitp-Html5,

Hitphml'title-content-tree--document

description::
A-lagHitp--title-content-tree-document maps an-archo-title-content-tree--document.
We use the section, header, footer and p Html-elements to create lagHitp-docs.

name::
* McsEngl.lagHitp'title-content-tree--document,
* McsEngl.Hitphml'title-content-tree--document,
* McsEngl.lagHitp-Tctd,

part::
title-of-lagHitp-tree,
content-of-lagHitp-tree,
doc-unit-of-lagHitp-tree,

specific::
footer-tree,
header-tree,
meta-tree,
p-tree,
root-tree,
section-tree,

lagHitp-Tctd.ROOT (header)

description::
A-lagHitp-root-tree (a-lagHitp-doc) maps|represents an-archo-root-tree (a-title-content-tree-doc).
We use a-header and an-h1 elements to create the-title, and an-ordered-set of h1-trees with last a-footer-tree to create the-content of the-root-tree.
The-header-element is the first child of the-body-element.
<header id="idHeader">
  <h1 id="idHeaderH1">Title
  </h1>
</header>

<section id="idName">
  <h1 id="idNameH1">Title
    </h1>
  content
</section>

<footer id="idFooter">
  <p id="idFooterP1">Title:
    doc-units
    </p>
</footer>

name::
* McsEngl.lagHitp-Tctd.header,
* McsEngl.lagHitp-header-tree,
* McsEngl.lagHitp-Tctd.root,
* McsEngl.lagHitp-root-tree,
* McsEngl.lagHitp-document.root,
* McsEngl.lagHitp-doc.root,

Depth:
The biggest depth of a-lagHitp-doc is 6+1.
This is because the-heading-elements h1 ... h6 are 6 and thus a-section-tree can have only 5 subtrees.
The extra depth we get from p-trees.

PROPOSAL: Because many documents use deeper depth than 7 (even-though I do-not-think it is a good practice) I proposed on {2010.10.24} in public-html-comments@w3.org list to use all the single-digit numbers 0-9 as html-headings.

lagHitp-Tctd.SECTION

description::
A-section-tree is a-tree in which we use the-section-element as a-container, a-heading-element for its title and for its content, doc-units or other section-trees.
The-subtrees of a-section-tree have ordered titles in the form h1, h2, h3, h4, h5, and h6.
<section id="idName2">
<h2 id="idName2H2">Title2
  </h2>
<p>Sentence1.
  Sentence2.
  </p>
 
<section id="idName3">
<h3 id="idName3H3">Title3
  </h3>
<p>Sentence1.
  Sentence2.
  </p>
</section>
</section>

name::
* McsEngl.lagHitp-Tctd.section,
* McsEngl.lagHitp-section-tree,

specific::
• h1-section-tree (has h1-element as title),
• h2-section-tree (has h2-element as title),
• h3-section-tree (has h3-element as title),
• h4-section-tree (has h4-element as title),
• h5-section-tree (has h5-element as title),
• h6-section-tree (has h6-element as title),

lagHitp-Tctd.FOOTER

description::
A-lagHitp-footer-tree is an optional special tree, last child of the-root-tree.
It is-created with the-footer-element, with no title, and content document-units with text that ends the-text of the-doc.
<footer id="idFooter">
  <p id="idFooterP1">Title:
    doc-units
    </p>
</footer>

name::
* McsEngl.lagHitp-Tctd.footer,
* McsEngl.lagHitp-footer-tree,

lagHitp-Tctd.P

description::
A-lagHitp-p-tree is always a-leaf-tree we create with the-p-element.
Its-title is the first line which ends with ':'.
Its-content contains only doc-units.
<p id="idName">Title:
  sentences or subparagraphs
  </p>
//or
<div id="idName">
  <p>Title:
    Sentence1.
    Sentence2.
  </p>
  <table>
    ...
  </table>
  </div>

name::
* McsEngl.lagHitp-Tctd.p,
* McsEngl.lagHitp-p-tree,

lagHitp-Tctd.Meta

description::
A-web-page-meta-tree is a special section-tree, which is NOT PART of the-root-tree.
It contains meta-info about the-doc such as versions, comments, support etc.
<section id="idMeta">
<h1 id="idMetaH1">Meta-Info
  </h1>
  content.meta
  <p id="idMetaWebpage_path"><span class="clsB clsColorGreen">page-wholepath</span>:
    lagHitp-web-page
    ∈ synagonism.net
  </p>
</section>

name::
* McsEngl.lagHitp-Tctd.meta,
* McsEngl.lagHitp-meta-tree,

Hitphml'title

description::
A-lagHitp-title maps an-archo-title[1].
We use the-heading-elements (h1, h2, ... h6) to implement it[1]:
<h1 id="idName">title</h1>
or the first line of a-p-element ending with '::'
<p id="idName">title::
  doc-unit
  </p>

name::
* McsEngl.lagHitp'title,
* McsEngl.lagHitp'web-page-title,
* McsEngl.Hitphml'title,

Hitphml'content

description::
A-lagHitp-content maps an-archo-content.
It contains lagHitp-doc-units and other lagHitp-trees.

name::
* McsEngl.lagHitp'content,
* McsEngl.lagHitp'web-page-content,
* McsEngl.Hitphml'content,

Hitphml'doc-unit

description::
A-lagHitp-doc-unit maps an-archo-doc-unit.
It is-created with p-elements and inline elements, or we use a-div-element as a-container if and extra block elements like ol, ul, table create the-doc-unit.

name::
* McsEngl.Hitphml'doc-unit,
* McsEngl.Hitphml'document-unit,
* McsEngl.Hitphml'unit,

specific::
paragraph-with-sentences-doc-unit,
paragraph-with-subparagraphs-doc-unit,
paragraph-with-nonsentences-doc-unit,

lagHitp-Html-unit.Paragraph-with-sentences

description::
For readability, we put every sentence in a new line.
<p id="idName">Sentence1.
  Sentence2.
  SentenceLast.
  </p>

name::
* McsEngl.lagHitp-Html-unit.paragraph-with-sentences,
* McsEngl.lagHitp-Html-unit.sentences,
* McsEngl.lagHitp'sentences-Html-doc-unit,

lagHitp-Html-unit.Paragraph-with-subparagraphs

description::
<p id="idName">Sentence1.
  Sentence2.
 
  Sentence3.
  SentenceLast.
  </p>

name::
* McsEngl.lagHitp-Html-unit.paragraph-with-subparagraphs,

lagHitp-Html-unit.Paragraph-with-nonsentences

description::
<div id="idName">
  <p>Sentence1.
    Sentence2.
  </p>
  <table>
    ...
  </table>
  <a class="clsHide" href="#idName"></a></div>

name::
* McsEngl.lagHitp-Html-unit.paragraph-with-nonsentences,
* McsEngl.lagHitp-Html-unit.nonsentences,
* McsEngl.lagHitp'nonsentences-Html-doc-unit,

Hitphml'file

description::
The-html-file is the main file of the-web-page.
It is the most whole CONTAINER of all files of the-web-page.
See the-example-file on github.

name::
* McsEngl.Html-file--of-lagHitp,
* McsEngl.lagHitp'file.Html,
* McsEngl.Hitphml'file,

Hitphml'IDs

description::
The core concept (and first motive) of our-proposal is the-addition of ID-attributes on all elements of a-lagHitp-page.
For example:
<h1 id="idXxxx">...
<p id="idYyyy">...

Now we can-refer to any part of the-document!!!

name::
* McsEngl.lagHitp'id, {2019-02-24},
* McsEngl.Hitphml'id!⇒lagHitp'id,
* McsEngl.lagHitp-id!⇒lagHitp'id,

The-IDs must-be unique:
You can-use as ID whatever you want.
We sugest to begin with "id" in-order to be-distinguished from other words in the-text and do-not-contain spaces.
For example:
id, idHeader, idLagHitpidx-income, ...

ID-Patterns:
If the-author of a-doc uses patterns to write the-IDs of a-text-file, it helps the-reader to quickly identify the-parts of the-file.
Examples:
- idA4 (article)
- idA4P2 (paragraph)
- idP2 (Part)
- idP2C2 (Chapter)

NOTATION::
the-ID of a-heading-element is the-ID of its section-element plus H1, H2, etc.
This way we can-link and preview the-part of the-doc with this heading.

address-link-icon of lagHitp

description::
· the-IDs must-be visible to the-reader:
· the-reader, in-order to REFER to any part of the-document, must-know the-ID of this part of the-file.
· this can-be-done by adding a hidden element in this part of the-file that will-be-visible when we want to see it and not disturbing our text.
· but if this hidden-element is and a-link-element, then the-reader could-copy the-address of this part of the-file from the-address-bar of his browser.
· here is an-example of the simple code we have to add to reach our goal.
<p id="idYyyy">...
  <a class="clsHide" href="#idYyyy"></a></p>

· with this code, when the-reader clicks|taps on content, at the-end of the clicked doc-unit appears the-ADDRESS-LINK-ICON.  
· clicking on this icon, s|he can-see the-ID of this text and s|he can-copy from the-address-bar the-address of this particular part of the-text.
· the-paragraph you are-reading now has the-feature we are-talking about and you can-experiment with it.
· we can-set IDs, if we need them, on every SENTENCE in a-paragraph.

name::
* McsEngl.lagHitp'address-link-icon,
* McsEngl.lagHitp'id'address-link-icon,

Hitphml'links

description::
By setting IDs in all elements of a-text, we can-refer to any part of a-document.
Then we can-use links in all places in a-text we refer to another place inside a-document or outside of it.
Law-texts are full of references.
Find the-references it is difficult and sometimes impossible.
If the-references are "one click away", then reading law will become easier.

name::
* McsEngl.lagHitp'link,
* McsEngl.Hitphml'link,
* McsEngl.lagHitp-link,

Hitphml'math-formulas

name::
* McsEngl.lagHitp'math,
* McsEngl.Hitphml'math,
* McsEngl.lagHitp-math,
* McsEngl.math-in-lagHitp,

description::
Using MathJax we can-have "beautiful math in all browsers". For example: x = b ± b 2 4 a c 2 a , C612
HOW:
1. we need to add the following code:
<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.4/MathJax.js?config=TeX-MML-AM_CHTML" async></script> and
2. create the-mathML-code[a]. An easy method is to copy it[a] from online sites like:
* http://www.wiris.com/editor/demo/en/developers#mathml-latex,
* http://www.wiris.com/editor/demo/en/chemtype,

Css-doc of Hitppage

description::
The-Css-language models the-presentation of the-archo-doc.
We use a-Css-file[1] for harmonization in the-appearance of documents and for the-Toc creation.
You need the following code, inside the-Html-doc, to use it[1]:
<link rel="stylesheet" href="../Mcsmgr/hitp.css">
You can-store the-hitp.css-file AND in your server.
Also you can modify the-appearance of the-document by using AND your own Css-file.

name::
* McsEngl.Hitpcss,
* McsEngl.Hitpcss'(lagHitp-Css-doc)!⇒Hitpcss,
* McsEngl.Hitpcss-doc!⇒Hitpcss,
* McsEngl.lagHitp'Css!⇒Hitpcss, {2019-02-21},
* McsEngl.Hitppage'Css-doc!⇒Hitpcss,
* McsEngl.lagHitp-Css!⇒Hitpcss,

Hitpcss'class

description::
· like the-IDs, the-name of all Css-classes begin with 'cls'.

name::
* McsEngl.lagHitp'class-of-Css!⇒lagHitp-cls,
* McsEngl.lagHitp'cls!⇒lagHitp-cls, {2019-02-28},
* McsEngl.lagHitp'cls-of-Css!⇒lagHitp-cls,
* McsEngl.Hitpcss'class!⇒lagHitp-cls,
* McsEngl.lagHitp-Css'class!⇒lagHitp-cls,

Css-class.clsHide

description::
· this class is-used to display the-links[a] on every element that[a] contain the-address of the-element.

name::
* McsEngl.lagHitp-cls.clsHide,
* McsEngl.lagHitp'clsHide,

Css-class.clsPreview

description::
· links with this class, display a-preview of their info and with a second click go to that location.

name::
* McsEngl.lagHitp-cls.clsPreview,
* McsEngl.lagHitp'clsPreview,

Css-class.clsClicked

description::
· this class is-added on the-Html-elements clicked by the-user and adds misc functionality:
- display the-address-link-icons.
- add color on the-links in the clicked element.

name::
* McsEngl.lagHitp-cls.clsClicked,
* McsEngl.lagHitp'clsClicked,

Css-class.clsTocExpand

description::
· if this class is-present on idMetaWebpage_path paragraph, then when the-page is-opened the-Toc is-expanded.

name::
* McsEngl.lagHitp-cls.clsTocExpand,
* McsEngl.lagHitp'clsTocExpand,

Css-class.paperbook-page

description::
· it is-used on span-elements to display the-number of a-page of a-paper-book in lagHitp-format.

name::
* McsEngl.lagHitp-cls.paperbook-page,
* McsEngl.lagHitp'clsPagePb,

lagHitp'clsPagePb {
  display: block;
  text-align: right;
  color: green;
}

Css-class.CENTER

name::
* McsEngl.lagHitp'center-text,
* McsEngl.lagHitp-cls.center,
* McsEngl.lagHitp'clsCenter,

lagHitp'clsCenter {
  text-align: center;
}

lagHitp'clsCenterBlock {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

lagHitp'clsCenterInline {
  display: block;
  text-align: center;
}

Css-class.BUTTON

name::
* McsEngl.lagHitp'button-class,
* McsEngl.lagHitp-cls.button,
* McsEngl.lagHitp'clsBtn,

lagHitp'clsBtn {
  border-radius: 5px;
  font-size: 12px;
  margin: 2px 0 5px 12px;
}

lagHitp'clsBtn:hover {
  background: #e0f2f7;
  color: red;
}

Css-class.COLOR

name::
* McsEngl.lagHitp'color-classes,
* McsEngl.lagHitp-cls.color,
* McsEngl.lagHitp'clsColor,

lagHitp'clsColorBlue {
  color: #0000ff;
}

lagHitp'clsColorGreen {
  color: #008000;
}

lagHitp'clsColorGreenBg {
  background-color: #008000;
}

lagHitp'clsColorRed {
  color: #ff0000;
}

lagHitp'clsColorYellow {
  color: #FFFF00;
}

lagHitp'clsColorYellowBg {
  background-color: #FFFF00;
}

Css-class.FONT

name::
* McsEngl.lagHitp'font-classes,
* McsEngl.lagHitp-cls.font,
* McsEngl.lagHitp'clsFont,

lagHitp'clsFontGrExt {
  font-family: "Palatino Linotype";
}

lagHitp'clsFontGrMg {
  font-family: MgPolNewTimes;
  font-size: 16px;
}

lagHitp'clsFontSerif {
  font-family: Serif, "Times New Roman", Georgia;
}

lagHitp'clsFontSansserif {
  font-family: SansSerif, "Microsoft Sans Serif", Arial, Dialog, Tahoma;
}

lagHitp'clsFontMonospaced {
  font-family: Monospaced, "Courier New", Courier;
}

lagHitp'clsFontScript {
  font-family: Script "Monotype Corsiva";
}

lagHitp'clsFontDecorative {
  font-family: Wingdings;
}

Css-class.SIZE

name::
* McsEngl.lagHitp'size-of-font,
* McsEngl.lagHitp-cls.size,
* McsEngl.lagHitp'clsSize,

lagHitp'clsSizeSmall {
  font-size: small;
}

lagHitp'clsSizeSmallX {
  font-size: x-small;
}

lagHitp'clsSizeMedium {
  font-size: large;
}

lagHitp'clsSizeLarge {
  font-size: large;
  font-weight: bold;
}

lagHitp'clsSizeLargeX {
  font-size: x-large;
  font-weight: bold;
}

Css-class.BIU

name::
* McsEngl.lagHitp'bold-class,
* McsEngl.lagHitp'italic-class,
* McsEngl.lagHitp'underline-class,
* McsEngl.lagHitp-cls.bold,
* McsEngl.lagHitp-cls.italic,
* McsEngl.lagHitp-cls.underline,
* McsEngl.lagHitp'clsB,
* McsEngl.lagHitp'clsBU,
* McsEngl.lagHitp'clsI,
* McsEngl.lagHitp'clsU,

lagHitp'clsB {
/* use strong element, not this */
  font-weight: bold;
}
===
· also use the-Html-element <strong>.

lagHitp'clsBU {
  font-weight: bold;
  text-decoration: underline;
}

lagHitp'clsI {
  font-style: italic;
}
===
· also use the-Html-element <em>.

lagHitp'clsU {
  text-decoration: underline;
}

Hitpcss'file

description::
The-Css-doc has 3 files.
The-hitp.css, main file, and 2 font files, filFntUbuntuMonoRegular.ttf and filIcnFa463.woff2 (Icons Font Awesome 4.6.3)
You can-download them from my-site, or from github:
- hitp.css,
- filFntUbuntuMonoRegular.ttf,
- filIcnFa463.woff2,

name::
* McsEngl.Hitpcss-file,
* McsEngl.Hitpcss'file,
* McsEngl.hitp.css,
* McsEngl.lagHitp-file.Css,

javascript-doc of Hitppage

description::
Browser-javascript-language models the-information processing on the-page.
- creates the-Toc and inserts it into the-page.
- makes the-width of Toc-container dynamic.
- adds preferences on the-page.
- adds the-site-structure.
- adds the-page-path.
- ...

name::
* McsEngl.lagHitp'browser-javascript-doc!⇒Hitpjsb,
* McsEngl.lagHitp'javascript-doc!⇒Hitpjsb,
* McsEngl.lagHitp'JS-doc!⇒Hitpjsb,
* McsEngl.Hitpjsb, {2020-05-09},
* McsEngl.Hitpjsb'(lagHitp-javascript-browser-doc), {2020-05-08},
* McsEngl.Hitpjsb-code!⇒Hitpjsb,
* McsEngl.Hitpjsb-doc!⇒Hitpjsb,
* McsEngl.Hitppage'browser-javascript-doc!⇒Hitpjsb,
* McsEngl.Hitppage'javascript-doc!⇒Hitpjsb,
* McsEngl.Hitppage'JS-doc!⇒Hitpjsb,
* McsEngl.Hitppage'Jsbr-doc!⇒Hitpjsb,
* McsEngl.lagHitp'Jsbr!⇒Hitpjsb, {2019-02-21},
* McsEngl.lagHitp-Jsbr!⇒Hitpjsb,
* McsEngl.lagHitp--Jsbr-doc!⇒Hitpjsb,
* McsEngl.javascript-code--of-lagHitp!⇒Hitpjsb,
* McsEngl.javascript-doc--of-lagHitp!⇒Hitpjsb,
* McsEngl.Jsbr-code--of-lagHitp!⇒Hitpjsb,
* McsEngl.Jsbr-doc--of-lagHitp!⇒Hitpjsb,

Hitpjsb'file

description::
'hitp.js' is the-javascript-code you need to create a-lagHitp-web-page.
It is part of the-Html-doc.
It is-included using the-script-element at the-end of the-body-element:
<script src="../Mcsmgr/hitp.js"></script>
You can-download this file, or use the online one.
So, hitp.html, hitp.css and hitp.js is the-code needed to create lagHitp-pages, and it is free (MIT license).

name::
* McsEngl.lagHitp'file.javascript,
* McsEngl.lagHitp'file.Jsbr,
* McsEngl.lagHitp'javascript-file,
* McsEngl.Hitpjsb'file,
* McsEngl.hitp.js,

Hitpjsb'API

description::
· a-lagHitp-Jsbr-document has an-API, like any programing-language document, with oHitp the-most-whole-object.

name::
* McsEngl.API.lagHitp,
* McsEngl.lagHitp'API,
* McsEngl.Hitpjsb'API,

repository::
* https://github.com/synagonism/hitp,
* latest: https://github.com/synagonism/hitp/tree/gh-pages,

oHitp

description::
oHitp is the-most-whole-object of the-lagHitp-javascript-document.

name::
* McsEngl.lagHitp'API'oHitp!⇒oHitp,
* McsEngl.lagHitp'oHitp!⇒oHitp,
* McsEngl.oHitp, {2019-02-24},

member::
// 17-7-7.2021-04-28 Object.getOwnPropertyNames(oHitp).sort().join(', ')
[aNamidxRoot, aSuggestions, aVersion, bEdge, bFirefox, fContainersInsert, fObjvalRKey, fTocTriCreate, fTocTriHighlightNode, nCfgPageinfoWidth, oEltClicked, oEltSitemenuUl, oTreeUl, sCfgHomeLocal, sNamidx, sPathSite, sPathSitemenu, sQrslrAClk, sQrslrAClkLast, sSrchCrnt, sSrchNext]
// 16-5-0.2017-11-09 Object.getOwnPropertyNames(oHitp).sort().join(', ')
[bEdge, bFirefox, bSite, fContainersInsert, fObjvalRKey, fTocTriCreate, fTocTriHighlightNode, nCfgPageinfoWidth, oEltClicked, oTreeUl, sCfgHomeLocal, sQrAClk, sQrAClkLast, sVersion]
// Object.getOwnPropertyNames(oHitp.__proto__).sort().join(', ')
[__defineGetter__, __defineSetter__, __lookupGetter__, __lookupSetter__, __proto__, constructor, hasOwnProperty, isPrototypeOf, propertyIsEnumerable, toLocaleString, toString, valueOf]

aNamidxRoot of oHitp

description::
· aNamidxRoot is a-javascript-array that contains the-namidx.lagRoot.json if exists.

name::
* McsEngl.aNamidxRoot//oHitp,
* McsEngl.oHitp/aNamidxRoot,

aSuggestions of oHitp

description::
· aSuggestions is a-javascript-array-object that contains the-name-index-file we are-reading each time we search for a-name.
· it is an oHitp member to have access to it from the-console.

name::
* McsEngl.aSuggestions//oHitp,
* McsEngl.oHitp/aSuggestions,

aVersion of oHitp

description::
· contains the-versions of hitp.js.
[
  'hitp.js.17-7-7.2021-04-28: dirMcs',
  'hitp.js.17-7-6.2021-04-02: dirMcs',
  'hitp.js.17-7-5.2021-04-02: lagLang',
  'hitp.js.17-7-4.2021-04-01: langoSinago-path',
  'hitp.js.17-7-3.2021-01-04: langoSinago',
  'hitp.js.17-7-2.2020-05-24: Greek search accents',
  'hitp.js.17-7-1.2020-05-05: F2, ctrl+F2',
  'hitp.js.17-6-2.2019-12-14: site-search',
  'hitp.js.17-6-1.2019-09-09: search-info',
  'hitp.js.17-6-0.2019-09-08: langoKomo-sensorial-concept',
  'hitp.js.17-5-0.2019-09-01: langoKamo',
  'hitp.js.17-4-0.2019-08-28: scrollTop',
  'hitp.js.17-3-0.2019-02-19.2019-03-05: main-name-searching',
  'hitp.js.17-2-1.2018-10-08: filMcs.last.html',
  'hitp.js.17-2-0.2018-09-21: name-notation',
  'hitp.js.17-1-0.2018-09-16: location.hash',
  'hitp.js.17-0-1.2018-09-15: home-icon',
  'hitp.js.17-0-0.2018-09-15: search-scalability',
  'hitp.js.16-5-2.2018-01-23',
  'hitp.js.16-5-1.2018-01-06: Đchain-network',
  'hitp.js.16-5-0.2017-11-10: arrow keys in search',
  'hitp.js.16-4-2.2017-10-17: no type-ahead in search',
  'hitp.js.16-4-1.2017-06-23: greek search',
  'hitp.js.16-3-5.2017-06-18: type after type-ahead, title-help, cnrInf-width',
  'hitp.js.16-2-0.2017-06-07: search-toc-show-easy',
  'hitp.js.16-1-2.2017-06-07: search-icon',
  'hitp.js.16.2017-06-05.search (15-6): hitp.16.2017-06-05.js',
  'hitp.js.15.2016-10-27.any-machine (14-9): hitp.15.2016-10-27.js',
  'hitp.js.14.2016-06-09.table-content-tree (13): hitp.14.2016-06-09.js',
  'hitp.js.13.2016-06-07.preview (12-11): hitp.13.2016-06-07.js',
  'hitp.js.12.2016-01-24.toc-icn-img (11.9): hitp.2016.01.24.12.js',
  'hitp.js.11.2015-10-26.preferences: hitp.2015.10.26.11.js',
  'hitp.js.10.2014-08-05.valuenames: hitp.2014.08.05.10.js',
  'hitp.js.9.2014-08-02.no-jQuery: hitp.2014.08.02.9.js',
  'hitp.js.8.2014-01-09.toc-on-hovering: hitp.2014.01.09.8.js',
  'hitp.js.7.2013-11-06.tabs: hitp.2013.11.06.7.js',
  'hitp.js.6.2013-08-21.site-structure: hitp.2013.08.21.6.js',
  'hitp.js.previous: hitp.2013.07.15.js (toc-ul-specific, hitp-obj)',
  'hitp.js.previous: /hitp/hitp.2013.06.29.js (hitp-dir)',
  'hitp.js.previous: toc.2013.05.30.js (section id)',
  'hitp.js.previous: toc.2013.04.19.js (JSLint ok)',
  'hitp.js.previous: toc.2013.04.14.js (preview links)',
  'hitp.js.previous: toc.2013.04.07.js (button expand|collapse)',
  'hitp.js.previous: toc.2013.04.05.js (toc scrolls to highlited)',
  'hitp.js.previous: toc.2013.04.04.js (goes click location)',
  'hitp.js.previous: toc.2013.04.01.js (toc on any browser)',
  'hitp.js.previous: 2010.12.06 (toc on chrome)'
]

name::
* McsEngl.aVersion//oHitp,
* McsEngl.oHitp/aVersion,

bEdge of oHitp

description::
· boolean if the-runtime is the-Edge-browser.

name::
* McsEngl.bEdge//oHitp,
* McsEngl.oHitp/bEdge,

bFirefox of oHitp

description::
· boolean if the-runtime is the-Firefox-browser.

name::
* McsEngl.bFirefox//oHitp,
* McsEngl.oHitp/bFirefox,

fContainersInsert of oHitp

description::
Creates new containers and inserts them in the-body-element:
- Top-cnr for title and menus.
- Main-cnr for page-info and page-content.
- Width-cnr for managing the-width of page-info.
- Site-cnr for containing the-site-strucute.
- Preview-cnr to display link-previews.

name::
* McsEngl.fContainersInsert//oHitp,
* McsEngl.oHitp/fContainersInsert,

fEvtClickContent of fContainersInsert

description::
· fEvtClickContent is a-click-event added to all content-Html-elements.
· highlights click position on table-of-contents.
· highlights links on click element.
· removes popup,
· removes previous highlighted links.

name::
* McsEngl.fEvtClickContent//fContainersInsert//oHitp,
* McsEngl.oHitp'fContainersInsert/fEvtClickContent,

fEvtMouseoverContent of fContainersInsert

description::
· fEvtMouseoverContent is a-mouseover-event added to all content-Html-elements.
· highlights mouseover position on table-of-contents.

name::
* McsEngl.fEvtMouseoverContent//fContainersInsert//oHitp,
* McsEngl.oHitp'fContainersInsert/fEvtMouseoverContent,

fEvtPreview of fContainersInsert

description::
· fEvtPreview is an-event-listener we add on clsPreview-links to show a-preview.

name::
* McsEngl.fEvtPreview//fContainersInsert//oHitp,
* McsEngl.oHitp'fContainersInsert/fEvtPreview,

fSearchSuggest of fContainersInsert

description::
· doing: suggests names of structured-concepts, that BEGIN with a-search-name.
· input: nothing or string of namidx to search: lagEng03si_2_0, root, ...

name::
* McsEngl.fSearchSuggest//fContainersInsert//oHitp,
* McsEngl.oHitp'fContainersInsert/fSearchSuggest,

fSSNamidxDisplay of fSearchSuggest

description::
· doing: display names of a-namidx.
· input: sNamidxIn: lagEll01alfa, lagEng02bi, lagEng03si_0.

name::
* McsEngl.lagHitp'fSSNamidxDisplay,
* McsEngl.oHitp'fSSNamidxDisplay,

fSSNamidxRefManage of fSearchSuggest

description::
· doing: decides what to do with a-reference-namidx.
· input: lagEng03si_0, lagEng03si_2_0.

name::
* McsEngl.lagHitp'fSSNamidxRefManage,
* McsEngl.oHitp'fSSNamidxRefManage,

fSSNamidxRefDisplay of fSearchSuggest

description::
· doing: display names of a-reference-namidx, make them clickable, highligts first.
· input: sNamidxRefIn: lagEng03si_0, ..

name::
* McsEngl.lagHitp'fSSNamidxRefDisplay,
* McsEngl.oHitp'fSSNamidxRefDisplay,

fSSNamidx_pathFind of fSearchSuggest

description::
· input: lagEng01ei, lagEll01alfa.
· output: site/dirMcs/dirNamidx/dirLagEng/namidx.lagEng01ei.json.

name::
* McsEngl.lagHitp'fSSNamidx_pathFind,
* McsEngl.oHitp'fSSNamidx_pathFind,

fSSEvtPreview of fSearchSuggest

description::
· doing: adds preview-event on links in search-sugestions and adds its text on search-input.

name::
* McsEngl.lagHitp'fSSEvtPreview,
* McsEngl.oHitp'fSSEvtPreview,

fSSEscapeRs of fSearchSuggest

description::
· input: a-search-name string.
· output: the same string escaped (for '+' '.' '|' '(' '*') to use it as a-regexp without special chars.

name::
* McsEngl.lagHitp'fSSEscapeRs,
* McsEngl.oHitp'fSSEscapeRs,

oEltBody of fContainersInsert

description::
· oEltBody-(body-container) is the-document.body-javascript-object representing the-Html-body-element of the-web-page.

name::
* McsEngl.lagHitp'body-container, {2019-02-24},
* McsEngl.oEltBody//fContainersInsert//oHitp,
* McsEngl.oHitp'fContainersInsert/oEltBody,

part::
* top-container,
* main-container,
* site-container,
* width-container,
* preview-container,

oEltCnrTopDiv of fContainersInsert

description::
· oEltCnrTopDiv-(top-container) is a-javascript-Html-div-object that contains the-title of the-page plus the-icons of site, home, search and width.

name::
* McsEngl.container.top//oEltBody//lagHitp,
* McsEngl.lagHitp'body-container'top-container,
* McsEngl.lagHitp'container.top,
* McsEngl.lagHitp'container.oEltCnrTopDiv,
* McsEngl.lagHitp'page-title--bar,
* McsEngl.lagHitp'title-bar,
* McsEngl.lagHitp'title-container,
* McsEngl.lagHitp'top-container, {2019-02-24},
* McsEngl.lagHitp'oEltCnrTopDiv.fContainersInsert,
* McsEngl.oEltCnrTopDiv//fContainersInsert//oHitp,
* McsEngl.oHitp'fContainersInsert/oEltCnrTopDiv,
* McsEngl.top-container//oEltBody//lagHitp,

whole-chain::
* oEltBody,

oEltCnrMainDiv of fContainersInsert

description::
· oEltCnrMainDiv-(main-container) is a-javascript-Html-div-object that contains the-content of the-page and info about it.

name::
* McsEngl.container.main//oEltBody//lagHitp,
* McsEngl.lagHitp'body-container'main-container,
* McsEngl.lagHitp'container.main,
* McsEngl.lagHitp'container.oEltCnrMainDiv,
* McsEngl.lagHitp'main-container, {2019-02-24},
* McsEngl.lagHitp'oEltCnrMainDiv.fContainersInsert,
* McsEngl.main-container//oEltBody//lagHitp,
* McsEngl.oEltCnrMainDiv//fContainersInsert//oHitp,
* McsEngl.oHitp'fContainersInsert/oEltCnrMainDiv,

part::
* oEltCnrMainContentDiv,
* oEltCnrMainInfoDiv,

whole-chain::
* oEltBody,

oEltCnrMainContentDiv of fContainersInsert

description::
· oEltCnrMainContentDiv is a-javascript-Html-div-object that contains the-content of the-page.

name::
* McsEngl.container.content//oEltCnrMainDiv//lagHitp,
* McsEngl.content-container//oEltCnrMainDiv//lagHitp,
* McsEngl.lagHitp'container.content,
* McsEngl.lagHitp'container.oEltCnrMainContentDiv,
* McsEngl.lagHitp'content-container, {2019-02-24},
* McsEngl.lagHitp'main-container'content,
* McsEngl.lagHitp'oEltCnrMainContentDiv.fContainersInsert,
* McsEngl.oEltCnrMainContentDiv//fContainersInsert//oHitp,
* McsEngl.oHitp'fContainersInsert/oEltCnrMainContentDiv,

whole-tree-of-lagHitp'content-container::
* lagHitp'main-container,

oEltCnrMainInfoDiv of fContainersInsert

description::
· oEltCnrMainInfoDiv-(the-info-container) is a-javascript-Html-div-object that contains information about the-page such as table-of-contents and search tabs.

name::
* McsEngl.container.info//oEltCnrMainDiv//lagHitp,
* McsEngl.info-container//oEltCnrMainDiv//lagHitp,
* McsEngl.lagHitp'container.page-info,
* McsEngl.lagHitp'container.oEltCnrMainInfoDiv,
* McsEngl.lagHitp'info-container, {2019-02-23},
* McsEngl.lagHitp'main-container'info,
* McsEngl.lagHitp'page-info-container,
* McsEngl.lagHitp'oEltCnrMainInfoDiv.fContainersInsert,
* McsEngl.oEltCnrMainInfoDiv//fContainersInsert//oHitp,
* McsEngl.oHitp'fContainersInsert/oEltCnrMainInfoDiv,

whole-chain::
* lagHitp'main-container,

whole-path-container of info-container

description::
· oEltPginfPathP is a-javascript-Html-p-object that contains the-whole-path of the-page, ie the-path of the-directories that contain this page.
· contains the-innerHTML of the-element with id=idMetaWebpage_path.

name::
* McsEngl.lagHitp'info-container'page-whole-path,
* McsEngl.lagHitp'page-whole-path--of--info-container,
* McsEngl.lagHitp'whole-path--of--info-container,
* McsEngl.lagHitp'oEltPginfPathP-of-fContainersInsert,
* McsEngl.oEltPginfPathP//fContainersInsert//oHitp,
* McsEngl.oHitp'fContainersInsert/oEltPginfPathP,

whole-chain::
* oEltCnrMainInfoDiv,

tabs of info-container

description::
· page-info-(oEltCnrMainInfoDiv) contains tabs with misc information.
· ALL lagHitp-pages display the-table-of-contents-tab.
· anyone can-add his own tab.
· lagHitp-Mcs contain and the-search-tab.
· to add a-tab you need to add code in 2 containers:
a) in tabs-headers (oEltPginfTabHeadersUl) you have to add the-title of the-tab as a-list-item-li.
b) in tabs-content (oEltPginfTabCntDiv) you have to add a-div-container with tab's information.

name::
* McsEngl.lagHitp'info-container'tabs,
* McsEngl.lagHitp'page-info'tabs,
* McsEngl.lagHitp'tabs-of-fContainersInsert,
* McsEngl.lagHitp'fContainersInsert'tabs,
* McsEngl.oHitp'fContainersInsert'tabs,
* McsEngl.oHitp'tabs-container--of-fContainersInsert,

whole-chain::
* oEltCnrMainInfoDiv,

oEltPginfTabHeadersUl of fContainersInsert

description::
· oEltPginfTabHeadersUl is a-javascript-Html-ul-object that contains the-headers of the-tabs we have inside the-page-info-container.
=== code
oEltPginfTabHeadersUl.innerHTML =
  '<li class="clsTabActive"><a href="#idTabCntTocDiv">page-Toc</a></li>' +
  '<li><a href="#idTabCntSrchDiv">search</a></li>'

name::
* McsEngl.lagHitp'fContainersInsert'oEltPginfTabHeadersUl,
* McsEngl.lagHitp'oEltPginfTabHeadersUl-of-fContainersInsert,
* McsEngl.lagHitp'tab-headers-container,
* McsEngl.oEltPginfTabHeadersUl//fContainersInsert//oHitp,
* McsEngl.oHitp'fContainersInsert/oEltPginfTabHeadersUl,

whole-chain::
* tabs-container,

oEltPginfTabCntDiv of fContainersInsert

description::
· oEltPginfTabCntDiv is a-javascript-Html-div-object that contain the-contents of the-tabs of the-page-info-container.

name::
* McsEngl.lagHitp'tab-content-container,
* McsEngl.lagHitp'oEltPginfTabCntDiv-of-fContainersInsert,
* McsEngl.oHitp'oEltPginfTabCntDiv-of-fContainersInsert,
* McsEngl.lagHitp'fContainersInsert'oEltPginfTabCntDiv,
* McsEngl.oHitp'fContainersInsert'oEltPginfTabCntDiv,

Toc-tab of info-container

description::
· ALL lagHitp-pages contain a-table-of-contents-tab which displays the-table-of-contents of the-page, font preferences and notes on how to work with the-page.

name::
* McsEngl.lagHitp'info-container'Toc-tab,
* McsEngl.lagHitp'tab.Toc,
* McsEngl.lagHitp'Toc-tab,

part::
* oEltPginfTabHeadersUl,
* tabs-content-container,
* oEltTabCntTocDiv,
* oEltTabCntTocExpBtn,
* oEltTabCntTocCpsBtn,
* table-of-contents-tree,
* oEltTabCntTocPrfDiv,
* oEltTabCntTocNotP,

whole-chain::
* oEltCnrMainInfoDiv,

oEltTabCntTocDiv of fContainersInsert

description::
· oEltTabCntTocDiv is a-javascript-Html-div-object that contains the-content of the-Toc-tab.

name::
* McsEngl.lagHitp'Toc-content-container,
* McsEngl.lagHitp'oEltTabCntTocDiv-of-fContainersInsert,
* McsEngl.oHitp'oEltTabCntTocDiv-of-fContainersInsert,
* McsEngl.lagHitp'fContainersInsert'oEltTabCntTocDiv,
* McsEngl.oHitp'fContainersInsert'oEltTabCntTocDiv,

whole-chain::
* tabs-content-container,

oEltTabCntTocExpBtn of fContainersInsert

description::
· oEltTabCntTocExpBtn is a-javascript-Html-input-object that represents the-expand-all-button which holds the-click-event that expands all nodes of the-table-of-contents tree.

name::
* McsEngl.lagHitp'Toc-expand-all-button,
* McsEngl.lagHitp'oEltTabCntTocExpBtn-of-fContainersInsert,
* McsEngl.oHitp'oEltTabCntTocExpBtn-of-fContainersInsert,
* McsEngl.lagHitp'fContainersInsert'oEltTabCntTocExpBtn,
* McsEngl.oHitp'fContainersInsert'oEltTabCntTocExpBtn,

oEltTabCntTocCpsBtn of fContainersInsert

description::
· oEltTabCntTocCpsBtn is a-javascript-Html-input-object that represents the-collapse-all-button which holds the-click-event that collaps all nodes of the-table-of-contents tree.

name::
* McsEngl.lagHitp'Toc-collapse-all-button,
* McsEngl.lagHitp'oEltTabCntTocCpsBtn-of-fContainersInsert,
* McsEngl.oHitp'oEltTabCntTocCpsBtn-of-fContainersInsert,
* McsEngl.lagHitp'fContainersInsert'oEltTabCntTocCpsBtn,
* McsEngl.oHitp'fContainersInsert'oEltTabCntTocCpsBtn,

oEltTabCntTocPrfDiv of fContainersInsert

description::
· preferences-oEltTabCntTocPrfDiv is a-javascript-Html-div-object that contains a-fieldset-element with radio-buttons for a-user to choose the type of font s|he preferes to read the-page.

name::
* McsEngl.lagHitp'preferences,
* McsEngl.lagHitp'oEltTabCntTocPrfDiv-of-fContainersInsert,
* McsEngl.oHitp'oEltTabCntTocPrfDiv-of-fContainersInsert,
* McsEngl.lagHitp'fContainersInsert'oEltTabCntTocPrfDiv,
* McsEngl.oHitp'fContainersInsert'oEltTabCntTocPrfDiv,

oEltTabCntTocNotP of fContainersInsert

description::
· oEltTabCntTocNotP is a-javascript-Html-p-object with notes on how to read the-page.

name::
* McsEngl.lagHitp'oEltTabCntTocNotP-of-fContainersInsert,
* McsEngl.oHitp'oEltTabCntTocNotP-of-fContainersInsert,
* McsEngl.lagHitp'fContainersInsert'oEltTabCntTocNotP,
* McsEngl.oHitp'fContainersInsert'oEltTabCntTocNotP,

search-tab of info-container

description::
· lagHitp-Mcs-pages contain and a-search-tab with an-input-field to write names of structured-concepts-Mcs we want to find and a-ol-Html-element to hold found names of concepts.

name::
* McsEngl.lagHitp'info-container'search-tab,
* McsEngl.lagHitp'tab.search,
* McsEngl.lagHitp'search-tab,

whole-chain::
* oEltCnrMainInfoDiv,

content-container of search-tab

description::
· oEltTabCntSrchDiv-(content-container) is a-javascript-Html-div-object that contains the-content of the-search-tab.

name::
* McsEngl.lagHitp'fContainersInsert'oEltTabCntSrchDiv,
* McsEngl.lagHitp'oEltTabCntSrchDiv-of-fContainersInsert,
* McsEngl.lagHitp'search-tab'content-container,
* McsEngl.oHitp'fContainersInsert'oEltTabCntSrchDiv,
* McsEngl.oHitp'oEltTabCntSrchDiv-of-fContainersInsert,

whole-chain::
* tabs-content-container,

language-label of search-tab

description::
· oEltTabCntSrchLbl-(language-label) is a-javascript-Html-label-object that contains the-'language:' label for the-language-list.

name::
* McsEngl.lagHitp'search-tab'language-label,

language-selection-list of search-tab

description::
· oEltTabCntSrchSlt-(language-selection-list) is a-javascript-Html-select-object that contains the-languages on which we want to search for a-name.

name::
* McsEngl.lagHitp'search-tab'language-selection-list,

number-of-suggestions-found of search-tab

description::
· oEltTabCntSrchP-(number-of-suggestions-found) is a-javascript-Html-p-element that contains the-number of names found.
· example content: 10 / 335 N..O / 178,215 English / 179,888 total NAMES

name::
* McsEngl.lagHitp'fContainersInsert'oEltTabCntSrchP,
* McsEngl.lagHitp'oEltTabCntSrchP-of-fContainersInsert,
* McsEngl.lagHitp'search-tab'number-of-suggestions-found-container,
* McsEngl.oHitp'fContainersInsert'oEltTabCntSrchP,
* McsEngl.oHitp'oEltTabCntSrchP-of-fContainersInsert,

checkbox of search-tab

description::
· oEltTabCntSrchLblChk-(checkbox) is a-javascript-Html-label-object that contains a-checkbox with the-'show All, not 999 (slow)' label

name::
* McsEngl.lagHitp'search-tab'checkbox,

input-text-box of search-tab

description::
· oEltTabCntSrchIpt-(input-text-box) is a-javascript-Html-input-object where a-user writes the-name of the-structured-concept-Mcs s|he wants to find.
· it has 2 event-listeners:
a) on keyup search for names begining with what is-written and
b) an-enter-event to go on highlighted name.

name::
* McsEngl.lagHitp'fContainersInsert'oEltTabCntSrchIpt,
* McsEngl.lagHitp'oEltTabCntSrchIpt-of-fContainersInsert,
* McsEngl.lagHitp'search-tab'input-text-box,
* McsEngl.lagHitp'search-text-box,
* McsEngl.oHitp'fContainersInsert'oEltTabCntSrchIpt,
* McsEngl.oHitp'oEltTabCntSrchIpt-of-fContainersInsert,

input-text-string of search-tab

description::
· search-name is the-name we write into the-search-text-box to find its concept.

name::
* McsEngl.lagHitp'search-name,
* McsEngl.lagHitp'search-tab'input-text-string,

suggestions-ordered-list of search-tab

description::
· oEltTabCntSrchOl-(suggestions-ordered-list) is a-javascript-Html-ol-object that contains search-suggestions.
· on arrow-down and arrow-up highlights next suggestions.

name::
* McsEngl.lagHitp'fContainersInsert'oEltTabCntSrchOl,
* McsEngl.lagHitp'oEltTabCntSrchOl-of-fContainersInsert,
* McsEngl.lagHitp'search-tab'suggestions-ordered-list,
* McsEngl.oHitp'fContainersInsert'oEltTabCntSrchOl,
* McsEngl.oHitp'oEltTabCntSrchOl-of-fContainersInsert,

whole-chain::
* tab-search-content-container,

oEltCnrWidthDiv of fContainersInsert

description::
· page-info-width-container-(oEltCnrWidthDiv) is a-javascript-Html-div-object that contains the-settings for the-width of the-page-info-container.

name::
* McsEngl.container.width//oEltBody//lagHitp,
* McsEngl.lagHitp'container.page-info-width,
* McsEngl.lagHitp'container.width,
* McsEngl.lagHitp'container.oEltCnrWidthDiv,
* McsEngl.lagHitp'fContainersInsert'oEltCnrWidthDiv,
* McsEngl.lagHitp'oEltCnrWidthDiv-of-fContainersInsert,
* McsEngl.lagHitp'width-container,
* McsEngl.oHitp'fContainersInsert'oEltCnrWidthDiv,
* McsEngl.oHitp'oEltCnrWidthDiv-of-fContainersInsert,
* McsEngl.width-container//oEltBody//lagHitp,

whole-chain::
* oEltBody,

oEltCnrSiteDiv of fContainersInsert

description::
· site-structure-container-(oEltCnrSiteDiv) is a-javascript-Html-div-object that contains the-site-structure-list.

name::
* McsEngl.container.site//oEltBody//lagHitp,
* McsEngl.lagHitp'container.site-structure,
* McsEngl.lagHitp'container.oEltCnrSiteDiv,
* McsEngl.lagHitp'fContainersInsert'oEltCnrSiteDiv,
* McsEngl.lagHitp'oEltCnrSiteDiv-of-fContainersInsert,
* McsEngl.lagHitp'site-structure--container,
* McsEngl.oHitp'fContainersInsert'oEltCnrSiteDiv,
* McsEngl.oHitp'oEltCnrSiteDiv-of-fContainersInsert,
* McsEngl.site-container//oEltBody//lagHitp,

whole-chain::
* oEltBody,

oEltCnrPreviewDiv of fContainersInsert

description::
· oEltCnrPreviewDiv is a-javascript-Html-div-object that contains previews of links.

name::
* McsEngl.lagHitp'container.preview,
* McsEngl.lagHitp'container.oEltCnrPreviewDiv,
* McsEngl.lagHitp'fContainersInsert'oEltCnrPreviewDiv,
* McsEngl.lagHitp'oEltCnrPreviewDiv-of-fContainersInsert,
* McsEngl.lagHitp'preview-container,
* McsEngl.oHitp'fContainersInsert'oEltCnrPreviewDiv,
* McsEngl.oHitp'oEltCnrPreviewDiv-of-fContainersInsert,
* McsEngl.preview-container//oEltBody//lagHitp,

whole-chain::
* oEltBody,

fTocTriCreate of oHitp

description::
Returns a string html-ul-element that holds the-Toc-tree with the-headings of the-page.
<ul id="idTocTri" class="clsTreeUl">
 <li><a class="clsPreview" href="#idHeader">SynAgonism</a>
   <ul>
     <li><a href="#heading">heading</a><li>
     <li><a href="#heading">heading</a><li>
   </ul>
 <li>
</ul>

name::
* McsEngl.fTocTriCreate//oHitp,
* McsEngl.oHitp/fTocTriCreate,

fTocTriHighlightNode of oHitp

description::
· Highlights ONE item in Toc-list

name::
* McsEngl.fTocTriHighlightNode//oHitp,
* McsEngl.oHitp/fTocTriHighlightNode,

nCfgPageinfoWidth of oHitp

description::
· config-variable which contains the-number of the-width of page-info-container.
· default 30.

name::
* McsEngl.nCfgPageinfoWidth//oHitp,
* McsEngl.oHitp/nCfgPageinfoWidth,

oEltClicked of oHitp

description::
· holds the-object of the-Html-element a-user clicks on.

name::
* McsEngl.oEltClicked/oHitp,
* McsEngl.oHitp/oEltClicked,

oTreeUl of oHitp

description::
· contains functionality to manage collapsible-trees, from unordered-lists with clsTreeUl.

name::
* McsEngl.oHitp/oTreeUl,
* McsEngl.oTreeUl//oHitp,

part::
* fTruCreate,
* fTruToggleLi,
* fTruTocCollapseAll,
* fTruTocExpandAll,
* fTruTocExpandFirst,

oTreeUl.fTruCreate

description::
· creates collapsible-trees the-Html-unorderd-lists with clsTreeUl.
· if input is a-javascript-object of an-Html-unorderd-list, then it creates one tree, the-input.
· if input is none, it creates all these lists to trees.

name::
* McsEngl.fTruCreate//oTreeUl//oHitp,
* McsEngl.oHitp'oTreeUl/fTruCreate,

oTreeUl.fTruToggleLi

description::
· expands or collapses an input list-item.

name::
* McsEngl.fTruToggleLi//oTreeUl//oHitp,
* McsEngl.oHitp'oTreeUl/fTruToggleLi,

oTreeUl.fTruTocCollapseAll

description::
· collapses all list-items of Toc-tree.

name::
* McsEngl.fTruTocCollapseAll//oTreeUl//oHitp,
* McsEngl.oHitp'oTreeUl/fTruTocCollapseAll,

oTreeUl.fTruTocExpandAll

description::
· expands all list-items of Toc-tree.

name::
* McsEngl.fTruTocExpandAll//oTreeUl//oHitp,
* McsEngl.oHitp'oTreeUl/fTruTocExpandAll,

oTreeUl.fTruTocExpandFirst

description::
· expands the-first list-item of Toc-tree.

name::
* McsEngl.fTruTocExpandFirst//oTreeUl//oHitp,
* McsEngl.oHitp'oTreeUl/fTruTocExpandFirst,

sCfgHomeLocal of oHitp

description::
· config-variable, contains the-string of the-local-directory of the-site.
· example: /dirWstSgm/

name::
* McsEngl.oHitp/sCfgHomeLocal,
* McsEngl.sCfgHomeLocal//oHitp,

sNamidx of oHitp

description::
· sNamidx contains the-string of the-name-index-file we want to search for names.
· only the middle part eg 'lagRoot' for 'namidx.lagRoot.json' or 'lagEng02bi' for 'namidx.lagEng02bi.json'.

name::
* McsEngl.oHitp/sNamidx,
* McsEngl.sNamidx//oHitp,

sPathSite of oHitp

description::
· sPathSite contains the-path of a-lagHitp-site:
- no-server: ''
- server.local: location.origin + oHitp.sCfgHomeLocal
- server.online: location.origin + '/'

name::
* McsEngl.oHitp/sPathSite,
* McsEngl.sPathSite//oHitp,

sPathSitemenu of oHitp

description::
· sPathSitemenu contains the-path of the-site-structure a-lagHitp-site:
- no-server: ''
- server.local: location.origin + oHitp.sCfgHomeLocal + 'filSite-structureLocal.html'
- server.online: location.origin + '/' + 'filSite-structure.html'

name::
* McsEngl.oHitp/sPathSitemenu,
* McsEngl.sPathSitemenu//oHitp,

sSrchCrnt of oHitp

description::
· contains the-index we are-searching now, eg A, char.A, G, ...
· we display it at suggestions-found-container.

name::
* McsEngl.oHitp/sSrchCrnt,
* McsEngl.sSrchCrnt//oHitp,

sSrchNext of oHitp

description::
· contains the NEXT index from which we are-searching now, eg B, char.A, G, ...
· we display it at suggestions-found-container.

name::
* McsEngl.oHitp/sSrchNext,
* McsEngl.sSrchNext//oHitp,

sQrslrAClk of oHitp

description::
· selector for a-elements with clsClickCnt

name::
* McsEngl.oHitp/sQrslrAClk,
* McsEngl.sQrslrAClk//oHitp,

sQrslrAClkLast of oHitp

description::
· last selector for a-elements with clsClickCnt.

name::
* McsEngl.oHitp/sQrslrAClkLast,
* McsEngl.sQrslrAClk//oHitp,

Hitpjsb'table-of-contents

description::
When you are-reading text on a-computer-screen you are-losing your reading-position.
lagHitp-web-pages automatically create the-table-of-contents-tree (Toc) of the-doc of the-page and show your reading-position.
HOW: you need to add the following code at the-end of the-body-element:
<script src="../Mcsmgr/hitp.js"></script>

The-attributes of lagHitp-Toc are:
* It is expandable,
* There is two-way communication between the-Toc and the-content,
- By clicking on the-Toc, goes to that heading in the-content.
- By clicking|hovering on content, this content position is highlited in the-Toc and its parents are only expanded, giving to the-reader the big picture of the-position s|he is-reading.
Thus the-Toc improves the-readability of big documents.
* If the-user needs more space for the-content, the-splitbar has a-button that closes|opens the-Toc with one click,
* The-splitter changes width,

My previous approach was the-creation of a-Chrome-extension, my Table-of-contents-crx which creates a-Toc on any page with headings only in Chrome.

name::
* McsEngl.Hitpjsb'table-of-contents,
* McsEngl.lagHitp'table-of-contents,
* McsEngl.lagHitp'Toc,
* McsEngl.lagHitp'Toc-tree,

whole-chain::
* oEltTabCntTocDiv,

Hitpjsb'link-preview

description::
Another functionality that facilitates reading is the-addition of previews (pop-ups) on internal (same-origin) links with destination relatively small chunks of text.
This is especially useful for footnotes, abbreviations, definitions, index items, paragraphs etc.

HOW: you only have to add the-class 'clsPreview' on the-links you want to trigger popups when the-reader is hovering over them.
<a class="clsPreview" href="#idPreview">link-preview</a>

name::
* McsEngl.lagHitp'link-preview,
* McsEngl.Hitpjsb'link-preview,
* McsEngl.lagHitp'popup,
* McsEngl.lagHitp'preview-functionality,

Hitpjsb'tree-info

description::
Our information is full of generic-specific and whole-part trees.
Now lagHitp support collapsible trees, easily readable.

HOW:
You create the-tree as an-html-unordered-list (UL).
Then you add the-class 'clsTreeUl' on the first element.
That's it, the-rest is done by the javascript code of the-page.

  • Tree-root
    • Node1
      • Node1.1
        • Node1.1.1
        • Node1.1.2
      • Node1.2
        • Node1.2.1
        • Node1.2.2
    • Node2
      • Node2.1
      • Node2.2
      • Node2.3

name::
* McsEngl.lagHitp'info-tree,
* McsEngl.Hitpjsb'info-tree,
* McsEngl.lagHitp'tree-info,

meta-info of Hitppage

description::
A-lagHitp-web-page contains and extra info other than a-doc.
Most of this info is-stored in the-meta-title-content-tree.

name::
* McsEngl.lagHitp'meta-info,
* McsEngl.Hitppage'meta-info,

page-wholepath of lagHitp-meta

description::
· by setting a-p-element[1] with id "idMetaWebpage_path", the-program sets its content as the first paragraph in the left info-container, showing where the-page fits in the-site's-structure.
NOTE: If the-document does-not-contain this paragraph, the-program sets the-title-element as page-path.
I put this[1] element as the last paragraph of the-meta-title-content-tree.

name::
* McsEngl.lagHitp'idMetaWebpage_path,
* McsEngl.lagHitp'pagepath,
* McsEngl.lagHitp'page-path,

site-structure of lagHitp-meta

description::
Every lagHitp-page, except of presenting its own structure, presents and its site-structure in a-collapsible-tree.

HOW: You have to add ONCE in the-root-directory of the-site the-file 'filSite-structure.html' with the-site-structure in the-form of an-unordered-html-list.
Modifying this file, ALL the-lagHitp-pages will-present the-changes.

name::
* McsEngl.lagHitp'site'structure,
* McsEngl.lagHitp'site-structure,

writing-style of Hitppage

name::
* McsEngl.lagHitp'writing-style,

description::
Today, our information has MANY interpretations/meanings (= polysemous).
lagHitp-web-pages can-reduce it, by accepting the-following writing-style.

Names:
We use the-name-notation-of-this-site.
No spaces inside names.

Definition-links:
The-names of the-sentences are-connected with preview-links with their definitions.

Sentences:
Every sentence begins in a new line, which improves readability.

Time:
{1959} denotes time.

index of Hitppage

description::
Html5.id.toc.preview-pages improve the-functionality of the-indexes of documents because we have the-capability to refer|link, from the-index, to any part of the-text (because we use IDs) and preview these parts.

name::
* McsEngl.lagHitp'index,
* McsEngl.Hitppage'index!⇒lagHitp'index,
* McsEngl.lagHitp-index!⇒lagHitp'index,

concept-index

description::
Every text describes CONCEPTS.
The-concepts have NAMES.
Every SENTENCE in a-text is composed of names.
IF we create the-concept-index of a-text, with every concept-entry to hold its names and its definition, THEN we will-have ONE interpretation of the-meaning of a-text (= monosemous-text).
IF we set preview-linking on the-names of sentences with the-concept-index, THEN the-understanding of a-text will-become FAST.

name::
* McsEngl.lagHitp'concept-index,
* McsEngl.lagHitp'index.concept,

concept-model

description::
Every text describes concepts and relations of concepts, which form a subjective MODEL (modelConcept) of reality.
More important than the-concept-index is the-modelConcept of the-text.
In a-model-concept a-concept-entry contains, except its names and its definition and ALL its attributes|characteristics.
A crude example of a-modelConcept contains my lagHitp-page of the Keynes book 'The General Theory of Employment, Interest, and Money'.
A better example is my Javascript-programming-language-concept.

name::
* McsEngl.lagHitp'concept-model,
* McsEngl.lagHitp'modelConcept,

name-index

description::
Βy setting as ID on each name|term-entry the pattern "idLagHitpidx-term", the-reader will-have very quick access to the-entries.
un.sna.2008.html is an-example with a-name-index.

name::
* McsEngl.lagHitp'name-index,
* McsEngl.lagHitp'index.name,

word-index

name::
* McsEngl.lagHitp'index.word,
* McsEngl.lagHitp'word-index,

description::
The majority of programs today search a-text for words and NOT names.
By pressing Ctrl+F or F3 you can-search for words.

Hitppage.SPECIFIC

name::
* McsEngl.Hitppage.specific,

SPECIFIC::
This site presents many examples with our proposal.
Actually I'm writing the-site with this proposal.
Reading the-code of these examples and seeing its behavior, is the best way to understand what really we are-proposing.
* lagHitp.eBook-page,
* lagHitp.law-page,
* lagHitp.standard-page,
* lagHitp.example-empty-page,
* lagHitp.sensorial-concept--page,

Hitppage.sensorial-concept (link)

Hitppage.eBook

description::
· digital-book written in lagHitp.

=== economy-book:
* {2015}. People Powered Money: an-important and timely book.
* {1936}. Keynes. The General Theory of Employment, Interest, and Money: the-classic book with footnote-preview AND its conceptual-view.
* {1867|1887}. Marx. Capital, Volume-I: the-theory of surplus-value and the-labor-theory of exchange-value.

=== society-book:
* {1884}. Engels. The Origin of the Family, Private Property and the State: a-diamond in our knowledge about the-evolution of human-society.

=== Infotech-book:
* {2016}. Antonopoulos. Mastering Bitcoin in Greek:

name::
* McsEngl.Hitp-digital-book!⇒Hitpbook,
* McsEngl.Hitp-ebook!⇒Hitpbook,
* McsEngl.Hitpbook,
* McsEngl.Hitppage.eBook!⇒Hitpbook,
* McsEngl.ebook.Hitp!⇒Hitpbook,
* McsEngl.ebookHitp!⇒Hitpbook,
* McsEngl.ebkHitp!⇒Hitpbook,
* McsEngl.dbkHitp!⇒Hitpbook,
* McsEngl.html5.id.toc.preview-ebook!⇒Hitpbook,
* McsEngl.html5.id.toc.preview-digital-book!⇒Hitpbook,
* McsEngl.html5IdTocPreview-ebook!⇒Hitpbook,
* McsEngl.synagonism.net'ebook!⇒Hitpbook,
===
• ebkHitp-cpt,
• ebook.Hitp-cpt,
• Hitpbook-cpt,
• dbkHitp-cpt,
• html5.id.toc.preview-ebook-cpt,
• html5.id.toc.preview-digital-book-cpt,
• html5IdTocPreview-ebook-cpt,
• Hitp-digital-book-cpt,
• Hitp-ebook-cpt,
• Hitpebk-cpt,

Hitppage.law

description::
· law written in lagHitp.
· IDs conventions (some times):
- idA4 (article)
- idA4P2 (paragraph)
- idA4P2Sp2 (SubParagraph)
- idP2 (Part)
- idP2T1 (Title)
- idP2T1C2 (Chapter)
- idP2T1C2S2 (Section)

name::
* McsEngl.Hitplaw,
* McsEngl.Hitppage.law!⇒Hitplaw,
* McsEngl.law.008-Hitp!⇒Hitplaw,
* McsEngl.law.Hitp!⇒Hitplaw,
* McsEngl.lawHitp!⇒Hitplaw,

generic-tree-of-Hitplaw::
* law,

Hitplaw.English

description::
=== EU:
* Treaty on European Union-{2010},
* Treaty on the Functioning of the European Union-{2010},
* Protocols-{2010},
* Declarations-{2010},
* Charter of Fundamental Rights of the European Union-{2010},

=== US:
* US.Constitution.1992: final, in force.
* US.Constitution.1787: first, original form.

name::
* McsEngl.Hitplaw.English,

Hitplaw.Greek

description::
* Σύνταγμα.2019,
* Σύνταγμα.2008,
* Σύνταγμα.1986,
* Ν.2010.3861, ΦΕΚ.2010.Α112: Διαύγεια
* Ν.2010.3852, ΦΕΚ.2010.Α87: Καλλικράτης
* Ν.2010.3839, ΦΕΚ.2010.Α51: Επιλογή-προϊσταμένων
* Ν.2007.3528, ΦΕΚ.2007.Α26: Δημοσιοϋπαλληλικός-Κώδικας
* ΠΔ.2010.100, ΦΕΚ.2010.Α177: Ενεργειακοί-Επιθεωρητές

name::
* McsEngl.Hitplaw.Greek,

Hitppage.standard

description::
· standard written in lagHitp.

=== economy-standard:
* System-of-National-Accounts-2008:
* IFRS for SMEs 2009: I have-converted this book to lagHitp, but I have-not-published it, because IFRS demands money to publish it!!!

=== infotech-standard:
* EMCAScript Language Specification: (ecma-262, Edition 5.1, 2011).

name::
* McsEngl.Hitppage.standard!⇒Hitpstandard,
* McsEngl.Hitpstandard,
* McsEngl.standard.Hitp!⇒Hitpstandard,

04_web-site of lagHitp

description::
· lagHitp-site is a-website with lagHitp-web-pages.

name::
* McsEngl.lagHitp'04_web-site!⇒lagHitp'site,
* McsEngl.lagHitp'web-site!⇒lagHitp'site,
* McsEngl.lagHitp'site,

structure of lagHitp-site (link)

configuring lagHitp-site

description::
· when a-lagHitp-page is-loaded, the-javascript-code first loads the-config.json-file, if exists.
· this file contains configuration-variables for the-site, such as:
- nCfgPageinfoWidth,
- sCfgHomeLocal,

name::
* McsEngl.lagHitp'configuring,
* McsEngl.lagHitp'site'configuring,

05_license of lagHitp

description::
This web-page's work is FREE under the-creative-commons Attribution-3.0-Unported-(CC-BY-3.0)-license.
The-computer-code is under the-MIT-license, you can-find it on GitHub.

name::
* McsEngl.lagHitp'05_license,
* McsEngl.lagHitp'license,
* McsEngl.Mws'license,
* McsEngl.license-of-Mws,
* McsEngl.license-of-lagHitp,
* McsEngl.license-of-synagonism.net,
* McsEngl.synagonism.net'licence,

06_evaluation of lagHitp

name::
* McsEngl.lagHitp'06_evaluation,
* McsEngl.lagHitp'evaluation,

description::
·

problem of lagHitp

name::
* McsEngl.lagHitp'issue,
* McsEngl.lagHitp'problem,

Firefox

location.href {2013.08.16}:
FIXED
In contrast to Chrome, Firefox loses selected-text after setting value on 'location.href'.
WORKAROUND: first click to go to that location and then select-text from this location.

Back-Forward {2013.08.16}:
FIXED.
Clicking on buttons 'back', 'forward' shows the visited locations but does not go to that location.
WORKAROUND: click on the-address-bar and hit enter.

07_manager of lagHitp

description::
· lagHitp-manager is the-tools we use to manage (= write, read, publish, ...) lagHitp-web-pages.
· for now {2019} I am-using editor, browser, ftp programs.
· but I want a-javascript-program like my-HtmlMgr written in java in {2010}.

name::
* McsEngl.lagHitp'07_manager,
* McsEngl.lagHitp'manager,
* McsEngl.lagHitp-manager!⇒lagHitp'manager,

DOING of lagHitp

name::
* McsEngl.lagHitp'doing,

doing.SPECIFIC

specific::
* address-link-icon--functionality,
* evoluting,
* link-preview,
* table-of-contents,
* searching,

08_searching of lagHitp

description::
· the-lagMcsh-searching works and for the-lagHitp-files because all Html-elements[a] have ids and we can-refer to any of them[a].
· if a-lagHitp-site contains name-index-files at 'dirMcs/dirNamidx/', a-lagHitp-page displays and a-search-tab from where a-user searches for names in the-lagHitp-pages.

name::
* McsEngl.lagHitp'08_searching,
* McsEngl.lagHitp'searching,
* McsEngl.lagHitp'doing.searching!⇒lagHitp'searching,
* McsEngl.Mcs'doing.searching!⇒lagHitp'searching,
* McsEngl.Mcs'searching!⇒lagHitp'searching,

evoluting of lagHitp

name::
* McsEngl.lagHitp'evoluting, {2019-02-24},
* McsEngl.lagHitp-evolution!⇒lagHitp'evoluting,
* McsEngl.lagHitp.evolution!⇒lagHitp'evoluting,

{2021-05-25}..{}-lagHitp'v19.working::
-
* McsEngl.lagHitp'v19.working,

{2018-09-15}..{2021-05-25}-lagHitp'v18.module::
- mHitp.18.2021-05-25.html:
- module: 'hitp.js' to mHitp.js
- base-dir: from dirMiwMcs to dirMcs (simpler)
- file-names: firMcsName to McsDir000000 (no need to change the-file-name, changing the-main-name)
- Hitp-files: name to /dirHitp/HitpDir000
- I renamed the-filMcsHitp to McsTchInf000008 and the-Ids from lagHitp to Lhitp,
- F2-key opens search-tab, {2020-05-05},
- main-name searching, {2019-03-05},
* McsEngl.lagHitp'v18-{2021-05-25}-module,
* McsEngl.{lagHitp'2021-05-25}-v18-module,

{2018-09-15}-lagHitp'v17.search-scalability::
- lagHitp.17.2018-09-15.search-scalability:
- Arrow-keys on search. {2017-11-10},
- No type-ahead. {2017-10-17},
- Underline hovering links. {2017-10-17},
* McsEngl.lagHitp'v17-{2018-09-17}-search-scalability,
* McsEngl.{lagHitp'2018-09-17}-v17-search-scalability,

{2017-06-05}-lagHitp'v16.searching::
- lagHitp.16.2017-06-05.searching:
- structured-concept-searching: with this operation it is-demonstrated THE-POWER of structured-concepts.
- 'mouseover' event, shows its position on ToC. {2017-05-30},
* McsEngl.lagHitp'v16-{2017-06-05}-Mcs-searching,
* McsEngl.{lagHitp'2017-06-05}-v16-Mcs-searching,
* McsEngl.{Mcs'2017-06-05}-searching,

{2016-10-27}-lagHitp'v15.Any-machine::
- lagHitp.15.2016-10-27.Any-machine:
* hitp.15.2016-10-27.js,
* hitp.15.2016-10-27.css,
- The-site looks and behaves the-same on any machine of size and input-method.
- Hovering events removed. NOW first-click does the previous hovering events and second-click the previous click events.
- Font-awesome-icons added.
- clicking on blue-links shows preview, SECOND-clicking goes destination. {2016.09.27}
- clicking on content shows position on Toc (touch input friendly).
- Collapsible-trees added. {2016.07.20}
* McsEngl.lagHitp'v15-{2016-10-27}-any-machine-size,
* McsEngl.{lagHitp'2016-10-27}-v15-any-machine-size,

{2016-06-09}-lagHitp'v14.Title-Content-Tree::
- lagHitp.14.2016-06-09.Title-Content-Tree:
Recursive-definition of 'title-content-tree'.
Document-unit, div.
* McsEngl.lagHitp'v14-{2016-06-09}-recursive-document,
* McsEngl.{lagHitp'2016-06-09}-v14-recursive-document,

{2016-06-07}-lagHitp'v13.preview::
Preview-links have more darkblue-color than non-preview-links. {2016.05.01}
Added a-time-delay on preview-links. {2016.04.30}
Changed id-link from ¶ to a background link image. {2016.02.23}
* McsEngl.lagHitp'v13-{2016-06-07}.preview,
* McsEngl.{lagHitp'2016-06-07}-v13.preview,

{2016-01-24}-lagHitp'v12.Toc-Icons::
- lagHitp.12.2016-01-24.Toc-Icons:
Changed the icons of the-Toc-tree to images from characters, for compatibility.
* McsEngl.lagHitp'v12-{2016-01-24}-Toc-icons,
* McsEngl.{lagHitp'2016-01-24}-v12-Toc-icons,

{2015-10-26}-lagHitp'v11.Preferences::
- lagHitp.11.2015-10-26.Preferences:
Users now can-choose how they prefer to view lagHitp-pages:
- they can-have or not the link-preview characteristic,
- they can-see on the table-of-contents the position of the content they are reading by hovering or clicking on that content.
* McsEngl.lagHitp'v11-{2015-10-26}-user-preferences,
* McsEngl.{lagHitp'2015-10-26}-v11-user-preferences,

{2014-08-05}-lagHitp'v10.valuenames::
- lagHitp.10.2014-08-05.VALUENAMES | TYPENAMES:
With 'valuename' I mean a-NAME (identifier) of a-name-value-pair (variable), that denotes the-VALUE (type) with which it is-associated.
Now ALL the-custom-names of my code are valuenames, with its FIRST-CHARACTER to denote its value|type:
- aName denotes array.
- bName denotes boolean.
- fName denotes function.
- nName denotes number.
- oName denotes object.
- rName denotes regular-expression.
- sName denotes string.
- xName denotes mixed-values.
This method is a SIMPLE method to make javascript a type language!!!
This way we increase the readability of the source code.
I published my new code, with the MIT license (= do whatever you want, only mention my work), on GitHub at https://github.com/synagonism/hitp.
* McsEngl.lagHitp'v10-{2014-08-05}-javascript-with-valuenames,
* McsEngl.{lagHitp'2014-08-05}-v10-javascript-with-valuenames,

{2014-08-02}-lagHitp'v09.NO-jQuery::
I rewrote the-code, by removing jQuery.
Everything now is vanilla javascript.
Fixed: preview popup location.
* McsEngl.lagHitp'v09-{2014-08-02}-no-jQuery,
* McsEngl.{lagHitp'2014-08-02}-v09-no-jQuery,

{2014-01-09}-lagHitp'v08.Table-of-contents::
- lagHitp.08.2014-01-09.Table-of-contents:
Hovering a piece of text, you see its position on ToC.
To see the-address of the-text you click on ¶.
With the previous functionality, you had to click on text to see its position.
* McsEngl.lagHitp'v08-{2014-01-09}-Toc,
* McsEngl.{lagHitp'2014-01-09}-v08-Toc,

{2013-11-06}-lagHitp'v07.tabs::
- lagHitp.07.2013-11-06.Tabs:
The page-structure is set under a tab.
* McsEngl.lagHitp'v07-{2013-11-06}-tabs,
* McsEngl.{lagHitp'2013-11-06}-v07-tabs,

{2013-08-21}-lagHitp'v06.site-structure::
- lagHitp.06.2013-08-21.Site-structure:
Now each lagHitp-web-page presents and its site-structure except of its own structure.
* McsEngl.lagHitp'v06-{2013-08-21}-site-structure,
* McsEngl.{lagHitp'2013-08-21}-v06-site-structure,

{2013-07-15}-lagHitp'v05.ToC-Algorithm::
- lagHitp.05.2013-07-15.ToC-Algorithm:
I wrote a new smaller specific algorithm that creates the ToC of a lagHitp-page.
The previous was the one of html5-outliner-chrome-extension.
Also I enclosed the-code in one literal object, the 'Hitp'.
I allow gaps in headings like: h1, h2, h4 because existing docs use this pattern.
* McsEngl.lagHitp'v05-{2013-07-15}-Toc-algo,
* McsEngl.{lagHitp'2013-07-15}-v05-Toc-algo,

{2013-06-27}-lagHitp'v04.name::
- lagHitp.04.2013-06-27.Name:
I change the-name of the proposal from html5.id.toc to html5.id.toc.preview (= html5IdTocPreview)
in-order to include all its main attributes.
Abbreviation: ebkHitp, Hitp.
* McsEngl.lagHitp'v04-{2013-06-27}-Hitp,
* McsEngl.{lagHitp'2013-06-27}-v04-Hitp,

{2013-04-14}-lagHitp'v03.preview::
- lagHitp.03.2013-04-14.Preview:
Html5.ID.TOC.PREVIEW: Another feature that facilitates reading-productivity.
* McsEngl.lagHitp'v03-{2013-04-14}-Html5.Id.Toc.Preview,
* McsEngl.{lagHitp'2013-04-14}-v03-Html5.Id.Toc.Preview,
* McsEngl.{Mcs'2013-04-14}-lagHitp'v03-Html5.Id.Toc.Preview,

{2013-04-01}-lagHitp'v02.Table-of-Contents::
- lagHitp.02.2013-04-01.Table-of-Contents:
Html5.ID.ToC: Adding a few lines of javascript code the static-pages are becoming dynamic ('applications!') but this facilitates reading.
This way the 'electronic-text' begins to have more advantantages than 'printed-text'.
Other forms of 'electronic-text' which merely digitize printed-text are inferior to 'printed-text'.
* McsEngl.lagHitp'v02-{2013-04-01}-Html5.Id.Toc,
* McsEngl.{lagHitp'2013-04-01}-v02-Html5.Id.Toc,

{2011-02-17}-lagHitp'v01.ID-first-publication::
- lagHitp.01.2011-02-17.first-publication:
Html5.ID: the goal of my first try was to show a simple method of a-text-format we can-read in a ubiquitous web-browser that anyone can-REFER to any part of it.
The main types of texts I had in my mind were law-texts.
* McsEngl.lagHitp'v01-{2011-02-17}-Html5.Id,
* McsEngl.{lagHitp'2011-02-17}-v01-Html5.Id,

versioning of lagHitp

description::
After some years using my versioning-format, now I-am-using a modified Semantic-Versioning-format.
Name.Major-Minor-Patch.YYYY-MM-DD
Major = Incompatible, with changes in previous features.
Minor = Compatible with added features.
Patch = Compatible with only fixes.
Again with no definitions, so there-is some subjectivity what major, minor, patch is.
[HmnSgm.2017-09-24]
===
We can-have a simple versioning paradigm on lagHitp-pages by setting the-date on its file-name plus one or more numbers indicating how many times changes have-occured, ie 'index.16.2016-06-09.html' (= version 16 of index.html on {2016-06-09}).
Having and a-file with only the-file-name but with the LAST-MINOR-DYNAMIC version we can always have access to the last version with minor changes we do-not-think important to hold records on them.
From internal links we can-have access to previous dated versions.
As example look this file you are-reading.
Evolution is a continuous entity.
Every author SUBJECTIVELY desides when to call a-page 'version'.

name::
* McsEngl.lagHitp'versioning,

todo of lagHitp

name::
* McsEngl.lagHitp'todo,

todo::
* Make a-wysiwyg-desktop--editor for lagHitp. {2017-09-24},

todo.DONE

todo::
* Arrow down|up events on mcs-searching. {2017-10-19},
* Done. {2017-11-10},

todo::
* Underline links when hovering. {2017-10-12},
* Done. {2017-10-17},

todo::
* Make it mobile friendly. {2016.08.08}
* Done. {lagHitp.15.2016-10-27},

GENERIC-SPECIFIC-TREE of lagHitp

name::
* McsEngl.lagHitp'generic-specific-tree,

GENERIC-TREE of lagHitp

generic-of-lagHitp::
* computer-language,
** web-page-language,
** data-language,
** programing-language,

attribute-tree-of-lagHitp::
* ,

att-tree-inherited-from::
· :
* ,

att-tree-own-of-lagHitp::
* ,

SPECIFIC-TREE of lagHitp

specific-of-lagHitp::
* lagHitpMcs,

meta-info

This page was visited times since {2013-05-30},

page-wholepath: synagonism.net / worldviewSngo / dirTchInf / lagHitp

contact:
• author: Kaseluris.Nikos.1959.
• email:
 
• twitter: @synagonism.

web-page-versions:
• version.working: McsTchInf000008.last.html.
• version.17-38-0.2021-04-02: ../../dirMiwMcs/dirTchInf/filMcsLagHitp.17-38-0.2021-04-02.html
• version.17-0-0.2017-11-27 (16-39-1): ../../dirMiwMcs/dirTchInf/FilMcsHitp.17-0-0.2017-11-27.html (dirTechInf)
• version.16.2016-06-09.title-content-tree (15-18): ../../hitp/index.16.2016-06-09.html.
• version.15.2016-01-25.content: /hitp/index.15.201-01-25.html.
• version.14.previous: /hitp/index.2013.08.23.14.html (site-structure)
• version.13.previous: /hitp/index.2013.08.20.13.html (name web-page)
• version.12.previous: /hitp/index.2013.06.29.12.html (new-dir-hitp)
• version.11.previous: /hit/index.2013.06.26.html (new-name)
• version.10.previous: /hit/index.2013.06.18.html (no-doc.ready)
• version.9.previous: /hit/index.2013.06.01.html (synagonism.net)
• version.8.previous: /gym-eleous.ioa.sch.gr/textid/index.2013.05.29.html (concept-index)
• version.7.previous: /gym-eleous.ioa.sch.gr/textid/index.2013.05.15.html (math)
• version.6.previous: /gym-eleous.ioa.sch.gr/textid/index.2013.04.14.html (link-preview)
• version.5.previous: /gym-eleous.ioa.sch.gr/textid/index.2013.04.01.html (Toc)
• version.4.previous: /gym-eleous.ioa.sch.gr/textid/index.2013.03.31.html (counter)
• version.3.previous: /gym-eleous.ioa.sch.gr/textid/index.2013.03.28.html (¶ right)
• version.2.previous: /gym-eleous.ioa.sch.gr/textid/index.2013.01.16.html
• version.1.published: /gym-eleous.ioa.sch.gr/textid/index.2011.02.17.html
• created: {2011-02-15},

support (link)

comments

comments powered by Disqus