Huy Dinh » PHP http://huydinh.co.uk/blog Just 8 bit crazy about coding Sat, 23 Jan 2010 11:47:36 +0000 http://wordpress.org/?v=2.9.1 en hourly 1 Replacement zoomer for Magento http://huydinh.co.uk/blog/2008/08/31/replacement-zoomer-for-magento/ http://huydinh.co.uk/blog/2008/08/31/replacement-zoomer-for-magento/#comments Sun, 31 Aug 2008 11:57:55 +0000 Huy Dinh http://huydinh.co.uk/blog/?p=40 One of Magento's little annoyances is the main image preview method - like everything else about Magento, it comes with bells and whistles. Is that a bad thing? Well, yes.

Before I complain, look at the original zoomer.

I'd argue whether the average user needs to zoom into an image using the a slider, because imo, they wither want to see the whole image or as much detail as possible (maximum zoom). Luckily the front end is much easier to change than the back end, so I've made my own zoomer tool which is infinitely easier to use (because you can't actually control anything) you just roll the mouse pointer over the image, a little box will appear that shows a portion of the actual image with maximum zoom. Move the mouse pointer and the zoomed image will be updated accordingly.

Easy, peasy, nifty.

See a demo and download it.

It was written specificly for Magento 1.1 so uses Prototype 1.4 instead of the latest.

To use it, follow similar instructions to installing lightbox:

Put the .js in the main js folder: /js/huy/.
Put the .css in your theme's css folder: /skin/frontend/default/default/css/huy/

In /app/design/frontend/default/default/template/catalog/product/view/ delete the following lines:

PLAIN TEXT
PHP:
  1. <p class="a-center" id="track_hint"><?php echo $this->__('Double click on above image to view full picture') ?></p>
  2. <div class="image-zoom" id="track_outer">
  3.     <img id="zoom_out" src="<?php echo $this->getSkinUrl('images/slider_btn_zoom_out.gif') ?>" alt="<?php echo $this->__('Zoom Out') ?>" class="btn-zoom-out" />
  4.     <div id="track">
  5.         <div id="handle"></div>
  6.     </div>
  7.     <img id="zoom_in" src="<?php echo $this->getSkinUrl('images/slider_btn_zoom_in.gif') ?>" alt="<?php echo $this->__('Zoom In') ?>" class="btn-zoom-in" />
  8. </div>
  9. <script type="text/javascript">
  10.     Event.observe(window, 'load', function() {
  11.         product_zoom = new Product.Zoom('image', 'track', 'handle', 'zoom_in', 'zoom_out');
  12.     });
  13. </script>

You may want to change the styling of zoomer.css to taste.

Remember to minify it!

]]> http://huydinh.co.uk/blog/2008/08/31/replacement-zoomer-for-magento/feed/ 1 Minify Magento’s JS and CSS http://huydinh.co.uk/blog/2008/08/31/minify-magentos-js-and-css/ http://huydinh.co.uk/blog/2008/08/31/minify-magentos-js-and-css/#comments Sun, 31 Aug 2008 10:38:13 +0000 Huy Dinh http://huydinh.co.uk/blog/?p=36 I don't want to sound like a broken record but Magento is slow. So why then aren't the JS and CSS minified by default?

My love for optimisation knows no boundaries, as such, I've taken it on myself to provide an automated solution - here it is:

minify.zip

It's a simple script that scans through each theme's layout/page.xml and minifies each JS and CSS it finds.

To use the script, you need to have the Java runtime environment installed, php must have shell execution abilities and your webserver must have write permissions in  each theme's page.xml (/app/design/frontend/default/default/layout/page.xml), css folder (/skin/frontend/default/default/css) and the main js folder (/js). You also need to have YUI Compressor's build jar file on your server (download it here).

One last thing is to edit the script with your Magento's root folder and location of YUI Compressor's jar file.

It is recommended that you put the script into a password protected folder!

Oh, one last thing: I haven't tested the script in a Windows environment so it may not work.

]]> http://huydinh.co.uk/blog/2008/08/31/minify-magentos-js-and-css/feed/ 1 Crooked Tongues Store – refreshed http://huydinh.co.uk/blog/2008/07/22/crooked-tongues-store-refreshed/ http://huydinh.co.uk/blog/2008/07/22/crooked-tongues-store-refreshed/#comments Tue, 22 Jul 2008 20:13:24 +0000 Huy Dinh http://huydinh.co.uk/blog/?p=24 Crooked Tongues, the famous online sneakers store has been updated with a new ecommerce system - one built from scratch, based on the CMS I built for Freeview... well, not quite "based on" but there are similar features and functionality - especially the recursive navigation/categorisation structure whereby each category can have child categories... there's a name for that design pattern but I don't remember what it is.

Built using the Code Igniter framework by Ca Phun Ung and I, it's very fast and robust and was completed in record time of aproximately 2 months. Most of the backend logic was done by me, templates and javascript by Ca Phun.

I'm pretty proud of this shopping cart system... it has a little bit of data redundancy but it makes the system faster so even though I'm an optimisation evangelist, I think having the redundancy is a good call.

The system is quite flexible - you can sell shoes with multiple size/quantities, apparel with up to 20 different sizes, accessories without a size, homogeneous products with 1 difference... such as a choice of colour.

Anyway, hop over to http://www.crookedtongues.com for some street culture.

]]> http://huydinh.co.uk/blog/2008/07/22/crooked-tongues-store-refreshed/feed/ 1 Slots Logic – a slot machine search engine http://huydinh.co.uk/blog/2008/02/06/slots-logic-a-slot-machine-search-engine/ http://huydinh.co.uk/blog/2008/02/06/slots-logic-a-slot-machine-search-engine/#comments Wed, 06 Feb 2008 13:24:46 +0000 Huy Dinh http://huydinh.co.uk/blog/2008/02/06/slots-logic-a-slot-machine-search-engine/ Previously known as Slots Boffin, Slots Logic is a website with information and reviews about slot machines. I don't know when it was launched but is live now, and it's pretty good.

The site is nice and colourful with good icons and graphics. My part in the site was the PHP engine that searches for specific slot machines.

So, if you want to know more about slot machines, go to http://www.slotslogic.com!

]]> http://huydinh.co.uk/blog/2008/02/06/slots-logic-a-slot-machine-search-engine/feed/ 0