sprited images up, changed some css class names, combined css files

This commit is contained in:
tmont 2011-02-28 07:27:38 +00:00
parent 22bd4c936a
commit fb7d53dfb5
12 changed files with 289 additions and 286 deletions

View File

@ -137,7 +137,7 @@ namespace VideoGameQuotes.Web.Models {
return string.Empty; return string.Empty;
} }
return string.Format("<a href=\"#\" class=\"edit-link edit-{0}-link\" title=\"edit\"></a><a href=\"#\" class=\"delete-link delete-{0}-link\" title=\"delete\"></a>", editType); return string.Format("<a href=\"#\" class=\"edit-icon edit-{0}-link\" title=\"edit\"></a><a href=\"#\" class=\"delete-icon delete-{0}-link\" title=\"delete\"></a>", editType);
} }
} }
} }

View File

@ -142,8 +142,6 @@
<CopyToOutputDirectory>Always</CopyToOutputDirectory> <CopyToOutputDirectory>Always</CopyToOutputDirectory>
</Content> </Content>
<Content Include="media\css\global.css" /> <Content Include="media\css\global.css" />
<Content Include="media\css\quote.css" />
<Content Include="media\css\reset.css" />
<Content Include="media\images\accept.png" /> <Content Include="media\images\accept.png" />
<Content Include="media\images\add.png" /> <Content Include="media\images\add.png" />
<Content Include="media\images\cancel.png" /> <Content Include="media\images\cancel.png" />
@ -158,6 +156,7 @@
<Content Include="media\images\notfound.png" /> <Content Include="media\images\notfound.png" />
<Content Include="media\images\pencil.png" /> <Content Include="media\images\pencil.png" />
<Content Include="media\images\search.png" /> <Content Include="media\images\search.png" />
<Content Include="media\images\sprite.png" />
<Content Include="media\images\unknown.png" /> <Content Include="media\images\unknown.png" />
<Content Include="media\images\vgquotes.png" /> <Content Include="media\images\vgquotes.png" />
<Content Include="media\js\browse.js" /> <Content Include="media\js\browse.js" />

View File

@ -11,10 +11,10 @@
<br /> <br />
<%= Html.DropDownListFor(model => model.GameId, Model.GetGameList()) %> <%= Html.DropDownListFor(model => model.GameId, Model.GetGameList()) %>
<a href="#" id="create-game-link" class="create-new-link" title="create new game"></a> <a href="#" id="create-game-link" class="add-icon" title="create new game"></a>
<% if (Model.CurrentUser != null && Model.CurrentUser.Group >= UserGroup.Admin) { %> <% if (Model.CurrentUser != null && Model.CurrentUser.Group >= UserGroup.Admin) { %>
<a href="#" id="edit-game-link" class="edit-link" title="edit currently selected game"></a> <a href="#" id="edit-game-link" class="edit-icon" title="edit currently selected game"></a>
<a href="#" id="delete-game-link" class="delete-link" title="delete currently selected game"></a> <a href="#" id="delete-game-link" class="delete-icon" title="delete currently selected game"></a>
<% } %> <% } %>
</p> </p>
@ -52,7 +52,7 @@
<div id="system-select"> <div id="system-select">
<p><span id="SystemIds" class="label">Systems</span></p> <p><span id="SystemIds" class="label">Systems</span></p>
<%= Model.MakeSystemTable(Html) %> <%= Model.MakeSystemTable(Html) %>
<p><a href="#" id="create-system-link" class="create-new-link" title="create new system"></a></p> <p><a href="#" id="create-system-link" class="add-icon" title="create new system"></a></p>
</div> </div>
<div id="create-system-form" class="subform"> <div id="create-system-form" class="subform">
@ -89,8 +89,8 @@
<% } %> <% } %>
<p> <p>
<a href="#" class="submit-link button-link" id="create-system-submit" title="save system">Save System</a> <a href="#" class="button-link" id="create-system-submit" title="save system"><span class="submit-icon"></span>Save System</a>
<a href="#" class="cancel-link button-link" id="create-system-cancel" title="cancel">Cancel</a> <a href="#" class="button-link" id="create-system-cancel" title="cancel"><span class="cancel-icon"></span>Cancel</a>
</p> </p>
</fieldset> </fieldset>
</div> </div>
@ -98,7 +98,7 @@
<div id="publisher-select"> <div id="publisher-select">
<p><span class="label">Publishers</span></p> <p><span class="label">Publishers</span></p>
<%= Model.MakePublisherTable(Html) %> <%= Model.MakePublisherTable(Html) %>
<p><a href="#" id="create-publisher-link" class="create-new-link" title="create new publisher"></a></p> <p><a href="#" id="create-publisher-link" class="add-icon" title="create new publisher"></a></p>
</div> </div>
<div id="create-publisher-form" class="subform"> <div id="create-publisher-form" class="subform">
@ -121,15 +121,15 @@
</p> </p>
<p> <p>
<a href="#" class="submit-link button-link" id="create-publisher-submit" title="save publisher">Save Publisher</a> <a href="#" class="button-link" id="create-publisher-submit" title="save publisher"><span class="submit-icon"></span>Save Publisher</a>
<a href="#" class="cancel-link button-link" id="create-publisher-cancel" title="cancel">Cancel</a> <a href="#" class="button-link" id="create-publisher-cancel" title="cancel"><span class="cancel-icon"></span>Cancel</a>
</p> </p>
</fieldset> </fieldset>
</div> </div>
<p> <p>
<a href="#" class="submit-link button-link" id="create-game-submit" title="save game">Save Game</a> <a href="#" class="button-link" id="create-game-submit" title="save game"><span class="submit-icon"></span>Save Game</a>
<a href="#" class="cancel-link button-link" id="create-game-cancel" title="cancel">Cancel</a> <a href="#" class="button-link" id="create-game-cancel" title="cancel"><span class="cancel-icon"></span>Cancel</a>
</p> </p>
</fieldset> </fieldset>
</div> </div>
@ -143,7 +143,7 @@
<div> <div>
<p><span class="label">Categories</span></p> <p><span class="label">Categories</span></p>
<%= Model.MakeCategoryTable(Html) %> <%= Model.MakeCategoryTable(Html) %>
<p><a href="#" id="create-category-link" class="create-new-link" title="create new category"></a></p> <p><a href="#" id="create-category-link" class="add-icon" title="create new category"></a></p>
</div> </div>
<% if (Model.QuoteId > 0) { %> <% if (Model.QuoteId > 0) { %>

View File

@ -11,5 +11,5 @@
<% } %> <% } %>
<li class="searchbox"> <li class="searchbox">
<%= Html.TextBox("searchQuery", null, new { id = "search-query" })%> <%= Html.TextBox("searchQuery", null, new { id = "search-query" })%>
<img src="/media/images/search.png" alt="search" title="search quotes" id="search-submit" /> <span href="#" title="search quotes" id="search-submit"></span>
</li> </li>

View File

@ -28,10 +28,10 @@
</p> </p>
<p class="quote-links"> <p class="quote-links">
<a class="quote-flag-link" href="#" title="flag this quote as inaccurate, fake, spam, duplicate, etc."></a> <a class="quote-flag-icon" href="#" title="flag this quote as inaccurate, fake, spam, duplicate, etc."></a>
<a class="quote-permalink" href="<%= Url.Action("quote", "quote", new { id = Model.Quote.Id, text = Model.Quote.GetUrlFriendlyText() }) %>" title="permanent link to this quote"></a> <a class="quote-permalink" href="<%= Url.Action("quote", "quote", new { id = Model.Quote.Id, text = Model.Quote.GetUrlFriendlyText() }) %>" title="permanent link to this quote"></a>
<% if (Model.User != null && Model.User.Group >= UserGroup.Admin) { %> <% if (Model.User != null && Model.User.Group >= UserGroup.Admin) { %>
<a class="edit-link" href="<%= Url.Action("edit", "quote", new { id = Model.Quote.Id }) %>" title="edit this quote"></a> <a class="edit-icon" href="<%= Url.Action("edit", "quote", new { id = Model.Quote.Id }) %>" title="edit this quote"></a>
<small>(<%= Model.Quote.FlagCount %>)</small> <small>(<%= Model.Quote.FlagCount %>)</small>
<% } %> <% } %>
</p> </p>

View File

@ -8,7 +8,6 @@
<meta http-equiv="content-type" content="text/html; charset=utf-8"/> <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<link rel="stylesheet" type="text/css" href="/media/css/reset.css" /> <link rel="stylesheet" type="text/css" href="/media/css/reset.css" />
<link rel="stylesheet" type="text/css" href="/media/css/global.css" /> <link rel="stylesheet" type="text/css" href="/media/css/global.css" />
<link rel="stylesheet" type="text/css" href="/media/css/quote.css" />
<link rel="shortcut icon" type="image/png" href="/media/images/favicon.png" /> <link rel="shortcut icon" type="image/png" href="/media/images/favicon.png" />
</head> </head>

View File

@ -1,6 +1,94 @@
html { /* reset */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
:focus {
outline: 0;
}
ins {
text-decoration: none;
}
del {
text-decoration: line-through;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
.clearfix:after {
visibility: hidden;
display: block;
font-size: 0;
content: " ";
clear: both;
height: 0;
}
* html .clearfix { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */
.mir { letter-spacing : -1000em; }
/*\*/html>body .mir { letter-spacing : normal; text-indent : -999em; overflow : hidden;}
/* defaults */
html {
height: 100%; height: 100%;
} }
body {
height: 100%;
}
ul, ol {
list-style-position: outside;
margin-left: 20px;
padding: 5px;
}
ul {
list-style-type: disc;
}
ol {
list-style-type: decimal;
}
dt {
font-weight: bold;
padding: 2px;
}
dd {
margin-left: 20px;
padding: 2px;
}
/***************** end reset ***************/
body { body {
background-color: #EEEEEE; background-color: #EEEEEE;
color: #000000; color: #000000;
@ -11,8 +99,9 @@ body {
h1 { h1 {
font-size: 5em; font-size: 5em;
text-align: center; text-align: center;
margin-bottom: 10px; margin: 0 auto 10px auto;
padding: 5px; padding: 5px;
width: 600px;
} }
h2 { h2 {
font-size: 3em; font-size: 3em;
@ -57,10 +146,6 @@ a.external {
padding-right: 14px; padding-right: 14px;
} }
.error-message {
padding-left: 18px;
background: transparent url(/media/images/error.png) no-repeat;
}
.input-validation-error { .input-validation-error {
background-color: #FFCCCC; background-color: #FFCCCC;
} }
@ -135,7 +220,6 @@ a.external {
} }
.paging-menu p { .paging-menu p {
text-align: right; text-align: right;
font-size: 80%; font-size: 80%;
@ -168,31 +252,45 @@ a.external {
width: 500px; width: 500px;
height: 120px; height: 120px;
} }
.create-new-link, .edit-link, .loading-link, .delete-link, .submit-link, .cancel-link { #logo a, .add-icon, .edit-icon, .loading-icon, .delete-icon, .submit-icon, .cancel-icon, #search-submit, .quote-permalink, .quote-flag-icon, .error-icon {
background-image: url(/media/images/sprite.png);
background-repeat: no-repeat;
}
.add-icon, .edit-icon, .loading-icon, .delete-icon, .submit-icon, .cancel-icon, #search-submit, .quote-permalink, .quote-flag-icon, .error-icon {
padding-left: 16px; padding-left: 16px;
margin-left: 2px; margin-left: 2px;
} }
.create-new-link { .error-icon {
background: transparent url(/media/images/add.png) left center no-repeat; background-position: -128px -125px;
margin-right: 2px;
} }
.edit-link { .add-icon {
background: transparent url(/media/images/pencil.png) left center no-repeat; background-position: -64px -125px;
} }
.loading-link { .edit-icon {
background-position: 0 -125px;
}
.loading-icon {
background: transparent url(/media/images/loading.gif) left center no-repeat; background: transparent url(/media/images/loading.gif) left center no-repeat;
} }
.delete-link { .delete-icon {
background: transparent url(/media/images/delete.png) left center no-repeat; background-position: -112px -125px;
} }
.submit-link { .submit-icon {
background: transparent url(/media/images/accept.png) left center no-repeat; background-position: -96px -125px;
} }
.cancel-link { .cancel-icon {
background: transparent url(/media/images/cancel.png) left center no-repeat; background-position: -80px -125px;
}
.quote-permalink {
background-position: -32px -125px;
}
.quote-flag-icon {
background-position: -48px -125px;
} }
.button-link { .button-link {
background-color: #FFFFFF; background-color: #FFFFFF;
padding: 2px 2px 2px 18px; padding: 2px 2px 2px 0;
border: 1px solid #999999 !important; border: 1px solid #999999 !important;
color: #000000 !important; color: #000000 !important;
text-decoration: none; text-decoration: none;
@ -218,18 +316,14 @@ a.external {
color: inherit; color: inherit;
height: 125px; height: 125px;
display: block; display: block;
background-image: url(/media/images/vgquotes.png); background-position: 0 0;
background-position: center center;
background-repeat: no-repeat;
} }
#login-dialog { #login-dialog {
padding: 10px; padding: 10px;
} }
#search-submit {
cursor: pointer;
}
#wrapper { #wrapper {
min-height: 100%; min-height: 100%;
@ -256,6 +350,10 @@ a.external {
color: #000000; color: #000000;
background-color: #EEEEEE; background-color: #EEEEEE;
} }
#search-submit {
background-position: -16px -125px;
cursor: pointer;
}
#main { #main {
padding: 20px 20px 120px 20px; padding: 20px 20px 120px 20px;
@ -318,3 +416,108 @@ a.external {
#footer a:hover { #footer a:hover {
text-decoration: underline; text-decoration: underline;
} }
/* quote stuff */
/* box shadow stuff from http://nicolasgallagher.com/css-drop-shadows-without-images/demo/ */
.quote-container {
width: 600px;
margin: 0 auto 50px auto;
position: relative;
}
.quote-container .quote-data .quote-score-container {
float: left;
font-family: Georgia, serif;
padding: 5px;
}
.quote-score {
cursor: help;
}
.quote-score, .vote-container {
text-align: center;
}
.vote-container {
height: 20px;
}
.quote-data {
margin-bottom: 10px;
}
.vote-for, .vote-against {
cursor: pointer;
}
.vote-for:hover, .vote-against:hover {
color: #46C46E;
}
.quote-text {
float: left;
font-weight: bold;
font-size: 20px;
}
.quote-score-container {
width: 40px;
font-size: 20px;
}
.quote-text {
box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
-moz-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
-webkit-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
background-color: #FFFFFF;
padding: 1.5em 1em;
width: 500px;
position: relative;
}
.quote-game-link {
}
.quote-categories a {
border: 1px solid #999999 !important;
background-color: #BBBBBB;
padding: 0 8px;
line-height: 26px;
display: block;
color: #FFFFFF !important;
position: relative;
}
.quote-categories a.game-link {
padding-left: 4px;
}
.quote-categories a.game-link img {
position: relative;
top: 3px;
}
.quote-categories a:hover {
background-color: #999999;
border: 1px solid #BBBBBB !important;
}
.quote-categories li {
float: left;
margin-right: 2px;
}
.quote-details-created {
float: left;
}
.quote-links {
float: right;
text-align: right;
width: 100px;
}
.flag-dialog {
width: 400px;
border: 2px ridge #000000;
background-color: #EEEEEE;
}
.flag-dialog textarea {
width: 394px;
height: 64px;
}
.flag-dialog .submit-container {
margin-top: 10px;
margin-bottom: 5px;
text-align: center;
}

View File

@ -1,111 +0,0 @@
/* box shadow stuff from http://nicolasgallagher.com/css-drop-shadows-without-images/demo/ */
.quote-container {
width: 600px;
margin: 0 auto 50px auto;
position: relative;
}
.quote-container .quote-data .quote-score-container {
float: left;
font-family: Georgia, serif;
padding: 5px;
}
.quote-score {
cursor: help;
}
.quote-score, .vote-container {
text-align: center;
}
.vote-container {
height: 20px;
}
.quote-data {
margin-bottom: 10px;
}
.vote-for, .vote-against {
cursor: pointer;
}
.vote-for:hover, .vote-against:hover {
color: #46C46E;
}
.quote-text {
float: left;
font-weight: bold;
font-size: 20px;
}
.quote-score-container {
width: 40px;
font-size: 20px;
}
.quote-text {
box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
-moz-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
-webkit-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
background-color: #FFFFFF;
padding: 1.5em 1em;
width: 500px;
position: relative;
}
.quote-game-link {
}
.quote-categories a {
border: 1px solid #999999 !important;
background-color: #BBBBBB;
padding: 0 8px;
line-height: 26px;
display: block;
color: #FFFFFF !important;
position: relative;
}
.quote-categories a.game-link {
padding-left: 4px;
}
.quote-categories a.game-link img {
position: relative;
top: 3px;
}
.quote-categories a:hover {
background-color: #999999;
border: 1px solid #BBBBBB !important;
}
.quote-categories li {
float: left;
margin-right: 2px;
}
.quote-details-created {
float: left;
}
.quote-links {
float: right;
text-align: right;
width: 100px;
}
.flag-dialog {
width: 400px;
border: 2px ridge #000000;
background-color: #EEEEEE;
}
.flag-dialog textarea {
width: 394px;
height: 64px;
}
.flag-dialog .submit-container {
margin-top: 10px;
margin-bottom: 5px;
text-align: center;
}
.quote-flag-link, .quote-permalink {
padding-left: 16px;
background-repeat: no-repeat;
}
.quote-flag-link {
background-image: url(/media/images/flag_red.png);
}
.quote-permalink {
background-image: url(/media/images/link.png);
}

View File

@ -1,89 +0,0 @@
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
:focus {
outline: 0;
}
ins {
text-decoration: none;
}
del {
text-decoration: line-through;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
.clearfix:after {
visibility: hidden;
display: block;
font-size: 0;
content: " ";
clear: both;
height: 0;
}
* html .clearfix { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */
.mir { letter-spacing : -1000em; }
/*\*/html>body .mir { letter-spacing : normal; text-indent : -999em; overflow : hidden;}
/* defaults */
html {
height: 100%;
}
body {
height: 100%;
}
ul, ol {
list-style-position: outside;
margin-left: 20px;
padding: 5px;
}
ul {
list-style-type: disc;
}
ol {
list-style-type: decimal;
}
dt {
font-weight: bold;
padding: 2px;
}
dd {
margin-left: 20px;
padding: 2px;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

View File

@ -47,7 +47,7 @@
submitting = true; submitting = true;
var $container = $("#create-system-form"); var $container = $("#create-system-form");
var $link = $(this); var $icon = $(this).find(".submit-icon");
var data = { var data = {
SystemName: $("#SystemName").val(), SystemName: $("#SystemName").val(),
SystemAbbreviation: $("#SystemAbbreviation").val(), SystemAbbreviation: $("#SystemAbbreviation").val(),
@ -67,7 +67,7 @@
data: data, data: data,
beforeSend: function() { beforeSend: function() {
$container.clearModelErrors(); $container.clearModelErrors();
$link.toggleClass("submit-link loading-link"); $icon.toggleClass("submit-icon loading-icon");
}, },
success: function(data, statux, $xhr) { success: function(data, statux, $xhr) {
if (data.Error !== null) { if (data.Error !== null) {
@ -86,7 +86,7 @@
}, },
complete: function() { complete: function() {
submitting = false; submitting = false;
$link.toggleClass("submit-link loading-link"); $icon.toggleClass("submit-icon loading-icon");
} }
}); });
@ -96,12 +96,12 @@
$(".edit-system-link").click(function() { $(".edit-system-link").click(function() {
var $link = $(this); var $link = $(this);
$link.toggleClass("edit-link loading-link"); $link.toggleClass("edit-icon loading-icon");
var systemId = $link.siblings("input[name='SystemIds']").val(); var systemId = $link.siblings("input[name='SystemIds']").val();
$.vgquotes.getResourceById("system", systemId, function(system) { $.vgquotes.getResourceById("system", systemId, function(system) {
$link.toggleClass("edit-link loading-link"); $link.toggleClass("edit-icon loading-icon");
if (system === null) { if (system === null) {
alert("Unable to fetch system " + systemId); alert("Unable to fetch system " + systemId);
@ -124,7 +124,7 @@
$(".delete-system-link").click(function() { $(".delete-system-link").click(function() {
var $link = $(this); var $link = $(this);
$link.toggleClass("delete-link loading-link"); $link.toggleClass("delete-icon loading-icon");
var systemId = $link.siblings("input[name='SystemIds']").val(); var systemId = $link.siblings("input[name='SystemIds']").val();
$.ajax("/system/delete", { $.ajax("/system/delete", {
@ -139,7 +139,7 @@
//remove checkbox for that system //remove checkbox for that system
$link.parent().empty(); $link.parent().empty();
}, },
complete: function() { $link.toggleClass("delete-link loading-link"); } complete: function() { $link.toggleClass("delete-icon loading-icon"); }
}); });
return false; return false;
@ -162,7 +162,7 @@
$("input:checked[name='SystemIds']").each(function(index, input) { if (typeof(data.SystemIds) === "undefined") { data.SystemIds = []; } data.SystemIds.push(input.value); }); $("input:checked[name='SystemIds']").each(function(index, input) { if (typeof(data.SystemIds) === "undefined") { data.SystemIds = []; } data.SystemIds.push(input.value); });
$("input:checked[name='PublisherIds']").each(function(index, input) { if (typeof(data.PublisherIds) === "undefined") { data.PublisherIds = []; } data.PublisherIds.push(input.value); }); $("input:checked[name='PublisherIds']").each(function(index, input) { if (typeof(data.PublisherIds) === "undefined") { data.PublisherIds = []; } data.PublisherIds.push(input.value); });
var $container = $("#create-game-form"); var $container = $("#create-game-form");
var $link = $(this); var $icon = $(this).find(".submit-icon");
var url = "/game/create"; var url = "/game/create";
var submittingAnEdit = $("#create-game-form > .edit-mode").val() == 1; var submittingAnEdit = $("#create-game-form > .edit-mode").val() == 1;
@ -177,7 +177,7 @@
traditional: true, traditional: true,
beforeSend: function() { beforeSend: function() {
$container.clearModelErrors(); $container.clearModelErrors();
$link.toggleClass("submit-link loading-link"); $icon.toggleClass("submit-icon loading-icon");
}, },
success: function(data, status, $xhr) { success: function(data, status, $xhr) {
if (data.Error !== null) { if (data.Error !== null) {
@ -197,7 +197,7 @@
}, },
complete: function() { complete: function() {
submitting = false; submitting = false;
$link.toggleClass("submit-link loading-link"); $icon.toggleClass("submit-icon loading-icon");
} }
}); });
@ -206,11 +206,11 @@
}()); }());
$("#edit-game-link").click(function() { $("#edit-game-link").click(function() {
$("#edit-game-link").toggleClass("edit-link loading-link"); $("#edit-game-link").toggleClass("edit-icon loading-icon");
var gameId = $("#GameId").val(); var gameId = $("#GameId").val();
$.vgquotes.getResourceById("game", gameId, function(game) { $.vgquotes.getResourceById("game", gameId, function(game) {
$("#edit-game-link").toggleClass("edit-link loading-link"); $("#edit-game-link").toggleClass("edit-icon loading-icon");
if (game === null) { if (game === null) {
alert("Unable to fetch game " + gameId); alert("Unable to fetch game " + gameId);
@ -246,7 +246,7 @@
$.ajax("/game/delete", { $.ajax("/game/delete", {
type: "POST", type: "POST",
data: { id: gameId }, data: { id: gameId },
beforeSend: function() { $link.toggleClass("delete-link loading-link"); }, beforeSend: function() { $link.toggleClass("delete-icon loading-icon"); },
success: function(data, status, $xhr) { success: function(data, status, $xhr) {
if (data.Error !== null) { if (data.Error !== null) {
alert(data.Error); alert(data.Error);
@ -256,7 +256,7 @@
//remove game from the dropdown //remove game from the dropdown
$("#GameId option[value='" + gameId + "']").remove(); $("#GameId option[value='" + gameId + "']").remove();
}, },
complete: function() { $link.toggleClass("delete-link loading-link"); } complete: function() { $link.toggleClass("delete-icon loading-icon"); }
}); });
return false; return false;
@ -275,7 +275,7 @@
submitting = true; submitting = true;
var $container = $("#create-publisher-form"); var $container = $("#create-publisher-form");
var $link = $(this); var $icon = $(this).find(".submit-icon");
var data = { PublisherName: $("#PublisherName").val(), PublisherWebsite: $("#PublisherWebsite").val() }; var data = { PublisherName: $("#PublisherName").val(), PublisherWebsite: $("#PublisherWebsite").val() };
var url = "/publisher/create"; var url = "/publisher/create";
var publisherId = $container.find("> .edit-mode").val(); var publisherId = $container.find("> .edit-mode").val();
@ -290,7 +290,7 @@
data: data, data: data,
beforeSend: function() { beforeSend: function() {
$container.clearModelErrors(); $container.clearModelErrors();
$link.toggleClass("submit-link loading-link"); $icon.toggleClass("submit-icon loading-icon");
}, },
success: function(data, statux, $xhr) { success: function(data, statux, $xhr) {
if (data.Error !== null) { if (data.Error !== null) {
@ -309,7 +309,7 @@
}, },
complete: function() { complete: function() {
submitting = false; submitting = false;
$link.toggleClass("submit-link loading-link"); $icon.toggleClass("submit-icon loading-icon");
} }
}); });
@ -319,12 +319,12 @@
$(".edit-publisher-link").click(function() { $(".edit-publisher-link").click(function() {
var $link = $(this); var $link = $(this);
$link.toggleClass("edit-link loading-link"); $link.toggleClass("edit-icon loading-icon");
var publisherId = $link.siblings("input[name='PublisherIds']").val(); var publisherId = $link.siblings("input[name='PublisherIds']").val();
$.vgquotes.getResourceById("publisher", publisherId, function(publisher) { $.vgquotes.getResourceById("publisher", publisherId, function(publisher) {
$link.toggleClass("edit-link loading-link"); $link.toggleClass("edit-icon loading-icon");
if (publisher === null) { if (publisher === null) {
alert("Unable to fetch publisher " + publisherId); alert("Unable to fetch publisher " + publisherId);
@ -345,7 +345,7 @@
$(".delete-publisher-link").click(function() { $(".delete-publisher-link").click(function() {
var $link = $(this); var $link = $(this);
$link.toggleClass("delete-link loading-link"); $link.toggleClass("delete-icon loading-icon");
$.ajax("/publisher/delete", { $.ajax("/publisher/delete", {
type: "POST", type: "POST",
@ -359,7 +359,7 @@
//remove checkbox for that publisher //remove checkbox for that publisher
$link.parent().empty(); $link.parent().empty();
}, },
complete: function() { $link.toggleClass("delete-link loading-link"); } complete: function() { $link.toggleClass("delete-icon loading-icon"); }
}); });
return false; return false;
@ -384,7 +384,7 @@
$.ajax(url, { $.ajax(url, {
data: data, data: data,
type: "POST", type: "POST",
beforeSend: function() { $link.toggleClass("submit-link loading-link"); }, beforeSend: function() { $link.toggleClass("submit-icon loading-icon"); },
success: function(data, status, $xhr) { success: function(data, status, $xhr) {
if (data.Error !== null) { if (data.Error !== null) {
alert(data.Error); alert(data.Error);
@ -413,7 +413,7 @@
} }
}, },
complete: function() { complete: function() {
$link.toggleClass("submit-link loading-link"); $link.toggleClass("submit-icon loading-icon");
var $cell = $("#new-category-name").parent(); var $cell = $("#new-category-name").parent();
$cell $cell
.children(":visible").remove().end() .children(":visible").remove().end()
@ -425,16 +425,16 @@
}; };
var $table = $("#category-checkbox-table"), $cell; var $table = $("#category-checkbox-table"), $cell;
var $submit = $("<a/>").attr({ href: "#", title: "submit" }).addClass("submit-link").click(submitCategory); var $submit = $("<a/>").attr({ href: "#", title: "submit" }).addClass("submit-icon").click(submitCategory);
var $cancel = $("<a/>").attr({ href: "#", title: "cancel" }).addClass("cancel-link"); var $cancel = $("<a/>").attr({ href: "#", title: "cancel" }).addClass("cancel-icon");
var $input = $("<input/>").attr({ id: "new-category-name", type: "text" }).bind("keyup", function(e) { var $input = $("<input/>").attr({ id: "new-category-name", type: "text" }).bind("keyup", function(e) {
console.log(e.which); console.log(e.which);
if (e.which === 13) { if (e.which === 13) {
e.preventDefault(); //make sure the parent form doesn't get submitted e.preventDefault(); //make sure the parent form doesn't get submitted
submitCategory.call($(this).siblings(".submit-link").get(0)); //make sure to invoke it with the correct context submitCategory.call($(this).siblings(".submit-icon").get(0)); //make sure to invoke it with the correct context
} else if (e.which === 27) { } else if (e.which === 27) {
e.preventDefault(); e.preventDefault();
//$cancel.onclick.call($(this).siblings(".cancel-link").get(0)); //$cancel.onclick.call($(this).siblings(".cancel-icon").get(0));
$cancel.click(); $cancel.click();
} }
}); });
@ -490,7 +490,7 @@
$.ajax("/category/delete", { $.ajax("/category/delete", {
type: "POST", type: "POST",
data: { id: categoryId }, data: { id: categoryId },
beforeSend: function() { $link.toggleClass("delete-link loading-link"); }, beforeSend: function() { $link.toggleClass("delete-icon loading-icon"); },
success: function(data) { success: function(data) {
if (data.Error !== null) { if (data.Error !== null) {
alert(data.Error); alert(data.Error);
@ -500,7 +500,7 @@
//remove checkbox //remove checkbox
$("#category-checkbox-table").find("input[value='" + categoryId + "']").parent().empty(); $("#category-checkbox-table").find("input[value='" + categoryId + "']").parent().empty();
}, },
complete: function() { $link.toggleClass("delete-link loading-link"); } complete: function() { $link.toggleClass("delete-icon loading-icon"); }
}); });
return false; return false;

View File

@ -26,8 +26,9 @@
} }
$("<span/>") $("<span/>")
.addClass("field-validation-error error-message") .addClass("field-validation-error")
.text(value) .append($("<span/>").addClass("error-icon"))
.append($("<span/>").text(value))
.insertAfter($input); .insertAfter($input);
} }
}); });
@ -209,13 +210,12 @@
}; };
var setupFlagLink = function() { var setupFlagLink = function() {
$("a.quote-flag-link").click(function() { $("a.quote-flag-icon").click(function() {
if ($(".flag-dialog").length > 0) { if ($(".flag-dialog").length > 0) {
return false; return false;
} }
var $link = $(this); var $container = $(this).parents(".quote-container");
var $container = $link.parents(".quote-container");
var quoteId = $container.find("input.quote-id").val(); var quoteId = $container.find("input.quote-id").val();
var $row = $("<tr/>"); var $row = $("<tr/>");
@ -232,11 +232,12 @@
var $submit = $("<a/>") var $submit = $("<a/>")
.attr({ href: "#", title: "submit" }) .attr({ href: "#", title: "submit" })
.addClass("submit-link button-link") .addClass("button-link")
.text("Submit") .append($("<span/>").addClass("submit-icon"))
.append($("<span/>").text("Submit"))
.click(function() { .click(function() {
var $link = $(this); var $icon = $(this).find(".submit-icon");
$link.toggleClass("submit-link loading-link"); $icon.toggleClass("submit-icon loading-icon");
$.ajax("/flag", { $.ajax("/flag", {
type: "POST", type: "POST",
@ -250,7 +251,7 @@
$.vgquotes.closeDialog($dialog); $.vgquotes.closeDialog($dialog);
}, },
complete: function() { $link.toggleClass("submit-link loading-link"); } complete: function() { $icon.toggleClass("submit-icon loading-icon"); }
}); });
return false; return false;
@ -258,8 +259,9 @@
var $cancel = $("<a/>") var $cancel = $("<a/>")
.attr({ href: "#", title: "cancel" }) .attr({ href: "#", title: "cancel" })
.addClass("cancel-link button-link") .addClass("button-link")
.text("Cancel") .append($("<span/>").addClass("cancel-icon"))
.append($("<span/>").text("Cancel"))
.click(function() { $.vgquotes.closeDialog($dialog); return false; }); .click(function() { $.vgquotes.closeDialog($dialog); return false; });
$dialog $dialog