parata - npm Package Compare versions

Comparing version 0.0.2 to 0.0.3

CHANGELOG.md

@@ -5,2 +5,6 @@ ## 0.0.2 (June 20, 2015)
 - Few css changes for the component template.
--
+
+## 0.0.3 (June 30, 2015)
+
+Added:
+- Separated attribute setter / getter for a component using `Attr`.

Gruntfile.js

@@ -20,8 +20,7 @@ module.exports = function(grunt) {
 
-  // Load Sass task
-  grunt.loadNpmTasks('grunt-contrib-sass');
-
+  // Load grunt mocha task
   grunt.loadNpmTasks('grunt-mocha-test');
 
+  // Register tasks
   grunt.registerTask('test', 'mochaTest');
 };

lib/component.js

 var fs = require('fs-extra'),
     path = require('path'),
-    Handlebars = require('handlebars');
+    Handlebars = require('handlebars'),
+    Attr = require('./attr.js');
 
-module.exports = function(config) {
+/**
+ *  Component
+ */
+module.exports = function() {
   var that = this,
-      attributes;
+      attr;
 
-  attributes = {
+  // Create data attributes for the component
+  that.attr = attr = new Attr();
+
+  // Default attributes for the component
+  attr.load({
     name: null,
@@ -15,22 +23,28 @@ description: null,
     scriptExample: null,
-    examples: []
-  };
+    examples: null
+  });
 
-  // Return constructed markup for the component
+  /**
+   *  @method generateExampleMarkup
+   *  Generate HTML markup for the example and set the `examples` attribute
+   */
   that.generateExampleMarkup = function() {
-    var variants = attributes.variants,
+    var variants = attr.get('variants'),
         i, length,
-        template = Handlebars.compile(attributes.rawExample),
+        template = Handlebars.compile(attr.get('rawExample')),
         data = {
-          name: attributes.name,
+          name: attr.get('name'),
           variant: ''
         },
-        scriptExample = null;
+        scriptExample = null,
+        examples = [];
 
-    if(attributes.scriptExample) {
-      scriptExample = attributes.scriptExample;
+    if(attr.get('scriptExample')) {
+      scriptExample = attr.get('scriptExample');
     }
 
+    // If multiple variants are available then build
+    // an example for each
     if(variants.length < 1) {
-      attributes.examples.push({
+      examples.push({
         variant: '',
@@ -44,3 +58,3 @@ code: template(data),
         data.variant = variants[i];
-        attributes.examples.push({
+        examples.push({
           variant: variants[i],
@@ -53,16 +67,7 @@ code: template(data),
 
+    // Set the `examples` attribute
+    attr.set('examples', examples);
+
     return this;
   };
-
-  // Set an attribute that will be serialized
-  that.setAttribute = function(key, value) {
-    attributes[key] = value;
-
-    return that;
-  };
-
-  // Return all attributes
-  that.getAttributes = function() {
-    return attributes;
-  }
 };

lib/parser.js

 var fs = require('fs-extra'),
     Component = require('../lib/component.js');
 
+/**
+ *  Parser
+ *  Parses the contents from a file and creates an object
+ */
 function Parser() {
@@ -12,2 +16,6 @@ var that = this,
 
+  /*
+   * @method setExampleFilePath
+   * Sets the example file path for a given component item
+   */
   that.setExampleFilePath = function(_exampleFilePath) {
@@ -20,2 +28,6 @@ exampleFilePath = _exampleFilePath;
 
+  /*
+   * @method setStyleFilePath
+   * Sets the style file path for a given component item
+   */
   that.setStyleFilePath = function(_styleFilePath) {
@@ -28,2 +40,6 @@ styleFilePath = _styleFilePath;
 
+  /**
+   * @method run
+   * Main method that gets called to create an object of parsed contents
+   */
   that.run = function() {
@@ -38,9 +54,15 @@ var pattern = /\/\*\*([\s\S]+?)\*\//gi,
       name = this.parseName(match);
-      component.setAttribute('name', name)
-               .setAttribute('description', this.parseDescription(match))
-               .setAttribute('variants', this.parseVariants(match))
-               .setAttribute('rawExample', this.parseHTMLExample(name))
-               .setAttribute('scriptExample', this.parseJSExample(name))
-               .generateExampleMarkup();
 
+      // Set component attributes
+      component.attr
+               .set('name', name)
+               .set('description', this.parseDescription(match))
+               .set('variants', this.parseVariants(match))
+               .set('rawExample', this.parseHTMLExample(name))
+               .set('scriptExample', this.parseJSExample(name));
+
+
+      // Compile and generate the example markup
+      component.generateExampleMarkup();
+
       components.push(component);
@@ -52,2 +74,6 @@ }
 
+  /**
+   *  @method getComponents
+   *  Returns a list of all components
+   */
   that.getComponents = function() {
@@ -57,2 +83,6 @@ return components;
 
+  /**
+   * @method parseName
+   * Parse the name for a component from the input
+   */
   that.parseName = function(input) {
@@ -65,4 +95,10 @@ var pattern = /\*\s*@component\s+(.+)/i,
     }
+
+    return '';
   };
 
+  /**
+   * @method parseDescription
+   * Parse description for the component from the input
+   */
   that.parseDescription = function(input) {
@@ -75,4 +111,10 @@ var pattern = /\*\s*@description\s+(.+)/i,
     }
+
+    return '';
   };
 
+  /**
+   *  @mehtod parseVariants
+   *  Parse different variants usually class names for a stylesheet from the input
+   */
   that.parseVariants = function(input) {
@@ -95,2 +137,6 @@ var pattern = /\s*\*\s*@variants(.+)/i,
 
+  /**
+   *  @mehtod parseHTMLExample
+   *  Parse the html example from the input
+   */
   that.parseHTMLExample = function(name) {
@@ -103,4 +149,10 @@ var pattern = new RegExp('<example\\s*for=\\"' + name + '\\">([\\s\\S]+?)<\\/example>', 'gi'),
     }
+
+    return '';
   };
 
+  /**
+   *  @mehtod parseJSEcample
+   *  Parse javascript example for the given input
+   */
   that.parseJSExample = function(name) {
@@ -113,2 +165,4 @@ var pattern = new RegExp('<script\\s*for=\\"' + name + '\\">([\\s\\S]+?)<\\/script>', 'gi'),
     }
+
+    return '';
   };
@@ -115,0 +169,0 @@ }

lib/template.js

@@ -5,2 +5,11 @@ var fs = require('fs'),
 
+/**
+ *  Handlebars Helpers
+ */
+
+/**
+ *  `link` helper
+ *  Eg.:
+ *  {{link button}} => <a href="button.hrml">BUTTON</a>
+ */
 Handlebars.registerHelper('link', function(name) {
@@ -13,2 +22,10 @@ var result;
 
+/**
+ *  `titleize` helper
+ *  Eg.:
+ *  {{titleize hello}} => HELLO
+ *
+ *  TODO
+ *  Should titlecase it instead of upcasing.
+ */
 Handlebars.registerHelper('titleize', function(name) {
@@ -18,12 +35,23 @@ return new Handlebars.SafeString(name.toUpperCase());
 
+/**
+ *  Template
+ */
 module.exports = {
+
+  /**
+   *  @method generateComponent
+   *  Compile and build a component
+   */
   generateComponent: function(dest, templatePath, component) {
-    var attributes = component.getAttributes(),
-        contents = fs.readFileSync(templatePath, 'utf8');
+    var contents = fs.readFileSync(templatePath, 'utf8'),
         template = Handlebars.compile(contents),
-        result = template(attributes);
+        result = template(component.attr.dump());
 
-    fs.writeFileSync(path.join(dest, attributes.name + '.html'), result);
+    fs.writeFileSync(path.join(dest, component.attr.get('name') + '.html'), result);
   },
 
+  /**
+   *  @method generateIndex
+   *  Compile and build the main index page
+   */
   generateIndex: function(dest, templatePath, components) {
@@ -30,0 +58,0 @@ var contents = fs.readFileSync(templatePath, 'utf8'),

package.json

 {
   "name": "parata",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "description": "Component based style guide for the web.",
@@ -5,0 +5,0 @@ "main": "./lib/parata.js",

README.md

 # Parata
+
+[![Circle CI](https://circleci.com/gh/cybrilla/parata.svg?style=svg)](https://circleci.com/gh/cybrilla/parata)
+[![Code Climate](https://codeclimate.com/github/cybrilla/parata/badges/gpa.svg)](https://codeclimate.com/github/cybrilla/parata)
+
 Component based styles for the web. Parata enforces you to build re-usable components for the web and generates a component wise styleguide.
@@ -141,1 +145,2 @@
 `serverPort`          :    Default port the `serve` task.
+

tasks/lib/build.js

@@ -63,5 +63,5 @@ var fs = require('fs-extra'),
 var generateIndexFile = function(_components, dest, templatePath) {
-  var components = _components.map(function(c) { return c.getAttributes() });
+  var components = _components.map(function(c) { return c.attr.dump() });
 
   template.generateIndex(dest, templatePath, components);
 };

testbox/Gruntfile.js

@@ -7,32 +7,21 @@ module.exports = function(grunt) {
       options: {
-      }
+      },
     },
+
     sass: {
       dist: {
         files: {
-          'dist/app.dist.css': 'components/app.scss'
+          'dist/app.dist.css': 'components/**/*.scss'
         }
       }
-    },
-    copy: {
-      main: {
-        files: [
-          // flattens results to a single level
-          {expand: true, flatten: true, src: ['img/**/*'], dest: 'dist/', filter: 'isFile'},
-          {expand: true, flatten: true, src: ['fonts/**/*'], dest: 'dist/', filter: 'isFile'},
-        ],
-      }
-    },
+    }
   });
 
   // Load the plugin that provides the "uglify" task.
+  grunt.loadNpmTasks('grunt-contrib-sass');
   grunt.loadNpmTasks('parata');
 
-  grunt.loadNpmTasks('grunt-contrib-sass');
-
-  grunt.loadNpmTasks('grunt-contrib-copy');
-
   // Default task(s).
-  // grunt.registerTask('default', ['uglify']);
+  grunt.registerTask('default', ['uglify']);
 
 };

testbox/package.json

@@ -13,6 +13,4 @@ {
     "grunt": "^0.4.5",
-    "grunt-contrib-copy": "^0.8.0",
-    "grunt-contrib-sass": "^0.9.2",
-    "parata": "0.0.1"
+    "grunt-contrib-sass": "^0.9.2"
   }
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Native code

Supply chain risk

Contains native code (e.g., compiled binaries or shared libraries). Including native code can obscure malicious behavior.

Found 5 instances in 1 package

Improved metrics

Lines of code

521

increased by29.93%

Number of lines in readme file

146

increased by3.55%

Number of medium supply chain risk alerts

3

decreased by-62.5%

Worsened metrics

Total package byte prevSize

34136

decreased by-88.28%

Number of package files

34

decreased by-15%

No dependency changes