Skip to content

Commit 4b1ab1c

Browse files
zbryiktzbryikt
committed
separate script into index.ls; add additional libs in html
1 parent 5eef6ed commit 4b1ab1c

File tree

4 files changed

+94
-58
lines changed

4 files changed

+94
-58
lines changed

‎web/.view/index.js‎

Lines changed: 14 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -561,17 +561,25 @@ pug_html = pug_html + "\u003C\u002Fdiv\u003E\u003C\u002Fdiv\u003E\u003C\u002Fdiv
561561
;pug_debug_line = 46;pug_debug_filename = "src\u002Fpug\u002Findex.pug";
562562
pug_mixins["script"]("assets/lib/@loadingio/ldquery/main/ldq.min.js");
563563
;pug_debug_line = 47;pug_debug_filename = "src\u002Fpug\u002Findex.pug";
564-
pug_mixins["script"]("assets/lib/ldview/main/index.min.js");
564+
pug_mixins["script"]("assets/lib/proxise/main/proxise.min.js");
565565
;pug_debug_line = 48;pug_debug_filename = "src\u002Fpug\u002Findex.pug";
566-
pug_mixins["script"]("assets/lib/ldcolor/main/ldcolor.min.js");
566+
pug_mixins["script"]("assets/lib/@plotdb/rescope/main/rescope.min.js");
567567
;pug_debug_line = 49;pug_debug_filename = "src\u002Fpug\u002Findex.pug";
568-
pug_mixins["script"]("assets/lib/@loadingio/ldcolorpicker/main/ldcp.min.js");
568+
pug_mixins["script"]("assets/lib/@plotdb/csscope/main/csscope.min.js");
569569
;pug_debug_line = 50;pug_debug_filename = "src\u002Fpug\u002Findex.pug";
570-
pug_mixins["script"]("assets/lib/ldslider/main/ldrs.min.js");
570+
pug_mixins["script"]("assets/lib/@plotdb/block/main/block.min.js");
571571
;pug_debug_line = 51;pug_debug_filename = "src\u002Fpug\u002Findex.pug";
572+
pug_mixins["script"]("assets/lib/ldview/main/index.min.js");
573+
;pug_debug_line = 52;pug_debug_filename = "src\u002Fpug\u002Findex.pug";
574+
pug_mixins["script"]("assets/lib/ldcolor/main/ldcolor.min.js");
575+
;pug_debug_line = 53;pug_debug_filename = "src\u002Fpug\u002Findex.pug";
576+
pug_mixins["script"]("assets/lib/@loadingio/ldcolorpicker/main/ldcp.min.js");
577+
;pug_debug_line = 54;pug_debug_filename = "src\u002Fpug\u002Findex.pug";
578+
pug_mixins["script"]("assets/lib/ldslider/main/ldrs.min.js");
579+
;pug_debug_line = 55;pug_debug_filename = "src\u002Fpug\u002Findex.pug";
572580
pug_html = pug_html + "\u003Cscript\u003E";
573-
;pug_debug_line = 51;pug_debug_filename = "src\u002Fpug\u002Findex.pug";
574-
pug_html = pug_html + "var view;\nview = new ldview({\n root: document.body,\n initRender: false,\n init: {\n color: function(arg$){\n var node, ldcp;\n node = arg$.node;\n ldcp = new ldcolorpicker(node);\n ldcp.on('change', function(it){\n node.style.background = ldcolor.web(it);\n return view.get('gallery').style.color = ldcolor.web(it);\n });\n return node.style.background = ldcolor.web(ldcp.getColor());\n },\n slider: function(arg$){\n var node, ldrs;\n node = arg$.node;\n ldrs = new ldslider({\n root: node,\n min: 0.1,\n max: 1,\n step: 0.01,\n from: 1\n });\n return ldrs.on('change', function(v){\n return view.getAll('spinner').map(function(it){\n return it.style.transform = \"scale(\" + v + \")\";\n });\n });\n }\n },\n handler: {\n colorbox: function(){},\n gallery: function(){}\n }\n});\nview.render();\u003C\u002Fscript\u003E\u003C\u002Fbody\u003E\u003C\u002Fhtml\u003E";
581+
;pug_debug_line = 55;pug_debug_filename = "src\u002Fpug\u002Findex.pug";
582+
pug_html = pug_html + "var mgr;\nmgr = new block.manager({\n registry: function(arg$){\n var name, version, path, type;\n name = arg$.name, version = arg$.version, path = arg$.path, type = arg$.type;\n return \"\u002Fassets\u002Flib\u002F@loadingio\u002Fcss-spinner\u002Fdev\u002Fentries\u002F\" + name;\n }\n});\nmgr.init().then(function(){\n var view;\n view = new ldview({\n root: document.body,\n initRender: false,\n action: {\n click: {\n spinner: function(){\n return console.log('ok123');\n }\n }\n },\n init: {\n color: function(arg$){\n var node, ldcp;\n node = arg$.node;\n ldcp = new ldcolorpicker(node);\n ldcp.on('change', function(it){\n node.style.background = ldcolor.web(it);\n return view.get('gallery').style.color = ldcolor.web(it);\n });\n return node.style.background = ldcolor.web(ldcp.getColor());\n },\n slider: function(arg$){\n var node, ldrs;\n node = arg$.node;\n ldrs = new ldslider({\n root: node,\n min: 0.1,\n max: 1,\n step: 0.01,\n from: 1\n });\n return ldrs.on('change', function(v){\n return view.getAll('spinner').map(function(it){\n return it.style.transform = \"scale(\" + v + \")\";\n });\n });\n }\n },\n handler: {\n colorbox: function(){},\n gallery: function(){}\n }\n });\n return view.render();\n});\u003C\u002Fscript\u003E\u003C\u002Fbody\u003E\u003C\u002Fhtml\u003E";
575583
}.call(this, "JSON" in locals_for_with ?
576584
locals_for_with.JSON :
577585
typeof JSON !== 'undefined' ? JSON : undefined, "b64img" in locals_for_with ?

‎web/src/pug/index.ls‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
mgr = new block.manager registry: ({name,version,path,type}) -> "/assets/lib/@loadingio/css-spinner/dev/entries/#name"
2+
mgr.init!
3+
.then ->
4+
5+
view = new ldview do
6+
root: document.body
7+
init-render: false
8+
action: click:
9+
spinner: -> console.log \ok123
10+
init:
11+
color: ({node}) ->
12+
ldcp = new ldcolorpicker node
13+
ldcp.on \change, ->
14+
node.style.background = ldcolor.web(it)
15+
view.get('gallery').style.color = ldcolor.web(it)
16+
node.style.background = ldcolor.web(ldcp.get-color!)
17+
slider: ({node}) ->
18+
ldrs = new ldslider root: node, min: 0.1, max: 1, step: 0.01, from: 1
19+
ldrs.on \change, (v) ->
20+
view.get-all \spinner .map -> it.style.transform = "scale(#{v})"
21+
handler: colorbox: (->), gallery: (->)
22+
view.render!
23+

‎web/src/pug/index.pug‎

Lines changed: 5 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -44,24 +44,12 @@ html
4444
.col-sm: .item(ld="spinner"): +lds-ripple
4545
.col-sm: .item(ld="spinner"): +lds-spinner
4646
+script("assets/lib/@loadingio/ldquery/main/ldq.min.js")
47+
+script("assets/lib/proxise/main/proxise.min.js")
48+
+script("assets/lib/@plotdb/rescope/main/rescope.min.js")
49+
+script("assets/lib/@plotdb/csscope/main/csscope.min.js")
50+
+script("assets/lib/@plotdb/block/main/block.min.js")
4751
+script("assets/lib/ldview/main/index.min.js")
4852
+script("assets/lib/ldcolor/main/ldcolor.min.js")
4953
+script("assets/lib/@loadingio/ldcolorpicker/main/ldcp.min.js")
5054
+script("assets/lib/ldslider/main/ldrs.min.js")
51-
script: :lsc
52-
view = new ldview do
53-
root: document.body
54-
init-render: false
55-
init:
56-
color: ({node}) ->
57-
ldcp = new ldcolorpicker node
58-
ldcp.on \change, ->
59-
node.style.background = ldcolor.web(it)
60-
view.get('gallery').style.color = ldcolor.web(it)
61-
node.style.background = ldcolor.web(ldcp.get-color!)
62-
slider: ({node}) ->
63-
ldrs = new ldslider root: node, min: 0.1, max: 1, step: 0.01, from: 1
64-
ldrs.on \change, (v) ->
65-
view.get-all \spinner .map -> it.style.transform = "scale(#{v})"
66-
handler: colorbox: (->), gallery: (->)
67-
view.render!
55+
script: include:lsc index.ls

‎web/static/index.html‎

Lines changed: 52 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -14,41 +14,58 @@
1414
width: 80px;
1515
height: 80px;
1616
}
17-
</style></head><body><div class="text-center py-4"><h1 class="mb-0">CSS Spinner</h1><div>by <a class="text-white" href="https://loading.io/css">loading.io</a></div><div class="mt-4 d-flex justify-content-center mx-auto" style="max-width:320px"><div class="mx-2 flex-grow-1"><div class="form-control form-control-sm border-0" ld="color"></div></div><div class="mx-2 flex-grow-1"><div class="ldrs sm" ld="slider"></div></div></div></div><div class="w-50 mx-auto" ld="gallery"><div class="row text-center"><div class="col-sm"><div class="item" ld="spinner"><div class="lds-circle"><div></div></div></div></div><div class="col-sm"><div class="item" ld="spinner"><div class="lds-dual-ring"></div></div></div><div class="col-sm"><div class="item" ld="spinner"><div class="lds-facebook"><div></div><div></div><div></div></div></div></div></div><div class="row text-center"><div class="col-sm"><div class="item" ld="spinner"><div class="lds-heart"><div></div></div></div></div><div class="col-sm"><div class="item" ld="spinner"><div class="lds-ring"><div></div><div></div><div></div><div></div></div></div></div><div class="col-sm"><div class="item" ld="spinner"><div class="lds-roller"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div></div><div class="row text-center"><div class="col-sm"><div class="item" ld="spinner"><div class="lds-default"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div><div class="col-sm"><div class="item" ld="spinner"><div class="lds-ellipsis"><div></div><div></div><div></div><div></div></div></div></div><div class="col-sm"><div class="item" ld="spinner"><div class="lds-grid"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div></div><div class="row text-center"><div class="col-sm"><div class="item" ld="spinner"><div class="lds-hourglass"></div></div></div><div class="col-sm"><div class="item" ld="spinner"><div class="lds-ripple"><div></div><div></div></div></div></div><div class="col-sm"><div class="item" ld="spinner"><div class="lds-spinner"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div></div></div><script type="text/javascript" src="assets/lib/@loadingio/ldquery/main/ldq.min.js"></script><script type="text/javascript" src="assets/lib/ldview/main/index.min.js"></script><script type="text/javascript" src="assets/lib/ldcolor/main/ldcolor.min.js"></script><script type="text/javascript" src="assets/lib/@loadingio/ldcolorpicker/main/ldcp.min.js"></script><script type="text/javascript" src="assets/lib/ldslider/main/ldrs.min.js"></script><script>var view;
18-
view = new ldview({
19-
root: document.body,
20-
initRender: false,
21-
init: {
22-
color: function(arg$){
23-
var node, ldcp;
24-
node = arg$.node;
25-
ldcp = new ldcolorpicker(node);
26-
ldcp.on('change', function(it){
27-
node.style.background = ldcolor.web(it);
28-
return view.get('gallery').style.color = ldcolor.web(it);
29-
});
30-
return node.style.background = ldcolor.web(ldcp.getColor());
17+
</style></head><body><div class="text-center py-4"><h1 class="mb-0">CSS Spinner</h1><div>by <a class="text-white" href="https://loading.io/css">loading.io</a></div><div class="mt-4 d-flex justify-content-center mx-auto" style="max-width:320px"><div class="mx-2 flex-grow-1"><div class="form-control form-control-sm border-0" ld="color"></div></div><div class="mx-2 flex-grow-1"><div class="ldrs sm" ld="slider"></div></div></div></div><div class="w-50 mx-auto" ld="gallery"><div class="row text-center"><div class="col-sm"><div class="item" ld="spinner"><div class="lds-circle"><div></div></div></div></div><div class="col-sm"><div class="item" ld="spinner"><div class="lds-dual-ring"></div></div></div><div class="col-sm"><div class="item" ld="spinner"><div class="lds-facebook"><div></div><div></div><div></div></div></div></div></div><div class="row text-center"><div class="col-sm"><div class="item" ld="spinner"><div class="lds-heart"><div></div></div></div></div><div class="col-sm"><div class="item" ld="spinner"><div class="lds-ring"><div></div><div></div><div></div><div></div></div></div></div><div class="col-sm"><div class="item" ld="spinner"><div class="lds-roller"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div></div><div class="row text-center"><div class="col-sm"><div class="item" ld="spinner"><div class="lds-default"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div><div class="col-sm"><div class="item" ld="spinner"><div class="lds-ellipsis"><div></div><div></div><div></div><div></div></div></div></div><div class="col-sm"><div class="item" ld="spinner"><div class="lds-grid"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div></div><div class="row text-center"><div class="col-sm"><div class="item" ld="spinner"><div class="lds-hourglass"></div></div></div><div class="col-sm"><div class="item" ld="spinner"><div class="lds-ripple"><div></div><div></div></div></div></div><div class="col-sm"><div class="item" ld="spinner"><div class="lds-spinner"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div></div></div></div><script type="text/javascript" src="assets/lib/@loadingio/ldquery/main/ldq.min.js"></script><script type="text/javascript" src="assets/lib/proxise/main/proxise.min.js"></script><script type="text/javascript" src="assets/lib/@plotdb/rescope/main/rescope.min.js"></script><script type="text/javascript" src="assets/lib/@plotdb/csscope/main/csscope.min.js"></script><script type="text/javascript" src="assets/lib/@plotdb/block/main/block.min.js"></script><script type="text/javascript" src="assets/lib/ldview/main/index.min.js"></script><script type="text/javascript" src="assets/lib/ldcolor/main/ldcolor.min.js"></script><script type="text/javascript" src="assets/lib/@loadingio/ldcolorpicker/main/ldcp.min.js"></script><script type="text/javascript" src="assets/lib/ldslider/main/ldrs.min.js"></script><script>var mgr;
18+
mgr = new block.manager({
19+
registry: function(arg$){
20+
var name, version, path, type;
21+
name = arg$.name, version = arg$.version, path = arg$.path, type = arg$.type;
22+
return "/assets/lib/@loadingio/css-spinner/dev/entries/" + name;
23+
}
24+
});
25+
mgr.init().then(function(){
26+
var view;
27+
view = new ldview({
28+
root: document.body,
29+
initRender: false,
30+
action: {
31+
click: {
32+
spinner: function(){
33+
return console.log('ok123');
34+
}
35+
}
3136
},
32-
slider: function(arg$){
33-
var node, ldrs;
34-
node = arg$.node;
35-
ldrs = new ldslider({
36-
root: node,
37-
min: 0.1,
38-
max: 1,
39-
step: 0.01,
40-
from: 1
41-
});
42-
return ldrs.on('change', function(v){
43-
return view.getAll('spinner').map(function(it){
44-
return it.style.transform = "scale(" + v + ")";
37+
init: {
38+
color: function(arg$){
39+
var node, ldcp;
40+
node = arg$.node;
41+
ldcp = new ldcolorpicker(node);
42+
ldcp.on('change', function(it){
43+
node.style.background = ldcolor.web(it);
44+
return view.get('gallery').style.color = ldcolor.web(it);
45+
});
46+
return node.style.background = ldcolor.web(ldcp.getColor());
47+
},
48+
slider: function(arg$){
49+
var node, ldrs;
50+
node = arg$.node;
51+
ldrs = new ldslider({
52+
root: node,
53+
min: 0.1,
54+
max: 1,
55+
step: 0.01,
56+
from: 1
57+
});
58+
return ldrs.on('change', function(v){
59+
return view.getAll('spinner').map(function(it){
60+
return it.style.transform = "scale(" + v + ")";
61+
});
4562
});
46-
});
63+
}
64+
},
65+
handler: {
66+
colorbox: function(){},
67+
gallery: function(){}
4768
}
48-
},
49-
handler: {
50-
colorbox: function(){},
51-
gallery: function(){}
52-
}
53-
});
54-
view.render();</script></body></html>
69+
});
70+
return view.render();
71+
});</script></body></html>

0 commit comments

Comments
 (0)