Skip to content

Commit 4af6e40

Browse files
javascript-2020javascript-2020
committed
save file
1 parent 539eca7 commit 4af6e40

File tree

1 file changed

+7
-264
lines changed

1 file changed

+7
-264
lines changed

‎html-components/list/template/template.html‎

Lines changed: 7 additions & 264 deletions
Original file line numberDiff line numberDiff line change
@@ -10,299 +10,42 @@
1010
<meta charset=utf-8>
1111

1212
<title>
13-
html component :
13+
web-editor
1414
</title>
1515

1616
<meta name=description content=''>
1717

18-
<base href='https://ext-code.com/html-components/list/'>
19-
<link rel=canonical href='https://ext-code.com/html-components/list/'>
20-
18+
<link rel=canonical href='https://ext-code.com/html-components/list/web-editor/web-editor.html'>
2119
<meta name=viewport content='width=device-width, initial-scale=1'>
22-
<link rel=icon href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAMAAAAM7l6QAAAAaVBMVEVHcExfpvhYpPxapPtZo/lZpfxYpPtZpfxjp/Rxsv1ZpPpZpPtZpPpZpfxbpPheqPxcpvxorf1jqvxoputao/lbpPhmrP1ZpPtYo/tZo/hZpPtZpPqcyf+Rw/6Xxv+KwP6EvP53tf19uf1CLkbiAAAAHHRSTlMADp1YNLp7swf+YpU/wizc0vrpAiIX84VvHKlK4cmJ4wAAAVdJREFUKM+1ktmShCAMRVU2ARFxb5tF/f+PHIK92j1vM6myKuQYkns1y/4i8mEof6dlobX4hWHc09GtzfVSDZ/0qlvNg/Wr0SO7nOmlWb2zEN55Lj+WUsFat3O+ems3+g2HViLBuLfbdKaz8X5EkMnNBl2961tMsOuSanXr7N6iHOL+klqt3Y8r8yZuwRtGCCPyxgl3di0ODdrZYGgdA5H8wLXk1rUVpBQykeqY5Q/dcXgjajyNcfRNN2Z9P3TJbhKnB96OWzSHzzesCSGyThOjodEyeOxWpJZsEHioKcGxW4zc7LEzbCNv8KtoCit3SFwX40NLq7l+8wSRu3fEGLC7r/p07mDxYXl8gZ7RWBGKKXEcJ0GJzB8XFdH2SuESK/AAN5Ocri/2A5Yga5ZJ9+nPi7hk0FgBebr2xN2S8NJ9wxIhBZtShRCi5IRREQO2FpAUc5n9e/wA3jcXGxBAlmMAAAAASUVORK5CYII='>
23-
24-
25-
<script src='https://ajaxorg.github.io/ace-builds/src-noconflict/ace.js'></script>
26-
<script src='https://cdn.jsdelivr.net/npm/markdown-it/dist/markdown-it.min.js'></script>
27-
<link rel=stylesheet href='/css/github-markdown-light.css'>
2820

2921

3022
<script src='https://libs.ext-code.com/js/dom/component/v3.0/component.js?hdr'></script>
3123

3224
<script>
3325

34-
35-
36-
var component = 'file-mod';
37-
var date = '2026-02-09';
26+
var component = 'web-editor';
27+
var date = '2026-02-10';
3828
var files = {
3929
'source' : {
4030
'v2.0' : null,
4131
'latest' : null,
4232
},
4333
'examples' : {
44-
'filemod-v2.0-test.html' : null,
34+
'web-editor-v2.0-example-2.html' : null,
35+
'web-editor-v2.0-test.html' : null,
4536
},
4637
};
4738

48-
49-
50-
var df=true,did='html'
51-
;
52-
53-
var base = 'https://libs.ext-code.com/html/';
54-
55-
var ace;
56-
var md;
57-
var dirtree;
58-
var snippet;
59-
var editor;
60-
var log;
61-
62-
63-
async function init(){
64-
debug('init');
65-
66-
md = markdownit({
67-
html : true,
68-
breaks : false,
69-
linkify : true,
70-
linkTarget : '_blank',
71-
});
72-
73-
74-
dirtree = mod['dir-tree'];
75-
snippet = mod['snippet-html-console'];
76-
editor = mod['web-editor'];
77-
log = mod['log-mod'];
78-
79-
80-
await Promise.all([
81-
load(),
82-
mod.auto(),
83-
]);
84-
85-
86-
initdom();
87-
88-
89-
}//init
90-
91-
92-
async function load(){
93-
94-
var {error,txt} = await get(base+component+'/readme.md');
95-
96-
if(error){
97-
md_txt = error;
98-
}else{
99-
md_txt = txt;
100-
}
101-
102-
}//load
103-
104-
10539
</script>
10640

107-
108-
<link rel=stylesheet href='../css/component.css'>
109-
110-
<style>
111-
112-
body
113-
{margin-top:90px}
114-
115-
html-components-hdr
116-
{position:fixed;z-index:1;background:white;top:0px;padding-top:20px}
117-
118-
</style>
119-
12041
</head>
12142

12243
<body>
12344

124-
125-
<html-components-hdr v2.0 component=grp1>
126-
<h2 slot=title>
127-
</h2>
128-
<time slot=date datetime=2026-02-10>
129-
</time>
130-
</html-components-hdr>
131-
<script>
132-
/*
133-
{
134-
let hdr = document.querySelector('html-components-hdr');
135-
hdr.querySelector('h2').textContent = component;
136-
hdr.querySelector('time').setAttribute('datetime',date);
137-
let d = new Date(date);
138-
let formatted = d.toLocaleDateString('en-GB',{day:'2-digit',month:'short',year:'numeric'});
139-
hdr.querySelector('time').textContent = formatted;
140-
}
141-
*/
142-
</script>
143-
144-
145-
<div id=readme class=markdown-body></div>
146-
147-
<hr>
148-
149-
<section>
150-
151-
<h3>
152-
files
153-
<span style='font-size:16px;font-weight:normal'>
154-
( click to view )
155-
</span>
156-
</h3>
157-
158-
<dir-tree component></dir-tree>
159-
160-
</section>
161-
162-
<div id=view-hdr>
163-
</div>
164-
165-
<div id=view style='display:none'>
166-
<snippet-html-console component></snippet-html-console>
167-
<web-editor component fullsize></web-editor>
168-
</div>
169-
170-
171-
<log-mod component></log-mod>
45+
<page-html v1.0 component=grp style='display:block'></page-html>
17246

17347
</body>
17448

175-
<script>
176-
177-
178-
var md_txt;
179-
var cache = {};
180-
181-
182-
var callback = {};
183-
var show = {};
184-
185-
186-
187-
//:
188-
189-
190-
async function initdom(){
191-
debug('initdom');
192-
193-
var html = md.render(md_txt);
194-
$('#readme').innerHTML = html;
195-
196-
197-
files = dirtree.build(files);
198-
dirtree.display(files,{callback});
199-
200-
201-
await show.examples('filemod-v2.0-test.html');
202-
$('#view').style.display = '';
203-
204-
205-
}//initdom
206-
207-
208-
//:
209-
210-
211-
callback.file = function(name,o){
212-
213-
var par = o.parent.name;
214-
debug(par,name);
215-
switch(par){
216-
217-
case 'source' : show.source(name); break;
218-
case 'examples' : show.examples(name); break;
219-
220-
}//switch
221-
222-
}//show
223-
224-
225-
show.source = async function(file){
226-
227-
$('#view-hdr').textContent = 'source : '+file;
228-
$('web-editor').style.display = '';
229-
$('snippet-html-console').style.display = 'none';
230-
231-
var url = base+component+'/';
232-
if(file=='latest'){
233-
url += `${component}.html`;
234-
}else{
235-
url += `${file}/${component}-${file}.html`;
236-
}
237-
238-
var {txt} = await get(url);
239-
if(!txt)return;
240-
editor.setvalue(txt);
241-
editor.filename(file);
242-
editor.mode = 'html';
243-
244-
}//source
245-
246-
247-
show.examples = async function(file){
248-
249-
$('#view-hdr').textContent = 'examples : '+file;
250-
$('web-editor').style.display = 'none';
251-
$('snippet-html-console').style.display = '';
252-
253-
var url = base+component+'/examples/'+file;
254-
var {txt} = await get(url);
255-
if(!txt)return;
256-
257-
snippet.editor.setvalue(txt);
258-
snippet.editor.filename(file);
259-
snippet.clear();
260-
261-
}//example
262-
263-
264-
async function get(url){
265-
debug('get',url);
266-
if(cache[url]){
267-
debug('cache');
268-
return {txt:cache[url]};
269-
}
270-
271-
var err;
272-
try{
273-
274-
var res = await fetch(url);
275-
276-
}//try
277-
catch(err2){
278-
279-
err = err2;
280-
281-
}//catch
282-
if(err){
283-
var error = err.toString();
284-
log.red(error);
285-
return {error};
286-
}
287-
if(!res.ok){
288-
var error = await res.text();
289-
log.red(error);
290-
return {error};
291-
}
292-
293-
var txt = await res.text();
294-
cache[url] = txt;
295-
return {txt};
296-
297-
}//get
298-
299-
300-
301-
302-
303-
304-
</script>
305-
30649
</html>
30750

30851

0 commit comments

Comments
 (0)