Minimal android compatibility

Note that Samsung devices can't handle (hover: none) media query

web/share/css/keypad.css

@@ -140,7 +140,7 @@ div.keypad b {
 	color: var(--cs-key-holded-bg);
 }
 
-@media only screen and (hover: none) and (pointer: coarse) {
+@media only screen and (pointer: coarse) {
 	div.keypad {
 		zoom: 1.28 !important;
 	}

web/share/css/kvm/keyboard.css

@@ -20,7 +20,7 @@
 *****************************************************************************/
 
 
-@media only screen and (hover: none) and (pointer: coarse) {
+@media only screen and (pointer: coarse) {
 	div#keyboard-window {
 		visibility: visible !important;
 		padding-top: 9px !important;
@@ -47,7 +47,7 @@ div#keyboard-desktop {
 div#keyboard-mobile {
 	display: none;
 }
-@media only screen and (hover: none) and (pointer: coarse) {
+@media only screen and (pointer: coarse) {
 	div#keyboard-desktop {
 		display: none !important;
 	}

web/share/css/kvm/stream.css

@@ -103,7 +103,7 @@ div#stream-mouse-buttons {
 	display: none;
 }
 
-@media only screen and (hover: none) and (pointer: coarse) {
+@media only screen and (pointer: coarse) {
 	div#stream-window {
 		padding-top: 3px !important;
 		padding-bottom: 80px !important;

web/share/css/main.css

@@ -214,7 +214,7 @@ input[type=text], input[type=password] {
 	height: 30px;
 }
 
-@media only screen and (hover: none) and (pointer: coarse) and (orientation: portrait) {
+@media only screen and (pointer: coarse) and (orientation: portrait) {
 	button,
 	select,
 	input[type=text],

web/share/css/modal.css

@@ -74,7 +74,7 @@ div.modal div.modal-window div.modal-buttons button {
 	border-radius: 0;
 	height: 40px;
 }
-@media only screen and (hover: none) and (pointer: coarse) and (orientation: portrait) {
+@media only screen and (pointer: coarse) and (orientation: portrait) {
 	div.modal-buttons button {
 		height: 50px !important;
 	}

web/share/css/navbar.css

@@ -80,7 +80,7 @@ ul#navbar li a#logo:hover:not(.active),
 ul#navbar li a.menu-button:hover:not(.active) {
 	background-color: var(--cs-navbar-item-hovered-bg);
 }
-@media only screen and (hover: none) and (pointer: coarse) {
+@media only screen and (pointer: coarse) {
 	ul#navbar li a#logo:hover:not(.active),
 	ul#navbar li a.menu-button:hover:not(.active) {
 		background-color: var(--cs-navbar-default-bg) !important;

web/share/css/radio.css

@@ -45,7 +45,7 @@ div.radio-box label:not(:last-of-type) {
 	margin-right: 1px;
 	box-shadow: 1px 0 0 0 var(--cs-control-pressed-bg);
 }
-@media only screen and (hover: none) and (pointer: coarse) and (orientation: portrait) {
+@media only screen and (pointer: coarse) and (orientation: portrait) {
 	div.radio-box input[type=radio] + label {
 		height: 30px !important;
 	}

web/share/css/slider.css

@@ -42,7 +42,7 @@
 		margin-right: 0;
 	}
 }
-@media only screen and (hover: none) and (pointer: coarse) and (orientation: portrait) {
+@media only screen and (pointer: coarse) and (orientation: portrait) {
 	@supports (-webkit-appearance: none) {
 		input[type=range].slider {
 			margin: 20px 0 20px 0 !important;

web/share/css/tabs.css

@@ -53,7 +53,7 @@ div.tabs-box label {
 	position: relative;
 	top: 1px;
 }
-@media only screen and (hover: none) and (pointer: coarse) and (orientation: portrait) {
+@media only screen and (pointer: coarse) and (orientation: portrait) {
 	div.tabs-box label {
 		height: 30px !important;
 	}

web/share/css/window.css

@@ -170,7 +170,7 @@ div.window.window-full-tab button.window-button-exit-full-tab {
 	visibility: visible !important;
 }
 
-@media only screen and (hover: none) and (pointer: coarse) {
+@media only screen and (pointer: coarse) {
 	div.window {
 		padding-top: 45px !important;
 	}

web/share/js/kvm/mouse.js

@@ -129,7 +129,7 @@ export function Mouse(__getGeometry, __recordWsEvent) {
 	var __updateOnlineLeds = function() {
 		let is_captured;
 		if (__absolute) {
-			is_captured = (__stream_hovered || tools.browser.is_ios);
+			is_captured = (__stream_hovered || tools.browser.is_mobile);
 		} else {
 			is_captured = __isRelativeCaptured();
 		}

web/share/js/kvm/ocr.js

@@ -71,7 +71,7 @@ export function Ocr(__getGeometry) {
 	/************************************************************************/
 
 	self.setState = function(state) {
-		let enabled = (state && state.ocr.enabled && navigator.clipboard && !tools.browser.is_ios);
+		let enabled = (state && state.ocr.enabled && navigator.clipboard && !tools.browser.is_mobile);
 		if (enabled) {
 			let selected = tools.storage.get("stream.ocr.lang", state.ocr.langs["default"]);
 			let html = "";

web/share/js/tools.js

@@ -372,14 +372,6 @@ export var tools = new function() {
 		// Blink engine detection
 		let is_blink = ((is_chrome || is_opera) && !!window.CSS);
 
-		// iOS browsers
-		// https://stackoverflow.com/questions/9038625/detect-if-device-is-ios
-		// https://github.com/lancedikson/bowser/issues/329
-		let is_ios = (!!navigator.platform && (
-			/iPad|iPhone|iPod/.test(navigator.platform)
-			|| (navigator.platform === "MacIntel" && navigator.maxTouchPoints > 1 && !window["MSStream"])
-		));
-
 		// Any browser on Mac
 		let is_mac = ((
 			window.navigator.oscpu
@@ -391,15 +383,27 @@ export var tools = new function() {
 		// Any Windows
 		let is_win = (navigator && !!(/win/i).exec(navigator.platform));
 
+		// iOS browsers
+		// https://stackoverflow.com/questions/9038625/detect-if-device-is-ios
+		// https://github.com/lancedikson/bowser/issues/329
+		let is_ios = (!!navigator.platform && (
+			/iPad|iPhone|iPod/.test(navigator.platform)
+			|| (navigator.platform === "MacIntel" && navigator.maxTouchPoints > 1 && !window["MSStream"])
+		));
+
+		let is_android = /android/i.test(navigator.userAgent);
+
 		return {
 			"is_opera": is_opera,
 			"is_firefox": is_firefox,
 			"is_safari": is_safari,
 			"is_chrome": is_chrome,
 			"is_blink": is_blink,
-			"is_ios": is_ios,
 			"is_mac": is_mac,
 			"is_win": is_win,
+			"is_ios": is_ios,
+			"is_android": is_android,
+			"is_mobile": (is_ios || is_android),
 		};
 	};
 	self.info("Browser:", self.browser);

web/share/js/wm.js

@@ -362,7 +362,7 @@ function __WindowManager() {
 	var __organizeWindowsOnBrowserResize = function() {
 		for (let el_window of $$("window")) {
 			if (el_window.style.visibility === "visible") {
-				if (tools.browser.is_ios && el_window.classList.contains("window-resizable")) {
+				if (tools.browser.is_mobile && el_window.classList.contains("window-resizable")) {
 					// FIXME: При смене ориентации на мобильном браузере надо сбрасывать
 					// настройки окна стрима, поэтому тут стоит вот этот костыль
 					el_window.style.width = "";