1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
|
<?php
// ---------------------------------------------------------------------------
$ccodeJSON = file_get_contents('ccode.json');
$ccodeARRAY = json_decode($ccodeJSON);
unset($ccodeJSON); // free some memory
// print_r($ccodeARRAY);
// echo json_encode($ccodeARRAY, JSON_PRETTY_PRINT | JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES);
?><!DOCTYPE html>
<html prefix="og: http://ogp.me/ns#" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-GB" lang="en-GB" dir="ltr">
<head>
<!-- Metas + Title -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>KALLASSA : Ενημέρωση Τοπικών Ονομασιών</title>
<!-- CSS needed -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.10/css/select2.min.css" />
<style>
html, body, input { font-family: "Ubuntu", sans-serif; font-size: 14px; }
h2 { font-family: Ubuntu, Arial, sans-serif;, font-size: 20px; font-weight: 300; padding-bottom: 32px; }
h3 { font-family: Ubuntu, Arial, sans-serif;, font-size: 14px; font-weight: 300; }
.pi-container { max-width: 960px; width: 100%; margin: 0 auto; }
.row { margin-top: 4px; padding-bottom: 4px; border-bottom: 1px solid #eee; }
span.key { font-size: 10px; padding: 3px; background: #eee; color: #777; border-radius: 2px; }
</style>
</head>
<body>
<div class="pi-container">
<h2>Ενημέρωση Τοπικών Ονομασιών</h2>
<form id="ccode-form">
<?php foreach ($ccodeARRAY as $key => $val): ?>
<div class="row">
<div class="col-md-2"><span class="key"><?=$key?></span>: <?=$val->id?></div>
<div class="col-md-6"><?=$val->tag?></div>
<div class="col-md-4"><input class="form-control" name="local" data-id="<?=$key?>" value="<?=$val->local?>"></div>
</div>
<?php endforeach; ?>
</form>
<pre id="new-locals"></pre>
</div>
<!-- DOM ENDS HERE -->
<!-- scripts and libraries
load and register one by one, so you don't need to worry about if they are ready -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-migrate/1.4.1/jquery-migrate.min.js"></script>
<script>
function reportNewLocals() {
var newLocals = "";
$('#ccode-form input').each(function(key, value) {
newLocals += "\n" + key + " : " + this.value;
// this.data('id')
});
$("#new-locals").html(newLocals);
}
reportNewLocals();
$('form').on('keyup change paste', 'input, select, textarea', function(){
console.log('Form changed!');
reportNewLocals()
});
</script>
</body>
</html>
|
