Tags: photozoom
Photozoom 3 takes steroids
Posted in : Plugins & Widgets
Introducing the PZ3IceCold plugin
We haven't really named it that, it just kinda fit with the flow of the rest of the post ... just like all the images do 
... So, you want it, you desire it, you love the feel of it in your hands, you want to do all sorts of cool and sexy things with it ...... you need a shrink ...... but where the hell do you get it? The short answer is here, the long answer is way longer and also involves big words .... but you've already downloaded the plugin and forgotten all about my tacky lil pad, whilst you paw over the coolness of the interface .... I understand .... sniff .....
for the minority that are still reading, here's the rest of the post ( including all the big words ):
We rock 
Millions of people email us on a daily basis begging us to code a photozoom plugin that works with every version of b2evolution that we've tested it with ........ which is .... urm, whatever version I'm running, and another one, and scott may have tested it by the time I post this, in whatever version he's running, so that's three versions it may or may not run in ...... Today their dreams have become a reality ..... so stop emailing us already, just download the bloody plugin 
...... from now on, adding a photozoomed image to your posts is as simple as clicking a button, emailing us to tell us how frickin' cool the interface looks, clicking a few more buttons here, type the odd caption there and ... just for you IE users out there ..... clicking on a radio button, and voila, or boom or blammo or whatever, instant PZ3 image in your post complete with caption, alt text, title text and some other bits of your choice ....... how cool is that!
So, how come we're cooler than a canadian snowstorm?
The short answer is "install the plugin".The long answer is much longer and includes those big words I promised : On the grounds that the b2evo admin pretty much requires javascript just to function, we decided to have a play with improving the work-flow by manipulating the DOM with some pretty persuasive code .... which is ironic really, since photozoom was specifically created to be a pure CSS solution .... without all the ie specific html shit that other solutions employ ... anyway, I digress .... so, we started to play with an interface .... ohhh, and we bent the core a tad, sorry FG .... and then we spent a fair smidge of time, courtesy of Mr Gates, with a slightly higher than normal blood preassure ... and then, finally, we stepped back and looked in awe at the wondrous mess we'd created ....... at least it proved the concept was viable 
So, we wandered off into a dark and lonely place and spent a few days coding up the new work-flow ... and then we spent several hours beating IE over the head with a copy of HTML for Dummies ... and finally it was done. The end result is a plugin that makes it a doddle to add photozoom images to your post, without you having to worry about all the HTML/CSS required to make all the magic work. As an added bonus the plugin actually puts the HTML into your post so even if you uninstall the plugin, as long as you include the pz3 css in your skin, your images will still work.
Is that it?
Realising that not everybody likes the black look, weirdos, we added loads of classnames and id's and stuff to all the various bits that make up the interface, so if you prefer your screen to be red just hit the relevant stylesheet and play with hex. Just don't forget to take IE to one side and slap it around until it understands your changes. Please note : this is a pre-release version, so there's still a few style glitches to work out with the interface. The actual photozoom part of it is fully finished though and won't be changed between now and the public release, so it's safe to play with it.
As always any feedback would be appreciated, even if all you want to say is "your interface sucks", of course we'd just refer you to a good shrink, but that's by the by.
¥
Internet Explorer - wasting production time worldwide
Posted in : Techno Babble
Internet Explorer - wasting production time worldwide
Most people who know me will know my view of any/every version of Internet Explorer, hell most of them hold the same views. In fact, I'd imagine that pretty much every serious web developer out there would probably hold the same views. Internet Explorer is crap, and reminds us daily. Not only can it not understand the most basic HTML or CSS, but it usually can't even understand itself.
Today it hit a new level. I've been coding up a plugin for use on a clients site and, to improve the workflow, we decided to do some fancy shit with javascript seeing as the environment already required javascript to function. After a fair amount of thinking and tinkering I dived in and started coding away in a busy looking manner. After a fair amount of coding, quite a bit of which was spent beating my head against the wall with explorer and coding round it's *quirks* ... but that was expected .... I finally got the code behind the scenes done and started working on the GUI .... I wish I hadn't!
After finding some annoying little quirks ... like don't try leading/trailing whitespace in element title attributes ... ohhh and don't try and make it think to much whilst it's still trying to work out what HTML is .... I hit a deal killer. Internet Explorer couldn't add a radio button ( that worked ) via the DOM ...... a simple bloody radio button! .... if you want to try it yourself, copy paste the following code into notepad, save it as ie_is_crap.html and call it up in IE
Html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> | |
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-UK" lang="en-UK"> | |
<head> | |
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> | |
<title>Screen demo</title> | |
</head> | |
<body> | |
<script type="text/javascript"> | |
// create an element | |
function amCreateElement( elementType, elementAttributes ) | |
{ | |
// create an element of the required type | |
var theElement = document.createElement( elementType ); | |
| |
if( elementAttributes ) | |
{ // we have attributes for this element | |
var allAttributes = elementAttributes.split( '" ' ); | |
var numAttributes = allAttributes.length; | |
for( i = 0; i < numAttributes; i++ ) | |
{ // step though all elements | |
attributeName = allAttributes[i].slice( 0,allAttributes[i].indexOf( '=' ) ); | |
attributeValue = allAttributes[i].slice( attributeName.length + 2 ); | |
// the last attibute will still have trailing " | |
if( attributeValue.charAt( attributeValue.length - 1) == '"' ) attributeValue = attributeValue.slice( 0, -1 ); | |
// check for onclick et al | |
if( attributeName.slice( 0, 2 ) == 'on' ) | |
{// bugger now we need to play with explorer | |
if ( window.attachEvent ) | |
eval('theElement.attachEvent( attributeName, function(x){ '+attributeValue+' } );' )// IE | |
else | |
theElement.setAttribute( attributeName, attributeValue ); | |
} | |
else | |
{ // rest of attributes | |
if( attributeName == 'class' ) | |
{ // yet another piece of explorer crap | |
theElement.className = attributeValue; | |
} | |
else | |
{ // note : in iE everything else but style will work | |
theElement.setAttribute( attributeName, attributeValue, 0 ); | |
} | |
} | |
} | |
} | |
// return the element we just built | |
return theElement; | |
} | |
| |
theInput = amCreateElement( 'input', 'name="test" type="radio"' ); | |
document.body.appendChild( theInput ); | |
| |
| |
theInput = amCreateElement( 'input', 'name="test" type="radio"' ); | |
document.body.appendChild( theInput ); | |
| |
| |
</script> | |
</body> | |
</html> |
Inferior Experience brought to you by Microsoft
Great huh? I won't begin to tell you how many hours I spent narrowing it down to just that. So, this problem leaves us royally screwed, if I can't solve it then we have to revert back to a crap work flow and undo 3 days worth of my time ..... I am not a happy bunny ....... as a last resort I hit google, and for once I was impressed, it's first result leads to this post ( Problem with RADIO (created by DOM) in Internet Explorer ) on a forum, and more importantly, the answer .......... notice the date of the post, July 2005.
Basically it comes down to the fact that IE wouldn't allow you to add a name attribute to an element created through the DOM, because nobody would ever want to create a form object huh? The bit that really pisses me off is that their new *flagship* and *compatible* browser IE7 is just as fucked up, so web developers world wide will still have to waste hours overcoming IE's various quirks and failures ......... I dread to think of the number of hours a day that amounts to.
Thanks to the answer given by Martin Honnen, and the microdoft page that he linked to, I managed to get radio buttons working ..... hooray only 4 bloody hours wasted huh Mr Grates for any of you that are interested, just add the snippet below into the code you saved from above and rerun the page
Html:
if( window.attachEvent && elementAttributes && elementAttributes.indexOf( 'type="radio"' ) > -1 ) | |
{ // you REALLY have to hate IE :| | |
return document.createElement('<input '+elementAttributes+'></input>' ); | |
} |
A problem shared and all that
As you can imagine, with not being a happy bunny, I had to share my problem with Scott ...... the conversation went a tad like this :
tuxnus: it's ie6 ... it's high time to start penalizing them
yabba_hh: how the fuck do you penalise someone who's using IE6 ? they're ALREADY fucked
tuxnus: make it obvious to them
tuxnus: most haven't a clue
yabba_hh: if they haven't noticed just from using ie then even a big red banner with flashing gif saying "Yer browsers fucked" wouldn't work
tuxnus: trouble is, most have nothing to compare it to
tuxnus: they think what they see, is what everyone sees
yabba_hh: there's probably a fair amount of truth in that
So ...... for all you IE users out that there that haven't a clue what we're on about, go install an alternative browser like Firefox or Opera ( google them huh ), and then go wander around the web and see what it *really* looks like. Not only will you have a better experience, and be safer because you're not using a browser that has more security flaws than MI5's headquarters, you'll also be helping web developers world wide save production time by not having to code out IE's ineptitudes.
Anyway, it's time I went and finished the GUI
¥
