js-plus-plus/frontend.js

392 lines
11 KiB
JavaScript
Raw Normal View History

2024-03-31 14:43:25 -05:00
// Created by Samuel Lord (NodeMixaholic/Sparksammy)
// Licensed under Samuel Public License with <3
2024-02-28 18:40:33 -06:00
2024-03-31 14:43:25 -05:00
// Functions for commonly used elements
2024-02-28 18:40:33 -06:00
2024-03-31 16:10:45 -05:00
//Convert markdown to HTML and back
function markdownToHTML(markdown) {
// Replace headers (h1, h2, h3) with corresponding HTML tags
markdown = markdown.replace(/^# (.*$)/gim, '<h1>$1</h1>');
markdown = markdown.replace(/^## (.*$)/gim, '<h2>$1</h2>');
markdown = markdown.replace(/^### (.*$)/gim, '<h3>$1</h3>');
// Replace bold and italic text with corresponding HTML tags
markdown = markdown.replace(/\*\*(.*)\*\*/gim, '<b>$1</b>');
markdown = markdown.replace(/\*(.*)\*/gim, '<i>$1</i>');
// Replace unordered list items with HTML list tags
2024-03-31 16:42:50 -05:00
markdown = markdown.replace(/\* (.*?)(\n|$)/gim, '<li>$1</li>');
2024-03-31 16:10:45 -05:00
// Replace inline code with HTML <code> tag
markdown = markdown.replace(/`(.*?)`/gim, '<code>$1</code>');
// Replace blockquotes with HTML <blockquote> tag
markdown = markdown.replace(/^\s*> (.*)$/gim, '<blockquote>$1</blockquote>');
// Replace horizontal rules with HTML <hr> tag
markdown = markdown.replace(/^\s*[-*_]{3,}\s*$/gim, '<hr>');
// Replace line breaks with HTML <br> tag
markdown = markdown.replace(/\n$/gim, '<br>');
// Replace images with HTML <img> tag
markdown = markdown.replace(/!\[(.*?)\]\((.*?)\)/gim, '<img alt="$1" src="$2">');
// Replace links with HTML <a> tag
markdown = markdown.replace(/\[(.*?)\]\((.*?)\)/gim, '<a href="$2">$1</a>');
2024-03-31 16:32:30 -05:00
markdown = markdown.replaceAll("<ol><ul>", "")
2024-03-31 16:31:45 -05:00
2024-03-31 16:32:30 -05:00
markdown = markdown.replaceAll("</ul></ol>", "")
2024-03-31 16:10:45 -05:00
return markdown;
}
function htmlToMarkdown(html) {
// Replace headers (h1, h2, h3) with corresponding Markdown tags
html = html.replace(/<h1>(.*?)<\/h1>/gim, '# $1');
html = html.replace(/<h2>(.*?)<\/h2>/gim, '## $1');
html = html.replace(/<h3>(.*?)<\/h3>/gim, '### $1');
// Replace bold and italic text with corresponding Markdown tags
html = html.replace(/<b>(.*?)<\/b>/gim, '**$1**');
html = html.replace(/<i>(.*?)<\/i>/gim, '*$1*');
// Replace unordered list items with Markdown list tags
html = html.replace(/<ul>(.*?)<\/ul>/gim, function(match, p1) {
let listItems = p1.trim().split('</li>');
listItems.pop();
listItems = listItems.map(item => '* ' + item.trim().replace(/<li>/gim, '')).join('\n');
return listItems;
});
// Replace ordered list items with Markdown list tags
html = html.replace(/<li>(.*?)<\/li>/gim, '* $1\n');
// Replace inline code with Markdown backticks
html = html.replace(/<code>(.*?)<\/code>/gim, '`$1`');
// Replace blockquotes with Markdown blockquote tag
html = html.replace(/<blockquote>(.*?)<\/blockquote>/gim, '> $1');
// Replace horizontal rules with Markdown horizontal rules
html = html.replace(/<hr>/gim, '---');
// Replace line breaks with Markdown line breaks
html = html.replace(/<br>/gim, '\n');
// Replace images with Markdown image syntax
html = html.replace(/<img alt="(.*?)" src="(.*?)">/gim, '![$1]($2)');
// Replace links with Markdown link syntax
html = html.replace(/<a href="(.*?)">(.*?)<\/a>/gim, '[$2]($1)');
html = html.replaceAll("<ol><ul>", "")
html = html.replaceAll("</ul></ol>", "")
return html;
}
2024-03-31 14:43:25 -05:00
// Generalized element creation
function createElement(tagName, elementID, attributes = {}) {
const element = document.createElement(tagName);
element.id = elementID;
for (const [name, value] of Object.entries(attributes)) {
element.setAttribute(name, value);
}
document.body.appendChild(element);
return element;
2024-02-28 18:40:33 -06:00
}
2024-03-31 14:43:25 -05:00
function createDiv(elementID) {
createElement("div", elementID);
2024-03-09 13:56:28 -06:00
}
2024-03-31 14:43:25 -05:00
function createParagraph(elementID, text) {
let elem = createElement("p", elementID);
elem.innerText = `${text}`
2024-03-31 14:44:30 -05:00
return elem
2024-02-28 18:40:33 -06:00
}
2024-04-06 19:39:19 -05:00
function initHead(pageTitle = "") {
// Create head element
let head = document.createElement("head");
// Create title element
let titleElement = document.createElement("title");
titleElement.textContent = pageTitle;
// Create link element for app icon
let appIcon = document.createElement("link");
appIcon.rel = "apple-touch-icon";
appIcon.sizes = "180x180";
appIcon.href = "icon.png";
// Create link element for favicon
let favicon = document.createElement("link");
favicon.rel = "icon";
favicon.type = "image/png";
favicon.href = "icon.png";
// Append title, app icon, and favicon to the head element
head.appendChild(titleElement);
head.appendChild(appIcon);
head.appendChild(favicon);
// Append head element to the document
document.documentElement.insertBefore(head, document.documentElement.firstChild);
}
2024-03-31 16:53:37 -05:00
function initBody(bodyID = "body") {
2024-03-31 16:51:39 -05:00
// Create a new body element with the desired id
const newBody = document.createElement("body");
newBody.id = bodyID;
// Get a reference to the existing body element (if any)
const oldBody = document.body;
// Replace the existing body (if present) with the new one
if (oldBody) {
document.documentElement.replaceChild(newBody, oldBody);
} else {
// Simply append the new body if none exists
document.documentElement.appendChild(newBody);
}
2024-03-31 16:46:31 -05:00
}
2024-03-31 14:51:40 -05:00
function createButton(elementID, text, attributes = {}) {
2024-03-31 14:46:53 -05:00
let elem = createElement("button", elementID);
elem.innerText = `${text}`
2024-03-31 14:51:40 -05:00
for (const [name, value] of Object.entries(attributes)) {
elem.setAttribute(name, value);
}
2024-03-31 14:46:53 -05:00
return elem;
2024-02-28 18:40:33 -06:00
}
2024-03-31 14:51:40 -05:00
function changeAttributes(elem, attributes = {}) {
for (const [name, value] of Object.entries(attributes)) {
elem.setAttribute(name, value);
}
}
2024-03-31 14:43:25 -05:00
function createImage(elementID, src) {
2024-03-31 14:44:30 -05:00
return createElement("img", elementID, { src: src });
2024-02-28 18:40:33 -06:00
}
2024-03-31 14:43:25 -05:00
// Get URL parameters
function getURLParameters() {
return new URLSearchParams(window.location.search);
2024-02-28 18:40:33 -06:00
}
2024-03-31 14:43:25 -05:00
// Read file contents
function readFileContents(file) {
file = file.toString();
const fileToRead = new File([""], file);
const reader = new FileReader();
return new Promise((resolve, reject) => {
reader.onload = () => resolve(reader.result);
reader.onerror = () => reject(reader.error);
reader.readAsText(fileToRead, "UTF-8");
});
2024-02-28 18:40:33 -06:00
}
2024-03-31 14:43:25 -05:00
// Read data file as data URL
function readDataFile(file) {
file = file.toString();
const fileToRead = new File([""], file);
const reader = new FileReader();
return new Promise((resolve, reject) => {
reader.onload = () => resolve(reader.result);
reader.onerror = () => reject(reader.error);
reader.readAsDataURL(fileToRead);
});
2024-02-28 18:40:33 -06:00
}
2024-03-31 14:43:25 -05:00
function writeToBody(html) {
document.body.innerHTML += html.toString();
2024-02-28 18:40:33 -06:00
}
2024-03-31 14:43:25 -05:00
function overwriteBody(html) {
document.body.innerHTML = html.toString();
2024-02-28 18:40:33 -06:00
}
2024-03-31 14:43:25 -05:00
function randomPOS(elementID) {
const top = Math.floor(Math.random() * 90);
const left = Math.floor(Math.random() * 90);
document.getElementById(elementID).style.top = `${top}%`;
document.getElementById(elementID).style.left = `${left}%`;
2024-02-28 18:40:33 -06:00
}
2024-03-31 14:43:25 -05:00
function pos(elementID, x, y) {
document.getElementById(elementID).style.top = `${y}%`;
document.getElementById(elementID).style.left = `${x}%`;
2024-02-28 18:40:33 -06:00
}
2024-03-31 14:43:25 -05:00
// Select a random value in an array (handles non-arrays)
function randomSelectArray(array) {
if (Array.isArray(array)) {
const randomIndex = Math.floor(Math.random() * array.length);
return array[randomIndex];
} else {
console.log(`Error: ${array} is not an Array!`);
return null; // Or throw an error
}
2024-02-28 18:40:33 -06:00
}
2024-03-31 14:43:25 -05:00
function sleep(ms) {
return new Promise(resolve => setTimeout(resolve, ms));
2024-02-28 18:40:33 -06:00
}
2024-03-31 14:43:25 -05:00
async function asyncSleep(ms) {
await new Promise(r => setTimeout(r, ms));
2024-02-28 18:40:33 -06:00
}
2024-03-31 14:43:25 -05:00
// Check if a variable is a function
function isFunction(item) {
return typeof item === 'function';
2024-02-28 18:40:33 -06:00
}
2024-03-31 14:43:25 -05:00
function applyCSS(elementID, prop, value) {
document.getElementById(elementID).style[prop] = value;
2024-02-28 18:40:33 -06:00
}
2024-03-31 14:43:25 -05:00
function writeTimeAndDate(elementID, hourFormat) {
const element = document.getElementById(elementID);
const date = new Date();
const locale = hourFormat === 24 ? "en-GB" : "en-US";
element.innerText = date.toLocaleString(locale);
2024-02-28 18:40:33 -06:00
}
2024-03-31 14:43:25 -05:00
function writeText(elementID, str) {
document.getElementById(elementID).innerText = String(str);
2024-02-28 18:40:33 -06:00
}
2024-03-31 14:43:25 -05:00
function writeHTML(elementID, str) {
document.getElementById(elementID).innerHTML = String(str);
2024-02-28 18:40:33 -06:00
}
function clearPage() {
2024-03-31 14:43:25 -05:00
document.body.innerHTML = "";
2024-02-28 18:40:33 -06:00
}
2024-03-31 14:43:25 -05:00
function createList(listID, items) {
const list = document.createElement("ul");
list.id = listID;
document.body.appendChild(list);
items.forEach(item => (list.innerHTML += `<li>${item}</li>`));
2024-02-28 18:40:33 -06:00
}
function addToList(listID, jsArray) {
2024-03-09 13:56:28 -06:00
let listParent = document.getElementById(listID);
2024-02-28 18:40:33 -06:00
jsArray.forEach(item => {
2024-03-09 13:56:28 -06:00
listParent.innerHTML += `<li>${item}</li>`;
});
2024-02-28 18:40:33 -06:00
}
2024-03-09 13:56:28 -06:00
// Gets the value of an attribute
2024-02-28 18:40:33 -06:00
// Example: getAttribute(document.getElementById("link"), "href");
function getAttribute(el, att) {
2024-03-01 17:50:42 -06:00
let result = el.getAttribute(att);
2024-02-28 18:40:33 -06:00
return result;
}
// Show/Hide Elements
// Example: hideShow(el)
function hideShow(el) {
if (el.style.display == 'none') {
el.style.display = '';
} else{
el.style.display = 'none';
}
}
// Example: fadeOut(el, 1000)
function fadeOut(el, ms) {
2024-03-09 13:56:28 -06:00
let elem = getElementById(el);
ms = parseInt(ms);
2024-02-28 18:40:33 -06:00
for (i = 0; i < (ms + 1); i++) {
2024-03-09 13:56:28 -06:00
elem.style.opacity -= (i / 100);
sleep(1);
2024-02-28 18:40:33 -06:00
}
}
// Example: fadeIn(el, 1000);
function fadeIn(el, ms) {
2024-03-09 13:56:28 -06:00
elem = getElementById(el);
2024-02-28 18:40:33 -06:00
elem.style.opacity = 0;
ms = parseInt(ms);
for (i = 0; i < (ms + 1); i++) {
2024-03-09 13:56:28 -06:00
elem.style.opacity += (i / 100);
sleep(1);
2024-02-28 18:40:33 -06:00
}
}
2024-03-09 13:56:28 -06:00
2024-02-28 18:40:33 -06:00
function spin(el, ms){
2024-03-09 13:56:28 -06:00
elem = getElementById(el);
2024-03-31 14:43:25 -05:00
for (i = 0; i < (ms / 361); i++) {
2024-02-28 18:40:33 -06:00
elem.style.transform = 'rotate(' + i + 'deg)';
}
}
//Eval alternative
//Example: exec("alert('Hello, world!')")
function exec(jsCode) {
2024-03-09 13:56:28 -06:00
let js = jsCode.toString();
2024-03-31 16:19:13 -05:00
Function(js)()
2024-02-28 18:40:33 -06:00
}
2024-03-31 15:47:52 -05:00
2024-03-31 16:22:27 -05:00
function readInternetText(url) {
var request = new XMLHttpRequest(); // Create a new XMLHttpRequest object
request.open('GET', url, false); // Open the request with synchronous mode
request.send(null); // Send the request with no additional data
if (request.status === 200) { // Check if the request was successful
return request.responseText; // Return the response text
} else {
return 'Error: ' + request.status; // Return an error message if the request failed
}
}
2024-03-31 16:23:41 -05:00
2024-03-01 17:50:42 -06:00
function requir3(jsURL) {
let req = readInternetText(jsURL);
exec(req);
2024-02-28 18:40:33 -06:00
}
// Example: getFileSize(path/to/file)
function getFileSize(file) {
file = file.toString();
2024-03-01 17:50:42 -06:00
file = new File([""], file);
2024-02-28 18:40:33 -06:00
return file.getFileSize;
}
function lastModified(file) {
file = file.toString();
2024-03-01 17:50:42 -06:00
file = new File([""], file);
2024-02-28 18:40:33 -06:00
return file.lastModified;
}
2024-03-10 14:43:59 -05:00
// Example: playAudio("https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3", 0.4);
2024-02-28 18:40:33 -06:00
function playAudio(audio, speed) {
2024-03-01 17:50:42 -06:00
let ma = new Audio(audio);
2024-02-28 18:40:33 -06:00
ma.playbackRate = speed;
2024-03-09 13:56:28 -06:00
ma.play();
2024-02-28 18:40:33 -06:00
}
// Example: redir(url);
function redir(url) {
window.location.href = url.toString();
}
2024-03-31 15:47:52 -05:00
requir3("https://cdn.jsdelivr.net/npm/gun/gun.js") //Add Gun.JS support.
2024-03-31 16:16:09 -05:00
function initGun(relays = []) {
return Gun(relays)
}