Skip to content

updates to index #8

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 7 commits into
base: master
Choose a base branch
from
Open

updates to index #8

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
eb2c0b6
Update index.js
cgousley May 10, 2018
31d44e7
Merge pull request #1 from cgousley/cgousley-images-only
cgousley May 10, 2018
3124dd2
Update index.js
cgousley May 11, 2018
06e5a8b
Merge pull request #2 from cgousley/master
cgousley May 15, 2018
edceaa3
updated package.json to work with my fork
cgousley May 15, 2018
8b29639
Merge pull request #3 from cgousley/cgousley-images-only
cgousley May 15, 2018
78f8b18
.
cgousley May 15, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
145 changes: 80 additions & 65 deletions index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,85 +6,100 @@ var through = require('through'),

// from http://stackoverflow.com/questions/17191265/legal-characters-for-sass-and-scss-variable-names
var escapableCharactersRegex = /(["!#$%&\'()*+,.\/:;\s<=>?@\[\]^\{\}|~])/g;
function replaceEscapableCharacters(str) {
return str.replace(escapableCharactersRegex, function(a,b) {
return '\\' + b;
});

function replaceEscapableCharacters(str) {
return str.replace(escapableCharactersRegex, function (a, b) {
return '\\' + b;
});
}
var firstCharacterIsNumber = /^[0-9]/;

module.exports = function(opt) {
opt = opt || {};
opt.delim = opt.delim || '-';
opt.sass = !!opt.sass;
opt.eol = opt.sass ? '' : ';';
opt.ignoreJsonErrors = !!opt.ignoreJsonErrors;
opt.escapeIllegalCharacters = opt.escapeIllegalCharacters === undefined ? true : opt.escapeIllegalCharacters;
opt.firstCharacter = opt.firstCharacter || '_';
opt.prefixFirstNumericCharacter = opt.prefixFirstNumericCharacter === undefined ? true : opt.prefixFirstNumericCharacter;

return through(processJSON);

/////////////

function processJSON(file) {

// if it does not have a .json suffix, ignore the file
if (!gulpmatch(file,'**/*.json')) {
this.push(file);
return;
}
module.exports = function (opt) {
opt = opt || {};
opt.delim = opt.delim || '-';
opt.sass = !!opt.sass;
opt.eol = opt.sass ? '' : ';';
opt.ignoreJsonErrors = !!opt.ignoreJsonErrors;
opt.escapeIllegalCharacters = opt.escapeIllegalCharacters === undefined ? true : opt.escapeIllegalCharacters;
opt.firstCharacter = opt.firstCharacter || '_';
opt.prefixFirstNumericCharacter = opt.prefixFirstNumericCharacter === undefined ? true : opt.prefixFirstNumericCharacter;

// load the JSON
try {
var parsedJSON = JSON.parse(file.contents);
} catch (e) {
if (opt.ignoreJsonErrors) {
console.log(chalk.red('[gulp-json-sass]') + ' Invalid JSON in ' + file.path + '. (Continuing.)');
} else {
console.log(chalk.red('[gulp-json-sass]') + ' Invalid JSON in ' + file.path);
this.emit('error', e);
}
return;
}
return through(processJSON);

// process the JSON
var sassVariables = [];
/////////////

loadVariablesRecursive(parsedJSON, '', function pushVariable(assignmentString) {
sassVariables.push(assignmentString);
});
function processJSON(file) {

var sass = sassVariables.join('\n');
file.contents = Buffer.from(sass);
// if it does not have a .json suffix, ignore the file
if (!gulpmatch(file, '**/*.json')) {
this.push(file);
return;
}

file.path = gutil.replaceExtension(file.path, opt.sass ? '.sass' : '.scss');
// load the JSON
try {
var parsedJSON = JSON.parse(file.contents);
} catch (e) {
if (opt.ignoreJsonErrors) {
console.log(chalk.red('[gulp-json-sass]') + ' Invalid JSON in ' + file.path + '. (Continuing.)');
} else {
console.log(chalk.red('[gulp-json-sass]') + ' Invalid JSON in ' + file.path);
this.emit('error', e);
}
return;
}

this.push(file);
}
// process the JSON
var sassVariables = [];
var images = parsedJSON.images;
loadVariablesRecursive(images, '', function pushVariable(assignmentString) {
console.log(assignmentString);
sassVariables.push(assignmentString);
});

function loadVariablesRecursive(obj, path, cb) {
for (var key in obj) {
if (obj.hasOwnProperty(key)) {
var val = obj[key];
var sass = sassVariables.join('\n');
file.contents = Buffer.from(sass);

// escape invalid sass characters
if (opt.escapeIllegalCharacters) {
key = replaceEscapableCharacters(key);
}
file.path = gutil.replaceExtension(file.path, opt.sass ? '.sass' : '.scss');

// sass variables cannot begin with a number
if (path === '' && firstCharacterIsNumber.exec(key) && opt.prefixFirstNumericCharacter) {
key = opt.firstCharacter + key;
}
this.push(file);
}

if (typeof val !== 'object') {
cb('$' + path + key + ': ' + val + opt.eol);
} else {
loadVariablesRecursive(val, path + key + opt.delim, cb);
function loadVariablesRecursive(obj, path, cb) {
for (var key in obj) {
if (obj.hasOwnProperty(key)) {
var val = obj[key];

// escape invalid sass characters
if (opt.escapeIllegalCharacters) {
key = replaceEscapableCharacters(key);
}

// sass variables cannot begin with a number
if (path === '' && firstCharacterIsNumber.exec(key) && opt.prefixFirstNumericCharacter) {
key = opt.firstCharacter + key;
}
var isObject = typeof val !== 'object';
var isArray = Array.isArray(val);



if (isObject & !isArray) {
cb('$' + path + key + ': ' + val + opt.eol);
} else if (isArray) {

if (typeof (val[0]) === "string") {
cb('$' + path + key + ': ' + val[0] + opt.eol);
} else {
loadVariablesRecursive(val[0], path + key + opt.delim, cb);
}
} else {
loadVariablesRecursive(val, path + key + opt.delim, cb);
}
} else {
console.log(obj);
}
}
}
}
}

}
109 changes: 82 additions & 27 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,40 +1,95 @@
{
"name": "gulp-json-sass",
"description": "Gulp plugin for turning JSON files into files of scss/sass variable definitions.",
"version": "0.0.2",
"scripts": {
"test": "npm run coverage && npm run rm",
"coverage": "istanbul cover test/*.js",
"rm": "rimraf ./coverage"
"_args": [
[
{
"raw": "cgousley/json-images-to-sass",
"scope": null,
"escapedName": null,
"name": null,
"rawSpec": "cgousley/json-images-to-sass",
"spec": "github:cgousley/json-images-to-sass",
"type": "hosted",
"hosted": {
"type": "github",
"ssh": "[email protected]:cgousley/json-images-to-sass.git",
"sshUrl": "git+ssh://[email protected]/cgousley/json-images-to-sass.git",
"httpsUrl": "git+https://github.com/cgousley/json-images-to-sass.git",
"gitUrl": "git://github.com/cgousley/json-images-to-sass.git",
"shortcut": "github:cgousley/json-images-to-sass",
"directUrl": "https://raw.githubusercontent.com/cgousley/json-images-to-sass/master/package.json"
}
}
]
],
"_from": "cgousley/json-images-to-sass",
"_inCache": true,
"_location": "/gulp-json-sass",
"_phantomChildren": {
"escape-string-regexp": "1.0.5",
"sigmund": "1.0.1"
},
"repository": {
"type": "git",
"url": "https://github.com/rbalicki2/gulp-json-sass"
"_requested": {
"raw": "cgousley/json-images-to-sass",
"scope": null,
"escapedName": null,
"name": null,
"rawSpec": "cgousley/json-images-to-sass",
"spec": "github:cgousley/json-images-to-sass",
"type": "hosted",
"hosted": {
"type": "github",
"ssh": "[email protected]:cgousley/json-images-to-sass.git",
"sshUrl": "git+ssh://[email protected]/cgousley/json-images-to-sass.git",
"httpsUrl": "git+https://github.com/cgousley/json-images-to-sass.git",
"gitUrl": "git://github.com/cgousley/json-images-to-sass.git",
"shortcut": "github:cgousley/json-images-to-sass",
"directUrl": "https://raw.githubusercontent.com/cgousley/json-images-to-sass/master/package.json"
}
},
"keywords": [
"gulp",
"json",
"sass",
"scss",
"css"
"_requiredBy": [
"#USER",
"/"
],
"bugs": {
"url": "https://github.com/rbalicki2/gulp-json-sass/issues"
"_resolved": "git://github.com/cgousley/json-images-to-sass.git#8b296397608c5b68a081ce60cacf98d361976cf1",
"_shasum": "19a3475dbedd3e736af0b199262971e46f971774",
"_shrinkwrap": null,
"_spec": "cgousley/json-images-to-sass",
"dependencies": {
"chalk": "^0.5.1",
"gulp-match": "^0.2.0",
"gulp-util": "^3.0.0",
"through": "^2.3.4"
},
"homepage": "https://github.com/rbalicki2/gulp-json-sass",
"main": "index.js",
"license": "MIT",
"description": "Gulp plugin for turning JSON files into files of scss/sass variable definitions.",
"devDependencies": {
"gulp": "^3.8.6",
"gulp-concat": "^2.3.4",
"gulp-ruby-sass": "^0.7.1",
"tape": "^2.14.0",
"through2": "^0.5.1"
},
"dependencies": {
"chalk": "^0.5.1",
"gulp-match": "^0.2.0",
"gulp-util": "^3.0.0",
"through": "^2.3.4"
}
"gitHead": "8b296397608c5b68a081ce60cacf98d361976cf1",
"homepage": "https://github.com/cgousley/json-images-to-sass",
"keywords": [
"gulp",
"json",
"sass",
"scss",
"css"
],
"license": "MIT",
"main": "index.js",
"name": "gulp-json-sass",
"optionalDependencies": {},
"readmeFilename": "readme.md",
"repository": {
"type": "git",
"url": "https://github.com/cgousley/json-images-to-sass.git"
},
"scripts": {
"coverage": "istanbul cover test/*.js",
"rm": "rimraf ./coverage",
"test": "npm run coverage && npm run rm"
},
"version": "0.0.2"
}