Skip to content

Commit

Permalink
Work in progress, progressing on new darkening way
Browse files Browse the repository at this point in the history
  • Loading branch information
ThomazPom committed Nov 7, 2024
1 parent 5a4cb22 commit 4ef9975
Show file tree
Hide file tree
Showing 4 changed files with 85 additions and 13 deletions.
14 changes: 9 additions & 5 deletions background.js
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,7 @@ class uDarkC extends uDarkExtended {
regex_search_for_url_raw = /url\(\s*?(('.+?(?<!\\)'|(".+?(?<!\\)")|[^\)'"]*)\s*?)\)/gsi
background_match = /background|sprite|(?<![a-z])(bg|box|panel|fond|fundo|bck)(?![a-z])/i
logo_match = /nav|avatar|logo|icon|alert|notif|cart|menu|tooltip|dropdown|control/i
background_color_css_properties_regex = /color|fill|box-shadow|border|^background(?:-image|-color)?$|^--ud-ptd-background/ // Background images can contain colors // css properties that are background colors
background_color_css_properties_regex = /color|fill|(?:box|text)-shadow|border|^background(?:-image|-color)?$|^--ud-ptd-background/ // Background images can contain colors // css properties that are background colors

exactAtRuleProtect = true
matchAllCssCommentsRegex = /\/\*[^*]*\*+([^/*][^*]*\*+)*\/|\/\*[^*]*\*+([^/*][^*]*\*+)*|\/\*[^*]*(\*+[^/*][^*]*)*/g
Expand Down Expand Up @@ -350,7 +350,7 @@ class uDarkC extends uDarkExtended {
}
}
}
functionPrototypeEditor(leType, laFonction, watcher = x => x, conditon = x => x, result_editor = x => x, getter) {
functionPrototypeEditor(leType, laFonction, watcher = x => x, conditon = x => x, result_editor = x => x) {
// console.log(leType,leType.name,leType.prototype,laFonction,laFonction.name)
if (laFonction.concat) {
return laFonction.forEach(aFonction => {
Expand Down Expand Up @@ -378,11 +378,11 @@ class uDarkC extends uDarkExtended {
Object.defineProperty(leType.prototype, laFonction.name, {
value: {
[laFonction.name]: exportFunction(function() {
if (conditon === true || conditon(this, arguments)) {
if (conditon === true || conditon.apply(this, arguments)) { // if a standard function is provided, it will will be able to use the 'this' keyword
// console.log("Setting",leType,laFonction,this,arguments[0],watcher(this, arguments)[0])
let watcher_result = watcher(this, arguments);
// console.log("watcher_result", this,originalFunction,watcher_result,originalFunctionKey,leType.prototype[originalFunctionKey],this[originalFunctionKey],this.getP);
let result = originalFunction.apply(this, watcher_result)
let result = originalFunction.apply(this, watcher_result) // if a standard function is provided, it will will be able to use the 'this' keyword
return result_editor(result, this, arguments, watcher_result);
} else {
return (originalFunction.apply(this, arguments));
Expand Down Expand Up @@ -674,6 +674,7 @@ class uDarkC extends uDarkExtended {
}

frontEditHTML(elem, strO, details, options = {}) {

// 1. Ignore <script> elements to prevent unintended modifications to JavaScript
let str = strO;
if (elem instanceof HTMLScriptElement) {
Expand Down Expand Up @@ -729,7 +730,7 @@ class uDarkC extends uDarkExtended {
createDocumentFromHtml(html) {
// Use DOMParser to convert the HTML string into a DOM document
const parser = new DOMParser();
return parser.parseFromString(html, "text/html");
return parser.p_ud_parseFromString(html, "text/html");
}

processSvgElements(documentElement, details) {
Expand Down Expand Up @@ -1733,10 +1734,13 @@ class AllLevels {
CSSStyleSheet.prototype.p_ud_replaceSync = CSSStyleSheet.prototype.replaceSync;
CSSStyleSheet.prototype.p_ud_insertRule = CSSStyleSheet.prototype.insertRule;

DOMParser.prototype.p_ud_parseFromString = DOMParser.prototype.parseFromString;

uDark.createInternalProperty(Element, "innerHTML");
uDark.createInternalProperty(ShadowRoot, "innerHTML");
uDark.createInternalProperty(CSS2Properties, "backgroundColor");
uDark.createInternalProperty(Navigator, "serviceWorker", navigator.serviceWorker != undefined);

}

{
Expand Down
19 changes: 15 additions & 4 deletions contentScriptClass.js
Original file line number Diff line number Diff line change
Expand Up @@ -151,7 +151,7 @@ class uDarkExtendedContentScript {
);
args[1] = res;
return args;
}, (elem, args) => args[0].toLowerCase() == "style")
}, (attribute, value ) => attribute.toLowerCase() == "style")

uDark.valuePrototypeEditor(HTMLImageElement, "src", (image, value) => {
let res = uDark.image_element_prepare_href(image, document, value);
Expand All @@ -166,6 +166,7 @@ class uDarkExtendedContentScript {

);


uDark.valuePrototypeEditor(SVGImageElement, "href", (image, value) => { // the <image> tag inside an SVG, no an <img> tag !
return uDark.image_element_prepare_href(image, document, value);
});
Expand All @@ -185,7 +186,6 @@ class uDarkExtendedContentScript {
elem.addEventListener("load", uDark.do_idk_mode);
}
})

// uDark.valuePrototypeEditor(HTMLLinkElement, "integrity", (elem, value) => {
// console.log("CSS integrity set", elem, value);
// return value;
Expand Down Expand Up @@ -246,13 +246,24 @@ class uDarkExtendedContentScript {
// return x;

// })
uDark.functionPrototypeEditor(Node, [


uDark.functionPrototypeEditor(DOMParser, DOMParser.prototype.parseFromString, (elem, args) => {
// Catching the parsing of the document, to edit it before it's inserted in the DOM, is in the philosophy of UltimaDark of doing things at key moments.
// parseFromString is a key moment, as it manipulates strings. insertBefore, used with an instanciated element for instance is not a key moment, as we could have edited the element before.
args[0]=uDark.frontEditHTML("ANY_ELEMENT",args[0])
return args
}, (text,type) => type == "text/html")



uDark.functionPrototypeEditor(Node, [ // So far we assume the CSS inserted in HTMStyleElements via appendChild or insertBefore are valid. This migh not always be the case, this is to keep in mind.
Node.prototype.appendChild,
Node.prototype.insertBefore
], (elem, args) => {
(args[0].o_ud_textContent = uDark.edit_str(args[0].textContent));
return args
}, (elem, value) => elem instanceof HTMLStyleElement)
}, function(){ return this instanceof HTMLStyleElement})


/******************** BUT ********************** */
Expand Down
11 changes: 7 additions & 4 deletions inject_css_override_no_edit.css
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,15 @@
:root {
--uDark_darken_A: 0.4;
--uDark_darken_B: 0.1;
--uDark_transform_darken: calc(min( var(--uDark_darken_calc_low) , var(--uDark_darken_calc_high) ));
--demo-background: hsl(from red h s var(--uDark_transform_darken));
--uDark_treshold: 0.2;
--uDark_transform_darken: calc(min( var(--uDark_darken_calc_low) , var(--uDark_darken_calc_high) ));
--uDark_transform_darken_treshold:calc(min(var(--uDark_darken_calc_low) , var(--uDark_darken_calc_high) ) * var(--uDark_isOverTreshold) + l * (1 - var(--uDark_isOverTreshold))) ;
--demo-background: red;
--uDark_darken_calc_low: 2 * var(--uDark_darken_A) * l;
--uDark_darken_calc_high: ( 2 * (var(--uDark_darken_B) - var(--uDark_darken_A)) * l + 100 * (2 * var(--uDark_darken_A) - var(--uDark_darken_B)));
--demo-color: hsl(from var(--demo-background) h s var(--uDark_transform_darken));
--uDark_isOverTreshold: clamp( 0, calc( l - var(--uDark_treshold) * 100 + 0.01 ) * infinity ,1); /* 0 if under treshold, 1 if over treshold, + 0.01 avoids a bug on precise values */

}
:root {
--uDark_lighten_A: 0.65;
Expand Down Expand Up @@ -39,8 +44,6 @@ iframe,embed,object,video {
:root{
color-scheme: dark!important; /*Force dark color scheme:
This is sensible to other elements being color-schemed in css, be we have a replace in background css editing for these cases.*/
--ud-failed-idktwice-ceilbrightness:160 /* When udark failed, idk mode failed we are in idktwice mode, and in this mode exists a function ceilBrightness
This functions aims at a last resort to make the color at least not too bright. This variable is the maximum value for the brightness of the color in this case. */
}


Expand Down
54 changes: 54 additions & 0 deletions other-tools-and-tests/tools/monitorDomEdits.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,54 @@
methodsToMonitor = [
'appendChild', 'assign', 'cloneNode', 'createElement', 'createTextNode',
'insertBefore', 'replaceChild',
'replaceWith', 'setAttribute', 'adoptNode', 'importNode', 'append',
'insertAdjacentElement', 'insertAdjacentHTML','innerHTML','outerHTML'
];

// Function to wrap a prototype method with logging
function wrapMethod(proto, methodName) {
const originalMethod = proto[methodName]
proto[methodName] = function (...args) {
let mres = originalMethod.apply(this, args);
console.log(`Called ${methodName} with arguments:`, args,"on",this,"res:",mres);
return mres;
};
}

// Function to wrap properties (like innerHTML, outerHTML) with a getter/setter
function wrapProperty(proto, propertyName) {
const descriptor = Object.getOwnPropertyDescriptor(proto, propertyName);

if (descriptor && (descriptor.get || descriptor.set)) {
Object.defineProperty(proto, propertyName, {
get() {
return descriptor.get && descriptor.get.call(this);
},
set(value) {
console.log(`Setting ${propertyName} to:`, value,"on",this);
if (descriptor.set) {
descriptor.set.call(this, value);
}
}
});
}
}

// Detect the appropriate prototype for each method or property and wrap it
function monitorDOMMutations() {
methodsToMonitor.forEach((name) => {
if (name === 'innerHTML' || name === 'outerHTML') {
wrapProperty(Element.prototype, name);
}
else if (name in HTMLElement.prototype) {
wrapMethod(HTMLElement.prototype, name);
} else if (name in Document.prototype) {
wrapMethod(Document.prototype, name);
} else if (name in Node.prototype) {
wrapMethod(Node.prototype, name);
}
});
}

// Run the monitor setup
monitorDOMMutations();

0 comments on commit 4ef9975

Please sign in to comment.