Skip to content

Instantly share code, notes, and snippets.

@ashworth-zach

ashworth-zach/gematria-calculator.markdown

Created August 19, 2022 03:03
Show Gist options
  • Save ashworth-zach/f6bc848d9cbdb96803bb1763f72b31eb to your computer and use it in GitHub Desktop.
Save ashworth-zach/f6bc848d9cbdb96803bb1763f72b31eb to your computer and use it in GitHub Desktop.
Download ZIP
Gematria Calculator
Raw
index.html
<body>
<div class="input">
<input type="text" id="text" placeholder="text">
<button id="submit">Go</button>
</div>
<div class="result">
<label class="text-result-English" for="EnglishOrdinal">English Ordinal (EO)</label>
<p class="text-result" id="EnglishOrdinal"></p>
<label class="text-result-Reverse" for="ReverseEnglishOrdinal">Reverse English Ordinal (REO)</label>
<p class="text-result" id="ReverseEnglishOrdinal"></p>
<label class="text-result-Full" for="FullReduction">Full Reduction (FR)</label>
<p class="text-result" id="FullReduction"></p>
</div>
<div class="scrollcontainer">
<div id="master-container">
</div>
</div>
</body>
Raw
script.js
let values = {
Reverse: undefined,
English: undefined,
Full: undefined
};
let EnglishOrdinalDefinitions = {
" ": 0,
a: 1,
b: 2,
c: 3,
d: 4,
e: 5,
f: 6,
g: 7,
h: 8,
i: 9,
j: 10,
k: 11,
l: 12,
m: 13,
n: 14,
o: 15,
p: 16,
q: 17,
r: 18,
s: 19,
t: 20,
u: 21,
v: 22,
w: 23,
x: 24,
y: 25,
z: 26
};
let ReverseEnglishOrdinalDefinitions = {
" ": 0,
a: 26,
b: 25,
c: 24,
d: 23,
e: 22,
f: 21,
g: 20,
h: 19,
i: 18,
j: 17,
k: 17,
l: 15,
m: 14,
n: 13,
o: 12,
p: 11,
q: 10,
r: 9,
s: 8,
t: 7,
u: 6,
v: 5,
w: 4,
x: 3,
y: 2,
z: 1
};
let FullReductionDefinitions = {
" ": 0,
a: 1,
b: 2,
c: 3,
d: 4,
e: 5,
f: 6,
g: 7,
h: 8,
i: 9,
j: 1,
k: 2,
l: 3,
m: 4,
n: 5,
o: 6,
p: 7,
q: 8,
r: 9,
s: 1,
t: 2,
u: 3,
v: 4,
w: 5,
x: 6,
y: 7,
z: 8
};
let EnglishOrdinal = [];
let ReverseEnglishOrdinal = [];
let FullReduction = [];
function submit() {
let inputText = document.getElementById("text");
let value = copyObject(inputText.value);
inputText.value = "";
EnglishOrdinal = [];
ReverseEnglishOrdinal = [];
FullReduction = [];
values = {
Reverse: undefined,
English: undefined,
Full: undefined
};
for (let i = 0; i < value.length; i++) {
pushValueToArrays(value[i].toLowerCase());
}
for (let i = 2; i > -1; i--) {
switch (i) {
case 0:
values["English"] = combineValues(EnglishOrdinal);
createOrUpdateGrids(EnglishOrdinal, value, i, "(EO)");
break;
case 1:
values["Reverse"] = combineValues(ReverseEnglishOrdinal);
createOrUpdateGrids(ReverseEnglishOrdinal, value, i, "(REO)");
break;
case 2:
values["Full"] = combineValues(FullReduction);
createOrUpdateGrids(FullReduction, value, i, "(FR)");
break;
}
}
updateResults();
}
function createOrUpdateGrids(gridData, value, type, finalHeading) {
let master = document.getElementById("master-container");
switch (type) {
case 0:
createGridElements(
gridData,
value,
"English Ordinal",
master,
finalHeading
);
break;
case 1:
createGridElements(
gridData,
value,
"Reverse English Ordinal",
master,
finalHeading
);
break;
case 2:
createGridElements(
gridData,
value,
"Full Reduction",
master,
finalHeading
);
break;
}
}
function createGridElements(
data,
value,
gridTitle,
parentElement,
finalHeading
) {
let newTable = document.createElement("table");
//shorthand description for creating class for each item
let key = gridTitle.split(" ")[0];
generateTableRows(newTable, key, data, value, finalHeading);
//add grid title
let gridTitleElement = document.createElement("label");
gridTitleElement.classList.add("grid-title");
gridTitleElement.classList.add("grid-title-"+key);
gridTitleElement.innerHTML = gridTitle
parentElement.prepend(newTable);
parentElement.prepend(gridTitleElement);
}
function generateTableRows(newTable, key, data, value, finalHeading){
for (let i = 0; i < 2; i++) {
let newRow = document.createElement("tr");
if (i == 0) {
for (let j = 0; j < value.length; j++) {
let newColHeader = document.createElement("th");
newColHeader.innerHTML = value[j];
newRow.appendChild(newColHeader);
if (j == value.length - 1) {
let lastHeader = document.createElement("th");
lastHeader.innerHTML = finalHeading;
lastHeader.classList.add("lastHeader");
lastHeader.classList.add("lastHeader-" + key);
newRow.appendChild(lastHeader);
}
}
} else {
for (let j = 0; j < data.length; j++) {
let newColData = document.createElement("td");
newColData.innerHTML = data[j];
newRow.appendChild(newColData);
if (j == data.length - 1) {
let finalVal = values[key];
let finalResultData = document.createElement("td");
finalResultData.style.color = "limegreen";
finalResultData.innerHTML = finalVal;
newRow.appendChild(finalResultData);
}
}
}
newTable.appendChild(newRow);
}
}
function addGridDescription() {}
function updateResults() {
engOrdElement = document.getElementById("EnglishOrdinal");
revEngOrdElement = document.getElementById("ReverseEnglishOrdinal");
fullReductionElement = document.getElementById("FullReduction");
engOrdElement.innerHTML = values["English"];
revEngOrdElement.innerHTML = values["Reverse"];
fullReductionElement.innerHTML = values["Full"];
}
function pushValueToArrays(value) {
EnglishOrdinal.push(EnglishOrdinalDefinitions[value]);
ReverseEnglishOrdinal.push(ReverseEnglishOrdinalDefinitions[value]);
FullReduction.push(FullReductionDefinitions[value]);
}
function combineValues(arr) {
let finalResult = 0;
for (let i = 0; i < arr.length; i++) {
finalResult += arr[i];
}
return finalResult;
}
function copyObject(value){
return JSON.parse(JSON.stringify(value));
}
let element = document.getElementById("submit");
element.addEventListener("click", submit);
$(document).on("keypress", function (e) {
if (e.which == 13) {
submit();
}
});
Raw
scripts
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
Raw
style.css
body{
background-color:black;
}
div {
color:white;
}
.result {
display:inline-block;
width:10%;
vertical-align:top;
}
.text-result {
}
table {
font-family: arial, sans-serif;
border-collapse: collapse;
margin:10px;
font-size:13pt
/* width: 100%; */
}
td, th {
border: 1px solid #dddddd;
text-align: center;
width: 50px;
height: 25px;
}
.grid-title {
margin-top:-15px;
margin-bottom:-15px;
}
.text-result-English {color:#48D1CC}
.text-result-Reverse {color:#6495ED}
.text-result-Full {color:#00FA9A}
.grid-title-English {color:#48D1CC}
.grid-title-Reverse {color:#6495ED}
.grid-title-Full {color:#00FA9A}
th {
color: #DCDCDC
}
.scrollcontainer{
width:50%;
height: 500px;
overflow-y:scroll;
display: inline-block;
}
.lastHeader {
font-size:9pt;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment