From f6cc469bf8090c95a8e678441ac858fa0c325193 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jarno=20Le=20Cont=C3=A9?= Date: Sat, 1 Jul 2017 13:16:10 +0200 Subject: [PATCH 1/4] Add export to JSON. --- lib/stylesheet/index.js | 1 + lib/stylesheet/templates/json.tpl | 4 ++++ 2 files changed, 5 insertions(+) create mode 100644 lib/stylesheet/templates/json.tpl diff --git a/lib/stylesheet/index.js b/lib/stylesheet/index.js index aa58eb4..2d37bf8 100644 --- a/lib/stylesheet/index.js +++ b/lib/stylesheet/index.js @@ -11,6 +11,7 @@ function readTemplatedStylesheetFromFile(file) { module.exports = { css: readTemplatedStylesheetFromFile(path.join(__dirname, '/templates/css.tpl')), javascript: readTemplatedStylesheetFromFile(path.join(__dirname, '/templates/javascript.tpl')), + json: readTemplatedStylesheetFromFile(path.join(__dirname, '/templates/json.tpl')), less: readTemplatedStylesheetFromFile(path.join(__dirname, '/templates/less.tpl')), 'prefixed-css': require('./prefixed-css'), sass: readTemplatedStylesheetFromFile(path.join(__dirname, '/templates/sass.tpl')), diff --git a/lib/stylesheet/templates/json.tpl b/lib/stylesheet/templates/json.tpl new file mode 100644 index 0000000..43c62c5 --- /dev/null +++ b/lib/stylesheet/templates/json.tpl @@ -0,0 +1,4 @@ +{ + <% layout.images.forEach(function (image, idx) { %>"<%= image.className %>": { "x": <%= image.x %>, "y": <%= image.y %>, "width": <%= image.width %>, "height": <%= image.height %> }<% if (idx !== layout.images.length - 1) { %>,<% } %> + <% }); %> +} \ No newline at end of file From d80802c08e0de96691878911f3d74f4b009dd449 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jarno=20Le=20Cont=C3=A9?= Date: Sat, 1 Jul 2017 13:24:32 +0200 Subject: [PATCH 2/4] Add tests for export to JSON. --- test/fixtures/stylesheets/json/no-options.json | 6 ++++++ test/fixtures/stylesheets/json/with-nameMapping.json | 6 ++++++ test/fixtures/stylesheets/json/with-pixelRatio.json | 6 ++++++ test/fixtures/stylesheets/json/with-prefix.json | 6 ++++++ test/fixtures/stylesheets/json/with-spritePath.json | 6 ++++++ test/specs/stylesheet/json.js | 5 +++++ 6 files changed, 35 insertions(+) create mode 100644 test/fixtures/stylesheets/json/no-options.json create mode 100644 test/fixtures/stylesheets/json/with-nameMapping.json create mode 100644 test/fixtures/stylesheets/json/with-pixelRatio.json create mode 100644 test/fixtures/stylesheets/json/with-prefix.json create mode 100644 test/fixtures/stylesheets/json/with-spritePath.json create mode 100644 test/specs/stylesheet/json.js diff --git a/test/fixtures/stylesheets/json/no-options.json b/test/fixtures/stylesheets/json/no-options.json new file mode 100644 index 0000000..a2f5e80 --- /dev/null +++ b/test/fixtures/stylesheets/json/no-options.json @@ -0,0 +1,6 @@ +{ + "foo": { "x": 0, "y": 0, "width": 150, "height": 12 }, + "bar": { "x": 0, "y": 12, "width": 150, "height": 24 }, + "test": { "x": 0, "y": 36, "width": 150, "height": 12 } + +} \ No newline at end of file diff --git a/test/fixtures/stylesheets/json/with-nameMapping.json b/test/fixtures/stylesheets/json/with-nameMapping.json new file mode 100644 index 0000000..643831b --- /dev/null +++ b/test/fixtures/stylesheets/json/with-nameMapping.json @@ -0,0 +1,6 @@ +{ + "oof": { "x": 0, "y": 0, "width": 150, "height": 12 }, + "rab": { "x": 0, "y": 12, "width": 150, "height": 24 }, + "tset": { "x": 0, "y": 36, "width": 150, "height": 12 } + +} \ No newline at end of file diff --git a/test/fixtures/stylesheets/json/with-pixelRatio.json b/test/fixtures/stylesheets/json/with-pixelRatio.json new file mode 100644 index 0000000..88e1951 --- /dev/null +++ b/test/fixtures/stylesheets/json/with-pixelRatio.json @@ -0,0 +1,6 @@ +{ + "foo": { "x": 0, "y": 0, "width": 75, "height": 6 }, + "bar": { "x": 0, "y": 6, "width": 75, "height": 12 }, + "test": { "x": 0, "y": 18, "width": 75, "height": 6 } + +} \ No newline at end of file diff --git a/test/fixtures/stylesheets/json/with-prefix.json b/test/fixtures/stylesheets/json/with-prefix.json new file mode 100644 index 0000000..3999ea8 --- /dev/null +++ b/test/fixtures/stylesheets/json/with-prefix.json @@ -0,0 +1,6 @@ +{ + "prefix-foo": { "x": 0, "y": 0, "width": 150, "height": 12 }, + "prefix-bar": { "x": 0, "y": 12, "width": 150, "height": 24 }, + "prefix-test": { "x": 0, "y": 36, "width": 150, "height": 12 } + +} \ No newline at end of file diff --git a/test/fixtures/stylesheets/json/with-spritePath.json b/test/fixtures/stylesheets/json/with-spritePath.json new file mode 100644 index 0000000..a2f5e80 --- /dev/null +++ b/test/fixtures/stylesheets/json/with-spritePath.json @@ -0,0 +1,6 @@ +{ + "foo": { "x": 0, "y": 0, "width": 150, "height": 12 }, + "bar": { "x": 0, "y": 12, "width": 150, "height": 24 }, + "test": { "x": 0, "y": 36, "width": 150, "height": 12 } + +} \ No newline at end of file diff --git a/test/specs/stylesheet/json.js b/test/specs/stylesheet/json.js new file mode 100644 index 0000000..d79a35f --- /dev/null +++ b/test/specs/stylesheet/json.js @@ -0,0 +1,5 @@ +'use strict'; + +var testTemplatedStylesheet = require('./testTemplatedStylesheet'); + +testTemplatedStylesheet('json'); From 23f1a3a7da71544bbb37e225aa36061aefdc1133 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jarno=20Le=20Cont=C3=A9?= Date: Sat, 1 Jul 2017 13:28:25 +0200 Subject: [PATCH 3/4] Update README.md with export to json option --- README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/README.md b/README.md index 6aeec03..7cbdcd4 100644 --- a/README.md +++ b/README.md @@ -115,6 +115,7 @@ Built-in formats: - `'css'`: http://www.w3.org/Style/CSS/ - `'prefixed-css'`: A version of `'css'` that generates a smaller stylesheet but requires the use of the `'prefix'` stylesheet option - `'javascript'`: Creates a file that exports javascrip object with sprites data. +- `'json'`: Creates a json file with sprites data. #### options.stylesheetOptions Type: `Object` From 4662f4e00014fc58ae6184550216c226f4cb0639 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jarno=20Le=20Cont=C3=A9?= Date: Sat, 1 Jul 2017 13:48:31 +0200 Subject: [PATCH 4/4] Fix tests for export to JSON. --- test/fixtures/stylesheets/json/no-options.json | 2 +- test/fixtures/stylesheets/json/with-nameMapping.json | 2 +- test/fixtures/stylesheets/json/with-pixelRatio.json | 2 +- test/fixtures/stylesheets/json/with-prefix.json | 2 +- test/fixtures/stylesheets/json/with-spritePath.json | 2 +- 5 files changed, 5 insertions(+), 5 deletions(-) diff --git a/test/fixtures/stylesheets/json/no-options.json b/test/fixtures/stylesheets/json/no-options.json index a2f5e80..5d89074 100644 --- a/test/fixtures/stylesheets/json/no-options.json +++ b/test/fixtures/stylesheets/json/no-options.json @@ -2,5 +2,5 @@ "foo": { "x": 0, "y": 0, "width": 150, "height": 12 }, "bar": { "x": 0, "y": 12, "width": 150, "height": 24 }, "test": { "x": 0, "y": 36, "width": 150, "height": 12 } - + } \ No newline at end of file diff --git a/test/fixtures/stylesheets/json/with-nameMapping.json b/test/fixtures/stylesheets/json/with-nameMapping.json index 643831b..89acd9c 100644 --- a/test/fixtures/stylesheets/json/with-nameMapping.json +++ b/test/fixtures/stylesheets/json/with-nameMapping.json @@ -2,5 +2,5 @@ "oof": { "x": 0, "y": 0, "width": 150, "height": 12 }, "rab": { "x": 0, "y": 12, "width": 150, "height": 24 }, "tset": { "x": 0, "y": 36, "width": 150, "height": 12 } - + } \ No newline at end of file diff --git a/test/fixtures/stylesheets/json/with-pixelRatio.json b/test/fixtures/stylesheets/json/with-pixelRatio.json index 88e1951..14e9592 100644 --- a/test/fixtures/stylesheets/json/with-pixelRatio.json +++ b/test/fixtures/stylesheets/json/with-pixelRatio.json @@ -2,5 +2,5 @@ "foo": { "x": 0, "y": 0, "width": 75, "height": 6 }, "bar": { "x": 0, "y": 6, "width": 75, "height": 12 }, "test": { "x": 0, "y": 18, "width": 75, "height": 6 } - + } \ No newline at end of file diff --git a/test/fixtures/stylesheets/json/with-prefix.json b/test/fixtures/stylesheets/json/with-prefix.json index 3999ea8..df8d5e9 100644 --- a/test/fixtures/stylesheets/json/with-prefix.json +++ b/test/fixtures/stylesheets/json/with-prefix.json @@ -2,5 +2,5 @@ "prefix-foo": { "x": 0, "y": 0, "width": 150, "height": 12 }, "prefix-bar": { "x": 0, "y": 12, "width": 150, "height": 24 }, "prefix-test": { "x": 0, "y": 36, "width": 150, "height": 12 } - + } \ No newline at end of file diff --git a/test/fixtures/stylesheets/json/with-spritePath.json b/test/fixtures/stylesheets/json/with-spritePath.json index a2f5e80..5d89074 100644 --- a/test/fixtures/stylesheets/json/with-spritePath.json +++ b/test/fixtures/stylesheets/json/with-spritePath.json @@ -2,5 +2,5 @@ "foo": { "x": 0, "y": 0, "width": 150, "height": 12 }, "bar": { "x": 0, "y": 12, "width": 150, "height": 24 }, "test": { "x": 0, "y": 36, "width": 150, "height": 12 } - + } \ No newline at end of file