Improved injected css

This commit is contained in:
keplyx 2020-01-27 22:45:22 +01:00
parent 3916d2d2d1
commit a3f01a483f

View file

@ -15,27 +15,42 @@ const PLANEX_URL = 'http://planex.insa-toulouse.fr/';
const CUSTOM_CSS_GENERAL = 'https://srv-falcon.etud.insa-toulouse.fr/~amicale_app/custom_css/planex/customMobile2.css'; const CUSTOM_CSS_GENERAL = 'https://srv-falcon.etud.insa-toulouse.fr/~amicale_app/custom_css/planex/customMobile2.css';
const CUSTOM_CSS_NIGHTMODE = 'https://srv-falcon.etud.insa-toulouse.fr/~amicale_app/custom_css/planex/customDark2.css'; const CUSTOM_CSS_NIGHTMODE = 'https://srv-falcon.etud.insa-toulouse.fr/~amicale_app/custom_css/planex/customDark2.css';
// Remove transparency to planex items to prevent invisible items // JS + JQuery functions used to remove alpha from events. Copy paste in browser console for quick testing
const REMOVE_ALPHA_FUNCTION_INJECTED = // function removeAlpha(node) {
'function removeAlpha() {' + // console.log(node);
' $(".fc-event-container .fc-event").each(function(index) {' + // let bg = node.css("background-color");
' let bg = $(this).css("background-color");' + // if (bg.match("^rgba")) {
' if (bg.match("^rgba")) {' + // let a = bg.slice(5).split(',');
' let a = bg.slice(5).split(\',\');' + // let newBg ='rgb(' + a[0] + ',' + parseInt(a[1]) + ',' + parseInt(a[2]) + ')';
' let newBg = \'rgb(\' + a[0] + \',\' + parseInt(a[1]) + \',\' + parseInt(a[2]) + \')\';' + // node.css("background-color", newBg);
' $(this).css("background-color", newBg);' + // }
' };' + // }
' });' + // let observer = new MutationObserver(function(mutations) {
'}'; // for (let i = 0; i < mutations.length; i++) {
// if (mutations[i]['addedNodes'].length > 0 && $(mutations[i]['addedNodes'][0]).hasClass("fc-event"))
// removeAlpha($(mutations[i]['addedNodes'][0]))
// }
// });
// observer.observe(document.querySelector(".fc-body"), {attributes: false, childList: true, characterData: false, subtree:true});
// Watch for changes in the calendar and call the remove alpha function // Watch for changes in the calendar and call the remove alpha function
const OBSERVE_MUTATIONS_INJECTED = const OBSERVE_MUTATIONS_INJECTED =
'let observer = new MutationObserver(function(mutations) {' + 'function removeAlpha(node) {\n' +
' removeAlpha();' + ' console.log(node);\n' +
'});' + ' let bg = node.css("background-color");\n' +
'observer.observe(document.querySelector(".fc-body"), {attributes: false, childList: true, characterData: false, subtree:true});'; ' if (bg.match("^rgba")) {\n' +
' let a = bg.slice(5).split(\',\');\n' +
' let newBg =\'rgb(\' + a[0] + \',\' + parseInt(a[1]) + \',\' + parseInt(a[2]) + \')\';\n' +
' node.css("background-color", newBg);\n' +
' }\n' +
'}' +
'let observer = new MutationObserver(function(mutations) {\n' +
' for (let i = 0; i < mutations.length; i++) {\n' +
' if (mutations[i][\'addedNodes\'].length > 0 && $(mutations[i][\'addedNodes\'][0]).hasClass("fc-event"))\n' +
' removeAlpha($(mutations[i][\'addedNodes\'][0]))\n' +
' }\n' +
'});\n' +
'observer.observe(document.querySelector(".fc-body"), {attributes: false, childList: true, characterData: false, subtree:true});\n';
/** /**
* Class defining the app's planex screen. * Class defining the app's planex screen.
* This screen uses a webview to render the planex page * This screen uses a webview to render the planex page
@ -48,7 +63,6 @@ export default class PlanexScreen extends React.Component<Props> {
super(); super();
this.customInjectedJS = this.customInjectedJS =
'$(document).ready(function() {' + '$(document).ready(function() {' +
REMOVE_ALPHA_FUNCTION_INJECTED +
OBSERVE_MUTATIONS_INJECTED + OBSERVE_MUTATIONS_INJECTED +
'$("head").append(\'<meta name="viewport" content="width=device-width, initial-scale=1.0">\');' + '$("head").append(\'<meta name="viewport" content="width=device-width, initial-scale=1.0">\');' +
'$("head").append(\'<link rel="stylesheet" href="' + CUSTOM_CSS_GENERAL + '" type="text/css"/>\');'; '$("head").append(\'<link rel="stylesheet" href="' + CUSTOM_CSS_GENERAL + '" type="text/css"/>\');';