A.R. Van Halleorg

There’s a good chance that you’ve probably seen this before and weren’t able to come up with a solution and ripped your hair out trying to get it and maybe that’s what you were about to do before you stumbled on this. I was shown this by a coworker this morning and I decided to add it to my ever growing list of reasons why IE6/IE7 reminds me of a mother-in-law with it’s horrific ability to nag for details. (Not my case, my mother-in-law doesn’t care about anything)

So! Actually there are 2 things I’ve seen that work :

1. Remove the margin-top from the element (especially things like headers and put padding or line-height instead)

2. (from coworker) set your element to have vertical-align:top and suddenly it disappears!

Hope that helped someone. If not, well I guess I’ll keep looking.

Firstly, I’d like to apologize to booking for this taking so long. The update is coming up, I had a few days of issues with regular expressions and things didn’t go so well, but now it’s on track.

The main reason for the push on this update prior to my other changes is that some people have been having difficulty with the simple_html_dom.php file and I apologize for that. I was unable to get a hold of the person who made it, so I had to restructure my plugin for independence. Thank you to Booking for helping me with validating that the snippet worked.

Left to do : Add CSS to the admin / Almost done

Newly added : You can include the description of any National Film Board of Canada film that you link to via the oembed. If YouTube and Vimeo throw descriptions into their oembed xml files, then all will go well with their videos too. The element is video_description if they’re curious of if you know someone there and want to harass them to put it.

Newly updated : The layout is a little different on the front end now. There’s the title (an h3), followed by the embed code (which is set to the width/height of your choice), followed by the caption (Author/Provider) and then in a blockquote, there is a description. They all have their own individual CSS though, which is why my first point is not complete yet. Last minute change.

New admin : The administration panel is completely revamped. It has the colours of the NFB website and now shows you the last three films that were added to the NFB website, if you change the admin language, it will show you the last three French films as well. The oe links are provided underneath those videos if you’d like to add it to a post.

Future changes that will come up in the next update :
1. A button in the post page that will let you preview the embed before you insert it in the post.
2. Each film will have its own individual width/height set aside from the default if you wish to make an exception.
3. Embeds will be capable of being saved in the database so you aren’t having to make calls all the time for the information. (optional; sorry I couldn’t fit it in this patch)
4. Visibility of all posts that contain oembeds so you can keep track of which films you’ve already added (optional)
5. Separate CSS layout for all embeds.
6. Ability to replace an oe link with the actual embed. (Once this is done however, it’s irreversible. This is for the more determined folk.)

There will be more to come, but those are some of the changes in the upcoming fixes. Look for the update on at http://wordpress.org/extend/plugins/nfb-video-plugin/ within the next 48 hours.

Isn’t this an annoying bug? Just when you think your troubles are over and you’ve got the file all figured out, it goes and denies you the video portion of your video.

This really isn’t Viper’s fault, but one parameter in particular seems to have a problem with a lot of MOV files.

So go into the plugin’s file and find the following bit of code:

Then comment it out :

Save and then refresh your blog page and see if it shows your video now.

If so, YAY.

If not, I’m sorry, it’s all I found.

Hope it helps!

Over the last week I’ve been reading Practices of an Agile Developer. It’s a book with Pragmatic Programmer that discusses what Agile is, bad habits that developers tend to have in regards to production, development and their view on customers/users, and the best practices in trying to set aside these old habits in order to become a more productive developer for yourself and your team.

One of the major things they emphasize on in this book is feedback. Have a constant flow of feedback and get everything achieved in iterations (small periods of development to get things done) and making sure that you don’t end the day with things left to do. And sometimes that means splitting a list of tasks in order to get some things done and others done later.

After having read it, I have already started to break down my tasks. Let’s say for instance…You have a newsletter and you need to get it sent out. In this case I have a newsletter that gets sent out once a month and there’s quite a flow problem in getting it out there. I get a document with the information, I put it in an html file, I have it reviewed 7 times for 2 typos, and then I proceed to put it online and get it revised yet again. As you can tell it causes quite a bit of overhead.

So what am I doing this week? Making it a bit more Agile.

Step 1 : Receive document, put information in html and send for revision.
Step 2 : Edit
Step 3 : Once everything is done and given the go ahead, I put it on the CMS for the online version
Step 4 : Let them know it’s out of my hands now.

It doesn’t sound like it’s reduced THAT much in the process. But the organized structure allows me to work on my other tasks while I wait instead of having to put it in the CMS waiting for more of the changes. Waiting is a huge problem with development.

Anyways, if you’re interested, you can get Practices of an Agile Developer:

Hope you enjoy it!

Well, it’s not the big grand update that you’ve been waiting for with the NFB’s Video Plug-in, but I’ve made a small addition to the current version available.

EDIT : Let’s also give you a link…duh…I’m such a tool sometimes lol
You can download it at this link on WordPress.org.

You can now embed YouTube videos in your blog posts the same way you would with NFB films and Vimeo.
“oe” followed by the link.

oehttp://www.youtube.com/watch?v=lu_2Fxp_e0s&feature=PlayList&p=3F10961D41198147&index=0&playnext=1

and you’ll get something like this :

[Invalid Link] http://www.youtube.com/watch?v=lu_2Fxp_e0s&feature=PlayList&p=3F10961D41198147&index=0&playnext=1

Enjoy!

This is just a first draft database install code I’ve been working on. It’s basic. But on the off chance someone needed something basic like this, I put it here. I’ll be updating as it gets more complex.

Sorry if there are some thought issues throughout it, but it’s literally just something I tossed together for a skeleton.

Enjoy. [ps : I'll make this text later. It was just faster to make it a jpg.]

My .png won’t work as a background

As soon as IE6 started becoming moot and we dumped it’s butt on the sidewalk, we had people complaining that IE7 was the new IE6. Why? Because pngs still didn’t work like they should as a background.

This’ll be a simple post about that.

IE7 is your picky mother-in-law. It won’t be happy till you give it every little detail and omit nothing.

SO.

Here’s what you do.

.classname {background:url(image.png) no-repeat top left transparent;}

See the transparent? People seem to assume because transparent is not a valid ‘color:’ value, that it won’t work on a background, but that’s not true. Transparent validates as CSS 2.1 in a background. And for pngs to work properly in a background in IE7, you need to provide a background-color.

Like I said…it’s really…really…picky.

The container holding my floating elements won’t expand

For containers with floating elements inside, I generally put a spacer or an :after with an invisible content of some sort to make it know where the end is. This works in IE8 and Safari and Firefox, however IE7 wants nothing to do with it for some unbeknownst reason to me. SO. What did I do?

.classname {min-height:18px;}

Setting the min-height made it work immediately. I set it to 18px only because the standard line-height used in all the text is 18px.

Hope these two small things helped out.

Working on the next change to the NFB Video Plugin. I’m writing it here, because to be honest we don’t have our official page up yet. Once the page is done, you’ll find more information on the NFB.ca website. Until then! This is what’s coming up…

An issue that came up a few times is how many times the links are being read by the plug-in. Correct, it is a lot of times. So, we’re going to cut down on that if the user so chooses. So the question is…do you want to keep track of your embeds?

1 – I don’t want to keep track of them.
[WARNING : Choosing this option means the plug-in will verify the link every time.]
2 – I’d like to keep them, but leave my oe links tidy when editing my posts.
3 – I’d like to automatically replace my oe links by the embed code
[WARNING : If you don't know HTML or you don't care to go back and have to fix individual posts, you should set your caption options first.]

The second addition I’d like to add in this version hopefully is a separate tab where you can see a list of the last 10/20/30/50/100 links that you embedded on your blog, what post it belongs to and the date. For multiple links on your site, it will indent and show them in Maroon. Why do I want to do this? It’s so you can see if you have duplicate content on your site. Which you don’t want if you like SEO.

Anyways, update more later on the progress.

Amendment : Please read this post for additional details.

Recently someone used the above to get to my site and I realize I haven’t written a post yet to explain what you can do about calling the Colorbox. After much trial and error on a project at work I ended up with a few options.

For those that don’t know how Colorbox is called…

Firstly you have an element with a class or id, i’d probably use an id unless you have a class that is pretty unique for the page (like the name of a button) for this case, let’s name the id as showGoogle

$(“#showGoogle”).colorbox({href:”http://www.google.ca/”});

The above will open a colorbox with Google’s homepage on it. Now the issue that came up afterwards is how do you do things inside the colorbox or access things in the colorbox once it’s up. Well, first, let’s show you two other things you can do.

Before you open your colorbox (I use this at work because we need to hide our videos before the colorbox opens):
$.bind(‘cbox_open’, function(){alert(“Whatever you want!”);});

After your colorbox is closed (I used it to bring back the videos):
$.bind(‘cbox_closed’, function(){alert(“Whatever you want when it’s closed!”);});

And finally there’s this other bit that works once it’s loaded:
$(“#showGoogle”).colorbox({href:”http://www.google.ca”}, function(){alert(“Show this bit here!”)});

The last issue I ran into was how do I get Javascript to go off on things inside the colorbox? I called it inside the code that shows up. Calling the function on the side with $(“#whatever”).click(function(){}); didn’t work, so I put the things I wanted in the click into a function, then called that function in the onClick.

So far I haven’t found an easier way about it, but I’m sure I’ll find it soon and I’ll update this post in the future to make sure it’s up to date.

Also someone searched for a colorbox bug in chrome, what was the bug? Maybe I can post the solution here or another colorbox post.

Ugh! Okay, I never know where to start these kind of posts without being condescending, but I’m opting for tolerance and understanding today, so I’m just going to help people steer away from IE6 instead of just flaming them.

What is a browser (Yes, some people don’t know, it’s not their fault):

A browser is the thing you’re using to view this page and any other page on the internet.

“For those who just don’t know what a browser is”

You are probably using a Windows Machine and you probably have a big “e” on your Desktop. For users on Vista and Windows 7, I’m pretty sure you guys are already set on the IE browser front. For those with Windows XP, what you have is probably IE6. You can check by Help -> About Internet Explorer when your browser is open. It will give you a line that says Version: something or other. If it says 6, you need to update. You can download an update by clicking here for IE8 and hit Download Now.

Warning : If you have had someone fix your computer since you bought it, make sure you have a Windows License on it before you try to download. It WILL put Genuine Advantage on your computer and refuse you for being a thief.

BUT there is the alternative. Which is getting FREE BROWSERS. This means you can get a new browser for free, without a Windows License and don’t have to worry about not being able to surf the internet. If you look further down the blog you’ll find the links to all the browsers I could think of on hand.

“For archaic IT departments”

I’m sorry, I really don’t know a completely kid-gloved version of what I have to say about this, but I’ll try. I get that you’re in the IT department and that you have access to everything you could possibly want on your computer, but people in your company probably don’t. Cause you’ve probably denied them that access. Which means the IE6 on their computers is YOUR FAULT. There is NO excuse for it. “Oh no, but we have 1000′s of computers to update, rah rah.” If you have 1000′s of computers on your network, you no doubt have a way to update all computers for security patches and whatnot, don’t give me any of this crap that you can’t install IE6 the same way too. If nothing else, at least put them on IE7. This is completely absurd that you sit and whine and complain about the anti-ie6 sentiment (cause you know you’ll have to actually do your job). Get over it. If you aren’t up to date, you can also scroll down to the end of this post to give you the list of browsers to move to.

“For thieves”

I’m not gonna bother being nice about this one. I’m seeing a lot of people who are all “I can’t afford Windows, rah rah”. Shut up. You’re a thief. If you’re a thief and you can’t even manage to find ways around YOUR OWN SELF-CREATED DILEMNA, you don’t deserve to have people spending 15$-40$ per hour of THEIR money to make their sites support your dumb arrogant decision. You can rant and rave all you like in the comments, I really won’t give a crap about you or your opinion at this point. Update your browser.

Firefox 3.5 (FREE)

Safari 4.0 (FREE)
Google Chrome (FREE)
Internet Explorer 7 (FREE if you have windows license)
Internet Explorer 8 (FREE if you have windows license)
Opera 9.64(FREE)