Javascript functions to pretty-print JOSM data

4 files changed, 28 insertions, 12 deletions

diff --git a/web/public/js/taginfo.js b/web/public/js/taginfo.js
index 16d0b4d..1410fe2 100644
--- a/web/public/js/taginfo.js
+++ b/web/public/js/taginfo.js
@@ -107,6 +107,22 @@ function print_type_icon(type, on_or_off) {
      return on_or_off ? '<img src="/img/types/' + type + '.16.png" alt="yes" width="16" height="16"/> ' : '<img src="/img/types/none.16.png" alt="no" width="16" height="16"/> ';
 }
 
+function print_josm_value(key, value, value_bool) {
+    return value ? link_to_value(key, value) : value_bool ? (value_bool + ' (Boolean)') : '*';
+}
+
+function print_josm_icon(style, icon) {
+    return icon ? '<img src="/api/4/josm/style/image?style=' + style + '&image=' + icon + '" title="' + icon + '" alt=""/>' : '';
+}
+
+function print_josm_line(width, color) {
+    return '<div>' + (width > 0 ? '<div title="' + color + '" style="height: ' + width + 'px; margin-top: ' + (10 - Math.round(width/2)) + 'px; padding: 0; background-color: ' + color + '"></div>' : '') + '</div>';
+}
+
+function print_josm_area(color) {
+    return color ? '<div title="' + color + '" style="height: 18px; background-color: ' + color + '"></div>' : '';
+}
+
 function print_image(type) {
     type = type.replace(/s$/, '');
     var name;
diff --git a/web/viewsjs/key.js.erb b/web/viewsjs/key.js.erb
index 9333425..6e84c1a 100644
--- a/web/viewsjs/key.js.erb
+++ b/web/viewsjs/key.js.erb
@@ -133,10 +133,10 @@ var create_flexigrid_for = {
             preProcess: function(data) {
                 data.rows = jQuery.map(data.data, function(row, i) {
                     return { 'cell': [
-                        row.value ? link_to_value(row.key, row.value) : row.value_bool ? (row.value_bool + ' (Boolean)') : '*',
-                        row.icon ? '<img src="/api/4/josm/style/image?style=standard&image=' + row.icon + '" title="' + row.icon + '" alt=""/>' : '',
-                        '<div>' + (row.line_width > 0 ? '<div title="' + row.line_color + '" style="height: ' + row.line_width + 'px; margin-top: ' + (10 - Math.round(row.line_width/2)) + 'px; padding: 0; background-color: ' + row.line_color + '"></div>' : '') + '</div>',
-                        row.area_color ? '<div title="' + row.area_color + '" style="height: 18px; background-color: ' + row.area_color + '"></div>' : ''
+                        print_josm_value(row.key, row.value, row.value_bool),
+                        print_josm_icon('standard', row.icon),
+                        print_josm_line(row.line_width, row.line_color),
+                        print_josm_area(row.area_color)
                     ] };
                 });
                 return data;
diff --git a/web/viewsjs/reports/josm_styles.js.erb b/web/viewsjs/reports/josm_styles.js.erb
index 54992c3..ea3b365 100644
--- a/web/viewsjs/reports/josm_styles.js.erb
+++ b/web/viewsjs/reports/josm_styles.js.erb
@@ -21,10 +21,10 @@ function create_flexigrid_with_option(stylename) {
             data.rows = jQuery.map(data.data, function(row, i) {
                 return { 'cell': [
                     link_to_key(row.key),
-                    row.value ? link_to_value(row.key, row.value) : row.value_bool ? (row.value_bool + ' (Boolean)') : '*',
-                    row.icon ? '<img src="/api/4/josm/style/image?style=standard&image=' + row.icon + '" title="' + row.icon + '" alt=""/>' : '',
-                    '<div>' + (row.line_width > 0 ? '<div title="' + row.line_color + '" style="height: ' + row.line_width + 'px; margin-top: ' + (10 - Math.round(row.line_width/2)) + 'px; padding: 0; background-color: ' + row.line_color + '"></div>' : '') + '</div>',
-                    row.area_color ? '<div title="' + row.area_color + '" style="height: 18px; background-color: ' + row.area_color + '"></div>' : ''
+                    print_josm_value(row.key, row.value, row.value_bool),
+                    print_josm_icon('standard', row.icon),
+                    print_josm_line(row.line_width, row.line_color),
+                    print_josm_area(row.area_color)
                 ] };
             });
             return data;
diff --git a/web/viewsjs/tag.js.erb b/web/viewsjs/tag.js.erb
index 90f8a23..7f745ba 100644
--- a/web/viewsjs/tag.js.erb
+++ b/web/viewsjs/tag.js.erb
@@ -106,10 +106,10 @@ var create_flexigrid_for = {
             preProcess: function(data) {
                 data.rows = jQuery.map(data.data, function(row, i) {
                     return { 'cell': [
-                        row.value ? link_to_value(row.key, row.value) : row.value_bool ? (row.value_bool + ' (Boolean)') : '*',
-                        row.icon ? '<img src="/api/4/josm/style/image?style=standard&image=' + row.icon + '" title="' + row.icon + '" alt=""/>' : '',
-                        '<div>' + (row.line_width > 0 ? '<div title="' + row.line_color + '" style="height: ' + row.line_width + 'px; margin-top: ' + (10 - Math.round(row.line_width/2)) + 'px; padding: 0; background-color: ' + row.line_color + '"></div>' : '') + '</div>',
-                        row.area_color ? '<div title="' + row.area_color + '" style="height: 18px; background-color: ' + row.area_color + '"></div>' : ''
+                        print_josm_value(row.key, row.value, row.value_bool),
+                        print_josm_icon('standard', row.icon),
+                        print_josm_line(row.line_width, row.line_color),
+                        print_josm_area(row.area_color)
                     ] };
                 });
                 return data;