More work for CSP, in particular install

Install needs testing.
https://github.com/FreshRSS/FreshRSS/issues/1075

app/install.php

@@ -616,27 +616,6 @@ function printStep1() {
 		<a class="btn btn-attention next-step confirm" data-str-confirm="<?php echo _t('install.js.confirm_reinstall'); ?>" href="?step=2" tabindex="2" ><?php echo _t('install.action.reinstall'); ?></a>
 	</form>
 
-	<script>
-		function ask_confirmation(e) {
-			var str_confirmation = this.getAttribute('data-str-confirm');
-			if (!str_confirmation) {
-				str_confirmation = "<?php echo _t('gen.js.confirm_action'); ?>";
-			}
-
-			if (!confirm(str_confirmation)) {
-				e.preventDefault();
-			}
-		}
-
-		function init_confirm() {
-			confirms = document.getElementsByClassName('confirm');
-			for (var i = 0 ; i < confirms.length ; i++) {
-				confirms[i].addEventListener('click', ask_confirmation);
-			}
-		}
-
-		init_confirm();
-	</script>
 	<?php } elseif ($res['all'] == 'ok') { ?>
 	<a class="btn btn-important next-step" href="?step=2" tabindex="1" ><?php echo _t('install.action.next_step'); ?></a>
 	<?php } else { ?>
@@ -674,7 +653,7 @@ function printStep2() {
 		<div class="form-group">
 			<label class="group-name" for="auth_type"><?php echo _t('install.auth.type'); ?></label>
 			<div class="group-controls">
-				<select id="auth_type" name="auth_type" required="required" onchange="auth_type_change(true)" tabindex="4">
+				<select id="auth_type" name="auth_type" required="required" tabindex="4">
 					<?php
 						function no_auth($auth_type) {
 							return !in_array($auth_type, array('form', 'persona', 'http_auth', 'none'));
@@ -709,48 +688,6 @@ function printStep2() {
 			</div>
 		</div>
 
-		<script>
-			function show_password() {
-				var button = this;
-				var passwordField = document.getElementById(button.getAttribute('data-toggle'));
-				passwordField.setAttribute('type', 'text');
-				button.className += ' active';
-
-				return false;
-			}
-			function hide_password() {
-				var button = this;
-				var passwordField = document.getElementById(button.getAttribute('data-toggle'));
-				passwordField.setAttribute('type', 'password');
-				button.className = button.className.replace(/(?:^|\s)active(?!\S)/g , '');
-
-				return false;
-			}
-			toggles = document.getElementsByClassName('toggle-password');
-			for (var i = 0 ; i < toggles.length ; i++) {
-				toggles[i].addEventListener('mousedown', show_password);
-				toggles[i].addEventListener('mouseup', hide_password);
-			}
-
-			function auth_type_change() {
-				var auth_value = document.getElementById('auth_type').value,
-				    password_input = document.getElementById('passwordPlain'),
-				    mail_input = document.getElementById('mail_login');
-
-				if (auth_value === 'form') {
-					password_input.required = true;
-					mail_input.required = false;
-				} else if (auth_value === 'persona') {
-					password_input.required = false;
-					mail_input.required = true;
-				} else {
-					password_input.required = false;
-					mail_input.required = false;
-				}
-			}
-			auth_type_change();
-		</script>
-
 		<div class="form-group form-actions">
 			<div class="group-controls">
 				<button type="submit" class="btn btn-important" tabindex="7" ><?php echo _t('gen.action.submit'); ?></button>
@@ -778,7 +715,7 @@ function printStep3() {
 		<div class="form-group">
 			<label class="group-name" for="type"><?php echo _t('install.bdd.type'); ?></label>
 			<div class="group-controls">
-				<select name="type" id="type" onchange="mySqlShowHide()" tabindex="1" >
+				<select name="type" id="type" tabindex="1">
 				<?php if (extension_loaded('pdo_mysql')) {?>
 				<option value="mysql"
 					<?php echo(isset($_SESSION['bd_type']) && $_SESSION['bd_type'] === 'mysql') ? 'selected="selected"' : ''; ?>>
@@ -831,19 +768,6 @@ function printStep3() {
 			</div>
 		</div>
 		</div>
-		<script>
-			function mySqlShowHide() {
-				document.getElementById('mysql').style.display = document.getElementById('type').value === 'mysql' ? 'block' : 'none';
-				if (document.getElementById('type').value !== 'mysql') {
-					document.getElementById('host').value = '';
-					document.getElementById('user').value = '';
-					document.getElementById('pass').value = '';
-					document.getElementById('base').value = '';
-					document.getElementById('prefix').value = '';
-				}
-			}
-			mySqlShowHide();
-		</script>
 
 		<div class="form-group form-actions">
 			<div class="group-controls">
@@ -897,13 +821,15 @@ case 5:
 }
 ?>
 <!DOCTYPE html>
-<html lang="fr">
+<html>
 	<head>
-		<meta charset="utf-8">
-		<meta name="viewport" content="initial-scale=1.0">
+		<meta charset="UTF-8" />
+		<meta name="viewport" content="initial-scale=1.0" />
 		<title><?php echo _t('install.title'); ?></title>
-		<link rel="stylesheet" type="text/css" media="all" href="../themes/base-theme/template.css" />
-		<link rel="stylesheet" type="text/css" media="all" href="../themes/Origine/origine.css" />
+		<link rel="stylesheet" href="../themes/base-theme/template.css?<?php echo @filemtime(PUBLIC_PATH . '/themes/base-theme/template.css'); ?>" />
+		<link rel="stylesheet" href="../themes/Origine/origine.css?<?php echo @filemtime(PUBLIC_PATH . '/themes/Origine/origine.css'); ?>" />
+		<script src="../scripts/install.js?<?php echo @filemtime(PUBLIC_PATH . '/scripts/install.js'); ?>"></script>
+		<meta name="robots" content="noindex,nofollow" />
 	</head>
 	<body>
 

p/scripts/install.js

@@ -0,0 +1,76 @@
+"use strict";
+
+function show_password() {
+	var button = this;
+	var passwordField = document.getElementById(button.getAttribute('data-toggle'));
+	passwordField.setAttribute('type', 'text');
+	button.className += ' active';
+	return false;
+}
+function hide_password() {
+	var button = this;
+	var passwordField = document.getElementById(button.getAttribute('data-toggle'));
+	passwordField.setAttribute('type', 'password');
+	button.className = button.className.replace(/(?:^|\s)active(?!\S)/g , '');
+	return false;
+}
+var toggles = document.getElementsByClassName('toggle-password');
+for (var i = 0 ; i < toggles.length ; i++) {
+	toggles[i].addEventListener('mousedown', show_password);
+	toggles[i].addEventListener('mouseup', hide_password);
+}
+
+function auth_type_change() {
+	var auth_type = document.getElementById('auth_type');
+	if (auth_type) {
+		var auth_value = auth_type.value,
+			password_input = document.getElementById('passwordPlain'),
+			mail_input = document.getElementById('mail_login');
+
+		if (auth_value === 'form') {
+			password_input.required = true;
+			mail_input.required = false;
+		} else if (auth_value === 'persona') {
+			password_input.required = false;
+			mail_input.required = true;
+		} else {
+			password_input.required = false;
+			mail_input.required = false;
+		}
+	}
+}
+var auth_type = document.getElementById('auth_type');
+if (auth_type) {
+	auth_type_change();
+	auth_type_change.addEventListener('change', auth_type_change);
+}
+
+function mySqlShowHide() {
+	var mysql = document.getElementById('mysql');
+	if (mysql) {
+		mysql.style.display = document.getElementById('type').value === 'mysql' ? 'block' : 'none';
+		if (document.getElementById('type').value !== 'mysql') {
+			document.getElementById('host').value = '';
+			document.getElementById('user').value = '';
+			document.getElementById('pass').value = '';
+			document.getElementById('base').value = '';
+			document.getElementById('prefix').value = '';
+		}
+	}
+}
+var bd_type = document.getElementById('type');
+if (bd_type) {
+	mySqlShowHide();
+	bd_type.addEventListener('change', mySqlShowHide);
+}
+
+function ask_confirmation(e) {
+	var str_confirmation = this.getAttribute('data-str-confirm');
+	if (!confirm(str_confirmation)) {
+		e.preventDefault();
+	}
+}
+var confirms = document.getElementsByClassName('confirm');
+for (var i = 0 ; i < confirms.length ; i++) {
+	confirms[i].addEventListener('click', ask_confirmation);
+}

p/scripts/main.js

@@ -871,7 +871,7 @@ function notifs_html5_show(nb) {
 		window.location.reload();
 	}
 
-	if (context['html5_notif_timeout'] !== 0){
+	if (context['html5_notif_timeout'] !== 0) {
 		setTimeout(function() {
 			notification.close();
 		}, context['html5_notif_timeout'] * 1000);
@@ -1246,8 +1246,9 @@ function init_configuration_alert() {
 }
 
 function parseJavaScriptCookie() {
-	var json = JSON.parse(decodeURIComponent(document.cookie.replace(/(?:(?:^|.*;\s*)FreshRSS-vars\s*\=\s*([^;]*).*$)|^.*$/, "$1"))) || {};
+	var vars = decodeURIComponent(document.cookie.replace(/(?:(?:^|.*;\s*)FreshRSS-vars\s*\=\s*([^;]*).*$)|^.*$/, "$1"));
 	document.cookie = 'FreshRSS-vars=; expires=Thu, 01 Jan 1970 00:00:00 GMT';
+	var json = JSON.parse(vars);
 	window.context = json.context;
 	window.shortcuts = json.shortcuts;
 	window.url = json.url;
@@ -1256,7 +1257,6 @@ function parseJavaScriptCookie() {
 }
 
 function init_all() {
-	parseJavaScriptCookie();
 	if (!window.$) {
 		if (window.console) {
 			console.log('FreshRSS waiting for JS…');
@@ -1264,6 +1264,7 @@ function init_all() {
 		window.setTimeout(init_all, 50);
 		return;
 	}
+	parseJavaScriptCookie();
 	init_notifications();
 	init_confirm_action();
 	$stream = $('#stream');