bitwrench 1.2.16 → 2.0.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (130) hide show
  1. package/README.md +160 -158
  2. package/bin/bitwrench.js +3 -0
  3. package/dist/bitwrench-code-edit.cjs.js +639 -0
  4. package/dist/bitwrench-code-edit.es5.js +875 -0
  5. package/dist/bitwrench-code-edit.es5.min.js +15 -0
  6. package/dist/bitwrench-code-edit.esm.js +628 -0
  7. package/dist/bitwrench-code-edit.esm.min.js +15 -0
  8. package/dist/bitwrench-code-edit.umd.js +645 -0
  9. package/dist/bitwrench-code-edit.umd.min.js +15 -0
  10. package/dist/bitwrench.cjs.js +6983 -0
  11. package/dist/bitwrench.cjs.min.js +62 -0
  12. package/dist/bitwrench.css +5100 -0
  13. package/dist/bitwrench.es5.js +8446 -0
  14. package/dist/bitwrench.es5.min.js +31 -0
  15. package/dist/bitwrench.esm.js +6981 -0
  16. package/dist/bitwrench.esm.min.js +62 -0
  17. package/dist/bitwrench.umd.js +6989 -0
  18. package/dist/bitwrench.umd.min.js +62 -0
  19. package/dist/builds.json +127 -0
  20. package/dist/sri.json +18 -0
  21. package/package.json +86 -24
  22. package/readme.html +288 -0
  23. package/src/bitwrench-code-edit.js +627 -0
  24. package/src/bitwrench-color-utils.js +311 -0
  25. package/src/bitwrench-component-base.js +736 -0
  26. package/src/bitwrench-components-inline.js +374 -0
  27. package/src/bitwrench-components-v2.js +1879 -0
  28. package/src/bitwrench-components.js +610 -0
  29. package/src/bitwrench-styles.js +3240 -0
  30. package/src/bitwrench.js +3367 -0
  31. package/src/cli/convert.js +205 -0
  32. package/src/cli/index.js +122 -0
  33. package/src/cli/inject.js +55 -0
  34. package/src/cli/layout-default.js +142 -0
  35. package/src/generate-css.js +381 -0
  36. package/src/vendor/quikdown.js +654 -0
  37. package/src/version.js +16 -0
  38. package/.eslintrc.json +0 -27
  39. package/.github/workflows/codeql-analysis.yml +0 -72
  40. package/.travis.yml +0 -34
  41. package/bitwrench.css +0 -92
  42. package/bitwrench.js +0 -3348
  43. package/bitwrench.js_sri.txt +0 -1
  44. package/bitwrench.min.js +0 -1
  45. package/bitwrench.min.js_sri.txt +0 -1
  46. package/bitwrench_ESM.js +0 -3207
  47. package/bitwrench_ESM.js_sri.txt +0 -1
  48. package/bitwrench_ESM.min.js +0 -1
  49. package/bitwrench_ESM.min.js_sri.txt +0 -1
  50. package/dev/bitwrench-todo.md +0 -215
  51. package/dev/css-arrows.md +0 -23
  52. package/dev/docStringDev.js +0 -124
  53. package/dev/docStringParseDev.js +0 -171
  54. package/dev/example11-load-mjs-page.html +0 -17
  55. package/dev/figures.html +0 -37
  56. package/dev/html_gen.js +0 -349
  57. package/dev/htmld.md +0 -250
  58. package/dev/htmldev.html +0 -45
  59. package/dev/index-old.html +0 -87
  60. package/dev/misc-notes.md +0 -21
  61. package/dev/norm.css +0 -30
  62. package/dev/notes.md +0 -2
  63. package/dev/pageData.mjs +0 -69
  64. package/dev/sizes.html +0 -49
  65. package/dev/universal-js-module.js +0 -37
  66. package/examples/example1.html +0 -78
  67. package/examples/example10.html +0 -84
  68. package/examples/example11.html +0 -17
  69. package/examples/example12.html +0 -18
  70. package/examples/example2.html +0 -44
  71. package/examples/example3.html +0 -50
  72. package/examples/example4.html +0 -22
  73. package/examples/example5.html +0 -82
  74. package/examples/example6.html +0 -128
  75. package/examples/example7.html +0 -91
  76. package/examples/example8.html +0 -27
  77. package/examples/example9.html +0 -102
  78. package/examples/examplePageData12.mjs +0 -73
  79. package/examples/pageData.mjs +0 -69
  80. package/examples/pico.min.css +0 -5
  81. package/icon/bitwrench-dark-tall.png +0 -0
  82. package/icon/bitwrench-dark.png +0 -0
  83. package/icon/bitwrench-icon-lt-grey.png +0 -0
  84. package/icon/bitwrench-icon.vsd +0 -0
  85. package/icon/bitwrench-logo-dark.png +0 -0
  86. package/icon/bitwrench-logo-full.png +0 -0
  87. package/icon/bitwrench-logo-green.png +0 -0
  88. package/icon/bitwrench-logo-grey.png +0 -0
  89. package/icon/bitwrench-logo-white.png +0 -0
  90. package/icon/bitwrench-logos-colors.png +0 -0
  91. package/icon/bitwrench-thick-logo.png +0 -0
  92. package/icon/bitwrench-thick-teal/android-chrome-192x192.png +0 -0
  93. package/icon/bitwrench-thick-teal/android-chrome-512x512.png +0 -0
  94. package/icon/bitwrench-thick-teal/apple-touch-icon.png +0 -0
  95. package/icon/bitwrench-thick-teal/browserconfig.xml +0 -9
  96. package/icon/bitwrench-thick-teal/favicon-16x16.png +0 -0
  97. package/icon/bitwrench-thick-teal/favicon-32x32.png +0 -0
  98. package/icon/bitwrench-thick-teal/favicon.ico +0 -0
  99. package/icon/bitwrench-thick-teal/mstile-144x144.png +0 -0
  100. package/icon/bitwrench-thick-teal/mstile-150x150.png +0 -0
  101. package/icon/bitwrench-thick-teal/mstile-310x150.png +0 -0
  102. package/icon/bitwrench-thick-teal/mstile-310x310.png +0 -0
  103. package/icon/bitwrench-thick-teal/mstile-70x70.png +0 -0
  104. package/icon/bitwrench-thick-teal/site.webmanifest +0 -19
  105. package/icon/bitwrench-thick-teal.ico +0 -0
  106. package/icon/bitwrench-thick-teal.svg +0 -44
  107. package/icon/bitwrench-thick-teal.zip +0 -0
  108. package/icon/favicon-test.html +0 -20
  109. package/icon/logos-test.PNG +0 -0
  110. package/images/bitwrench-512x512.png +0 -0
  111. package/images/bitwrench-logo-med.png +0 -0
  112. package/images/bitwrench-thick-logo.png +0 -0
  113. package/images/bitwrench-thick-logo.svg +0 -64
  114. package/images/bitwrench-thick-teal.ico +0 -0
  115. package/images/favicon.ico +0 -0
  116. package/index.html +0 -282
  117. package/instr_tmp/bitwrench.js +0 -1350
  118. package/karma.conf.js +0 -140
  119. package/makefile +0 -21
  120. package/quick-docs.html +0 -206
  121. package/test/bitwrench_test.js +0 -1255
  122. package/test/karma-test.js +0 -1081
  123. package/tools/bw_deprecatedNames.js +0 -19
  124. package/tools/bwconsole.js +0 -20
  125. package/tools/createSimpleHTMLPage.js +0 -41
  126. package/tools/emitreadme.sh +0 -4
  127. package/tools/export-bw-default-css.js +0 -41
  128. package/tools/umd2ModuleHack.js +0 -32
  129. package/tools/update-bw-package.js +0 -36
  130. package/tools/updatereadme.js +0 -34
package/dev/htmldev.html DELETED
@@ -1,45 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
- <head>
4
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
5
- <link rel="icon" type="image/x-icon" href="../images/favicon.ico" />
6
- <!-- bitwrench.js library examples
7
- (c) M A Chatterjee
8
- deftio <at> deftio <dot> com
9
- web : http:deftio.com/bitwrench
10
- github: http:github.com/deftio/bitwrench
11
- -->
12
- <script type="text/javascript" src="../bitwrench.js"></script>
13
- <style type="text/css"></style>
14
- </style>
15
- </head>
16
- <body class="bw-def-page-setup bw-font-sans-serif">
17
- <div id="top"></div>
18
- <hr>
19
- <div id="bot"></div>
20
- <script>
21
-
22
- var content =
23
- [
24
- ["h1","Example HTML Gen with bitwrench"],
25
- ["p", {},[{t:"strong",a:{style:{color:"red"}}, c:"bitwrench.js version"}, bw.version()["version"]]],
26
- ["p", {},"This example shows how to set up json like webpage with bitwrench"],
27
- ["p",{style:"color:orange;"},()=>{return "arrow "+new Date()}],
28
- "<br>",
29
- {tag:"div",a:{class:"bw-left", onclick:function(x){x.style.color=x.style.color=="red"?"blue":"red";} }, c:"click me"},
30
- ["h2",{class:"bw-left bw-col-6", id:"result"},"H2 heading"],
31
- ["div",{}, [{c:"foo"},"bar",["span"," bar2"],{c:[1," content in the middle " ,43]} ]],
32
- "<br>",
33
- ];
34
-
35
- var c2 = {c:content};
36
-
37
- // make the content go live since we're in a browser. Note that if we were on node we could just write out our content
38
- bw.DOM("#top", bw.html({c:content}));
39
- var x = bw.htmlEmit(c2);
40
- bw.DOM("#bot", x.html);
41
-
42
- //document.getElementById("test").innerHTML = bw.logExport({"exportFormat":"HTML"});
43
- </script>
44
- </body>
45
- </html>
package/dev/index-old.html DELETED
@@ -1,87 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
- <head>
4
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
5
- <link rel="icon" type="image/x-icon" href="./images/bitwrench-thick-teal.ico" />
6
-
7
- <title>bitwrench.js</title>
8
- <!--
9
- bitwrench.js intro page
10
- (c) M A Chatterjee 2012-2018 deftio<at>deftio<dot>com
11
- github: https:github.com/deftio/bitwrench
12
- web: https:deftio.com/bitwrench
13
- NPM: https://www.npmjs.com/package/bitwrench
14
- -->
15
- <link rel="stylesheet" type="text/css" href="bitwrench.css" />
16
- <!-- Global site tag (gtag.js) - Google Analytics -->
17
- <script async src="https://www.googletagmanager.com/gtag/js?id=UA-30080304-3"></script>
18
- <script>
19
- window.dataLayer = window.dataLayer || [];
20
- function gtag(){dataLayer.push(arguments);}
21
- gtag('js', new Date());
22
- gtag('config', 'UA-30080304-3');
23
- </script>
24
-
25
- <script type="text/javascript" src="./bitwrench.js" ></script>
26
- </head>
27
- <body class="bw-def-page-setup bw-font-sans-serif">
28
- <div class="bw-container">
29
- <div class="bw-col-12">
30
- <a href="http://www.deftio.com/bitwrench"><img src="./images/bitwrench-thick-logo.png" width="50%" alt="bitwrench.js"></img></a>
31
- <h1>Intro</h1>
32
- <p id="versionArea"></p>
33
- <br>
34
-
35
-
36
- <p>bitwrench is a javascript library for useful demo hacking and misc kitchen sink operations. Use it for throwing up quick web pages which don’t depend on any server side framework but need a little prettyifcation or for visualizing quick data. For example when debugging C/C++ embedded projects where I don’t want to clutter my build dir with lots of “weird web stuff” - just write a simple HTML page with bitwrench and still load/debug raw text files, JSON, arrays and other bits of embedded files with no extra dependancies.</p>
37
- <ul>
38
- <li><strong>HTML quick emits</strong> – create HTML objects either client or server side from pure JSON. useful for making quick components or dynamic content w/o any inline HTML
39
- <ul>
40
- <li>html([“div”, {class:“class1 class2”, onclick:“myFunction(this)”,“This is the content”}]</li>
41
- <li>supports “deep” hieararchical JSON constructs and arrays</li>
42
- <li>registerFunction abilities allow functions to be passed statically to HTML elements (see docs)</li>
43
- </ul>
44
- </li>
45
- <li><strong>Color conversions and interpolation</strong>
46
- <ul>
47
- <li>RGB, RGBa, HSL, HSLa, and theme generation both as numeric values also as CSS outputs</li>
48
- </ul>
49
- </li>
50
- <li><strong>setting/getting cookies</strong> with defautls</li>
51
- <li><strong>pretty printing json</strong></li>
52
- <li><strong>Saving/Loading application data files</strong> (works in both browser or node)
53
- <ul>
54
- <li>save / load files as raw or JSON</li>
55
- </ul>
56
- </li>
57
- <li><strong>Getting URL parameters with defaults</strong>
58
- <ul>
59
- <li>simple parsing of URL params, also used for command line scripts</li>
60
- </ul>
61
- </li>
62
- <li><strong>Data manipulation functions</strong> and other “random” things (interpolation, clipping, multi-d arrays, random())</li>
63
- <li><strong>Logging</strong> with time-stamps, messaging, and pretty printing (raw, HTML, and text)
64
- <ul>
65
- <li>Logging also has auto dissolve so one can log a process and then dump later or suppress in ‘production’</li>
66
- </ul>
67
- </li>
68
- <li><strong>Built-in docString parsing</strong> with extraction support</li>
69
- </ul>
70
- <p>There is no great structure here, just a bunch of kitchen sink things that seemed to be handy in alot of quick web dev situations. All non-dom specific calls can be run either server side or client side.</p>
71
- <p>Of course your mileage may very…</p>
72
- <p>A minified form bitwrench.min.js is provided with identical functionality</p>
73
-
74
- <br><br>
75
- <div id="content"></div>
76
- <br><br>
77
- <div class="bw-center" style="font-size: 9pt"><span style="color:teal">bit</span>wrench.js&nbsp;&nbsp;&copy&nbsp;2012-<span id="cdate"></span>&nbsp; M A Chatterjee</div><br>
78
- </div>
79
- </div>
80
- <script type="text/javascript">
81
- bw.DOMGetElements("#versionArea")[0].innerHTML = "<strong>bitwrench.js version:</strong> " + bw.version()["version"];
82
- bw.DOMGetElements("#cdate")[0].innerHTML = (new Date()).getFullYear();
83
- var h = bw.buildHTMLObjString;
84
- </script>
85
-
86
- </body>
87
- </html>
package/dev/misc-notes.md DELETED
@@ -1,21 +0,0 @@
1
- //=============================================
2
- //arrows for table sort
3
- .bw-table-sort-upa::after {
4
- content: "\2191";
5
- }
6
-
7
- .bw-table-sort-dna::after {
8
- content: "\2193";
9
- }
10
-
11
- .bw-table-sort-xxa::after {
12
- content: "\00a0";
13
- }
14
- .bw-table-sort-up::after {
15
- }
16
-
17
- .bw-table-sort-dn::after {
18
- }
19
-
20
- .bw-table-sort-xx::after {
21
- }
package/dev/norm.css DELETED
@@ -1,30 +0,0 @@
1
- html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}
2
- /* Extract from normalize.css by Nicolas Gallagher and Jonathan Neal git.io/normalize */
3
- html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}
4
- article,aside,details,figcaption,figure,footer,header,main,menu,nav,section{display:block}summary{display:list-item}
5
- audio,canvas,progress,video{display:inline-block}progress{vertical-align:baseline}
6
- audio:not([controls]){display:none;height:0}[hidden],template{display:none}
7
- a{background-color:transparent}a:active,a:hover{outline-width:0}
8
- abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}
9
- b,strong{font-weight:bolder}dfn{font-style:italic}mark{background:#ff0;color:#000}
10
- small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
11
- sub{bottom:-0.25em}sup{top:-0.5em}figure{margin:1em 40px}img{border-style:none}
12
- code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}hr{box-sizing:content-box;height:0;overflow:visible}
13
- button,input,select,textarea,optgroup{font:inherit;margin:0}optgroup{font-weight:bold}
14
- button,input{overflow:visible}button,select{text-transform:none}
15
- button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}
16
- button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}
17
- button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}
18
- fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em}
19
- legend{color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto}
20
- [type=checkbox],[type=radio]{padding:0}
21
- [type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}
22
- [type=search]{-webkit-appearance:textfield;outline-offset:-2px}
23
- [type=search]::-webkit-search-decoration{-webkit-appearance:none}
24
- ::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}
25
- /* End extract */
26
- html,body{font-family:Verdana,sans-serif;font-size:15px;line-height:1.5}html{overflow-x:hidden}
27
- h1{font-size:36px}h2{font-size:30px}h3{font-size:24px}h4{font-size:20px}h5{font-size:18px}h6{font-size:16px}
28
- .w3-serif{font-family:serif}.w3-sans-serif{font-family:sans-serif}.w3-cursive{font-family:cursive}.w3-monospace{font-family:monospace}
29
- h1,h2,h3,h4,h5,h6{font-family:"Segoe UI",Arial,sans-serif;font-weight:400;margin:10px 0}.w3-wide{letter-spacing:4px}
30
- hr{border:0;border-top:1px solid #eee;margin:20px 0}
package/dev/notes.md DELETED
@@ -1,2 +0,0 @@
1
- when running karma (browser tests) may need to tie in to chromium on ubuntu. if so use this:
2
- export CHROME_BIN=/usr/bin/chromium-browser
package/dev/pageData.mjs DELETED
@@ -1,69 +0,0 @@
1
- import bw from '../bitwrench_ESM.js'; //only because we are referencing some bitwrench fns in our page data
2
-
3
- export const htmlData = {
4
- c: //for more on the format, see docs github.com/deftio/bitwrench
5
- [
6
- ["h1" ,{"class":"bw-h1"},"Bitwrench Test Area with ESM modules & ESM content" ],
7
- "bitwrench version: "+bw.version().version +"<br><br>",
8
- ["div",{"class":"foo"} ,"This page has HTML content which is entirely written as Javascript objects (JSON-like but with support for functions) by content using "+bw.html(["a",{href:"https://github.com/deftio/bitwrench"},"bitwrench.js"])+". Bitwrench has built-in grids, tables,headings, and other quick-n-dirty html prototyping tasks. Bitwrench html generation runs either client or server side."],
9
- "<hr>",
10
- ["h2","Lorem Ipsum Generator"],
11
- "Good for testing simple layout ideas.<br><br>",
12
- ["div",{},bw.loremIpsum(230)],
13
- "<hr>",
14
- ["h2",{},"Sample Content with 3 Columns"],
15
- ["div",{"class":"bw-row"},
16
- [
17
- ["div",{"class":"bw-col-4 bw-left "},"<h3>Left justified</h3>"+bw.loremIpsum(95)], //mix text and html freely
18
- ["div",{"class":"bw-col-4 bw-center bw-pad1"},"<h3>Centered</h3>"+bw.loremIpsum(95,3)],
19
- ["div",{"class":"bw-col-4 bw-right "},"<h3>Right justified</h3>"+bw.loremIpsum(95,2)],
20
- ],
21
- ],
22
- "<br><hr>",
23
- ["h2", {}, "Example Sortable Table"],
24
- bw.htmlTable( // json to table (note table data can be functions as well)
25
- [
26
- ["Name","Age", "Prof", "Fav Color"], // just an 2D array
27
- ["Sue", 34, "Engineer", {a:{style:"color:red"},c:"red"}], // inline json-html objects
28
- ["Bob" ,35, "Teacher", {a:{style:"color:green"},c:"green"}],
29
- ["Vito",23, "Mechanic", {a:{style:"color:blue",onclick:"alert('blue!')"},c:"blue"}],
30
- ["Hank",73, "Retired", {a:{style:"color:purple"},c:"purple"}]
31
- ],{sortable:true}),
32
- "<br><hr>",
33
- ["h2",{},"Sample Buttons"],
34
- "These buttons have function handlers attached.<br><br>",
35
- ["button",{onclick:"alert('button pressed!')"},"Alert Button"], // staight js
36
- "&nbsp;&nbsp;",
37
- ["button",{onclick:(e)=>{e.innerHTML=(new Date()).toLocaleTimeString()}},"Time Button"], // bitwrench maps and registers event functions
38
- "<br><hr>",
39
- ["h2","Built in Headings"],
40
- [1,2,3,4,5,6].map( function(x){return bw.html(["h"+x,"Heading "+x])}).join(""), // Headings
41
- "<br><hr>",
42
- ["h2","Grid System (responsive)"],
43
- "Grid system (just uses css so can use either bitwrench.js loader or just bitwrench.css with no javascript. Use -fluid for responsive<br><br>",
44
- ["style",{},"\n.boxEv {background-color: #aaa; height: 30px; border-radius:5px; border:1px solid black;}\n.boxOd {background-color: #ddd; height:30px; border-radius:5px;border:1px solid black;;}\n"], // some styles (note bw has CSS generation shown in another example)
45
- ["div",{class:"bw-row bw-center"},[{a:{class:"bw-col-1 boxEv"},c:"bw-col-1"},{a:{class:"bw-col-1 boxOd"},c:"bw-col-1"},{a:{class:"bw-col-1 boxEv"},c:"bw-col-1"},{a:{class:"bw-col-1 boxOd"},c:"bw-col-1"},{a:{class:"bw-col-1 boxEv"},c:"bw-col-1"},{a:{class:"bw-col-1 boxOd"},c:"bw-col-1"},{a:{class:"bw-col-1 boxEv"},c:"bw-col-1"},{a:{class:"bw-col-1 boxOd"},c:"bw-col-1"},{a:{class:"bw-col-1 boxEv"},c:"bw-col-1"},{a:{class:"bw-col-1 boxOd"},c:"bw-col-1"},{a:{class:"bw-col-1 boxEv"},c:"bw-col-1"},{a:{class:"bw-col-1 boxOd"},c:"bw-col-1"}]],
46
- ["div",{class:"bw-row bw-center"},[{a:{class:"bw-col-2 boxEv"},c:"bw-col-2"},{a:{class:"bw-col-2 boxOd"},c:"bw-col-2"},{a:{class:"bw-col-2 boxEv"},c:"bw-col-2"},{a:{class:"bw-col-2 boxOd"},c:"bw-col-2"},{a:{class:"bw-col-2 boxEv"},c:"bw-col-2"},{a:{class:"bw-col-2 boxOd"},c:"bw-col-2"}]],
47
- ["div",{class:"bw-row bw-center"},[{a:{class:"bw-col-3 boxEv"},c:"bw-col-3"},{a:{class:"bw-col-3 boxOd"},c:"bw-col-3"},{a:{class:"bw-col-3 boxEv"},c:"bw-col-3"},{a:{class:"bw-col-3 boxOd"},c:"bw-col-3"}]],
48
- ["div",{class:"bw-row bw-center"},[{a:{class:"bw-col-4 boxEv"},c:"bw-col-4"},{a:{class:"bw-col-4 boxOd"},c:"bw-col-4"},{a:{class:"bw-col-4 boxEv"},c:"bw-col-4"}]],
49
- ["div",{class:"bw-row bw-center"},[{a:{class:"bw-col-5 boxEv"},c:"bw-col-5"},{a:{class:"bw-col-7 boxOd"},c:"bw-col-7"}]],
50
- ["div",{class:"bw-row bw-center"},[{a:{class:"bw-col-6 boxEv"},c:"bw-col-6"},{a:{class:"bw-col-6 boxOd"},c:"bw-col-6"}]],
51
- ["div",{class:"bw-row bw-center"},[{a:{class:"bw-col-7 boxEv"},c:"bw-col-7"},{a:{class:"bw-col-5 boxOd"},c:"bw-col-5"}]],
52
- ["div",{class:"bw-row bw-center"},[{a:{class:"bw-col-8 boxEv"},c:"bw-col-8"},{a:{class:"bw-col-4 boxOd"},c:"bw-col-4"}]],
53
- ["div",{class:"bw-row bw-center"},[{a:{class:"bw-col-9 boxEv"},c:"bw-col-9"},{a:{class:"bw-col-3 boxOd"},c:"bw-col-3"}]],
54
- ["div",{class:"bw-row bw-center"},[{a:{class:"bw-col-10 boxEv"},c:"bw-col-10"},{a:{class:"bw-col-2 boxOd"},c:"bw-col-2"}]],
55
- ["div",{class:"bw-row bw-center"},[{a:{class:"bw-col-11 boxEv"},c:"bw-col-11"},{a:{class:"bw-col-1 boxOd"},c:"bw-col-1"}]],
56
- ["div",{class:"bw-row bw-center"},[{a:{class:"bw-col-12 boxEv"},c:"bw-col-12"}]],
57
-
58
- "<br><hr>",
59
- ["h2",{},"Simple Sign"],
60
- ["div",{style:"padding:10%; border:1px solid black;"},bw.htmlSign("This is a big sign!")],
61
- "<br><hr>",
62
- ["h2",{},"Tabbed Content"],
63
- bw.htmlTabs([
64
- ["Tab1",bw.loremIpsum(900)],
65
- ["Tab2",bw.loremIpsum(900,20)],
66
- ["Tab3",bw.loremIpsum(900,50)]],{tab_atr:{style:""}}) ,
67
- "<br>",
68
- ]
69
- }
package/dev/sizes.html DELETED
@@ -1,49 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
- <head>
4
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
5
- <link rel="icon" type="image/x-icon" href="../images/favicon.ico" />
6
- <!-- above is all boiler plate -->
7
-
8
- <title>bitwrench.js</title>
9
- <!-- bitwrench.js quick-docs doc
10
- (c) M A Chatterjee
11
- deftio <at> deftio <dot> com
12
- github: https:github.com/deftio/bitwrench
13
- web: https://deftio.com/bitwrench
14
- -->
15
-
16
- <script type="text/javascript" src="../bitwrench.min.js" bwargs="ex1:1;ex2:2"></script>
17
-
18
- </head>
19
-
20
- <body class="bw-def-page-setup bw-font-sans-serif">
21
- <div class="bw-container">
22
- <div class="bw-col-10">
23
- <img src="../images/bitwrench-thick-logo.png" width="500"></img>
24
- <h1>Bitwrench Size Analysis</h1>
25
- <p id="versionArea"></p>
26
- <br>
27
- <div>total size (bytes) not incl umd wrapper = <span id="total"></span></div>
28
- Size of each function for pruning (bitwrench.min.js)
29
-
30
-
31
- </div>
32
- <div id="tab1"></div>
33
- <!-- grid demo area -->
34
- </div>
35
-
36
- <script>
37
- var i, t = [["Name","Type", "Key size (bytes)", "Val Size (bytes)", "Total (bytes)"]];
38
- for (i in bw) {
39
- var s = "undef";
40
- if (bw.to(bw[i] != "undefined"))
41
- var s = String(bw[i]).length;
42
- t.push( [i,bw.to(bw[i]), i.length, s, i.length+s])
43
- }
44
- bw.DOM("#tab1",bw.htmlTable(t,{"sortable":true}));
45
- bw.sortHTMLTable("#tab1",4,"down"); // show biggest at top...
46
- bw.DOM("#total",t.reduce((s,x)=> s+(isNaN(Number(x[4]))?0:Number(x[4])),0).toString())
47
- </script>
48
- </body>
49
- </html>
package/dev/universal-js-module.js DELETED
@@ -1,37 +0,0 @@
1
- /**
2
- "universal" js module definition borrowed from
3
- https://github.com/umdjs/umd/blob/master/templates/returnExports.js
4
-
5
-
6
- */
7
- "use strict";
8
-
9
- (function (root, factory) {
10
- if (typeof define === 'function' && define.amd) {
11
- // AMD. Register as an anonymous module.
12
- define([], factory);
13
- } else if (typeof module === 'object' && module.exports) {
14
- // Node. Does not work with strict CommonJS, but
15
- // only CommonJS-like environments that support module.exports,
16
- // like Node.
17
- console.log("node...");
18
- module.exports = factory();
19
- } else {
20
- // console.log("browser..",root, typeof root);
21
- // Browser globals (root is window)
22
- var module = factory();
23
- root[module["exportName"]] = module;
24
- }
25
-
26
- }(typeof self !== 'undefined' ? self : this, function () {
27
-
28
- "use strict";
29
-
30
- var _f = {};
31
-
32
- _f.exportName = "myModuleName"; // visible name of module
33
-
34
-
35
- return _f;
36
-
37
- }));
package/examples/example1.html DELETED
@@ -1,78 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
- <head>
4
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
5
- <link rel="icon" type="image/x-icon" href="../images/favicon.ico" />
6
- <!-- bitwrench.js library examples
7
- (c) M A Chatterjee
8
- deftio <at> deftio <dot> com
9
- web : http:deftio.com/bitwrench
10
- github: http:github.com/deftio/bitwrench
11
- -->
12
- <script type="text/javascript" src="../bitwrench.js"></script>
13
-
14
- </head>
15
- <body class="bw-def-page-setup bw-font-sans-serif">
16
- <script>
17
-
18
- //sample function to generate some sample table data.
19
- //loops used instead of array.map() for those less familiar with javascript map/filter/reduce
20
- function getRandomTableData(cols,rows) {
21
- var d = bw.multiArray(bw.random,[rows,cols]); //
22
-
23
- var headers = new Array(cols); // // make headers. Note see docs in bw.makeHTMLTable for data w/o headers
24
- for (i=0; i< headers.length; i++)
25
- headers[i] = "Col-"+i;
26
- d.unshift(headers); // in Javascript this oddly named function inserts an element at the beginning of an array.
27
- return d;
28
- }
29
-
30
- var content =
31
- [
32
- ["h1",{},"Simple Example Page (browser version)"],
33
- ["p", {},"<strong>bitwrench.js version:</strong> " + bw.version()["version"]],
34
- ["p",{},"This is a test for building completely programmatic content with bitwrench.js."],
35
- ["h2",{},"Some Sample Content"],
36
- ["div",{id:"test"},bw.loremIpsum(250)],
37
- ["h2",{},"More Sample Content but using only half width"],
38
- ["div",{"class":'bw-col-6'},bw.loremIpsum(300)], // style:"background-image:url(../images/bitwrench.png) no-repeat 100% 100%;"}
39
- "<br>",
40
- ["p",{"class":"bw-col-6"},bw.loremIpsum(300)],
41
- ["h2",{},"Sample Table Data"],
42
- ["p",{}, "The following table is autogenerated from a Javascript array of data. The table is sortable by clicking on the column headers."],
43
- bw.htmlTable(getRandomTableData(12,8),{sortable:true}),
44
- ["h2",{},"Sample Content with 3 Columns"],
45
- {c:"Left col is left justified, center is center justiifed, right is right justified.<br><br>"},
46
- ["div",{"class":"bw-row"}, //create a row
47
- [
48
- ["div",{"class":"bw-col-4 bw-left "},bw.loremIpsum(500)],
49
- ["div",{"class":"bw-col-4 bw-center bw-pad1"},bw.loremIpsum(700,33)],
50
- ["div",{"class":"bw-col-4 bw-right "},bw.loremIpsum(500)],
51
- ],
52
- ],
53
- ["h2",{},"Tabbed Content"],
54
- bw.htmlTabs([["Tab1",bw.loremIpsum(500)],["Tab2",bw.loremIpsum(500,20)],["Tab3",bw.loremIpsum(500,50)]],{tab_atr:{style:""}}) ,
55
- "<br>",
56
- ['h2',{},"Accordian"],
57
- ["div",{},"An accordian allows expanding and collapsing of a list of dynamic content"],
58
- "<br>",
59
-
60
- //accordian done using bw.html accordian
61
- bw.htmlAccordian([
62
- ["Accordian 1",bw.loremIpsum(500,4)],
63
- ["Accordian 2",bw.loremIpsum(500,5),{show:false}],
64
- ["Accordian 3",bw.htmlTabs([["Inner Tab1",bw.loremIpsum(500,10)],["Inner Tab2",bw.loremIpsum(500,20)],["Inner Tab3",bw.loremIpsum(500,50)]])],
65
- ["Accordian 4",bw.loremIpsum(500,4),{show:true}]
66
- ]
67
- ,{ atr_h: {class:"bw-thm-dark"},atr_c:{"style": "color: red "}}
68
- ),
69
- "<br><br>"
70
-
71
- ];
72
-
73
- // make the content go live since we're in a browser. Note that if we were on node we could just write out our content
74
- bw.DOMInsertElement("body",{c:content},true);
75
-
76
- </script>
77
- </body>
78
- </html>
package/examples/example10.html DELETED
@@ -1,84 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
- <head>
4
- </head>
5
- <body class="bw-def-page-setup bw-font-sans-serif">
6
-
7
- <script type="module">
8
- import bw from '../bitwrench_ESM.js';
9
- window.bw = bw;
10
- var htmlData = {c: //for more on the format, see docs github.com/deftio/bitwrench
11
- [
12
- ["h1" ,{"class":"bw-h1"},"Bitwrench Test Area : using ES Module Version" ],
13
- "bitwrench version: "+bw.version().version +"<br><br>",
14
- ["div",{"class":"foo"} ,"This page has HTML content which is entirely written as Javascript objects (JSON-like but with support for functions) by content using "+bw.html(["a",{href:"https://github.com/deftio/bitwrench"},"bitwrench.js"])+". Bitwrench has built-in grids, tables,headings, and other quick-n-dirty html prototyping tasks. Bitwrench html generation runs either client or server side."],
15
- "<hr>",
16
- ["h2","Lorem Ipsum Generator"],
17
- "Good for testing simple layout ideas.<br><br>",
18
- ["div",{},bw.loremIpsum(230)],
19
- "<hr>",
20
- ["h2",{},"Sample Content with 3 Columns"],
21
- ["div",{"class":"bw-row"},
22
- [
23
- ["div",{"class":"bw-col-4 bw-left "},"<h3>Left justified</h3>"+bw.loremIpsum(95)], //mix text and html freely
24
- ["div",{"class":"bw-col-4 bw-center bw-pad1"},"<h3>Centered</h3>"+bw.loremIpsum(95,3)],
25
- ["div",{"class":"bw-col-4 bw-right "},"<h3>Right justified</h3>"+bw.loremIpsum(95,2)],
26
- ],
27
- ],
28
- "<br><hr>",
29
- ["h2", {}, "Example Sortable Table"],
30
- bw.htmlTable( // json to table (note table data can be functions as well)
31
- [
32
- ["Name","Age", "Prof", "Fav Color"], // just an 2D array
33
- ["Sue", 34, "Engineer", {a:{style:"color:red"},c:"red"}], // inline json-html objects
34
- ["Bob" ,35, "Teacher", {a:{style:"color:green"},c:"green"}],
35
- ["Vito",23, "Mechanic", {a:{style:"color:blue",onclick:"alert('blue!')"},c:"blue"}],
36
- ["Hank",73, "Retired", {a:{style:"color:purple"},c:"purple"}]
37
- ],{sortable:true}),
38
- "<br><hr>",
39
- ["h2",{},"Sample Buttons"],
40
- "These buttons have function handlers attached.<br><br>",
41
- ["button",{onclick:"alert('button pressed!')"},"Alert Button"], // staight js
42
- "&nbsp;&nbsp;",
43
- ["button",{onclick:myFunc},"Time Button"], // bitwrench maps and registers event functions
44
- "<br><hr>",
45
- ["h2","Built in Headings"],
46
- [1,2,3,4,5,6].map( function(x){return bw.html(["h"+x,"Heading "+x])}).join(""), // Headings
47
- "<br><hr>",
48
- ["h2","Grid System (responsive)"],
49
- "Grid system (just uses css so can use either bitwrench.js loader or just bitwrench.css with no javascript. Use -fluid for responsive<br><br>",
50
- ["style",{},"\n.boxEv {background-color: #aaa; height: 30px; border-radius:5px; border:1px solid black;}\n.boxOd {background-color: #ddd; height:30px; border-radius:5px;border:1px solid black;;}\n"], // some styles (note bw has CSS generation shown in another example)
51
- ["div",{class:"bw-row bw-center"},[{a:{class:"bw-col-1 boxEv"},c:"bw-col-1"},{a:{class:"bw-col-1 boxOd"},c:"bw-col-1"},{a:{class:"bw-col-1 boxEv"},c:"bw-col-1"},{a:{class:"bw-col-1 boxOd"},c:"bw-col-1"},{a:{class:"bw-col-1 boxEv"},c:"bw-col-1"},{a:{class:"bw-col-1 boxOd"},c:"bw-col-1"},{a:{class:"bw-col-1 boxEv"},c:"bw-col-1"},{a:{class:"bw-col-1 boxOd"},c:"bw-col-1"},{a:{class:"bw-col-1 boxEv"},c:"bw-col-1"},{a:{class:"bw-col-1 boxOd"},c:"bw-col-1"},{a:{class:"bw-col-1 boxEv"},c:"bw-col-1"},{a:{class:"bw-col-1 boxOd"},c:"bw-col-1"}]],
52
- ["div",{class:"bw-row bw-center"},[{a:{class:"bw-col-2 boxEv"},c:"bw-col-2"},{a:{class:"bw-col-2 boxOd"},c:"bw-col-2"},{a:{class:"bw-col-2 boxEv"},c:"bw-col-2"},{a:{class:"bw-col-2 boxOd"},c:"bw-col-2"},{a:{class:"bw-col-2 boxEv"},c:"bw-col-2"},{a:{class:"bw-col-2 boxOd"},c:"bw-col-2"}]],
53
- ["div",{class:"bw-row bw-center"},[{a:{class:"bw-col-3 boxEv"},c:"bw-col-3"},{a:{class:"bw-col-3 boxOd"},c:"bw-col-3"},{a:{class:"bw-col-3 boxEv"},c:"bw-col-3"},{a:{class:"bw-col-3 boxOd"},c:"bw-col-3"}]],
54
- ["div",{class:"bw-row bw-center"},[{a:{class:"bw-col-4 boxEv"},c:"bw-col-4"},{a:{class:"bw-col-4 boxOd"},c:"bw-col-4"},{a:{class:"bw-col-4 boxEv"},c:"bw-col-4"}]],
55
- ["div",{class:"bw-row bw-center"},[{a:{class:"bw-col-5 boxEv"},c:"bw-col-5"},{a:{class:"bw-col-7 boxOd"},c:"bw-col-7"}]],
56
- ["div",{class:"bw-row bw-center"},[{a:{class:"bw-col-6 boxEv"},c:"bw-col-6"},{a:{class:"bw-col-6 boxOd"},c:"bw-col-6"}]],
57
- ["div",{class:"bw-row bw-center"},[{a:{class:"bw-col-7 boxEv"},c:"bw-col-7"},{a:{class:"bw-col-5 boxOd"},c:"bw-col-5"}]],
58
- ["div",{class:"bw-row bw-center"},[{a:{class:"bw-col-8 boxEv"},c:"bw-col-8"},{a:{class:"bw-col-4 boxOd"},c:"bw-col-4"}]],
59
- ["div",{class:"bw-row bw-center"},[{a:{class:"bw-col-9 boxEv"},c:"bw-col-9"},{a:{class:"bw-col-3 boxOd"},c:"bw-col-3"}]],
60
- ["div",{class:"bw-row bw-center"},[{a:{class:"bw-col-10 boxEv"},c:"bw-col-10"},{a:{class:"bw-col-2 boxOd"},c:"bw-col-2"}]],
61
- ["div",{class:"bw-row bw-center"},[{a:{class:"bw-col-11 boxEv"},c:"bw-col-11"},{a:{class:"bw-col-1 boxOd"},c:"bw-col-1"}]],
62
- ["div",{class:"bw-row bw-center"},[{a:{class:"bw-col-12 boxEv"},c:"bw-col-12"}]],
63
-
64
- "<br><hr>",
65
- ["h2",{},"Simple Sign"],
66
- ["div",{style:"padding:10%; border:1px solid black;"},bw.htmlSign("This is a big sign!")],
67
- "<br><hr>",
68
- ["h2",{},"Tabbed Content"],
69
- bw.htmlTabs([
70
- ["Tab1",bw.loremIpsum(300)],
71
- ["Tab2",bw.loremIpsum(300,20)],
72
- ["Tab3",bw.loremIpsum(300,50)]],{tab_atr:{style:""}}) ,
73
- "<br>",
74
- ]};
75
-
76
- bw.DOMInsertElement("body",bw.html(htmlData),true);
77
- function myFunc(x){return x.innerHTML = (new Date()).toLocaleTimeString();} // button function
78
-
79
-
80
- bw.DOMInsertElement("head",bw.html(bw.htmlFavicon("\u266C","teal"))); // insert a favicon on the top tab of the page, "X" for a single letter
81
- bw.DOMInsertElement("head",bw.html({t:"title",c:"Bitwrench HTML Gen "})); // insert a page title on the browser tab
82
- </script>
83
- </body>
84
- </html>
package/examples/example11.html DELETED
@@ -1,17 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
- <head>
4
- </head>
5
- <body class="bw-def-page-setup bw-font-sans-serif">
6
-
7
- <script type="module">
8
- import bw from '../bitwrench_ESM.js';
9
- window.bw = bw;
10
- import {htmlData} from './pageData.mjs';
11
- bw.DOMInsertElement("body",bw.html(htmlData),true);
12
-
13
- bw.DOMInsertElement("head",bw.html(bw.htmlFavicon("\u266C","teal"))); // insert a favicon on the top tab of the page, "X" for a single letter
14
- bw.DOMInsertElement("head",bw.html({t:"title",c:"Bitwrench HTML Gen "})); // insert a page title on the browser tab
15
- </script>
16
- </body>
17
- </html>
package/examples/example12.html DELETED
@@ -1,18 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
- <head>
4
- <link href="./pico.min.css" rel="stylesheet" />
5
- </head>
6
- <body class="bw-def-page-setup bw-font-sans-serif">
7
-
8
- <script type="module">
9
- import bw from '../bitwrench_ESM.js';
10
- window.bw = bw;
11
- import {htmlData} from './examplePageData12.mjs';
12
- bw.DOMInsertElement("body",bw.html(htmlData),true);
13
-
14
- bw.DOMInsertElement("head",bw.html(bw.htmlFavicon("\u266C","teal"))); // insert a favicon on the top tab of the page, "X" for a single letter
15
- bw.DOMInsertElement("head",bw.html({t:"title",c:"Bitwrench HTML Gen "})); // insert a page title on the browser tab
16
- </script>
17
- </body>
18
- </html>
package/examples/example2.html DELETED
@@ -1,44 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
- <head>
4
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
5
- <link rel="icon" type="image/x-icon" href="../images/favicon.ico" />
6
- <!-- bitwrench.js library examples
7
- (c) M A Chatterjee
8
- deftio <at> deftio <dot> com
9
- web : http:deftio.com/bitwrench
10
- github: http:github.com/deftio/bitwrench
11
- -->
12
- <script type="text/javascript" src="../bitwrench.js"></script>
13
- </head>
14
- <body class="bw-def-page-setup bw-font-sans-serif">
15
- <script>
16
- //var bw = bitwrench;
17
-
18
- bw.CSSSimpleThemes(1);
19
- // =======================================================
20
- var i,s="";
21
- for (i=0; i<40; i++) {
22
- s+= bw.html(["div",{class:"bw-col-6",style:"height:20px; background-color:" + bw.colorToRGBHex(bw.colorInterp(i,0,40,["#029b38","#cb3288","#8babc9","#9fffb0"]))},""]);
23
- }
24
-
25
- var content =
26
- [
27
- ["h1" ,{},"Examples with Colors"],
28
- ["p" ,{},"bitwrench.js version " + bw.version()["version"] ],
29
- ["h2" ,{},"Color Bars with bw.colorInterp()"],
30
- ["pre",{},s],
31
- "<br>",
32
- ["h2", {}, "Grey Scale Color Boxes using bwHtmlTable() and bw.multiArray()"],
33
- "<br>",
34
- ["div",{}, bw.htmlTable(bw.multiArray(function(){return bw.html(["div",{style:"width:45px;height:45px;background-color:"+bw.colorToRGBHex(bw.colorInterp(bw.random(0,1,{setType:"float"})))},""])},[10,10]),{useFirstRowAsHeaders:false})]
35
- ];
36
-
37
- // make the content go live..
38
- bw.DOMInsertElement( "body", {a:{class:"container"},c:content},true);
39
-
40
-
41
-
42
- </script>
43
- </body>
44
- </html>