"Empty Form" update

benkeen · Oct 7, 2012 · 49d9511 · 49d9511
1 parent ca97c5c
commit 49d9511
Show file tree

Hide file tree

Showing 3 changed files with 77 additions and 49 deletions.
diff --git a/css/styles.css b/css/styles.css
@@ -491,44 +491,51 @@ hr {
 	border-bottom: 1px solid #538c27;
 	box-shadow: inset 0 0 8px 4px #548c29, 0 1px 0 0 #eeeeee;
 }
+
 .gdSecondaryButton {
 	display: block;
-	background-color: #3366CC;
-	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #3366CC), color-stop(100%, #2a5bbd));
-	background-image: -webkit-linear-gradient(top, #3366CC, #2a5bbd);
-	background-image: -moz-linear-gradient(top, #3366CC, #2a5bbd);
-	background-image: -ms-linear-gradient(top, #3366CC, #2a5bbd);
-	background-image: -o-linear-gradient(top, #3366CC, #2a5bbd);
-	background-image: linear-gradient(top, #3366CC, #2a5bbd);
-	border: 1px solid #2a5bbd;
-	border-bottom: 1px solid #547fd3;
-	border-radius: 3px;
-	-webkit-box-shadow: inset 0 1px 0 0 #6b90d9;
-	-moz-box-shadow: inset 0 1px 0 0 #6b90d9;
-	box-shadow: inset 0 1px 0 0 #6b90d9;
-	color: #fff;
+  background-color: #eeeeee;
+  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #eeeeee), color-stop(100%, #cccccc));
+  background-image: -webkit-linear-gradient(top, #eeeeee, #cccccc);
+  background-image: -moz-linear-gradient(top, #eeeeee, #cccccc);
+  background-image: -ms-linear-gradient(top, #eeeeee, #cccccc);
+  background-image: -o-linear-gradient(top, #eeeeee, #cccccc);
+  background-image: linear-gradient(top, #eeeeee, #cccccc);
+  border: 1px solid #ccc;
+  border-bottom: 1px solid #bbb;
+  border-radius: 3px;
+  color: #333;
 	font: bold 11px "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
 	line-height: 1;
 	padding: 2px 10px 2px;
 	margin: 15px 0px 0px;
 	text-align: center;
-	text-shadow: 0 -1px 0 #4c9021;
+  text-shadow: 0 1px 0 #eee;
 }
 .gdSecondaryButton:hover {
-	background-color: #76b347;
-	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #2250ac), color-stop(100%, #1d4699));
-	background-image: -webkit-linear-gradient(top, #2250ac, #1d4699);
-	background-image: -moz-linear-gradient(top, #2250ac, #1d4699);
-	background-image: -ms-linear-gradient(top, #2250ac, #1d4699);
-	background-image: -o-linear-gradient(top, #2250ac, #1d4699);
-	background-image: linear-gradient(top, #2250ac, #1d4699);
-	box-shadow: inset 0 1px 0 0 #4b71bc;
+	background-color: #dddddd;
+	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #dddddd), color-stop(100%, #bbbbbb));
+	background-image: -webkit-linear-gradient(top, #dddddd, #bbbbbb);
+	background-image: -moz-linear-gradient(top, #dddddd, #bbbbbb);
+	background-image: -ms-linear-gradient(top, #dddddd, #bbbbbb);
+	background-image: -o-linear-gradient(top, #dddddd, #bbbbbb);
+	background-image: linear-gradient(top, #dddddd, #bbbbbb);
+	border: 1px solid #bbb;
+	border-bottom: 1px solid #999;
+	cursor: pointer;
+	text-shadow: 0 1px 0 #ddd;
 	cursor: pointer;
 }
 .gdSecondaryButton:active {
+	border: 1px solid #aaa;
+	border-bottom: 1px solid #888;
+	-webkit-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
+	box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
+	/*
 	border: 1px solid #2250ac;
 	border-bottom: 1px solid #4b71bc;
 	box-shadow: inset 0 0 8px 4px #1d4699, 0 1px 0 0 #eeeeee;
+	*/
 }
 
 .gdGenerateButton {
@@ -718,4 +725,8 @@ body .chzn-container-multi .chzn-choices {
 	line-height: 16px;
 	font-size: 6.5pt;
 	cursor: pointer;
+}
+
+#gdEmptyForm {
+	float: right;
 }
diff --git a/scripts/generator.js b/scripts/generator.js
@@ -43,7 +43,7 @@ define([
 		$(".gdExportType").bind("click", _changeExportType);
 		$(".gdAddRowsBtn").bind("click", function() { _addRows($("#gdNumRows").val()); });
 		$(".gdDeleteRowsBtn").bind("click", _deleteRows);
-		$("#gdEmptyForm").bind("click", function() { _emptyForm(true, 5); });
+		$("#gdEmptyForm").bind("click", function() { _emptyForm(true, 5); return false; });
 		$("#gdTableRows").sortable({
 			handle: ".gdColOrder",
 			axis: "y",
@@ -102,6 +102,7 @@ define([
 	 */
 	var _deleteRows = function() {
 		var rowIDs = [];
+		console.log($(".gdDeleteRows:checked"));
 		$(".gdDeleteRows:checked").each(function() {
 			var row = $(this).closest(".gdTableRow");
 			var parentRowID = row.attr("id");
@@ -147,17 +148,35 @@ define([
 	};
 
 	var _emptyForm = function(requireConfirmation, numInitRows) {
+		$("input[name=deleteRows]").attr("checked", "checked");
 		if (requireConfirmation) {
-			var answer = confirm(L.confirm_empty_form);
-			if (!answer) {
-				return false;
+			$("<div></div>").html(L.confirm_empty_form).dialog({
+				title: "Please confirm",
+				width: 360,
+				buttons: [
+					{
+						text: "Yes",
+						click: function() {
+							_deleteRows();
+							if (numInitRows) {
+								_addRows(numInitRows);
+							}
+						}
+					},
+					{
+						text: "No",
+						click: function() {
+							$(this).dialog("close");
+						}
+					}
+				]
+			});
+		} else {
+			_deleteRows();
+			if (numInitRows) {
+				_addRows(numInitRows);
 			}
 		}
-		$("input[name=deleteRows]").attr("checked", "checked");
-		_deleteRows();
-		if (numInitRows) {
-			_addRows(numInitRows);
-		}
 	};
 
 	/**
@@ -426,8 +445,20 @@ define([
 			return false;
 		}
 
-		console.log("would normally submit now");
-		return false;
+
+		// all checks out. Set the form target and submit the sucker
+		if (resultType == "HTML" || resultType == "XML" || resultType == "SQL") {
+			document.gdData.target = "_blank";
+		} else {
+			document.gdData.target = "hiddenIframe";
+		}
+
+		// pass the ordered rows to the server, according to whatever sort the user's done
+		$("#rowOrder").val(_getRowOrder());
+		$("#deletedRows").val(Generator.deletedRows.toString());
+
+		return true;
+	};
 
 
 /*
@@ -534,20 +565,6 @@ define([
 		}
 */
 
-		// all checks out. Set the form target and submit the sucker
-		if (resultType == "HTML" || resultType == "XML" || resultType == "SQL") {
-			document.gdData.target = "_blank";
-		} else {
-			document.gdData.target = "hiddenIframe";
-		}
-
-		// pass the ordered rows to the server, according to whatever sort the user's done
-		$("#rowOrder").val(_getRowOrder());
-		$("#deletedRows").val(Generator.deletedRows.toString());
-
-		return true;
-	};
-
 	var _resetPluginsDialog = function() {
 		$("#gdPluginInstallation").dialog({
 			modal:     true,

diff --git a/templates/generate_tab1.tpl b/templates/generate_tab1.tpl
@@ -78,9 +78,9 @@
 					</ul>
 
 					<div class="gdClear"></div>
+					<button class="gdSecondaryButton" id="gdEmptyForm">{$L.empty_form}</button>
 					<div class="gdVerticalPad"></div>
 
-					<div style="float: right"><input type="button" id="gdEmptyForm" value="{$L.empty_form}" /></div>
 					{$L.add} <input type="text" name="gdNumRows" id="gdNumRows" value="1" size="2" />
 					<input type="button" value="{$L.row_sp}" class="gdAddRowsBtn" />