Skip to content

Commit 0447d2c

Browse files
author
Krasimir Tsonev
committed
Working on the playground
1 parent 2d4ccba commit 0447d2c

37 files changed

+11124
-52
lines changed

lib/cssx.transpiler.js.map

-1
This file was deleted.

lib/cssx.transpiler.min.js

-2
This file was deleted.

lib/cssx.transpiler.min.js.map

-1
This file was deleted.

lib/cssx.transpiler.js lib/cssxler.js

+26-8
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,11 @@
22
if(typeof exports === 'object' && typeof module === 'object')
33
module.exports = factory();
44
else if(typeof define === 'function' && define.amd)
5-
define("cssx.transpiler", [], factory);
5+
define("cssxler", [], factory);
66
else if(typeof exports === 'object')
7-
exports["cssx.transpiler"] = factory();
7+
exports["cssxler"] = factory();
88
else
9-
root["cssx.transpiler"] = factory();
9+
root["cssxler"] = factory();
1010
})(this, function() {
1111
return /******/ (function(modules) { // webpackBootstrap
1212
/******/ // The module cache
@@ -59,14 +59,15 @@ return /******/ (function(modules) { // webpackBootstrap
5959
var generate = __webpack_require__(5).default;
6060

6161
var visitors = {
62-
CSSXDefinition: __webpack_require__(386)
62+
CSSXDefinition: __webpack_require__(386),
63+
CSSXRules: __webpack_require__(387)
6364
};
6465

6566
module.exports = function (code) {
6667
var ast = AST(code);
6768

6869
traverse(ast.program, visitors);
69-
// console.log(generate);
70+
return generate(ast).code;
7071
};
7172

7273
module.exports.ast = AST;
@@ -41858,12 +41859,29 @@ return /******/ (function(modules) { // webpackBootstrap
4185841859

4185941860
/***/ },
4186041861
/* 386 */
41861-
/***/ function(module, exports) {
41862+
/***/ function(module, exports, __webpack_require__) {
41863+
41864+
var t = __webpack_require__(41);
41865+
41866+
module.exports = {
41867+
enter: function (node, parent, index) {},
41868+
exit: function (node, parent, index) {
41869+
parent[index] = node.body[0];
41870+
}
41871+
};
4186241872

41873+
41874+
/***/ },
41875+
/* 387 */
41876+
/***/ function(module, exports, __webpack_require__) {
41877+
41878+
var t = __webpack_require__(41);
41879+
4186341880
module.exports = {
4186441881
enter: function (node, parent, index) {},
4186541882
exit: function (node, parent, index) {
41866-
delete parent[index];
41883+
var newNode = t.objectProperty(t.stringLiteral('a'), t.stringLiteral('b'));
41884+
parent[index] = newNode;
4186741885
}
4186841886
};
4186941887

@@ -41872,4 +41890,4 @@ return /******/ (function(modules) { // webpackBootstrap
4187241890
/******/ ])
4187341891
});
4187441892
;
41875-
//# sourceMappingURL=cssx.transpiler.js.map
41893+
//# sourceMappingURL=cssxler.js.map

lib/cssxler.js.map

+1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

lib/cssxler.min.js

+18
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

lib/cssxler.min.js.map

+1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

+2-1
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,9 @@
66
"scripts": {
77
"test": "mocha --colors ./test/*.spec.js",
88
"test-watch": "mocha --colors -w ./test/*.spec.js",
9+
"test-debug": "mocha debug ./test/*.spec.js",
910
"dev": "webpack --progress --colors --watch --mode=dev",
10-
"make": "npm run test && webpack --mode=dev && webpack --mode=build"
11+
"make": "webpack --mode=dev && webpack --mode=build && npm run test"
1112
},
1213
"repository": {
1314
"type": "git",

playground/try-it-out/index.html

+35
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>CSSX playground</title>
6+
<link rel="stylesheet" href="./vendor/codemirror/codemirror.css">
7+
<link rel="stylesheet" href="./vendor/codemirror/addon/fold/foldgutter.css" />
8+
<link rel="stylesheet" type="text/css" href="./styles.css" />
9+
</head>
10+
<body>
11+
<div class="container">
12+
<div class="left js-code-editor"></div>
13+
<div class="right">
14+
<div class="output js-output-editor"></div>
15+
<div class="nav-output">
16+
<label for="view-ast">
17+
<input type="checkbox" id="view-ast"/> View AST
18+
</label>
19+
</div>
20+
</div>
21+
</div>
22+
<script src="../../lib/cssx.js"></script>
23+
<script src="../../lib/cssxler.js"></script>
24+
<script src="../../src/transpiler/vendor/babylon.js"></script>
25+
<script src="./vendor/codemirror/codemirror.js"></script>
26+
<script src="./vendor/codemirror/javascript.js"></script>
27+
<script src="./vendor/codemirror/addon/fold/foldcode.js"></script>
28+
<script src="./vendor/codemirror/addon/fold/foldgutter.js"></script>
29+
<script src="./vendor/codemirror/addon/fold/brace-fold.js"></script>
30+
<script src="./vendor/codemirror/addon/fold/xml-fold.js"></script>
31+
<script src="./vendor/codemirror/addon/fold/markdown-fold.js"></script>
32+
<script src="./vendor/codemirror/addon/fold/comment-fold.js"></script>
33+
<script src="./script.js"></script>
34+
</body>
35+
</html>

playground/try-it-out/script.js

+44
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
var el = function (sel) { return document.querySelector(sel); };
2+
var clone = function (o) { return JSON.parse(JSON.stringify(o)); };
3+
4+
var CODEMIRROR_SETTINGS = {
5+
value: '',
6+
mode: 'javascript',
7+
tabSize: 2,
8+
lineNumbers: true,
9+
autofocus: true,
10+
foldGutter: true,
11+
gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"]
12+
};
13+
14+
var renderEditor = function (onChange) {
15+
var editor = CodeMirror(el('.js-code-editor'), CODEMIRROR_SETTINGS);
16+
17+
editor.on('change', function () {
18+
onChange(editor.getValue());
19+
});
20+
return editor;
21+
};
22+
var renderOutput = function () {
23+
var settings = clone(CODEMIRROR_SETTINGS), output;
24+
25+
settings.readOnly = true;
26+
settings.cursorBlinkRate = -1;
27+
output = CodeMirror(el('.js-output-editor'), settings);
28+
return output;
29+
};
30+
31+
var init = function () {
32+
var output = renderOutput();
33+
var print = output.setValue.bind(output);
34+
var editor = renderEditor(function (value) {
35+
try {
36+
ast = babylon.parse(value);
37+
print(JSON.stringify(ast, null, 2));
38+
} catch(err) {
39+
print('Error while parsing:\n' + err.message);
40+
}
41+
});
42+
};
43+
44+
window.onload = init;

playground/try-it-out/styles.css

+57
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
html {
2+
box-sizing: border-box;
3+
width: 100%;
4+
height: 100%;
5+
}
6+
*, *:before, *:after {
7+
box-sizing: inherit;
8+
}
9+
body {
10+
margin: 0;
11+
padding: 0;
12+
width: 100%;
13+
height: 100%;
14+
font-family: Arial, Verdana;
15+
color: #000;
16+
background: #fff;
17+
font-size: 16px;
18+
}
19+
.container {
20+
width: 100%;
21+
height: 100%;
22+
position: relative;
23+
}
24+
.left, .right {
25+
width: 50%;
26+
height: 100%;
27+
}
28+
.left {
29+
float: left;
30+
border-right: 1px solid #999;
31+
}
32+
.right {
33+
font-size: 0.7em;
34+
float: right;
35+
}
36+
.right .output {
37+
height: calc(100% - 30px);
38+
overflow-y: auto;
39+
overflow-x: hidden;
40+
}
41+
.error {
42+
color: #9f0000;
43+
font-weight: bold;
44+
}
45+
.CodeMirror {
46+
height: auto;
47+
}
48+
49+
/* output navigation */
50+
.nav-output {
51+
height: 30px;
52+
border-top: 1px solid #ddd;
53+
padding: 5px;
54+
}
55+
.nav-output label {
56+
cursor: pointer;
57+
}
Binary file not shown.
Binary file not shown.
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,105 @@
1+
// CodeMirror, copyright (c) by Marijn Haverbeke and others
2+
// Distributed under an MIT license: http://codemirror.net/LICENSE
3+
4+
(function(mod) {
5+
if (typeof exports == "object" && typeof module == "object") // CommonJS
6+
mod(require("../../lib/codemirror"));
7+
else if (typeof define == "function" && define.amd) // AMD
8+
define(["../../lib/codemirror"], mod);
9+
else // Plain browser env
10+
mod(CodeMirror);
11+
})(function(CodeMirror) {
12+
"use strict";
13+
14+
CodeMirror.registerHelper("fold", "brace", function(cm, start) {
15+
var line = start.line, lineText = cm.getLine(line);
16+
var startCh, tokenType;
17+
18+
function findOpening(openCh) {
19+
for (var at = start.ch, pass = 0;;) {
20+
var found = at <= 0 ? -1 : lineText.lastIndexOf(openCh, at - 1);
21+
if (found == -1) {
22+
if (pass == 1) break;
23+
pass = 1;
24+
at = lineText.length;
25+
continue;
26+
}
27+
if (pass == 1 && found < start.ch) break;
28+
tokenType = cm.getTokenTypeAt(CodeMirror.Pos(line, found + 1));
29+
if (!/^(comment|string)/.test(tokenType)) return found + 1;
30+
at = found - 1;
31+
}
32+
}
33+
34+
var startToken = "{", endToken = "}", startCh = findOpening("{");
35+
if (startCh == null) {
36+
startToken = "[", endToken = "]";
37+
startCh = findOpening("[");
38+
}
39+
40+
if (startCh == null) return;
41+
var count = 1, lastLine = cm.lastLine(), end, endCh;
42+
outer: for (var i = line; i <= lastLine; ++i) {
43+
var text = cm.getLine(i), pos = i == line ? startCh : 0;
44+
for (;;) {
45+
var nextOpen = text.indexOf(startToken, pos), nextClose = text.indexOf(endToken, pos);
46+
if (nextOpen < 0) nextOpen = text.length;
47+
if (nextClose < 0) nextClose = text.length;
48+
pos = Math.min(nextOpen, nextClose);
49+
if (pos == text.length) break;
50+
if (cm.getTokenTypeAt(CodeMirror.Pos(i, pos + 1)) == tokenType) {
51+
if (pos == nextOpen) ++count;
52+
else if (!--count) { end = i; endCh = pos; break outer; }
53+
}
54+
++pos;
55+
}
56+
}
57+
if (end == null || line == end && endCh == startCh) return;
58+
return {from: CodeMirror.Pos(line, startCh),
59+
to: CodeMirror.Pos(end, endCh)};
60+
});
61+
62+
CodeMirror.registerHelper("fold", "import", function(cm, start) {
63+
function hasImport(line) {
64+
if (line < cm.firstLine() || line > cm.lastLine()) return null;
65+
var start = cm.getTokenAt(CodeMirror.Pos(line, 1));
66+
if (!/\S/.test(start.string)) start = cm.getTokenAt(CodeMirror.Pos(line, start.end + 1));
67+
if (start.type != "keyword" || start.string != "import") return null;
68+
// Now find closing semicolon, return its position
69+
for (var i = line, e = Math.min(cm.lastLine(), line + 10); i <= e; ++i) {
70+
var text = cm.getLine(i), semi = text.indexOf(";");
71+
if (semi != -1) return {startCh: start.end, end: CodeMirror.Pos(i, semi)};
72+
}
73+
}
74+
75+
var start = start.line, has = hasImport(start), prev;
76+
if (!has || hasImport(start - 1) || ((prev = hasImport(start - 2)) && prev.end.line == start - 1))
77+
return null;
78+
for (var end = has.end;;) {
79+
var next = hasImport(end.line + 1);
80+
if (next == null) break;
81+
end = next.end;
82+
}
83+
return {from: cm.clipPos(CodeMirror.Pos(start, has.startCh + 1)), to: end};
84+
});
85+
86+
CodeMirror.registerHelper("fold", "include", function(cm, start) {
87+
function hasInclude(line) {
88+
if (line < cm.firstLine() || line > cm.lastLine()) return null;
89+
var start = cm.getTokenAt(CodeMirror.Pos(line, 1));
90+
if (!/\S/.test(start.string)) start = cm.getTokenAt(CodeMirror.Pos(line, start.end + 1));
91+
if (start.type == "meta" && start.string.slice(0, 8) == "#include") return start.start + 8;
92+
}
93+
94+
var start = start.line, has = hasInclude(start);
95+
if (has == null || hasInclude(start - 1) != null) return null;
96+
for (var end = start;;) {
97+
var next = hasInclude(end + 1);
98+
if (next == null) break;
99+
++end;
100+
}
101+
return {from: CodeMirror.Pos(start, has + 1),
102+
to: cm.clipPos(CodeMirror.Pos(end))};
103+
});
104+
105+
});
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
// CodeMirror, copyright (c) by Marijn Haverbeke and others
2+
// Distributed under an MIT license: http://codemirror.net/LICENSE
3+
4+
(function(mod) {
5+
if (typeof exports == "object" && typeof module == "object") // CommonJS
6+
mod(require("../../lib/codemirror"));
7+
else if (typeof define == "function" && define.amd) // AMD
8+
define(["../../lib/codemirror"], mod);
9+
else // Plain browser env
10+
mod(CodeMirror);
11+
})(function(CodeMirror) {
12+
"use strict";
13+
14+
CodeMirror.registerGlobalHelper("fold", "comment", function(mode) {
15+
return mode.blockCommentStart && mode.blockCommentEnd;
16+
}, function(cm, start) {
17+
var mode = cm.getModeAt(start), startToken = mode.blockCommentStart, endToken = mode.blockCommentEnd;
18+
if (!startToken || !endToken) return;
19+
var line = start.line, lineText = cm.getLine(line);
20+
21+
var startCh;
22+
for (var at = start.ch, pass = 0;;) {
23+
var found = at <= 0 ? -1 : lineText.lastIndexOf(startToken, at - 1);
24+
if (found == -1) {
25+
if (pass == 1) return;
26+
pass = 1;
27+
at = lineText.length;
28+
continue;
29+
}
30+
if (pass == 1 && found < start.ch) return;
31+
if (/comment/.test(cm.getTokenTypeAt(CodeMirror.Pos(line, found + 1))) &&
32+
(lineText.slice(found - endToken.length, found) == endToken ||
33+
!/comment/.test(cm.getTokenTypeAt(CodeMirror.Pos(line, found))))) {
34+
startCh = found + startToken.length;
35+
break;
36+
}
37+
at = found - 1;
38+
}
39+
40+
var depth = 1, lastLine = cm.lastLine(), end, endCh;
41+
outer: for (var i = line; i <= lastLine; ++i) {
42+
var text = cm.getLine(i), pos = i == line ? startCh : 0;
43+
for (;;) {
44+
var nextOpen = text.indexOf(startToken, pos), nextClose = text.indexOf(endToken, pos);
45+
if (nextOpen < 0) nextOpen = text.length;
46+
if (nextClose < 0) nextClose = text.length;
47+
pos = Math.min(nextOpen, nextClose);
48+
if (pos == text.length) break;
49+
if (pos == nextOpen) ++depth;
50+
else if (!--depth) { end = i; endCh = pos; break outer; }
51+
++pos;
52+
}
53+
}
54+
if (end == null || line == end && endCh == startCh) return;
55+
return {from: CodeMirror.Pos(line, startCh),
56+
to: CodeMirror.Pos(end, endCh)};
57+
});
58+
59+
});

0 commit comments

Comments
 (0)