|
1 | 1 | <!DOCTYPE html>
|
2 | 2 | <html lang="en">
|
| 3 | + |
3 | 4 | <head>
|
4 | 5 | <!--
|
5 | 6 | Copyright (c) 2024 Antoine Martin <antoine@xpra.org>
|
|
18 | 19 |
|
19 | 20 | <div>
|
20 | 21 | <label for="input">Input</label>
|
21 |
| - <input |
22 |
| - title="Input" |
23 |
| - type="text" |
24 |
| - class="form-control" |
25 |
| - id="input" |
26 |
| - placeholder="Input" |
27 |
| - maxlength="256" |
28 |
| - /> |
| 22 | + <input title="Input" type="text" class="form-control" id="input" placeholder="Input" maxlength="256" /> |
29 | 23 | </div>
|
30 | 24 |
|
31 | 25 | <hr />
|
32 | 26 |
|
33 | 27 | <div>
|
34 | 28 | <input type="checkbox" id="autofocus" />
|
35 | 29 | <br />
|
36 |
| - <label for="pasteboard">Pasteboard:</label><br/> |
| 30 | + <label for="pasteboard">Pasteboard:</label><br /> |
37 | 31 | <textarea id="pasteboard" readonly></textarea>
|
38 | 32 | </div>
|
39 | 33 |
|
40 | 34 | <hr />
|
41 | 35 |
|
42 | 36 | <div>
|
43 |
| - <label for="contents">Contents:</label><br/> |
| 37 | + <label for="contents">Contents:</label><br /> |
44 | 38 | <pre id="contents"></pre>
|
45 | 39 | </div>
|
46 | 40 |
|
47 | 41 | <hr />
|
48 | 42 |
|
49 | 43 | <div>
|
50 |
| - <label for="info">Events:</label><br/> |
| 44 | + <label for="info">Events:</label><br /> |
51 | 45 | <pre id="info"></pre>
|
52 | 46 | </div>
|
53 | 47 |
|
|
74 | 68 |
|
75 | 69 | function update_info(newtext) {
|
76 | 70 | console.log(newtext);
|
77 |
| - while (lines.length>10) { |
| 71 | + while (lines.length > 10) { |
78 | 72 | lines.shift();
|
79 | 73 | }
|
80 | 74 | lines.push(newtext);
|
|
90 | 84 | }
|
91 | 85 | }
|
92 | 86 |
|
93 |
| - autofocus.onchange = function () { |
| 87 | + autofocus.onchange = function() { |
94 | 88 | pasteboard.autofocus = autofocus.checked;
|
95 | 89 | if (autofocus.checked) {
|
96 | 90 | pasteboard.focus();
|
|
103 | 97 | update_info("`navigator.clipboard` found");
|
104 | 98 | if (navigator.clipboard.clipboardData) {
|
105 | 99 | update_info("`navigator.clipboard.clipboardData` found");
|
106 |
| - } |
107 |
| - else { |
| 100 | + } else { |
108 | 101 | update_info("No `navigator.clipboard.clipboardData`");
|
109 | 102 | }
|
110 |
| - } |
111 |
| - else { |
| 103 | + } else { |
112 | 104 | update_info("Error: `navigator.clipboard` is missing!");
|
113 | 105 | }
|
114 | 106 |
|
115 | 107 | function read_clipboard_data(format) {
|
116 |
| - update_info("requesting "+format); |
| 108 | + update_info("requesting " + format); |
117 | 109 | navigator.clipboard.read().then((data) => {
|
118 |
| - update_info("got "+format+" clipboard data: "+data); |
119 |
| - for (const item of data) { |
120 |
| - for (const type of item.types) { |
121 |
| - const item_data = item.getType(type).then((item_data) => { |
122 |
| - update_info("got "+type+"="+item_data); |
123 |
| - const fileReader = new FileReader(); |
124 |
| - fileReader.addEventListener("load", (event) => { |
125 |
| - update_info("loaded "+type+"="+event+" using "+event.target); |
126 |
| - update_info("result="+event.target.result); |
127 |
| - }, |
128 |
| - (error) => { |
129 |
| - update_info("failed to load "+type+" clipboard data: "+error); |
130 |
| - }); |
131 |
| - fileReader.readAsText(item_data); |
132 |
| - }, |
133 |
| - (error) => { |
134 |
| - update_info("failed to get "+type+" clipboard data: "+error); |
135 |
| - }); |
| 110 | + update_info("got " + format + " clipboard data: " + data); |
| 111 | + for (const item of data) { |
| 112 | + for (const type of item.types) { |
| 113 | + const item_data = item.getType(type).then((item_data) => { |
| 114 | + update_info("got " + type + "=" + item_data); |
| 115 | + const fileReader = new FileReader(); |
| 116 | + fileReader.addEventListener("load", (event) => { |
| 117 | + update_info("loaded " + type + "=" + event + " using " + event.target); |
| 118 | + update_info("result=" + event.target.result); |
| 119 | + }, |
| 120 | + (error) => { |
| 121 | + update_info("failed to load " + type + " clipboard data: " + error); |
| 122 | + }); |
| 123 | + fileReader.readAsText(item_data); |
| 124 | + }, |
| 125 | + (error) => { |
| 126 | + update_info("failed to get " + type + " clipboard data: " + error); |
| 127 | + }); |
| 128 | + } |
136 | 129 | }
|
137 |
| - } |
138 |
| - contents.innerText = data; |
139 |
| - }, |
140 |
| - (error) => { |
141 |
| - update_info("failed to read "+format+": "+error); |
142 |
| - }); |
| 130 | + contents.innerText = data; |
| 131 | + }, |
| 132 | + (error) => { |
| 133 | + update_info("failed to read " + format + ": " + error); |
| 134 | + }); |
143 | 135 | }
|
144 | 136 | if (navigator.clipboard.read) {
|
145 | 137 | read_clipboard_data("text/html");
|
146 | 138 | read_clipboard_data("text/plain");
|
147 |
| - } |
148 |
| - else { |
| 139 | + } else { |
149 | 140 | update_info("missing `navigator.clipboard.read`");
|
150 | 141 | }
|
151 | 142 |
|
152 | 143 | function read_clipboard_text() {
|
153 | 144 | update_info("requesting contents via readText()");
|
154 | 145 | navigator.clipboard.readText().then((text) => {
|
155 |
| - update_info("readText() clipboard data: '"+text+"'"); |
156 |
| - contents.innerHTML = text; |
157 |
| - // const clipboard_buffer = unescape(encodeURIComponent(text)); |
158 |
| - }, |
159 |
| - (error) => { |
160 |
| - update_info("failed to readText(): "+error); |
161 |
| - }); |
| 146 | + update_info("readText() clipboard data: '" + text + "'"); |
| 147 | + contents.innerHTML = text; |
| 148 | + // const clipboard_buffer = unescape(encodeURIComponent(text)); |
| 149 | + }, |
| 150 | + (error) => { |
| 151 | + update_info("failed to readText(): " + error); |
| 152 | + }); |
162 | 153 | }
|
163 | 154 | read_clipboard_text();
|
164 | 155 |
|
|
185 | 176 | exec_copy.onclick = function(e) {
|
186 | 177 | input.select();
|
187 | 178 | const copy = document.execCommand("copy");
|
188 |
| - update_info("copy="+copy); |
| 179 | + update_info("copy=" + copy); |
189 | 180 | }
|
190 | 181 |
|
191 | 182 | const exec_paste = document.getElementById("exec-paste");
|
192 | 183 | exec_paste.onclick = function(e) {
|
193 | 184 | input.select();
|
194 | 185 | const paste = document.execCommand("paste");
|
195 |
| - update_info("paste="+paste); |
| 186 | + update_info("paste=" + paste); |
196 | 187 | }
|
197 | 188 |
|
198 | 189 | </script>
|
199 | 190 | </body>
|
| 191 | + |
200 | 192 | </html>
|
0 commit comments