design mockup for autofilter; no new behavior yet

This commit is contained in:
Emi Matchu 2014-04-05 17:16:35 -05:00
parent a375707e40
commit acbec2ad5e
4 changed files with 25 additions and 24 deletions

View file

@ -1089,7 +1089,6 @@ View.Search = function (wardrobe) {
var form = $('form.item-search'), var form = $('form.item-search'),
item_set = new Partial.ItemSet(wardrobe, '#preview-search-results'), item_set = new Partial.ItemSet(wardrobe, '#preview-search-results'),
input_el = form.find('input[name=query]'), input_el = form.find('input[name=query]'),
clear_el = $('#preview-search-form-clear'),
error_el = $('#preview-search-form-error'), error_el = $('#preview-search-form-error'),
help_el = $('#preview-search-form-help'), help_el = $('#preview-search-form-help'),
loading_el = $('#preview-search-form-loading'), loading_el = $('#preview-search-form-loading'),
@ -1170,12 +1169,6 @@ View.Search = function (wardrobe) {
loadPage(1); loadPage(1);
}); });
clear_el.click(function (e) {
e.preventDefault();
input_el.val('');
form.submit();
});
wardrobe.search.bind('startRequest', function () { wardrobe.search.bind('startRequest', function () {
loading_el.delay(1000).show('slow'); loading_el.delay(1000).show('slow');
}); });
@ -1204,7 +1197,6 @@ View.Search = function (wardrobe) {
var human_query = typeof current_query === 'string' ? current_query : ''; var human_query = typeof current_query === 'string' ? current_query : '';
input_el.val(human_query); input_el.val(human_query);
no_results_span.text(human_query); no_results_span.text(human_query);
clear_el.toggle(!!request.query && request.query.length > 0);
}); });
wardrobe.search.bind('updatePagination', function (current_page, total_pages) { wardrobe.search.bind('updatePagination', function (current_page, total_pages) {
@ -1304,25 +1296,32 @@ View.Search = function (wardrobe) {
wrapper.find('li.must-log-in input').removeAttr('disabled'); wrapper.find('li.must-log-in input').removeAttr('disabled');
} }
var speciesNamesById = null; var namesById = null;
function updateCurrentSpeciesName() { function updatePetAttributes() {
if (speciesNamesById !== null) { if (namesById !== null) {
var speciesId = wardrobe.outfits.getPetType().species_id; var petType = wardrobe.outfits.getPetType();
var speciesName = speciesNamesById[speciesId]; var speciesName = namesById.species[petType.species_id];
$('label[for=advanced-search-species] span').text(speciesName); $('label[for=advanced-search-species] span').text(speciesName);
$('label[for=preview-search-autofilter] .species').text(speciesName);
var colorName = namesById.color[petType.color_id];
$('label[for=preview-search-autofilter] .color').text(colorName);
} }
} }
wardrobe.pet_attributes.bind('update', function(petAttributes) { wardrobe.pet_attributes.bind('update', function(petAttributes) {
speciesNamesById = {}; namesById = {};
petAttributes.species.forEach(function(species) { ["species", "color"].forEach(function(key) {
speciesNamesById[species.id] = species.name; namesById[key] = {};
petAttributes[key].forEach(function(attr) {
namesById[key][attr.id] = attr.name;
});
}); });
updateCurrentSpeciesName(); updatePetAttributes();
}); });
wardrobe.outfits.bind('updatePetType', updateCurrentSpeciesName); wardrobe.outfits.bind('updatePetType', updatePetAttributes);
} }
View.PrankColorMessage = function(wardrobe) { View.PrankColorMessage = function(wardrobe) {

View file

@ -306,7 +306,8 @@ body.outfits-edit
li:first-child li:first-child
margin-bottom: .75em margin-bottom: .75em
#preview-search-advanced-link #preview-search-advanced-link, label[for=preview-search-autofilter]
+inline-block
font-size: 85% font-size: 85%
margin-right: 1em margin-right: 1em
.preview-search-form-your-items .preview-search-form-your-items
@ -321,9 +322,6 @@ body.outfits-edit
margin: 0 .25em margin: 0 .25em
.current .current
font-weight: bold font-weight: bold
#preview-search-form-clear
display: none
font-size: 85%
#preview-search-form-loading #preview-search-form-loading
display: none display: none
font: font:

View file

@ -101,7 +101,11 @@
%input{:name => "query", :type => "search", autofocus: true}/ %input{:name => "query", :type => "search", autofocus: true}/
%input{:type => "submit", :value => t('.search.form.submit')}/ %input{:type => "submit", :value => t('.search.form.submit')}/
%a#preview-search-advanced-link{href: 'javascript:void(0)'}= t '.search.advanced.header' %a#preview-search-advanced-link{href: 'javascript:void(0)'}= t '.search.advanced.header'
%a#preview-search-form-clear{:href => "#"}= t '.search.form.clear' %label{for: 'preview-search-autofilter'}
%input#preview-search-autofilter{type: 'checkbox', checked: true}
= t('.search.autofilter_html',
color: content_tag('span', '', :class => 'color'),
species: content_tag('span', '', :class => 'species'))
#preview-search-form-pagination #preview-search-form-pagination
#preview-search-basic-main #preview-search-basic-main
#preview-search-form-loading= t '.search.loading' #preview-search-form-loading= t '.search.loading'

View file

@ -615,9 +615,9 @@ en:
header: Add an item header: Add an item
form: form:
submit: Search submit: Search
clear: clear
loading: Loading… loading: Loading…
no_results_html: No results for "%{query}" no_results_html: No results for "%{query}"
autofilter_html: Fits the %{color} %{species}
advanced: advanced:
header: Advanced Search header: Advanced Search
submit: Search, advancedly! submit: Search, advancedly!