PDA

View Full Version : Paid Preview zoom from category view


tonybarnes
09-06-2010, 11:36 AM
Allows customers to have a "preview" of the product page from within the category view. When the product image is moused over a "quick view this product" message is displayed (alternatively can always be displayed, up to you), when clicked it loads a lightbox view of the product.

The product page loaded in the lightbox is a custom version of your full product page, so can have whatever information you like in there. When product is added to cart, the lightbox closes, and the category is refreshed, so that they see the updated cart. Alternatively can redirect to cart or do something else if preferred.

DEMOS

http://www.savant-health.com/
http://www.shopcalico.com/shop/categories/New

£40 installed with some customisation (i.e. setting up the new product page for you) to suit.
£25 for source files and detailed installation instructions.

Please PM, or bump this thread for contact

Turki
09-08-2010, 01:38 PM
I need Screenshots or Live Demo

tonybarnes
09-08-2010, 01:56 PM
Sure, here you go:-

http://i78.photobucket.com/albums/j84/tony_barnes/Untitled-1-30.gif


http://i78.photobucket.com/albums/j84/tony_barnes/Untitled-2-4.gif


http://i78.photobucket.com/albums/j84/tony_barnes/Untitled-3.gif


http://i78.photobucket.com/albums/j84/tony_barnes/Untitled-4.gif

I've had to change it very slightly since first posting, as the way I did have it set up to refresh the page when product added to cart lead to the page refreshing every time you closed the window, which made no sense. It should be fine to add back in, I've just not done it yet

Turki
09-08-2010, 02:07 PM
Is this work in v5.5.4?

tonybarnes
09-08-2010, 02:09 PM
It's tested in 5.5.2, but should work fine in all versions of the cart as it has no reliance on the database structure

a1m
09-08-2010, 05:28 PM
Hey Tony,

I am very interested. Can you please setup a demo so I can test it and see it for myself?

Thanks

tonybarnes
09-09-2010, 08:01 AM
Hi a1m - I'm PM'ing you a link now. Once I've asked if it's ok by the store owner I'll bob a link up for others to try it.

tonybarnes
09-09-2010, 03:14 PM
Live demo for those who are interested

http://www.shopcalico.com/shop/categories/New

tonybarnes
09-10-2010, 10:04 AM
New pricing structure :)

Installed: £40
Install yourself: £25

novista
09-17-2010, 06:03 PM
Tony,

PM'd you on this.

Turki
09-17-2010, 09:17 PM
I want to purchase this and it work fine in Firefox but in IE8 there are bugs. Please test it in IE8

a1m
09-20-2010, 10:50 PM
I want to purchase this and it work fine in Firefox but in IE8 there are bugs. Please test it in IE8

Hey,

Can you please give some details about what bugs you see in IE8?

Thanks

Turki
09-20-2010, 11:26 PM
Webpage error details

User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; Trident/4.0; Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1) ; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; InfoPath.2; .NET4.0C; .NET CLR 1.1.4322)
Timestamp: Mon, 20 Sep 2010 23:23:21 UTC


Message: Object expected
Line: 465
Char: 2
Code: 0
URI: http://www.shopcalico.com/shop/javascript/common.js


Message: 'config' is null or not an object
Line: 56
Char: 2
Code: 0
URI: http://www.shopcalico.com/shop/categories/Vintage


Message: 'config' is null or not an object
Line: 281
Char: 7
Code: 0
URI: http://www.shopcalico.com/shop/categories/Vintage

I am using IE8 + win7

a1m
09-21-2010, 01:01 AM
Thanks for some details. What exactly happens though? Can you take a screenshot perhaps?

Turki
09-21-2010, 01:17 AM
1- When I try to click Quick Look icon, it keep changing it location.
2- The page load is slow because of the bugs.

tonybarnes
09-21-2010, 10:47 AM
Thanks for posting - the errors are not ones related to the mod. They've done their best to elude me as to how to solve, but that is a separate issue with that particular cart.

The position of the image is something I will have to go in and fix, looks to be another "IE love CSS compliance" issue... will investigate

tonybarnes
09-21-2010, 11:31 AM
Sorted the common.js error that was pooping up, thread gave me a new thought pattern!! So definitely no errors generated by script for this :)

Just updating to IE8 to see what the issue is with the display

a1m
09-21-2010, 08:39 PM
Sorted the common.js error that was pooping up, thread gave me a new thought pattern!! So definitely no errors generated by script for this :)

Just updating to IE8 to see what the issue is with the display

Hey Tony,

Whenever you are done with any adjustments/modifications, can you please send me the updates so I can replace the code or files as needed.

Thanks

Turki
09-21-2010, 09:15 PM
I am 100% sure that Tony will fix it :)
I will purchase it whenever you are done.

tonybarnes
09-22-2010, 10:24 AM
Right, suffice to say my loathing for IE grows by the day.... but all sorted now. A1M I've sent you the updated version :)

Turki
09-22-2010, 10:37 AM
Excellent work Tony I test it and it is fine now.

a1m
09-22-2010, 10:54 AM
Tony,

Got it! Great work as usual!

Anyone thinking about this mod should jump on this! A no-brainer mod for most stores!

hgmobile
09-23-2010, 10:56 PM
Applied to a modified V 5.02 store. Works well and even looks good on an ipad too !
Thanks for this mod to Tony and Novistaweb for making it work on our site.

tonybarnes
09-24-2010, 07:42 AM
Nicely - great it looks good on iPad too :)

novista
09-24-2010, 04:10 PM
Just want to say that this is a very nice mod and from a developer's point of view, very simple to implement and manage. One of the selling points is that the window which opens the product can be customized, you are not locked into a specific layout.

Allowing customers to add a product to their cart from the category page without forcing them to the cart page afterward is important. For those who have product variations, this mod lets customers select that variation without forcing them to open the product page.

Very nice job Tony.

websnail
09-24-2010, 11:19 PM
As I'm already upgrading 5.5.4 I might as well add this in as well...

Tony... Send me an invoice and I'll get this added in as well...

tonybarnes
09-25-2010, 09:56 PM
Thanks for the praise Michael!! All blushes this end, lol!

Will do Martin - I presume you want the self install version? Shall I send to your websnail addy?

websnail
09-26-2010, 05:12 PM
Will do Martin - I presume you want the self install version? Shall I send to your websnail addy?

Yup.. That'd be great

tonybarnes
09-27-2010, 08:07 AM
Sent - let me know how you get on

websnail
09-28-2010, 11:50 AM
Hey Tony,

Started installing the code and finding a few bits that could use tweaking...

This one in particular is a minor one but could save hassle later on.

1. Open templates/your_template/category.html, locate:
%%Panel.HTMLHead%%

... should be:
1. Open templates/your_template/category.html, locate:
%%Panel.HTMLHead%%
<body>

... otherwise the javascript will be lost between the head and body tags which is illegal syntax and likely to cause a problem later on with standards compliant browsers.

tonybarnes
09-28-2010, 12:05 PM
That's not something I've come across, can't find any info on the net either - do you have a link? Easy enough change though, thanks

websnail
09-28-2010, 12:54 PM
Something else for you to tidy things up a teensy bit...

..instead of:
<div id="RevealZoom%%GLOBAL_ZoomLink%%" style="display:none; position:absolute; margin-top:-27px; margin-left:2px" class="quicklookzoom"><a id="zoom%%GLOBAL_ZoomLink%%" href="%%GLOBAL_ProductLink%%?zoom=yes"><img src="/quicklook_onhover.gif"/></a></div>

this is neater:
<div id="RevealZoom%%GLOBAL_ZoomLink%%" style="display:none; position:absolute; margin-top:-27px; margin-left:2px" class="quicklookzoom"><a id="zoom%%GLOBAL_ZoomLink%%" href="%%GLOBAL_ProductLink%%?zoom=yes"><img src="%%GLOBAL_IMG_PATH%%/quicklook_onhover.gif"/></a></div>

You then upload the image quicklook_onhover.gif to:
/templates/Cosmetics/images/

... that makes it neater and easier to debug specific test sites if, like me, you have your test site as a sub-folder on your main site and don't want to put anything in the root folder.

:)

websnail
09-28-2010, 01:01 PM
I've sent you the last fix by email as it's a bit more of your code than I feel comfy with posting in public...

Sorts the messy bit though...

websnail
09-28-2010, 01:10 PM
Hmm... ok... now the fun is with IE8... could just be my CSS formatting or something I've missed but I do know my load times are now very high...

It's almost as if the JS is reloading every single time which is inefficient as heck... Wonder what I've borked?

tonybarnes
09-28-2010, 01:12 PM
lol, you're gonna post the whole code up at this rate ;)

Yeah, I can't recall what I was doing when I first stopped using the %%GLOBAL_IMG_PATH%%, it was some mod or another quite some time back, and it kept failing on me, from that point on I've just dumped stuff into the root. You're right though.

I'll be packaging up another updated version in the next day or so, going to slightly change the way a variable is passed further to what Martin has said earlier - though I've not encountered issues yet, it does make sense to keep it as future proof as poss!

Also thinking about swapping out the inline styling to a small CSS file, would make sense.

tonybarnes
09-28-2010, 01:15 PM
Sorry, had answered a phone call mid post, you've been busy!!

Yeah, looking at what you've done it's exactly what I would have, not sure why load time would be affected? Do you have a live link? Send to my gmail if you do and I'll have a look

websnail
09-28-2010, 01:17 PM
Ok... titbit #5435 :)

If you have a style that uses CSS min-width: with a value of greater than 800px; you need to edit your productzoom.html file

Find:
<body style="background:none;">

Replace with:
<body style="background:none; min-width: 790px;">

websnail
09-28-2010, 01:18 PM
Sorry, had answered a phone call mid post, you've been busy!!

Yeah, looking at what you've done it's exactly what I would have, not sure why load time would be affected? Do you have a live link? Send to my gmail if you do and I'll have a look
It's on my debug site so you already have access and the URL... :)

tonybarnes
09-28-2010, 01:28 PM
Duh! Will go look

tonybarnes
09-28-2010, 01:31 PM
Yep, other than slight spacing on the zoom image, seems to be working a treat, very nippy actually :)

websnail
09-28-2010, 01:33 PM
Yep, other than slight spacing on the zoom image, seems to be working a treat, very nippy actually :)
You've got an email about ie8 compatibility mode... That is borked annoyingly and the original IE8 loses the fancybox styling...

websnail
09-28-2010, 01:47 PM
...the original IE8 loses the fancybox styling...
.. and found the solution to this one at least.

Annoyingly the problem is the path which, for some reason, isn't interpreted properly by IE8... The solution I've found seems to be to use a full path eg:

/mystore/javascript/jquery/plugins/fancybox/image.jpg

rather than:
/fancybox/image.jpg

Because the JS isn't parsed by the template editor it's a case of manually editing too rather than using any programmatic input to solve the problem...

Ho hum... :rolleyes:

tonybarnes
09-28-2010, 02:14 PM
I was just trying to do the same - did you use mystore.com/javascript/etc? That's about the only thing I haven't tried! lol

websnail
09-28-2010, 02:28 PM
I was just trying to do the same - did you use mystore.com/javascript/etc? That's about the only thing I haven't tried! lol

Yep... this is more or less it:
#fancybox-loading.fancybox-ie div { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (src='/foostore/javascript/jquery/plugins/fancybox/fancy_loading.png', sizingMethod='scale'); }
.fancybox-ie #fancybox-close { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (src='/foostore/javascript/jquery/plugins/fancybox/fancy_close.png', sizingMethod='scale'); }

.fancybox-ie #fancybox-title-over { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (src='/foostore/javascript/jquery/plugins/fancybox/fancy_title_over.png', sizingMethod='scale'); zoom: 1; }
.fancybox-ie #fancybox-title-left { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (src='/foostore/javascript/jquery/plugins/fancybox/fancy_title_left.png', sizingMethod='scale'); }
.fancybox-ie #fancybox-title-main { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (src='/foostore/javascript/jquery/plugins/fancybox/fancy_title_main.png', sizingMethod='scale'); }
.fancybox-ie #fancybox-title-right { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (src='/foostore/javascript/jquery/plugins/fancybox/fancy_title_right.png', sizingMethod='scale'); }

.fancybox-ie #fancybox-left-ico { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (src='/foostore/javascript/jquery/plugins/fancybox/fancy_nav_left.png', sizingMethod='scale'); }
.fancybox-ie #fancybox-right-ico { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (src='/foostore/javascript/jquery/plugins/fancybox/fancy_nav_right.png', sizingMethod='scale'); }

.fancybox-ie .fancy-bg { background: transparent !important; }

.fancybox-ie #fancy-bg-n { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (src='/foostore/javascript/jquery/plugins/fancybox/fancy_shadow_n.png', sizingMethod='scale'); }
.fancybox-ie #fancy-bg-ne { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (src='/foostore/javascript/jquery/plugins/fancybox/fancy_shadow_ne.png', sizingMethod='scale'); }
.fancybox-ie #fancy-bg-e { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (src='/foostore/javascript/jquery/plugins/fancybox/fancy_shadow_e.png', sizingMethod='scale'); }
.fancybox-ie #fancy-bg-se { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (src='/foostore/javascript/jquery/plugins/fancybox/fancy_shadow_se.png', sizingMethod='scale'); }
.fancybox-ie #fancy-bg-s { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (src='/foostore/javascript/jquery/plugins/fancybox/fancy_shadow_s.png', sizingMethod='scale'); }
.fancybox-ie #fancy-bg-sw { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (src='/foostore/javascript/jquery/plugins/fancybox/fancy_shadow_sw.png', sizingMethod='scale'); }
.fancybox-ie #fancy-bg-w { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (src='/foostore/javascript/jquery/plugins/fancybox/fancy_shadow_w.png', sizingMethod='scale'); }
.fancybox-ie #fancy-bg-nw { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (src='/foostore/javascript/jquery/plugins/fancybox/fancy_shadow_nw.png', sizingMethod='scale'); }

websnail
09-28-2010, 02:29 PM
The other problem with IE8 compatibity mode is down to the position:absolute; call and something bizarre going on with the way IE8 compat mode handles it...

tonybarnes
09-28-2010, 02:31 PM
Yep, just came to that same outcome - I was in the wrong file... stupid extra directories!

lol, also trying to sort that, you should get a desk here mate, would save time ;) :D

I'm baffled as to why Microsoft can't just get their browsers to display stuff the same as other people....

Turki
09-29-2010, 07:29 PM
Tony, your add on is perfect but why you didn’t make it work in search result also, not all customers use categories some of them search for products.

It should work in categories, Search Result, Feature Items

Turki
09-29-2010, 08:58 PM
The new version of fancybox will not open image if you click it in Product Page.
Go to Product Page and click the product image, with the old version of fancybox it will open popup window with all images but the new version it will not open anything.

Turki
09-30-2010, 01:31 AM
The new version of fancybox will not open image if you click it in Product Page and it has some CSS issues in IE8.
The old fancybox will not work with this Add-on because you cannot add products from the popup window (you can view but you cannot add)

I fond simple solution to this, don’t use the new fancybox and use the default ISC fancybox and make simple changes to fancybox.js

Find:
hideOnContentClick : true,

change it to:
hideOnContentClick : false,

Also you may need to change “frameWidth” in fancybox.js from 560 to 700

tonybarnes
09-30-2010, 08:45 AM
Hi Turki,

Duly noted - I had planned on adding it in to the similar products bit, so I'll make amends to the installation file to include the other areas:

1. Featured products
2. New products
3. Search results
4. Similar products

The CSS issues with IE were also sorted yesterday (thanks to help from Martin), and will be added into the update.

Will hopefully have time to do it today, if not it will be done and sent out tomorrow

I'm not sure what the issue is you're talking about on the product page? Haven't come across that? I guess that it's just down to changes in the way fancybox items are loaded. The 1.3 api uses these commands - http://fancybox.net/api; whilst the 1.2 api uses http://fancybox.net/api/126 - I'll investigate and see what the best solution is, thanks for the heads up.

1.3 gives callback options that I'm not sure 1.2 contains, and are used in this mod, which is why I used 1.3

I've just checked and 6.0.14 still has fancybox 1.2 in it, rather than 1.3 - not sure why they wouldn't upgrade to the latest, stable version.

Cheers,

Tony

Turki
09-30-2010, 02:43 PM
I'm not sure what the issue is you're talking about on the product page?

With the old fancybox we can enlarge any image for products but with the new fancybox we cannot (enlarge not zoom)

OK, go to your site and click the product image in
http://www.savant-health.com/products/Udos-Choice-Ultimate-Oil-Blend-%252d-Organic.html

then go to
http://www.shopcalico.com/shop/products/Wild-Weave-Earring.html
and click the product image

tonybarnes
09-30-2010, 03:21 PM
Hi Turki,

The click to zoom has bee disabled on the Calico site, the <a href> doesn't contain the correct information to fire it up - it is set up with:

onclick="this.href=''; return false;"

instead of:

onclick="%%GLOBAL_TinyImageClickJavascript%% return false;"

This was done by the developer prior to me who did the look of the site - I'm not sure why the onclick has been left at all. I just added the "correct" code back in to test, refreshed, and the click to zoom worked fine (well, it loaded up fine, the formatting felt odd, but there has been a lot of changes in that respect on this site)

Cheers,

Tony

tonybarnes
09-30-2010, 03:54 PM
Turki, I'm just looking into the way that the zoom would function if you were to have a category view, along with new products, featured products, etc. The way it is currently designed things would quickly get messy, with a lot of additional load on the javascript.

I'm going to re-write a good chunk of the system, as you are completely correct, the system should work across the board on other panels/views.

This isn't what I originally sold (just a category zoom), but I reckon it's worth me fixing, and repackaging to send out to those who have already bought. Any newcomers will obviously just get the updated version :)

If you could bear with me a little while on this, as I need to rethink it a fair bit! In the meantime I will send out new instructions with the other amends mentioned

Cheers,

Tony

tonybarnes
10-01-2010, 12:33 PM
New version in testing, major rewrite/rethink was required to keep things as simple as possible for people to apply to their cart. Now works on all thumbs, and looking at the ISC 6 code, should be future proof also :)

Will send out when happy everything is working as it should.

a1m
10-01-2010, 01:21 PM
New version in testing, major rewrite/rethink was required to keep things as simple as possible for people to apply to their cart. Now works on all thumbs, and looking at the ISC 6 code, should be future proof also :)

Will send out when happy everything is working as it should.

cool! looking forward to it. When you do send out can you please send it as if it were a fresh install.

Thanks

tonybarnes
10-01-2010, 01:45 PM
After looking at how the edited files ended up looking (and some feedback from Martin!), I'm just going to be sending it out as an instruction sheet + new files required, rather than any altered ones. This gets past any issues with which version someone is running, if they have mods in there, etc.

I've also reduced the amount of files that need altering (suffice to say the accordion thread was good for firing up my javascript brain!), so there will be less headaches there, though you will need to chop old code out from previous install, but that will be quick enough as all commented.

Just re-checked ISC 6.x code, I'll need to do a test-run on that as code has changed very slightly... hrumph!

websnail
10-03-2010, 10:21 PM
Ughhhh...

Well, I spent what time I had over the weekend on this latest code and I've come to the conclusion that the biggest problem is the lack of a <DIV > </DIV > around the product information and the use of this daft odd/even class for the LI list element instead of something useful and specific that could be id'd and used with jQuery.

Anyway... I've sent you a bunch of emails Tony, one particularly blistering so get your fireproof gloves on..

Way I see it, the pragmatics of creating a proper overlay that sits over the product image will require some more careful examination of the DOM and figuring a way to add a New DIV around the ProductImage DIV, make sure it's set as location: relative; and then define your added overlay image as a SPAN and not a DIV. That would allow you to use the location: absolute in relation to the enclosing DIV and sort this $deity awful mess.


In short, this problem requires someone with a clue about CSS to figure how to make the overlay appear properly, to be clickable and THEN fix the Jquery accordingly... not the other way around...

Fun! ;)

tonybarnes
10-04-2010, 07:41 AM
Hey Martin - lol, yes, got the emails, have sent reply. I am baffled though, as it's working perfectly cross browser this end, all browsers, no probs...?? Just checked your test store set up, and the bits that I am targetting with the JS look to be in the same layout as they are here, so can't for the life of me think what is going on, unless something was missed in the downgrade process???

The way the CSS is set up should work, as the jquery is simply tagging the divs on as if they were always there, so the standard -ve margin value should work fine across the board (like it is my end???)

Hang on a second.... found it. Joy of joys, .ProductImage / List CSS seem to be set up differently in different templates... changing the settings on that screws up the mod.

Bugger...

Ok, now I know what I'm looking at, I need to re-look at it - silly me for thinking that it would be set up in the same way across templates!!! :mad::mad::mad::mad:

websnail
10-04-2010, 08:56 AM
Hang on a second.... found it. Joy of joys, .ProductImage / List CSS seem to be set up differently in different templates... changing the settings on that screws up the mod.

Bugger...

Ok, now I know what I'm looking at, I need to re-look at it - silly me for thinking that it would be set up in the same way across templates!!! :mad:
Never Ass-U-Me anything young padwan... ;)

I put my test store into default template, which I see your Savant store uses (no idea where your test store is mind) and the same problem... Although I have to admit I've reached the point that I don't know what I have and haven't tried now so I'm going to leave well alone until you suss it out.


Also for your info... the lack of a mouseout is something I've rectified.. sending the code now.

tonybarnes
10-04-2010, 09:13 AM
Got the mail, cheers - regarding the mouseout, I've replied, by having it in place it caused a flickering/issue actually being able to click the link, I'm having a rethink.. :)

tonybarnes
10-04-2010, 11:29 AM
Right, well I've now got this working 110% from what I can tell on our site - http://www.savant-health.com/

It is working across the new, featured, best selling, and category content panels.

websnail
10-04-2010, 12:14 PM
Right, well I've now got this working 110% from what I can tell on our site - http://www.savant-health.com/

It is working across the new, featured, best selling, and category content panels.

Yeah... as per my email, winging its way to you, I've had no end of problems with my own theme (based on the Cosmetics one) because of the heavy use of float: left in places that cause problems...

So be warned, this could make for a lot of headaches...

tonybarnes
10-04-2010, 01:02 PM
Thanks Martin.

Looks like the outcome of this is:

1. ISC doesn't have a "standard" way of displaying the thumbs
2. This is a PITA!

So whilst this is set up perfectly for our CSS rules, it may cause slight issues on others. I've just checked another store, a quick tweak, and sorted :)

a1m
10-04-2010, 02:04 PM
Thanks Martin.

Looks like the outcome of this is:

1. ISC doesn't have a "standard" way of displaying the thumbs
2. This is a PITA!

So whilst this is set up perfectly for our CSS rules, it may cause slight issues on others. I've just checked another store, a quick tweak, and sorted :)


Tony,

Since I haven't had a chance to do any installation yet, can you please send me the updated instructions / files whenever you get a chance please.

Thanks

tonybarnes
10-04-2010, 02:13 PM
Already sent through :)

Examaids
10-04-2010, 05:19 PM
Some possible bugs...When you add item via the pop-up, View Basket doesn't update. You have to click View Basked, view it to find out item has been added, only then does View Basket update. I also clicked a button or two and got attached view. Had to kill tab (latest Firefox on the Mac).

tonybarnes
10-04-2010, 07:30 PM
Is the pop-up closing properly when you add something to cart? If that is firing, then the page should refresh when it's closed. If you close the window without adding to cart, then it shouldn't refresh.

Just double checked (in case I uploaded something funky by mistake when shutting down at end of day!) and everything is kosher on XP with FF 3.6. I've not actually got a copy of FF on mac at the minute, I'll grab one in the morning and see if I can repeat the issue.

With regards to the scrollbar thing - did you just click around a load of the zoom links?

Examaids
10-05-2010, 06:52 AM
Page is refreshing this morning OK (not last night). It's not an ideal solution as I see a blank page momentarily...Regarding the pop-up collapsing...If you add a product that requires you to choose an option and you don't choose one, when you dismiss the browser warning pop-up, you are left with the view in the screenshot I uploaded last night. I just repeated it. You have to close the page to get rid of the collapsed pop-up.

tonybarnes
10-05-2010, 10:16 AM
I've not been able to get a copy of firefox to work on my mac (10.5.8 - going in circles?!?!) - however I've changed the way that it works, so this should be sorted now - any chance you could verify?

Examaids
10-05-2010, 10:53 AM
I've not been able to get a copy of firefox to work on my mac (10.5.8 - going in circles?!?!) - however I've changed the way that it works, so this should be sorted now - any chance you could verify?

That is better...You now have to dismiss quick view or choose an option when you add item to basket after dismissing the browser pop-up.

However, still not optimal shopping experience, IMO. When page updates, I still see a white page. This happens even if removing items from the basket.

First item is still not being added to View Basket at the top when using quick view. Second item is added. Actually, only second item is added, subsequent buys are ignored. If I View Basket, it only has the one item.

HTH.

tonybarnes
10-05-2010, 11:01 AM
Ok, so first problem is gone, that's good!

I'm not sure I get what you mean by the rest of what you're saying:


However, still not optimal shopping experience, IMO. When page updates, I still see a white page. This happens even if removing items from the basket.

First item is still not being added to View Basket at the top when using quick view. Second item is added. Actually, only second item is added, subsequent buys are ignored. If I View Basket, it only has the one item.

First part - are you talking about the page refreshing when you remove something from the cart? If so that is standard ISC, I agree, AJAX would be nicer.

I don't get what you mean by first and second item? When item is added from within quick look, the quicklook should disappear, the screen should remain grey whilst refreshing, then you should have a refreshed category view with item added to cart in link at top. Is that not happening for you?

Examaids
10-05-2010, 11:27 AM
Ok, so first problem is gone, that's good!
First part - are you talking about the page refreshing when you remove something from the cart? If so that is standard ISC, I agree, AJAX would be nicer.

Talking about both: removing items and adding items. Both result in a "white" flash. On our site, if I add or remove item, there is no flash.

I understand you need to update because of the mod but it's also happening on your store when I remove item from basket. Actually, also happening when I don't use your quick view mod to add item to basket.

I don't get what you mean by first and second item? When item is added from within quick look, the quicklook should disappear, the screen should remain grey whilst refreshing, then you should have a refreshed category view with item added to cart in link at top. Is that not happening for you?

When I add first item using quicklook, the View Basket at the top of the page isn't updated to show 1 item after quicklook disappears. If I add another item, it is added. However, if I add a third item via QL or standard page, nothing is added to basket. This may be a Firefox 3.6.10 cache related problem on the Mac only. I can now add more items and View Basket reflects updates having revisited your store.

Examaids
10-05-2010, 11:37 AM
OK..I emptied cache...went back to http://www.savant-health.com/ Added one item, tried adding another, no go. I think that may also have something to do with what item is being selected: one with options, or one without, or whether it's added from quicklook or item page, etc. Sorry, don't have time to test all of the permutations...Maybe later...

Had a quick look in Safari. Pager refresh is much better. No white flashes when items removed from basket.

tonybarnes
10-05-2010, 11:49 AM
Ok, I've been jumping around on our site for a bit now, the "white flashes" are fairly random - change from category A to B, no flash, change back, flash, change back again, flash, change back again, no flash. It's always been like this, never actually questioned it though!!

I'll have a dig to see if there's some reason it's doing this, as it's not related to this mod.

I also can't get the issue of not being able to add to cart to replicate? Add from zoom, then from normal page, then from zoom with configurable product, then normal page with configurable, etc, doesn't break?

tonybarnes
10-05-2010, 02:01 PM
The flashing has bugged me all day, finally worked out what it is - the little delivery flash animation we have running. Delete it out and there is no flashes... hmmmm, what on earth is causing that then!?!?

Still, nothing to do with mod, so all good!

tonybarnes
10-05-2010, 02:12 PM
Righty, dumped the flash content in an iframe and all is sorted, no flicker!

Very strange that it's something that I've never really picked up on, as soon as you mentioned it, it started bugging me!!

Thanks for highlighting and making me look into it :)

Examaids
10-06-2010, 09:08 AM
I also can't get the issue of not being able to add to cart to replicate? Add from zoom, then from normal page, then from zoom with configurable product, then normal page with configurable, etc, doesn't break?

Please try the various permutations you have for adding orders and keep emptying the cache before trying another ordering method. Am too busy at the moment to do more testing but will have another go during a slack period. I think the bug may be only there in Firefox 3.6.10 on the Mac OS.

I just quickly added first featured item to cart via QL and then the next and got attached. As you can see, View Basket did NOT update.

tonybarnes
10-06-2010, 10:20 AM
Right, finally got a copy of Firefox to install, there is something odd going on, seems to be down to speed of javascript from what I can gather. Tweak ahoy!

tonybarnes
10-06-2010, 11:46 AM
I've found the issue, seems that every browser is more or less capable of doing the JS, so speed issues changed the way things worked. The act of physically closing the pop-up was the issue, each browser taking different amounts of time to do it.

So I've simplified the way the pop up closes, which has sorted things - though testing on 2 carts shows some tweaking of the timing is required. We're on a dedicated server and a setting of 400ms is perfect, for the Calico store 1000ms seems to work best. Thanks for pointing it out :)

a1m
10-07-2010, 07:05 PM
Good news for those who might be thinking about adding this: Walmart.com has quick view now!

Some blogs have been debating whether this is a good idea. Honestly, this is a no brainer if you ask me. But to prove the point, one of the retailing giants, walmart also has this now.

//The End.

Turki
10-07-2010, 07:20 PM
Tony Quick View is better than Walmart.com Quick View :)

tonybarnes
10-08-2010, 05:01 AM
Haha - nice one :)

a1m
10-08-2010, 06:30 PM
While I love Tony's contribution towards making this possible, using FancyBox may not be a good choice it appears.

For a different project, I started doing some research on it and fancybox has a lot of issues. I came across another jquery plugin called colorbox which seems to be compliant towards all other browsers and resolves all the issues. Most importantly it is being kept upto date by the author.

tonybarnes
10-10-2010, 04:50 PM
I'll have a look into that - what were the issues raised?

Colorbox looks good though, seems to have same options

RickHope
10-25-2010, 01:11 AM
Very intersted in this

RickHope
10-25-2010, 01:12 AM
will PM you now

tonybarnes
10-25-2010, 07:01 AM
Have sent reply :)

tonybarnes
12-22-2010, 10:52 AM
Working on 6.x :D

Ryan@O'Neal
06-07-2011, 12:08 AM
+1 Tony, please advise as to your pricing on this - it's PERFECT to save me time in trying to do the same for this new project.

Also, if you have a demo with it working properly on 6.x, please let me know as well :)

tonybarnes
06-07-2011, 08:02 AM
Working example on my site - www.savant-health.com (http://www.savant-health.com)

Pricing as per first page:

£40 installed with some customisation (i.e. setting up the new product page for you) to suit.
£25 for source files and detailed installation instructions.

I'm on 6.1.1

totalwarehouse
07-17-2011, 03:10 PM
hi im interested in this, please let me know how to proceed, thanks.

tonybarnes
07-18-2011, 07:59 AM
Hi Totalwarehouse - drop me a PM on here and we can sort it out.