Skip to content

Instantly share code, notes, and snippets.

View Danny-Engelman's full-sized avatar
💭
working on HexedLand

Danny Engelman Danny-Engelman

💭
working on HexedLand
View GitHub Profile
@Danny-Engelman
Danny-Engelman / customElements.define.js
Created July 15, 2023 07:35
A customElements.define basic template
customElements.define("", class extends HTMLElement {
constructor() {
super()
.attachShadow({ mode: "open" })
.innerHTML = `<style></style>`;
}
connectedCallback() {
this.innerHTML = ``;
}
})
customElements.define("", class extends HTMLElement {
constructor() {
super()
.attachShadow({ mode: "open" })
.innerHTML = `<style></style>`;
}
connectedCallback() {
this.innerHTML = ``;
}
})
@Danny-Engelman
Danny-Engelman / ACME BaseClass
Created July 15, 2023 07:29
A Component Making Elements - BaseClass
// ********************************************************** ACME_BaseClass
class ACME_BaseClass extends HTMLElement {
// ======================================================== ACME_BaseClass.$query
$query(
// selector is a DOM selector string eg. "div:not[id='1']"
// if starts with * then return all elements as NodeList
// if starts with ** then return all elements as Array
selector,
// optional 2nd parameter is the root element to query from
root = this.shadowRoot || this
@Danny-Engelman
Danny-Engelman / index.html
Created July 12, 2023 16:55
HTML start file
<html>
<head>
<title></title>
<script src="element.js"></script>
</head>
<body>
</body>
</html>
@Danny-Engelman
Danny-Engelman / findeElements with TreeWalker API
Created March 23, 2021 11:26
findElements with TreeWalker API
// The native TreeWalker API has been around for ages, IE9 was the last Browser to implement it ... in 2011
function log() {
console.log(`%c TreeWalker `, `background:purple;color:yellow`, ...arguments);
}
// find element takes a function definition, the output must be Truthy or Falsy
function findElements(
acceptFunc = (x) => customElements.get(x.localName) || false
) {
log("start");
console.time("TreeWalker");
<script>navigator.serviceWorker.register('sw.js').then(()=>{location.href="$/index.js"})</script>
/*
Open F12 Network Tab
Press Ctrl-Shift-I to open SECOND console window
Execute this script (runs in first Console window)
*/
const rsColor='lightgreen';
const rsStaticColor=rsColor;
const remoteColor='pink';
let remoteTime=0;
let localTime=0;
@Danny-Engelman
Danny-Engelman / 8x8 Display
Last active October 24, 2019 09:54
Character on 8x8 (LED) Display
display(letter) {
let char2bitarray = (char) => {
const font8x8 = [
[0, 0, 0, 0, 0, 0, 0, 0], // U+0020 (space)
[24, 60, 60, 24, 24, 0, 24, 0], // U+0021 (!)
[54, 54, 0, 0, 0, 0, 0, 0], // U+0022 (")
[54, 54, 127, 54, 127, 54, 54, 0], // U+0023 (#)
[12, 62, 3, 30, 48, 31, 12, 0], // U+0024 ($)
[0, 99, 51, 24, 12, 102, 99, 0], // U+0025 (%)
[28, 54, 28, 110, 59, 51, 110, 0], // U+0026 (&)
@Danny-Engelman
Danny-Engelman / SharePoint_Cisar_OpenMonocaEditor.js
Created March 15, 2019 13:51
Open SharePoint document with Monaco editor (CiSaR script)
//add script with Cisar Chrome Browser extension!
SP.SOD.executeFunc("clienttemplates.js", "SPClientTemplates", function () {
function init() {
SPClientTemplates.TemplateManager.RegisterTemplateOverrides({
Templates: {
Fields: {
"MonacoEdit": { //add internal fieldname in Document Library!!
View: function (ctx, b, item) {
var fileref = item.FileRef;
var filepath = fileref.split('/');
@Danny-Engelman
Danny-Engelman / TransalpClubForumUnread.css
Last active March 15, 2019 11:33
Style Kunena Forum Unread list
/*
CSS changes for: https://transalpclub.nl/forum/unread
apply with Stylus Browser extension (or anyway you want to add CSS)
*/
body {
/* minder witruimte rondom tekstregels */
line-height: 1em;