Strip .no-css, .csstransitions and .cssanimations

README.md

@@ -49,6 +49,7 @@ This fork has the following changes:
 * Removed Sentry (Application Monitoring and Error Tracking Software)
 * Replaced gulp-uglify with gulp-terser
 * CRLF => LF line endings
+* Ongoing removal of jQuery and Underscore.js dependencies (things are native these days)
 
 ### PHP73 branch
 

dev/App/Abstract.js

@@ -9,8 +9,7 @@ import {
 	$htmlCL,
 	leftPanelDisabled,
 	leftPanelType,
-	bMobileDevice,
-	bAnimationSupported
+	bMobileDevice
 } from 'Common/Globals';
 
 import { isNormal, pString, detectDropdownVisibility, windowResizeCallback } from 'Common/Utils';
@@ -222,7 +221,7 @@ class AbstractApp extends AbstractBoot {
 		ko.components.register('x-script', require('Component/Script').default);
 		// ko.components.register('svg-icon', require('Component/SvgIcon').default);
 
-		if (Settings.appSettingsGet('materialDesign') && bAnimationSupported) {
+		if (Settings.appSettingsGet('materialDesign') && !bMobileDevice) {
 			ko.components.register('Checkbox', require('Component/MaterialDesign/Checkbox').default);
 			ko.components.register('CheckboxSimple', require('Component/Checkbox').default);
 		} else {

dev/Common/Booter.js

@@ -47,20 +47,6 @@ const useJsNextBundle = (function() {
 })();
 /* eslint-enable */
 
-/**
- * @param {string} id
- * @param {string} name
- * @returns {string}
- */
-function getComputedStyle(id, name) {
-	const element = window.document.getElementById(id);
-	return element && element.currentStyle
-		? element.currentStyle[name]
-		: window.getComputedStyle
-		? window.getComputedStyle(element, null).getPropertyValue(name)
-		: null;
-}
-
 /**
  * @param {string} styles
  * @returns {void}
@@ -302,9 +288,6 @@ window.__runBoot = function() {
 	}
 
 	const root = window.document.documentElement;
-	if ('none' !== getComputedStyle('rl-check', 'display')) {
-		root.className += ' no-css';
-	}
 
 	if (useJsNextBundle) {
 		root.className += ' js-next';

dev/Common/Globals.js

@@ -66,12 +66,6 @@ export const bSafari = !bChrome && sUserAgent.includes('safari');
  */
 export const bMobileDevice = (/android|iphone|ipod|ipad|blackberry|mobile/i).test(sUserAgent);
 
-/**
- * @type {boolean}
- */
-export const bAnimationSupported =
-	!bMobileDevice && $htmlCL.contains('csstransitions') && $htmlCL.contains('cssanimations');
-
 /**
  * @type {boolean}
  */

dev/Settings/User/General.js

@@ -2,7 +2,6 @@ import _ from '_';
 import ko from 'ko';
 
 import { MESSAGES_PER_PAGE_VALUES } from 'Common/Consts';
-import { bAnimationSupported } from 'Common/Globals';
 
 import { SaveSettingsStep, Magics, EditorDefaultType, Layout } from 'Common/Enums';
 
@@ -53,8 +52,6 @@ class GeneralUserSettings {
 		this.editorDefaultTypeTrigger = ko.observable(SaveSettingsStep.Idle);
 		this.layoutTrigger = ko.observable(SaveSettingsStep.Idle);
 
-		this.isAnimationSupported = bAnimationSupported;
-
 		this.identities = IdentityStore.identities;
 
 		this.identityMain = ko.computed(() => {

dev/Styles/Animations.less

@@ -30,7 +30,7 @@
   100% {transform: translateX(0)}
 }
 
-html.csstransitions.rl-started-trigger.no-mobile .b-login-content .loginFormWrapper {
+html.rl-started-trigger.no-mobile .b-login-content .loginFormWrapper {
 	/*transform: scale(1.1);*/
 	transform: translateY(-20px);
 	opacity: 0.5;
@@ -44,7 +44,7 @@ html.csstransitions.rl-started-trigger.no-mobile .b-login-content .loginFormWrap
 	.transition(opacity 0.5s linear);
 }
 
-html.csstransitions.rl-started-delay {
+html.rl-started-delay {
 
 	#rl-left {
 		.transition(width 0.3s ease-out);
@@ -64,7 +64,7 @@ html.csstransitions.rl-started-delay {
 }
 
 html {
-	&.rgba.cssanimations.backgroundsize .e-strip-animation {
+	&.rgba.backgroundsize .e-strip-animation {
 		background-size: 60px 60px;
 		.rl-strip-animation(0, 0.1);
 		animation: animate-stripes 2s linear infinite;
@@ -82,7 +82,7 @@ html.rl-anim {
 		}
 	}
 
-	&.cssanimations.csstransitions.no-mobile .b-login-content .errorAnimated {
+	&.no-mobile .b-login-content .errorAnimated {
 		animation: login-form-shake 400ms ease-in-out;
 	}
 
@@ -91,35 +91,35 @@ html.rl-anim {
 		font-weight: bold;
 	}
 
-	&.cssanimations.csstransitions.no-mobile .b-login-content .afterLoginHide {
+	&.no-mobile .b-login-content .afterLoginHide {
 		opacity: 0;
 	}
 
-	&.csstransitions.no-mobile .btn-group.dropdown.colored-toggle.open .animate-this-icon-on-open {
+	&.no-mobile .btn-group.dropdown.colored-toggle.open .animate-this-icon-on-open {
 		animation: bounce-me .5s linear;
 	}
 
-	&.csstransitions.no-mobile .b-login-content .loginFormWrapper {
+	&.no-mobile .b-login-content .loginFormWrapper {
 		.transition(all 0.3s ease-out);
 	}
 
-	&.csstransitions .button-delete-transitions {
+	& .button-delete-transitions {
 		.transition(all 0.2s linear);
 	}
 
-	&.cssanimations .b-folders .e-item .anim-action-class {
+	& .b-folders .e-item .anim-action-class {
 		animation: highlight-folder-row 0.5s linear;
 	}
 
-	&.csstransitions .b-folders .btn.buttonContacts {
+	& .b-folders .btn.buttonContacts {
 		.transition(margin 0.3s linear);
 	}
 
-	&.csstransitions .b-folders .b-content.opacity-on-panel-disabled {
+	& .b-folders .b-content.opacity-on-panel-disabled {
 		.transition(opacity 0.3s linear);
 	}
 
-	&.csstransitions .messageList {
+	& .messageList {
 		.messageListItem {
 			.transition(max-height 400ms ease);
 		}
@@ -128,23 +128,23 @@ html.rl-anim {
 		}
 	}
 
-	&.csstransitions .b-list-content {
+	& .b-list-content {
 		.e-contact-item {
 			.transition(max-height 400ms ease);
 		}
 	}
 
-	&.csstransitions .modal.b-domain-content {
+	& .modal.b-domain-content {
 		.modal-body {
 			.transition(left 500ms ease);
 		}
 	}
 
-	&.csstransitions.rl-modal.rl-modal-animation .popups {
+	&.rl-modal.rl-modal-animation .popups {
 		overflow: hidden;
 	}
 
-	&.csstransitions .modal.fade {
+	& .modal.fade {
 
 		.transition(all 200ms ease-out);
 		/*transform: scale(0.95);*/
@@ -155,7 +155,7 @@ html.rl-anim {
 		}
 	}
 
-	&.cssanimations .b-compose.loading .b-header-toolbar {
+	& .b-compose.loading .b-header-toolbar {
 		background-size: 60px 60px;
 		.rl-strip-animation(255, 0.2);
 		animation: animate-stripes 2s linear infinite;

dev/Styles/Layout.less

@@ -443,10 +443,6 @@ html.rl-ctrl-key-pressed {
 	display: none;
 }
 
-#rl-check{
-	display: none;
-}
-
 .rl-content-show {
 	display: block !important;
 }

dev/Styles/Login.less

@@ -163,7 +163,7 @@
 		z-index: 1051;
 		border-radius: 8px;
 	}
-	html.cssanimations &.submitting:after{
+	html &.submitting:after{
 		content: '';
 		position: absolute;
 		width: 60px;

dev/Styles/MessageList.less

@@ -616,7 +616,7 @@ html.ssm-state-desktop-large {
 	}
 }
 
-html.cssanimations .messageList .line-loading {
+html .messageList .line-loading {
 	height: 5px !important;
 }
 

dev/Styles/MessageView.less

@@ -615,7 +615,7 @@ html.rl-bottom-preview-pane .messageView {
 	}
 }
 
-html.cssanimations .messageItem .line-loading {
+html .messageItem .line-loading {
 	height: 5px !important;
 }
 

dev/Styles/Ui.less

@@ -204,7 +204,7 @@
 	}
 }
 
-html.cssanimations {
+html {
 
 	.e-spinner {
 		display: block;

dev/Styles/_FontasticToBoot.less

@@ -179,23 +179,3 @@
 		}
 	}
 }
-
-html.no-cssanimations .icon-spinner {
-	background: none;
-	background-image: url('@{rlSyncFileStop}');
-	background-repeat: no-repeat;
-
-	border: none;
-	box-shadow: none;
-	height: 16px;
-	width: 16px;
-
-	font-family: Arial;
-	&:before {
-		content: "";
-	}
-	&.animated {
-		background: none;
-		background-image: url('@{rlSyncFile}');
-	}
-}

rainloop/v/0.0.0/app/templates/Index.html

@@ -22,7 +22,6 @@
 
 <body class="thm-body">
 	<div id="rl-app"></div>
-	<div id="rl-check"></div>
 	<script type="text/javascript" data-cfasync="false" src="{{BaseAppBootScriptLink}}"></script>
 </body>