Made rounded corners an option

generator/css/cards.css

@@ -9,6 +9,10 @@
     overflow: hidden;
 }
 
+.card.rounded-corners {
+    border-radius: 4px;
+}
+
 .card-content-container {
     padding:2mm;
     padding-top:1mm;

generator/generate.html

@@ -129,6 +129,16 @@
                             </select>
                         </div>
                     </div>
+                    <div class="form-group">
+                        <label for="rounded-corners" class="col-sm-4 control-label">Corners</label>
+                        <div class="col-sm-8">
+                            <div class="checkbox">
+                                <label>
+                                    <input type="checkbox" checked id="rounded-corners" data-option="rounded_corners" value="1"> Rounded card corners
+                                </label>
+                            </div>
+                        </div>
+                    </div>
                     <div class="form-group">
                         <label for="foreground-color" class="col-sm-4 control-label">Front color</label>
                         <div class="col-sm-8">

generator/js/cards.js

@@ -14,7 +14,8 @@ function card_default_options() {
         card_arrangement: "doublesided",
         card_size: "25x35",
         card_count: null,
-        icon_inline: true
+        icon_inline: true,
+        rounded_corners: true
     }
 }
 
@@ -317,7 +318,7 @@ function card_generate_front(data, options) {
     var style_color = card_generate_color_style(color, options);
 
     var result = "";
-    result += '<div class="card card-size-' + options.card_size + '" ' + style_color + '>';
+    result += '<div class="card card-size-' + options.card_size + ' ' + (options.rounded_corners ? 'rounded-corners' : '') + '" ' + style_color + '>';
     result += card_element_icon(data, options);
     result += card_element_title(data, options);
     result += card_generate_contents(data.contents, data, options);
@@ -342,7 +343,8 @@ function card_generate_back(data, options) {
 	var icon = card_data_icon_back(data, options);
 
     var result = "";
-    result += '<div class="card card-size-' + options.card_size + '" ' + style_color + '>';
+    console.log('options.rounded_corners', options.rounded_corners);
+    result += '<div class="card card-size-' + options.card_size + ' ' + (options.rounded_corners ? 'rounded-corners' : '') + '" ' + style_color + '>';
     result += '  <div class="card-back" ' + background_style + '>';
 	if (!url)
 	{

generator/js/ui.js

@@ -269,10 +269,15 @@ function ui_set_background_color(color) {
 
 function ui_change_option() {
     var property = $(this).attr("data-option");
-    var value = $(this).val();
+    var value
+    if($(this).attr('type') == 'checkbox') {
+        value = $(this).is(':checked');
+    }
+    else {
+        value = $(this).val();
+    }
     card_options[property] = value;
     ui_render_selected_card();
-
 }
 
 function ui_change_card_title() {
@@ -492,6 +497,7 @@ $(document).ready(function () {
     $("#card-arrangement").change(ui_change_option);
     $("#card-size").change(ui_change_option);
     $("#background-color").change(ui_change_option);
+    $("#rounded-corners").change(ui_change_option);
 
     $("#default-color").change(ui_change_default_color);
     $("#default-icon").change(ui_change_default_icon);