haml_to_js 0.1

data/MIT-LICENSE.txt

@@ -0,0 +1,21 @@
+Copyright 2012 Sebastien Drouyer
+https://github.com/sdrdis/haml_to_js
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

data/README.md

@@ -0,0 +1,46 @@
+haml_to_js
+=========
+
+haml_to_js is a ruby library and command line that converts haml to javascript.
+
+Why an other haml to js converter (see similar utilities) ?
+* It is a extension of [haml_to_star](https://github.com/sdrdis/haml_to_star) which purpose is to convert haml into any language
+* This converter is intended for front usage
+* It simplifies debugging (the generated code is readable, a variable hold haml line number so you can know exactly where the problem is)
+* It support features that other don't support (don't hesitate to raise an issue if I am no longer right):
+  * if...else statements
+  * Declarations such as `.first{class: 'second'}` will generate `<div class="first second"></div>`
+  * Support for brackets inside parameters (ex: `%div{key: 'value with bracket}'}`)
+
+Installation
+------------
+
+`gem install haml_to_js`
+
+Usage
+-----
+
+`haml_to_js file` or `haml_to_js < file`
+
+Take a look at integration test cases in order to see what generated code looks like.
+
+The generated code has dependencies; it needs two functions `attrs` and `escape`. It is recommended to include [haml_to_js.js](https://github.com/sdrdis/haml_to_js/blob/master/js/haml_to_js.js).
+
+Contributions
+-------------
+
+This project is hosted on [github](https://github.com/sdrdis/haml_to_js), so don't hesitate to contribute and raise issues.
+
+License
+-------
+
+This project is under MIT License.
+
+Similar utilities
+-----------------
+
+[haml-js](https://github.com/creationix/haml-js)
+
+[client-side-js](https://github.com/uglyog/clientside-haml-js)
+
+[ruby-haml-js](https://github.com/dnagir/ruby-haml-js)

data/Rakefile

@@ -0,0 +1,8 @@
+require 'rake/testtask'
+
+Rake::TestTask.new do |t|
+  t.libs << 'test'
+end
+
+desc "Run tests"
+task :default => :test

data/bin/haml_to_js

@@ -0,0 +1,6 @@
+#!/usr/bin/env ruby
+
+require 'haml_to_js/compiler'
+
+inst = Compiler.new
+puts inst.convert_from_string(ARGF.read)

data/haml_to_js.gemspec

@@ -0,0 +1,24 @@
+Gem::Specification.new do |s|
+  s.name        = 'haml_to_js'
+  s.version     = '0.1'
+  s.date        = '2012-12-27'
+  s.summary     = "haml_to_js is a ruby library and command line that converts haml to javascript."
+  s.add_runtime_dependency('haml_to_star')
+  s.description = <<eos
+haml_to_js is a ruby library and command line that converts haml to javascript.
+
+Why an other haml to js converter (see similar utilities) ?
+* It is a extension of [haml_to_star](https://github.com/sdrdis/haml_to_star) which purpose is to convert haml into any language
+* This converter is intended for front usage
+* It simplifies debugging (the generated code is readable, a variable hold haml line number so you can know exactly where the problem is)
+* It support features that other don't support (don't hesitate to raise an issue if I am no longer right):
+  * if...else statements
+  * Declarations such as `.first{class: 'second'}` will generate `<div class="first second"></div>`
+  * Support for brackets inside parameters (ex: `%div{key: 'value with bracket}'}`)
+eos
+  s.authors     = ["Sébastien Drouyer"]
+  s.email       = 'sdrdis@hotmail.com'
+  s.files       = `git ls-files`.split("\n")
+  s.executables = ['haml_to_js']
+  s.homepage    = 'https://github.com/sdrdis/haml_to_js/'
+end

data/js/haml_to_js.js

@@ -0,0 +1,35 @@
+function escape(str) {
+    return String(str)
+        .replace(/&/g, '&')
+        .replace(/>/g, '>')
+        .replace(/</g, '&lt;')
+        .replace(/"/g, '&quot;')
+}
+
+function attrs(attrs, extended) {
+    if (extended) {
+      if (extended['class']) {
+        if (!attrs['class']) {
+          attrs['class'] = '';
+        }
+        attrs['class'] += extended['class'];
+      }
+      if (extended['id']) {
+        if (!attrs['id']) {
+          attrs['id'] = '';
+        }
+        attrs['id'] = extended['id'] + attrs['id'];
+      }
+    }
+    var buf = []
+    for (var key in attrs)
+        if (typeof attrs[key] === 'boolean') {
+            if (attrs[key] === true)
+                buf.push(key + '="' + key + '"')
+        } else if ($.isPlainObject(attrs[key]) || $.isArray(attrs[key])) {
+            buf.push(key + '="' + escape($.toJSON(attrs[key])) + '"')
+        } else if (attrs[key]) {
+            buf.push(key + '="' + escape(attrs[key]) + '"')
+        }
+    return buf.join(' ')
+}

data/lib/haml_to_js/compiler.rb

@@ -0,0 +1,66 @@
+# HAML-TO-*
+
+# MIT - Sebastien Drouyer
+
+# Why an other haml converter (especially for JS) ?
+#  - others are using global variables, except if you prefix all your variables with this.
+#  - they don't support brackets in parameters : try {value: "test}"}
+#  - we are giving line number so that you can debug your code more easily
+#  - class can't be used on prefix and params on others
+#  - this one is intended to be used in various languages : you can easily use it for others languages as Ruby or C
+
+require 'haml_to_star/compiler'
+
+class Compiler < HamlToStar::Compiler
+
+  def process_dom_params(dom_params)
+    return dom_params.gsub(%r{(for|name|id|class) *:}, '\'\1\':')
+  end
+
+  def process_code_line(line)
+    processed_line = line;
+    processed_line = processed_line.gsub(%r{each *([^ ]*) *: *([^ ]*) *in *([^ ]*)}, 'for (var \1 in \3) { var \2 = \3[\1];')
+    processed_line = processed_line.gsub(%r{each *([^ ]*) *in *([^ ]*)}, 'for (var _$key in \2) { var \1 = \2[_$key];')
+    return {:processed_line => processed_line, :changed => line != processed_line}
+  end
+  
+  def initialize_content(str, content)
+    str << "var #{@variable_name} = '';"
+    str << "var #{@variable_line_name} = 0;"
+    str << content.join("\n")
+  end
+  
+  def add_content(str, content)
+    str << "#{@variable_name} += " + content + ';'
+  end
+  
+  def add_code(str, line, inside)
+    processed_line = process_code_line(line[1..line.size - 1])
+    str << processed_line[:processed_line] + (inside.size > 0 ? '' : ';')
+    if (inside.size > 0)
+      if (!processed_line[:changed])
+        str << '{'
+      end
+      str << inside.join("\n")
+      str << '}'
+    end
+  end
+  
+  def evaluate(line)
+    if (line[0] == '=')
+      return 'escape(' + line[1..line.size - 1] + ')'
+    elsif (line[0..1] == '!=')
+      return line[2..line.size - 1]
+    else
+      return line
+    end
+  end
+  
+  def process_code_line_number(str, code_line_number)
+    str << "#{@variable_line_name} = #{code_line_number};";
+  end
+  
+  def process_inline_code(str, content)
+    str << "#{@variable_name} += " + evaluate(content) + ';'
+  end 
+end

data/test/integration_test.rb

@@ -0,0 +1,19 @@
+require 'test/unit'
+require 'haml_to_js/compiler'
+
+class IntegrationTest < Test::Unit::TestCase
+  def test_integration_test_cases
+    input_dir     = "integration_test_cases/input/"
+    input_ext     = ".jshaml"
+    output_dir    = "integration_test_cases/output/"
+    output_ext     = ".js"
+    input_files   = Dir.glob("#{input_dir}*#{input_ext}")
+    inst = Compiler.new
+    
+    input_files.each do |input_file|
+      filename = input_file[input_dir.length..(input_file.length - input_ext.length - 1)]
+      output_file = "#{output_dir}#{filename}#{output_ext}"
+      assert_equal(inst.convert_from_string(File.read(input_file)).strip, File.read(output_file).strip)
+    end
+  end
+end

data/test/integration_test_cases/input/002_div.jshaml

@@ -0,0 +1 @@
+%div

data/test/integration_test_cases/input/003_div_with_class.jshaml

@@ -0,0 +1 @@
+.class

data/test/integration_test_cases/input/004_div_with_class_and_id.jshaml

@@ -0,0 +1 @@
+#id.class

data/test/integration_test_cases/input/005_span_with_class_and_id.jshaml

@@ -0,0 +1 @@
+%span#id.class

data/test/integration_test_cases/input/006_span_with_id_and_two_classes.jshaml

@@ -0,0 +1 @@
+%span#id.class.second

data/test/integration_test_cases/input/007_div_with_id_parameter.jshaml

@@ -0,0 +1 @@
+%div{id: 'id'}

data/test/integration_test_cases/input/008_div_with_class_and_class_parameter.jshaml

@@ -0,0 +1 @@
+.class{class: 'second'}

data/test/integration_test_cases/input/009_div_with_class_and_javascript_class.jshaml

@@ -0,0 +1 @@
+.class{class: variable ? 'true' : 'false'}

data/test/integration_test_cases/input/010_div_with_class_and_multiple_parameters.jshaml

@@ -0,0 +1 @@
+.class{class: 'second', 'data-enabled': true}

data/test/integration_test_cases/input/011_div_with_class_and_inside.jshaml

@@ -0,0 +1,2 @@
+.class
+  .inside

data/test/integration_test_cases/input/012_div_with_class_and_inside_and_inside.jshaml

@@ -0,0 +1,3 @@
+.class
+  .inside
+    .deep

data/test/integration_test_cases/input/013_div_with_class_and_conditionnal_inside.jshaml

@@ -0,0 +1,5 @@
+.class
+  - if (condition)
+    .true
+  - else
+    .false

data/test/integration_test_cases/input/014_div_with_dynamic_escaped_content.jshaml

@@ -0,0 +1,2 @@
+.class
+  = variable

data/test/integration_test_cases/input/015_div_with_dynamic_non_escaped_content.jshaml

@@ -0,0 +1,2 @@
+.class
+  != variable

data/test/integration_test_cases/input/016_div_with_simple_each.jshaml

@@ -0,0 +1,3 @@
+.class
+  - each car in cars
+    .car

data/test/integration_test_cases/input/017_div_with_key_value_each.jshaml

@@ -0,0 +1,3 @@
+.class
+  - each id: car in cars
+    .car

data/test/integration_test_cases/output/001_empty.js

@@ -0,0 +1,2 @@
+var _$output = '';
+var _$line = 0;

data/test/integration_test_cases/output/002_div.js

@@ -0,0 +1,5 @@
+var _$output = '';
+var _$line = 0;
+_$line = 1;
+_$output += '<div >';
+_$output += '</div>';

data/test/integration_test_cases/output/003_div_with_class.js

@@ -0,0 +1,5 @@
+var _$output = '';
+var _$line = 0;
+_$line = 1;
+_$output += '<div class=" class" >';
+_$output += '</div>';

data/test/integration_test_cases/output/004_div_with_class_and_id.js

@@ -0,0 +1,5 @@
+var _$output = '';
+var _$line = 0;
+_$line = 1;
+_$output += '<div id="id" class=" class" >';
+_$output += '</div>';

data/test/integration_test_cases/output/005_span_with_class_and_id.js

@@ -0,0 +1,5 @@
+var _$output = '';
+var _$line = 0;
+_$line = 1;
+_$output += '<span id="id" class=" class" >';
+_$output += '</span>';

data/test/integration_test_cases/output/006_span_with_id_and_two_classes.js

@@ -0,0 +1,5 @@
+var _$output = '';
+var _$line = 0;
+_$line = 1;
+_$output += '<span id="id" class=" class second" >';
+_$output += '</span>';

data/test/integration_test_cases/output/007_div_with_id_parameter.js

@@ -0,0 +1,5 @@
+var _$output = '';
+var _$line = 0;
+_$line = 1;
+_$output += '<div ' + attrs({'id': 'id'}, {}) + '>';
+_$output += '</div>';

data/test/integration_test_cases/output/008_div_with_class_and_class_parameter.js

@@ -0,0 +1,5 @@
+var _$output = '';
+var _$line = 0;
+_$line = 1;
+_$output += '<div ' + attrs({'class': 'second'}, {"class":" class"}) + '>';
+_$output += '</div>';

data/test/integration_test_cases/output/009_div_with_class_and_javascript_class.js

@@ -0,0 +1,5 @@
+var _$output = '';
+var _$line = 0;
+_$line = 1;
+_$output += '<div ' + attrs({'class': variable ? 'true' : 'false'}, {"class":" class"}) + '>';
+_$output += '</div>';

data/test/integration_test_cases/output/010_div_with_class_and_multiple_parameters.js

@@ -0,0 +1,5 @@
+var _$output = '';
+var _$line = 0;
+_$line = 1;
+_$output += '<div ' + attrs({'class': 'second', 'data-enabled': true}, {"class":" class"}) + '>';
+_$output += '</div>';

data/test/integration_test_cases/output/011_div_with_class_and_inside.js

@@ -0,0 +1,8 @@
+var _$output = '';
+var _$line = 0;
+_$line = 1;
+_$output += '<div class=" class" >';
+_$line = 2;
+_$output += '<div class=" inside" >';
+_$output += '</div>';
+_$output += '</div>';

data/test/integration_test_cases/output/012_div_with_class_and_inside_and_inside.js

@@ -0,0 +1,11 @@
+var _$output = '';
+var _$line = 0;
+_$line = 1;
+_$output += '<div class=" class" >';
+_$line = 2;
+_$output += '<div class=" inside" >';
+_$line = 3;
+_$output += '<div class=" deep" >';
+_$output += '</div>';
+_$output += '</div>';
+_$output += '</div>';

data/test/integration_test_cases/output/013_div_with_class_and_conditionnal_inside.js

@@ -0,0 +1,17 @@
+var _$output = '';
+var _$line = 0;
+_$line = 1;
+_$output += '<div class=" class" >';
+ if (condition)
+{
+_$line = 3;
+_$output += '<div class=" true" >';
+_$output += '</div>';
+}
+ else
+{
+_$line = 5;
+_$output += '<div class=" false" >';
+_$output += '</div>';
+}
+_$output += '</div>';

data/test/integration_test_cases/output/014_div_with_dynamic_escaped_content.js

@@ -0,0 +1,7 @@
+var _$output = '';
+var _$line = 0;
+_$line = 1;
+_$output += '<div class=" class" >';
+_$line = 2;
+_$output += escape( variable);
+_$output += '</div>';

data/test/integration_test_cases/output/015_div_with_dynamic_non_escaped_content.js

@@ -0,0 +1,7 @@
+var _$output = '';
+var _$line = 0;
+_$line = 1;
+_$output += '<div class=" class" >';
+_$line = 2;
+_$output +=  variable;
+_$output += '</div>';

data/test/integration_test_cases/output/016_div_with_simple_each.js

@@ -0,0 +1,10 @@
+var _$output = '';
+var _$line = 0;
+_$line = 1;
+_$output += '<div class=" class" >';
+ for (var _$key in cars) { var car = cars[_$key];
+_$line = 3;
+_$output += '<div class=" car" >';
+_$output += '</div>';
+}
+_$output += '</div>';

data/test/integration_test_cases/output/017_div_with_key_value_each.js

@@ -0,0 +1,10 @@
+var _$output = '';
+var _$line = 0;
+_$line = 1;
+_$output += '<div class=" class" >';
+ for (var id in cars) { var car = cars[id];
+_$line = 3;
+_$output += '<div class=" car" >';
+_$output += '</div>';
+}
+_$output += '</div>';

metadata

@@ -0,0 +1,107 @@
+--- !ruby/object:Gem::Specification
+name: haml_to_js
+version: !ruby/object:Gem::Version
+  version: '0.1'
+  prerelease: 
+platform: ruby
+authors:
+- Sébastien Drouyer
+autorequire: 
+bindir: bin
+cert_chain: []
+date: 2012-12-27 00:00:00.000000000Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: haml_to_star
+  requirement: &76616240 !ruby/object:Gem::Requirement
+    none: false
+    requirements:
+    - - ! '>='
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :runtime
+  prerelease: false
+  version_requirements: *76616240
+description: ! "haml_to_js is a ruby library and command line that converts haml to
+  javascript.\n\nWhy an other haml to js converter (see similar utilities) ?\n* It
+  is a extension of [haml_to_star](https://github.com/sdrdis/haml_to_star) which purpose
+  is to convert haml into any language\n* This converter is intended for front usage\n*
+  It simplifies debugging (the generated code is readable, a variable hold haml line
+  number so you can know exactly where the problem is)\n* It support features that
+  other don't support (don't hesitate to raise an issue if I am no longer right):\n
+  \ * if...else statements\n  * Declarations such as `.first{class: 'second'}` will
+  generate `<div class=\"first second\"></div>`\n  * Support for brackets inside parameters
+  (ex: `%div{key: 'value with bracket}'}`)\n"
+email: sdrdis@hotmail.com
+executables:
+- haml_to_js
+extensions: []
+extra_rdoc_files: []
+files:
+- MIT-LICENSE.txt
+- README.md
+- Rakefile
+- bin/haml_to_js
+- haml_to_js.gemspec
+- js/haml_to_js.js
+- lib/haml_to_js/compiler.rb
+- test/integration_test.rb
+- test/integration_test_cases/input/001_empty.jshaml
+- test/integration_test_cases/input/002_div.jshaml
+- test/integration_test_cases/input/003_div_with_class.jshaml
+- test/integration_test_cases/input/004_div_with_class_and_id.jshaml
+- test/integration_test_cases/input/005_span_with_class_and_id.jshaml
+- test/integration_test_cases/input/006_span_with_id_and_two_classes.jshaml
+- test/integration_test_cases/input/007_div_with_id_parameter.jshaml
+- test/integration_test_cases/input/008_div_with_class_and_class_parameter.jshaml
+- test/integration_test_cases/input/009_div_with_class_and_javascript_class.jshaml
+- test/integration_test_cases/input/010_div_with_class_and_multiple_parameters.jshaml
+- test/integration_test_cases/input/011_div_with_class_and_inside.jshaml
+- test/integration_test_cases/input/012_div_with_class_and_inside_and_inside.jshaml
+- test/integration_test_cases/input/013_div_with_class_and_conditionnal_inside.jshaml
+- test/integration_test_cases/input/014_div_with_dynamic_escaped_content.jshaml
+- test/integration_test_cases/input/015_div_with_dynamic_non_escaped_content.jshaml
+- test/integration_test_cases/input/016_div_with_simple_each.jshaml
+- test/integration_test_cases/input/017_div_with_key_value_each.jshaml
+- test/integration_test_cases/output/001_empty.js
+- test/integration_test_cases/output/002_div.js
+- test/integration_test_cases/output/003_div_with_class.js
+- test/integration_test_cases/output/004_div_with_class_and_id.js
+- test/integration_test_cases/output/005_span_with_class_and_id.js
+- test/integration_test_cases/output/006_span_with_id_and_two_classes.js
+- test/integration_test_cases/output/007_div_with_id_parameter.js
+- test/integration_test_cases/output/008_div_with_class_and_class_parameter.js
+- test/integration_test_cases/output/009_div_with_class_and_javascript_class.js
+- test/integration_test_cases/output/010_div_with_class_and_multiple_parameters.js
+- test/integration_test_cases/output/011_div_with_class_and_inside.js
+- test/integration_test_cases/output/012_div_with_class_and_inside_and_inside.js
+- test/integration_test_cases/output/013_div_with_class_and_conditionnal_inside.js
+- test/integration_test_cases/output/014_div_with_dynamic_escaped_content.js
+- test/integration_test_cases/output/015_div_with_dynamic_non_escaped_content.js
+- test/integration_test_cases/output/016_div_with_simple_each.js
+- test/integration_test_cases/output/017_div_with_key_value_each.js
+homepage: https://github.com/sdrdis/haml_to_js/
+licenses: []
+post_install_message: 
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  none: false
+  requirements:
+  - - ! '>='
+    - !ruby/object:Gem::Version
+      version: '0'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  none: false
+  requirements:
+  - - ! '>='
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubyforge_project: 
+rubygems_version: 1.8.17
+signing_key: 
+specification_version: 3
+summary: haml_to_js is a ruby library and command line that converts haml to javascript.
+test_files: []