vergnet/application-amicale
5
5
Fork 5
Code Issues Pull requests Releases Wiki Activity

Forced planex items background to be opaque

Browse source
This commit is contained in:
keplyx 2019-11-10 18:10:24 +01:00
parent b425555da9
commit 06eba3fb9c
1 changed files with 35 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

40
screens/PlanexScreen.js
View file

@ -15,6 +15,27 @@ 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
const REMOVE_ALPHA_FUNCTION_INJECTED =
'function removeAlpha() {' +
' $(".fc-event-container .fc-event").each(function(index) {' +
' let bg = $(this).css("background-color");' +
' if (bg.match("^rgba")) {' +
' let a = bg.slice(5).split(\',\');' +
' let newBg = \'rgb(\' + a[0] + \',\' + parseInt(a[1]) + \',\' + parseInt(a[2]) + \')\';' +
' $(this).css("background-color", newBg);' +
' };' +
' });' +
'}';
// Watch for changes in the calendar and call the remove alpha function
const OBSERVE_MUTATIONS_INJECTED =
'let observer = new MutationObserver(function(mutations) {' +
' removeAlpha();' +
'});' +
'observer.observe(document.querySelector(".fc-body"), {attributes: false, childList: true, characterData: false, subtree:true});';
/** /**
* 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
@ -26,12 +47,21 @@ export default class PlanexScreen extends React.Component<Props> {
constructor() { constructor() {
super(); super();
this.customInjectedJS = this.customInjectedJS =
'document.querySelector(\'head\').innerHTML += \'<meta name="viewport" content="width=device-width, initial-scale=1.0">\';' + '$(document).ready(function() {' +
'document.querySelector(\'head\').innerHTML += \'<link rel="stylesheet" href="' + CUSTOM_CSS_GENERAL + '" type="text/css"/>\';' + REMOVE_ALPHA_FUNCTION_INJECTED +
'$(".fc-toolbar .fc-center").append(\'<p id="rotateToLandscape">' + i18n.t("planexScreen.rotateToLandscape") + '</p>\');' + OBSERVE_MUTATIONS_INJECTED +
'$(".fc-toolbar .fc-center").append(\'<p id="rotateToPortrait">' + i18n.t("planexScreen.rotateToPortrait") + '</p>\');true;'; '$("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"/>\');';
if (ThemeManager.getNightMode()) if (ThemeManager.getNightMode())
this.customInjectedJS += 'document.querySelector(\'head\').innerHTML += \'<link rel="stylesheet" href="' + CUSTOM_CSS_NIGHTMODE + '" type="text/css"/>\';'; this.customInjectedJS += '$("head").append(\'<link rel="stylesheet" href="' + CUSTOM_CSS_NIGHTMODE + '" type="text/css"/>\');';
this.customInjectedJS +=
'$(".fc-toolbar .fc-center").append(\'<p id="rotateToLandscape">' + i18n.t("planexScreen.rotateToLandscape") + '</p>\');' +
'$(".fc-toolbar .fc-center").append(\'<p id="rotateToPortrait">' + i18n.t("planexScreen.rotateToPortrait") + '</p>\');' +
'removeAlpha();' +
'});true;'; // Prevent crash on ios
} }
render() { render() {