diff options
Diffstat (limited to 'utils')
-rw-r--r-- | utils/build-demo.js | 73 | ||||
-rw-r--r-- | utils/create-icon-map.js | 26 | ||||
-rw-r--r-- | utils/create-svg-icons-map.js | 95 | ||||
-rw-r--r-- | utils/index-for-gh-pages.html | 98 | ||||
-rw-r--r-- | utils/main-page.html | 62 | ||||
-rw-r--r-- | utils/scripts/map-sources.js | 9 |
6 files changed, 0 insertions, 363 deletions
diff --git a/utils/build-demo.js b/utils/build-demo.js deleted file mode 100644 index 8f5edda..0000000 --- a/utils/build-demo.js +++ /dev/null @@ -1,73 +0,0 @@ -const ncp = require('ncp').ncp; -const fs = require('fs'); -const path = require('path') -const svgFolder = './assets/icons'; -const svgOutputFile = './src/style/scss/common/_icons.scss'; - -var copyFiles = function() { - // Copy generated style.css to demo/gen folder - ncp('lib/css/style.css', 'demo/gen', function (err) { - if (err) { - return console.error(err); - } - }); - - // Copy assets folder to demo/gen folder - ncp('assets', 'demo/gen/assets', function (err) { - if (err) { - return console.error(err); - } - }); -}; - -// var parseSvgContent = function(content) { -// var withoutLines = (content+'').replace(/\n|\t|\r/g, ''); -// return withoutLines.replace(/"/g,'\''); -// }; - -// var readFile = function(filePath) { -// return fs.readFileSync(filePath, 'utf8'); -// }; - -// var clearFile = function(filePath) { -// return fs.truncateSync(filePath, 0); -// }; - -// var writeFile = function(filePath){ -// const text = `.sdc-icon { -// display: inline-block; -// text-rendering: auto; -// -webkit-font-smoothing: antialiased; -// -moz-osx-font-smoothing: grayscale; -// width: 16px; -// height: 16px; -// }\n`; -// fs.writeFileSync(filePath, text); -// console.log("The file was saved!"); -// }; - -// var appendSvgIcons = function(content) { -// fs.appendFileSync(svgOutputFile, content); -// }; - -// var readFolder = function(folderPath) { -// var files = fs.readdirSync(svgFolder); -// files.forEach(file => { -// var extension = path.extname(file); -// if (extension ==='.svg'){ -// console.log(folderPath + "/" + file); -// var fileContent = readFile(folderPath + "/" + file); -// var svgContent = parseSvgContent(fileContent); -// var fileName = path.basename(file, '.svg') -// var scssContent = '.sdc-icon-' + fileName + ' {background-image: url("data:image/svg+xml;utf8,' + svgContent + '"); background-repeat: no-repeat;}'; -// appendSvgIcons(scssContent+'\n'); -// } -// }); - -// }; - -// Generate icons.scss file from multiple SVG files -// clearFile(svgOutputFile); -// writeFile(svgOutputFile); -// readFolder(svgFolder); -copyFiles(); diff --git a/utils/create-icon-map.js b/utils/create-icon-map.js deleted file mode 100644 index d980895..0000000 --- a/utils/create-icon-map.js +++ /dev/null @@ -1,26 +0,0 @@ - -const fs = require('fs'); -const path = require('path'); - -const svgFolder = './assets/icons/'; -const iconMapFile = './src/react/utils/iconMap.js'; - -let dataToWrite = ''; -let iconNames = []; - -let iconMapDir = path.dirname(iconMapFile); -if (!fs.existsSync(iconMapDir)) { - fs.mkdirSync(iconMapDir); -}; - -fs.readdirSync(svgFolder).forEach(file => { - let fileName = file.split('.'); - if (fileName[0] && fileName[1] === 'svg') { - dataToWrite += `import ${fileName[0]} from '-!svg-react-loader!../../.${svgFolder}${file}';\n`; - iconNames.push(fileName[0]); - } -}); - -dataToWrite += '\n' + `export default {\n\t${iconNames.join(',\n\t')}\n};`; - -fs.writeFileSync(iconMapFile, dataToWrite); diff --git a/utils/create-svg-icons-map.js b/utils/create-svg-icons-map.js deleted file mode 100644 index aec459c..0000000 --- a/utils/create-svg-icons-map.js +++ /dev/null @@ -1,95 +0,0 @@ -const fs = require('fs'); -const path = require('path'); -const svgFolder = path.resolve(__dirname + '/../assets/sdc-icons/'); -const iconMapFile = path.resolve(__dirname + '/../src/common/icons-map.json'); -const iconMapTSFile = path.resolve(__dirname + '/../src/common/icons-map.ts'); -const disallowedSvgAttributes = ['fill', 'id', 'width', 'height']; -const disallowedSvgStyle = ['fill']; -const disallowedSvgInlineAttributes = ['fill', 'id']; -const disallowedSvgInlineStyle = ['fill']; - -function _escapeStrRegex(str) { - return str.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); -} -function _makeSvgAttributesRegex(attrs) { - return new RegExp(`\s*(${attrs.map(_escapeStrRegex).join('|')})\s*=\s*("|')[^"']*\\2`, 'g'); -} -function _makeSvgStyleRegex(attrs) { - return new RegExp(`\s*${attrs.map(_escapeStrRegex).join('|')}\s*:[^'";]*;?`, 'g'); -} - -// prepare -const disallowedSvgAttributesRegex = _makeSvgAttributesRegex(disallowedSvgAttributes); -const disallowedSvgStyleRegex = _makeSvgStyleRegex(disallowedSvgStyle); -const disallowedSvgInlineAttributesRegex = _makeSvgAttributesRegex(disallowedSvgInlineAttributes); -const disallowedSvgInlineStyleRegex = _makeSvgStyleRegex(disallowedSvgInlineStyle); - -function addIcon(iconsObject, iconName, iconPath) { - let iconContent = fs.readFileSync(iconPath).toString(); - if (!iconContent) { - return; - } - - let iconInfoMsg = ''; - - // clean the first <svg> tag - iconContent = iconContent.replace(/<svg\b[^>]*>/, (svgTag) => { - let cleanedNum = 0; - const disallowedSvgAttributesMatch = svgTag.match(disallowedSvgAttributesRegex); - if (disallowedSvgAttributesMatch) { - svgTag = svgTag.replace(disallowedSvgAttributesRegex, ''); - cleanedNum += disallowedSvgAttributesMatch.length; - } - const disallowedSvgStyleMatch = svgTag.match(disallowedSvgStyleRegex); - if (disallowedSvgStyleMatch) { - svgTag = svgTag.replace(disallowedSvgStyleRegex, ''); - cleanedNum += disallowedSvgStyleMatch.length; - } - iconInfoMsg += 'ADDED'; - if (cleanedNum > 0) { - iconInfoMsg += `\n\t(cleaned ${cleanedNum} attributes and styles)`; - } - return svgTag; - }); - - const disallowedSvgInlineAttributesMatch = iconContent.match(disallowedSvgInlineAttributesRegex); - if (disallowedSvgInlineAttributesMatch) { - iconInfoMsg += `\n\t* CHECK for ${disallowedSvgInlineAttributesMatch.length} inline attributes [${disallowedSvgInlineAttributes.join(', ')}]`; - } - const disallowedSvgInlineStyleMatch = iconContent.match(disallowedSvgInlineStyleRegex); - if (disallowedSvgInlineStyleMatch) { - iconInfoMsg += `\n\t* CHECK for ${disallowedSvgInlineStyleMatch.length} inline styles [${disallowedSvgInlineStyle.join(', ')}]`; - } - - console.log(`# ${iconName}: ${iconInfoMsg}`); - - iconsObject[iconName] = iconContent; -} - -function main() { - const iconMapDir = path.dirname(iconMapFile); - if (!fs.existsSync(iconMapDir)) { - fs.mkdirSync(iconMapDir); - } - - const iconsObject = {}; - fs.readdirSync(svgFolder).forEach((file) => { - const fileName = file.split('.', 2)[0]; - const fileExtension = file.split('.', 2)[1]; - if (fileExtension === 'svg') { - const filePath = svgFolder + '/' + file; - if (fs.existsSync(filePath)) { - addIcon(iconsObject, fileName, filePath); - } - } - }); - - const dataToWrite = JSON.stringify(iconsObject); - - fs.writeFileSync(iconMapFile, dataToWrite); - fs.writeFileSync(iconMapTSFile, `export default ${dataToWrite};`); - - console.log(`Icons Map JSON created! [${iconMapFile}]`); -} - -main(); diff --git a/utils/index-for-gh-pages.html b/utils/index-for-gh-pages.html deleted file mode 100644 index a6d7f63..0000000 --- a/utils/index-for-gh-pages.html +++ /dev/null @@ -1,98 +0,0 @@ -<!DOCTYPE html> -<html> - -<head> - <meta charset="utf-8"> - <meta name="viewport" content="width=device-width, initial-scale=1"> - <meta content="IE=edge" http-equiv="X-UA-Compatible" /> - <title>Storybook</title> - <style> - body, html { - width: 100%; - height: 100%; - padding: 0; - margin: 0; - } - .header { - display: flex; - padding: 18px 40px 0 40px; - } - .logo { - margin-right: 95px; - cursor: pointer; - } - img { - width: 125px; - height: 26px; - } - .showcase-header { - display: flex; - } - .case-tab-name { - font-family: OpenSans, OpenSans-Regular, 'Open Sans', Arial, sans-serif; - font-size: 14px; - line-height: 1.71; - letter-spacing: -0.2px; - margin: 0 20px; - padding: 4px 8px 12px 8px; - color: #5a5a5a; - cursor: pointer; - text-transform: uppercase; - } - .case-tab-name[active=true] { - color: #009fdb; - border-bottom: solid 2px #009fdb; - } - .showcase-wrapper { - height: calc(100% - 60px); - display: flex; - flex-direction: column; - background-color: #FFFFFF; - } - .showcase-iframe { - height: 100%; - border-top: solid 1px #aaaaaa; - } - </style> - - <script> - var shows = { - mainPage: "main-page.html", - react: "react/index.html", - angular: "angular/index.html" - }; - function show(type){ - document.getElementById('showcase').src = shows[type]; - setActiveTab(type); - } - function setActiveTab(type) { - var allTabs = document.getElementsByClassName('case-tab-name'); - for(var i = 0; i < allTabs.length; i++ ) { - if(allTabs[i].getAttribute('id') === type+'-tab') { - allTabs[i].setAttribute('active', true); - } - else { - allTabs[i].setAttribute('active', false); - } - } - } - </script> - -</head> - -<body> - <div class="header"> - <div class="logo" onClick="show('mainPage')"><img src="assets/images/logo_onap.png"/></div> - <div class="showcase-header"> - <div class="case-tab-name" id="react-tab" onClick="show('react')">React</div> - <div class="case-tab-name" id="angular-tab" onClick="show('angular')">Angular</div> - </div> - </div> - - <div class="showcase-wrapper"> - <iframe id="showcase" src="main-page.html" class="showcase-iframe"> - </iframe> - </div> -</body> - -</html> diff --git a/utils/main-page.html b/utils/main-page.html deleted file mode 100644 index 30fb10f..0000000 --- a/utils/main-page.html +++ /dev/null @@ -1,62 +0,0 @@ -<!DOCTYPE html> -<html> - - <head> - <meta charset="utf-8"> - <meta name="viewport" content="width=device-width, initial-scale=1"> - <meta content="IE=edge" http-equiv="X-UA-Compatible" /> - <title>Storybook</title> - - <style> - body, html { - width: 100%; - padding: 0; - margin: 0; - } - body { - height: calc(100% - 40px); - display: flex; - flex-direction: column; - background-color: #FFFFFF; - padding: 65px 0; - } - .title, .description { - text-align: center; - align-self: center; - - } - .title { - font-family: OpenSans-Light, 'Open Sans', Arial, sans-serif; - width: 360px; - height: 29px; - font-size: 28px; - font-weight: 300; - line-height: 0.86; - letter-spacing: -0.4px; - color: #191919; - } - .description { - font-family: OpenSans-Regular, 'Open Sans', Arial, sans-serif; - width: 485px; - height: 41px; - font-size: 16px; - line-height: 1.5; - letter-spacing: -0.2px; - color: #5a5a5a; - padding: 28px; - } - .main-page-img { - margin: 15px; - display: flex; - align-self: center; - } - </style> - </head> - - <body> - <div class="title">Welcome to ONAP/UI project!</div> - <div class="description">The aim of this project is to create a basic component library, with a unified UX and UI for both Angular and React based projects.</div> - <img class="main-page-img" src="assets/images/illustration.png"/> - </body> - -</html>
\ No newline at end of file diff --git a/utils/scripts/map-sources.js b/utils/scripts/map-sources.js deleted file mode 100644 index 3ce6bfb..0000000 --- a/utils/scripts/map-sources.js +++ /dev/null @@ -1,9 +0,0 @@ -const sorcery = require('sorcery'); - -const argv = require('yargs') - .alias('f', 'file') - .argv; - -sorcery.load(argv.file).then(function (chain) { - chain.write(); -}); |