converting html to haml - ruby-on-rails

Question

There is a projects.html file above.This file works successfully but when I convert this html file to haml file with http://html2haml.heroku.com/ , haml file doesn't work.
Can you see any difference between two files?
projects.html.erb
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<script type="text/javascript">
$(function () {
var chart;
$(document).ready(function() {
chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false
},
title: {
text: 'Sectoral Statistics'
},
tooltip: {
pointFormat: '{series.name}: <b>{point.percentage}% - {point.y} proje</b> ',
percentageDecimals: 1
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
color: '#000000',
connectorColor: '#000000',
formatter: function() {
return '<b>'+ this.point.name +'</b>: '+ Math.round(this.percentage) +' % - '+ this.y +' proje';
}
}
}
},
series: [{
type: 'pie',
name: 'Browser share',
data: [
<% #results.each do |key,value| %>
['<%= key %>',<%= value %>,<%= value %>],
<% end %>
]
}]
});
});
});
</script>
projects.html.haml
%script{:src => "http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js", :type => "text/javascript"}
%script{:src => "http://code.highcharts.com/highcharts.js"}
%script{:src => "http://code.highcharts.com/modules/exporting.js"}
:javascript
$(function () {
var chart;
$(document).ready(function() {
chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false
},
title: {
text: 'Sectoral Statistics'
},
tooltip: {
pointFormat: '{series.name}: {point.percentage}% - {point.y} proje ',
percentageDecimals: 1
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
color: '#000000',
connectorColor: '#000000',
formatter: function() {
return ''+ this.point.name +': '+ Math.round(this.percentage) +' % - '+ this.y +' proje';
}
}
}
},
series: [{
type: 'pie',
name: 'Browser share',
data: [
#results.each do |key,value|
[' key ', value , value ],
]
}]
});
});
});

Answer 1

I think this is a bug in html2haml.
In your HTML, your last script tag looks something like this (I’ve cut it down for brevity):
<script type="text/javascript">
$(function () {
...
});
</script>
The first line is indented, but the last isn’t. html2haml is only looking at the first line when determining how to indent the javascript, and this is resulting in Haml that looks like:
:javascript
$(function () {
...
});
The last line – }); – isn’t indented.
To work around it you should fix the indentation, in either your HTML or in the generated Haml.
Note that there is another bug with :javascript filters you should be aware of. It think in this case you should be all right with that one.