Skip to content

Commit 873e418

Browse files
javascript-2020javascript-2020
committed
save file
1 parent 3bbb9b3 commit 873e418

File tree

1 file changed

+34
-116
lines changed

1 file changed

+34
-116
lines changed

‎utils/editors/html-editor/v2.0/html-editor-v2.0.html‎

Lines changed: 34 additions & 116 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,10 @@
11

22

3+
<!-- headers
4+
cross-origin-isolate
5+
-->
6+
7+
38
<!DOCTYPE html>
49

510
<html lang=en>
@@ -98,6 +103,7 @@
98103
var hdr;
99104
var mainmenu;
100105
var filemod;
106+
var autosave;
101107
var publish;
102108
var editor;
103109
var output;
@@ -122,6 +128,7 @@
122128
hdr = mod['editors-hdr'];
123129
mainmenu = mod['main-menu'];
124130
filemod = mod['file-mod'];
131+
autosave = mod['auto-save'];
125132
publish = mod['publish-ui'];
126133
editor = mod['web-editor'];
127134
output = mod['output-html'];
@@ -131,6 +138,7 @@
131138
mainmenu.initmod({ext,$,menu,editor,filemod});
132139
hdr.initmod({ext,$,menu});
133140
filemod.initmod({ext,$,menumod,menu,complete,source,focus,log});
141+
autosave.initmod({$,menu,keydown,log,save:btn.save});
134142
publish.initmod({ext,$,menu,run,source,complete,log});
135143
editor.initmod({ext,$,menu,on,ace});
136144
output.initmod({ext,$});
@@ -140,6 +148,7 @@
140148
mainmenu.init(),
141149
hdr.init(),
142150
filemod.init(),
151+
autosave.init(),
143152
publish.init(),
144153
editor.init(),
145154
output.init(),
@@ -169,6 +178,8 @@
169178

170179
({ext} = await import('https://libs.ext-code.com/js/io/ext-loader/ext-loader.m.js'));
171180

181+
var lsmod;
182+
172183
var promise = ext.load.libs(
173184
'js/dom/$.js',
174185
'js/core/datatype.js',
@@ -177,7 +188,9 @@
177188
'js/debug/debug.js',
178189
'js/core/ls-mod/ls-mod.js',
179190
);
180-
[$,datatype,menumod,keydown,debug] = await promise;
191+
[$,datatype,menumod,keydown,debug,lsmod] = await promise;
192+
193+
ls = lsmod();
181194

182195
mod.stack.complete;
183196

@@ -205,12 +218,8 @@
205218
#save-root
206219
{margin-left:5px;display:flex}
207220

208-
#save-menu
209-
{position:absolute;left:0;top:30px}
210-
211-
212221
#run
213-
{color:blue;font-weight:bold}
222+
{color:blue;font-weight:bold;min-width:60px}
214223

215224
#prettier
216225
{padding:2px;
@@ -264,7 +273,7 @@
264273
<editors-hdr component=grp>
265274
<img class=title src='images/html-editor.png' style='top:-5px;height:55px' alt='html editor'>
266275
<h1 slot=seo-hdr class=visually-hidden>html editor</h1>
267-
<time slot=date datetime=2025-12-31>31 Dec 2025</time>
276+
<time slot=date datetime=2026-01-01>01 Jan 2026</time>
268277
</editors-hdr>
269278

270279

@@ -276,28 +285,7 @@ <h1 slot=seo-hdr class=visually-hidden>html editor</h1>
276285

277286
<div id=save-root>
278287
<button id=save>save</button>
279-
<checkbox-one id=autosave></checkbox-one>
280-
<div id=save-menu-root class=menu-root>
281-
<img id=save-menu-icon class=menu-icon>
282-
<div id=save-menu class=menu style='display:none'>
283-
<div class=menu-title>
284-
save menu
285-
</div>
286-
<div class=menu-item>
287-
<div class=menu-label>
288-
autosave
289-
</div>
290-
<input type=checkbox checked>
291-
<input value=300 style='width:60px'>
292-
</div>
293-
<div id=trim class=menu-item>
294-
<div class=menu-label>
295-
trim on save
296-
</div>
297-
<input type=checkbox checked>
298-
</div>
299-
</div>
300-
</div>
288+
<auto-save v2.0 component=grp></auto-save>
301289
</div>
302290

303291
<publish-ui component></publish-ui>
@@ -314,18 +302,14 @@ <h1 slot=seo-hdr class=visually-hidden>html editor</h1>
314302

315303
<div id=view>
316304

317-
<web-editor v2.0 component></web-editor>
305+
<web-editor component></web-editor>
318306

319307
<div id=page-slider style='width:10px;cursor:ew-resize'></div>
320308

321-
<output-html component=page v2.0></output-html>
309+
<output-html component=page></output-html>
322310

323311
</div>
324312

325-
<checkbox-one-template>
326-
<script src='https://libs.ext-code.com/html/html-loader.js'></script>
327-
</checkbox-one-template>
328-
329313
<log-mod component></log-mod>
330314

331315
</body>
@@ -336,23 +320,12 @@ <h1 slot=seo-hdr class=visually-hidden>html editor</h1>
336320

337321
var root;
338322

339-
var autosave;
340-
341-
342323

343324

344325
var slider = {};
345326

346327
var ui = {};
347328
ui.mode = 'vert';
348-
ui.trim = null;
349-
350-
var savemenu;
351-
var savetimer = {};
352-
savetimer.timer = null;
353-
savetimer.chk = null;
354-
savetimer.time = null;
355-
savetimer.onclick = null;
356329

357330

358331
var btn = {};
@@ -377,22 +350,14 @@ <h1 slot=seo-hdr class=visually-hidden>html editor</h1>
377350

378351
mainmenu.initdom(root);
379352

380-
filemod.initdom(root);
353+
filemod.initdom();
381354

382355

383-
autosave = $(root,'#autosave');
356+
autosave.initdom();
384357

385-
$(root,'#save').onclick = btn.save;
386-
387-
savemenu = $(root,'#save-root .menu');
388-
$(root,'.menu-icon').onclick = menu.click(savemenu,false,false,savemenu_callback);
389-
menu.input.norm(savemenu);
390358

391-
savetimer.chk = $(savemenu,':scope>div:nth-of-type(2) [type=checkbox]');
392-
savetimer.time = $(savemenu,':scope>div:nth-of-type(2) input:not([type])');
393-
savetimer.chk.onclick = savetimer.onclick;
394359

395-
ui.trim = $(savemenu,':scope>div:nth-of-type(3) [type=checkbox]');
360+
$(root,'#save').onclick = btn.save;
396361

397362

398363
publish.initdom();
@@ -437,61 +402,6 @@ <h1 slot=seo-hdr class=visually-hidden>html editor</h1>
437402
}//focus
438403

439404

440-
function savemenu_kd(e){
441-
console.log(e.target);
442-
if(e.target.nodeName=='INPUT'){
443-
return;
444-
}
445-
return false;
446-
447-
}//savemenu_kd
448-
449-
450-
function savemenu_callback(type){
451-
console.log('savemenu_callback',arguments);
452-
if(type=='show'){
453-
$(savemenu,':scope>div:nth-of-type(2) input:not([type])').focus();
454-
keydown.add(savemenu_kd);
455-
}
456-
if(type=='hide'){
457-
keydown.rem(savemenu_kd);
458-
}
459-
460-
}//savemenu_callback
461-
462-
463-
savetimer.onclick = function(){
464-
debug('savetimer.click');
465-
clearTimeout(savetimer.timer);
466-
467-
if(savetimer.chk.checked){
468-
var value = savetimer.time.value;
469-
value = Number(value);
470-
if(isNaN(value)){
471-
log.red('invalid autosave time, using 300s');
472-
value = 300;
473-
}
474-
fn();
475-
}
476-
477-
478-
function fn(){
479-
480-
if(!autosave.checked){
481-
return;
482-
}
483-
debug('savetimer',value);
484-
btn.save();
485-
if(savetimer.chk.checked){
486-
var ms = value*1000;
487-
setTimeout(fn,ms);
488-
}
489-
490-
}//fn
491-
492-
}//savetimer
493-
494-
495405
//:
496406

497407

@@ -595,6 +505,11 @@ <h1 slot=seo-hdr class=visually-hidden>html editor</h1>
595505

596506
var txt = editor.getValue();
597507

508+
if(autosave.trim.checked){
509+
txt = autosae.txt.trim(txt);
510+
}
511+
512+
/*
598513
if(ui.trim.checked){
599514
var indent = 0;
600515
var lines = txt.split('\n');
@@ -604,13 +519,15 @@ <h1 slot=seo-hdr class=visually-hidden>html editor</h1>
604519
if(line.length==0){
605520
line = line.padStart(indent,' ');
606521
}
607-
var match = line.match(/^\s*/);
522+
var match = line.match(/^\s* /);
608523
indent = match ? match[0].length : indent;
609524
return line;
610525
611526
});
612527
txt = lines.join('\n');
613528
}
529+
*/
530+
614531

615532
var blob = new Blob([txt]);
616533
return blob;
@@ -665,7 +582,7 @@ <h1 slot=seo-hdr class=visually-hidden>html editor</h1>
665582

666583
//:
667584

668-
585+
/*
669586
window.onmessage = function(e){
670587
671588
@@ -677,8 +594,9 @@ <h1 slot=seo-hdr class=visually-hidden>html editor</h1>
677594
}
678595
679596
}//onmessage
680-
681-
597+
*/
598+
599+
682600
//:
683601

684602

0 commit comments

Comments
 (0)