vgquotes/Src/VideoGameQuotes.Web/Views/Quote/Submit.aspx

<%@ Page Title="" Language="C#" Inherits="System.Web.Mvc.ViewPage<VideoGameQuotes.Web.Models.QuoteSubmitModel>" MasterPageFile="~/Views/Shared/Site.Master" %>
<%@ Import Namespace="Portoa.Web.Util" %>
<asp:Content runat="server" ID="Title" ContentPlaceHolderID="TitleContent">Submit New Quote</asp:Content>
<asp:Content runat="server" ID="Main" ContentPlaceHolderID="MainContent">
				<h2>Submit New Quote</h2>

				<%= Html.ValidationSummary() %>

				<div id="create-quote-form">
					<% using (Html.BeginForm()) { %>
						<p>
							<span id="game-select">
								<%= Html.Label("Game", "GameId")  %>
								<br />
								<%= Html.DropDownListFor(model => model.GameId, Model.GetGameList()) %>
							</span>

							<a href="#" id="create-game-link">Create new game</a>
						</p>

						<div id="create-game-form">
							<fieldset>
								<legend>Create new game</legend>

								<p>
									<%= Html.LabelFor(model => model.GameName) %>
									<br />
									<%= Html.TextBoxFor(model => model.GameName) %>
								</p>

								<p>
									<%= Html.LabelFor(model => model.GameWebsite) %> <small>(link to Wikipedia page or something)</small>
									<br />
									<%= Html.TextBoxFor(model => model.GameWebsite) %>
								</p>

								<p>
									<%= Html.LabelFor(model => model.GameRegions) %>
									<br />
									<%= Model.MakeRegionTable(Html) %>
								</p>

								<p>
									<span id="system-select">
										<%= Html.LabelFor(model => model.SystemIds) %>
										<br />
										<%= Model.MakeSystemTable(Html) %>
									</span>
									<a href="#" id="create-system-link">Create new system</a>
								</p>

								<div id="create-system-form">
									<fieldset>
										<legend>Create new system</legend>

										<p>
											<%= Html.LabelFor(model => model.SystemName) %>
											<br />
											<%= Html.TextBoxFor(model => model.SystemName) %>
										</p>

										<p>
											<%= Html.LabelFor(model => model.SystemAbbreviation) %>
											<br />
											<%= Html.TextBoxFor(model => model.SystemAbbreviation) %>
										</p>

										<p>
											<%= Html.LabelFor(model => model.SystemReleaseDate) %>
											<br />
											<%= Html.TextBox("SystemReleaseDate", DateTime.UtcNow.ToString("yyyy-MM-dd")) %>
										</p>
									</fieldset>
								</div>

								<p>
									<span id="publisher-select">
										<%= Html.LabelFor(model => model.PublisherIds) %>
										<br />
										<%= Model.MakePublisherTable(Html) %>
									</span>
									<a href="#" id="create-publisher-link">Create new publisher</a>
								</p>

								<div id="create-publisher-form">
									<fieldset>
										<legend>Create new publisher</legend>

										<p>
											<%= Html.LabelFor(model => model.PublisherName) %>
											<br />
											<%= Html.TextBoxFor(model => model.PublisherName) %>
										</p>

										<p>
											<%= Html.LabelFor(model => model.PublisherWebsite) %>
											<br />
											<%= Html.TextBoxFor(model => model.PublisherWebsite) %>
										</p>
									</fieldset>
								</div>
							</fieldset>
						</div>

						<p>
							<%= Html.LabelFor(model => model.QuoteText) %>
							<br />
							<%= Html.TextAreaFor(model => model.QuoteText) %>
						</p>

						<p>
							<%= Html.LabelFor(model => model.CategoryIds) %>
							<br />
							<%= Model.MakeCategoryTable(Html) %>

							<a href="#" id="create-category-link">Create new category</a>
						</p>

						<%= Html.Submit("Submit") %>
					<% } %>
				</div>
</asp:Content>
<asp:Content runat="server" ID="DeferrableScripts" ContentPlaceHolderID="DeferrableScripts">
	<script type="text/javascript">//<![CDATA[
		$(document).ready(function() {
			$("#create-game-link").click(function() {
				var $form = $("#create-game-form");
				if ($form.is(":visible")) {
					$("#create-game-link").text("Create new game");
				} else {
					$("#create-game-link").text("Use existing game");
					$("#GameId").val("0");
				}

				$form.toggle();
				$("#game-select").toggle();
				return false;
			});

			$("#create-system-link").click(function() {
				var $form = $("#create-system-form");
				if ($form.is(":visible")) {
					$("#create-system-link").text("Create new system");
				} else {
					$("#create-system-link").text("Use existing system");
				}

				$form.toggle();
				$("#system-select").toggle();
				return false;
			});

			$("#create-publisher-link").click(function() {
				var $form = $("#create-publisher-form");
				if ($form.is(":visible")) {
					$("#create-publisher-link").text("Create new publisher");
				} else {
					$("#create-publisher-link").text("Use existing publisher");
				}

				$form.toggle();
				$("#publisher-select").toggle();
				return false;
			});

			$("#create-category-link").click(function() {
				var $table = $("#category-checkbox-table");
				var $row = $table.find("tr:last");
				if ($row.find("#new-category-name").length === 0) {
					var $cell = $("<td/>");
					if ($row.find("td").length === 8) {
						$row = $("<tr/>");
						$table.append($row);
					}

					$row.append($cell);

					var $input = $("<input/>").attr("id", "new-category-name").attr("type", "text").val("Category name");

					$input.bind("keypress", function(e) {
						if (e.which === 13) {
							e.preventDefault(); //make sure the parent form doesn't get submitted

							$input.attr("disabled", "disabled");
							$.ajax("/category/create", {
								data: { Name: $input.val() },
								type: "POST",
								success: function(data, status, $xhr) {
									if (data.Error !== null) {
										alert("An error occurred: " + data.Error);
										return;
									}

									//add category checkbox to table
									var $checkbox = $("<input/>")
										.attr({
											"id": "category_" + data.Data.categoryId,
											"type": "checkbox",
											"name": "CategoryIds",
											"checked": "checked"
										}).val(data.Data.categoryId);

									var $label = $("<label/>")
										.attr("for", $checkbox.attr("id"))
										.text(data.Data.categoryName);

									$input.before($checkbox).before($label);
								},
								error: function($xhr, status, error) {
									alert("An error occurred");
								},

								complete: function() {
									$input.remove();
								}
							});
						}
					});

					$cell.append($input);
					$input.select();
					$(this).text("Cancel new category");
				} else {
					$row.find("td:last").remove();
					$(this).text("Create new category");
				}

				return false;
			});
		});
	//]]></script>
		
</asp:Content>