Ohmspeaker.com

[Macrura]

Quick note about this site, it's just been re-launched as a 'V2' after an additional 90 hrs of work on it...

http://ohmspeaker.com/

mostly a lot of refactoring of code, finding better, more efficient ways of doing things, both in frontend and admin...I had about 2 years of good reading–the forum–between the initial launch and when the refactor started...

Thanks to pro modules like Table and Lister Pro, the management interface is fast, and easy for the company management to maintain.

With 4 separate product lines to manage (Speakers, Legacy Products, B-Stock and Home Theater), Lister pro has streamlined this–the agile ajax interface is truly unparalleled amongst ecommercce systems for adding and editing hundreds of products.

The news system has been expanded and enhanced with xml feeds, category/tag/archive filters, author profile, and other enhancements.

The product search was converted from a server side search to a completely Javascript based filter, using html5 pushstate, and graphical sliders.

The category overview pages filter the products as opposed to being separate pages, reducing page loads.

Product pages are more intuitive, with better veneer picker, and other javascript enhancements.

[adrian]

Very nice - love the filter tool!

Also - great to see the mention of PW on the credits page: http://ohmspeaker.com/credits/

Just one quick thing - the link to badasstheme.com on that page is broken.

[Macrura]

@adrian - many thanks, i fixed the credits!

[Jonathan Lahijani]

What order management system are you using with Foxycart? Orderdesk? Or a custom solution?

[bernhard]

the filter is awesome! do you have some insights on this for us?

[Macrura]

What order management system are you using with Foxycart? Orderdesk? Or a custom solution?

They are actually not using anything other than the stock Foxycart admin; Though i did setup Orderdesk and it looks great, but i don't think they ever used it.

the filter is awesome! do you have some insights on this for us?

@BernhardB - thanks for checking it out!

The filter is really dead simple..

1.) jQuery Datatable with custom filters, using PW page IDs as data attributes on the cells, e.g. data-filter="1234"

2.) when you change any of the filters, there is an onchange trigger to redraw the table with the filter;

3.) change some numerical inputs to the sliders

4.) empty divs above the table, one for each filter type, and those are populated at the same time when the filters change

[bernhard]

this one here? https://datatables.net/examples/plug-ins/range_filtering.html

[Macrura]

Yes - good find, that was the model i used for setting up the range filtering..

$.fn.dataTable.ext.search.push(
    function( settings, data, dataIndex ) {
        var distance 	= parseInt( $('#search_distance').val(), 10 );
        var distmax 	= parseFloat( data[3] ) || 0; // use data for the distance column

        if(
        	isNaN( distance )
        	||
        	distance <= distmax
		)
        {
            return true;
        }
        return false;
    }
);

and i'm using the ion rangeslider, which after testing a few different ones seemed to work best

[bernhard]

thank you - i hope i will get a job where i need this one day

[bernhard]

hi macrura,

just visited your site again because i may need something similar. as i did lots of work with datatables recently i saw you might want to add scrollx to your table as it is not 100% visible on very small screens: https://datatables.net/examples/basic_init/scroll_x.html

maybe you are already checking for mobile devices. i just checked with chrome window resize

[Macrura]

i thought i made the tables all collapse to vertical on mobile - which table isn't visible?

[bernhard]

as i said: maybe you took care of it on mobile  just wanted to let you know: http://ohmspeaker.com/speaker-filter/?width=14&height=15&price=3200&distance=21

[Macrura]

oh, thanks - yeah, didn't get around to doing the 'collapsable' rows on that page - thanks for the heads up!

[maxf5]

Great job! but this is not very safe.. 

[Macrura]

yeah, it's basically standard; you can enable hmac validation, not that hard, but in this case might be more effort than worth it, because these guys know if a price has been changed...

https://wiki.foxycart.com/v/1.1/hmac_validation