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
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
| <!DOCTYPE html>
<html lang="fr" dir="ltr">
<head>
<!-- cache-control avec max-age=60 pour le développement uniquement -->
<meta http-equiv="cache-control" content="public, max-age=60">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<meta name="author" content="Daniel Hagnoul">
<title>test</title>
<style>
*,
*:after,
*:before {
box-sizing: border-box;
}
/* CSS du test */
main {
display: grid;
grid-template-columns: 10rem 1fr;
background-color: black;
color: wheat;
}
#num {
height: 500px;
padding-right: 3px;
border: 1px solid white;
overflow: auto;
text-align: right;
color: bisque;
}
#code {
height: 100px;
padding-left: 3px;
border: 1px solid aqua;
overflow: auto;
color: white;
white-space: nowrap;
}
/* Fin CSS du test */
</style>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/locale/fr.js"></script>
<script src="http://danielhagnoul.developpez.com/lib/dvjh/dvjhUtilities-1.3.3.js"></script>
<script>
'use strict';
document.addEventListener( "DOMContentLoaded", ev => {
moment.locale( "fr" );
klog( `DOM ready : ${ new kDvjhDate() }` );
// code du test
// fin code du test
}, false );
window.addEventListener( "load", ev => {
klog( `Window load : ${ new kDvjhDate() }` );
// code du test
/*
* @bobince Sep 11 '10 at 16:04 sur
* https://stackoverflow.com/questions/3691461/remove-key-press-delay-in-javascript
*/
// Keyboard input with customisable repeat (set to 0 for no key repeat)
//
function KeyboardController(keys, repeat) {
// Lookup of key codes to timer ID, or null for no repeat
//
var timers= {};
// When key is pressed and we don't already think it's pressed, call the
// key action callback and set a timer to generate another one after a delay
//
document.onkeydown= function(event) {
var key= (event || window.event).keyCode;
if (!(key in keys))
return true;
if (!(key in timers)) {
timers[key]= null;
keys[key]();
if (repeat!==0)
timers[key]= setInterval(keys[key], repeat);
}
return false;
};
// Cancel timeout and mark key as released on keyup
//
document.onkeyup= function(event) {
var key= (event || window.event).keyCode;
if (key in timers) {
if (timers[key]!==null)
clearInterval(timers[key]);
delete timers[key];
}
};
// When window is unfocused we may not get key events. To prevent this
// causing a key to 'get stuck down', cancel all held keys
//
window.onblur= function() {
for (key in timers)
if (timers[key]!==null)
clearInterval(timers[key]);
timers= {};
};
};
let
divNum = null;
const
elemCode = document.querySelector( "#code"),
elemNum = document.querySelector( "#num"),
elemDiv = document.createElement( "div" );
// Arrow key movement. Repeat key five times a second
//
KeyboardController({
13 : function( ){
divNum = elemDiv.cloneNode( false ),
divNum.className = "numline";
divNum.textContent = elemNum.childElementCount + 1;
elemNum.appendChild( divNum );
elemNum.scrollTop += 20;
},
}, 200 );
// fin code du test
kIDUnique();
}, false );
</script>
</head>
<body>
<main>
<div id="num">
<div>1</div>
</div>
<div id="code" contenteditable="true">
<div>Hello</div>
</div>
</main>
</body>
</html> |
Ralentissement important au bout de quelques lignes
Répondre avec citation
Envoyé par danielhagnoul
Partager