Making Thumbdrives [almost] Obsolete

For the past few years I’ve had a file management script that I’ve been using. At first, it was just a convenience for sharing files with classmates, but lately I’ve been using it more and more. A lot of the computers at our hospital don’t do thumbdrives well, and while others have been attaching files to e-mails and using their webmail to access them, I just login to my file manager. With the webhost I use now, I have unlimited storage – and any computer with internet has access to it! It’s also really nice for transferring files that are too large for e-mail. The only downside is that really large files are difficult to upload with php, so I do still use the thumbdrive for some things.

I use filethingie on my site. It’s a single php flatfile (only 100k) that does everything without a database. The only issue with most hosts is php upload limits. Just add something like this to your php.ini file:

file_uploads = On
upload_max_filesize = 24M
post_max_size = 24M
memory_limit = 48M

Obviously the #1 concern with anything of this nature is security, so you might want to use .htaccess to restrict access to wherever your passwords reside.

That’s it!

File Thingie

For those of you that don’t have your own website and hosting, there are other ways to store files online. One of the more popular ways is by using a Gmail account for online storage. There are also many popular file storage sites like Xdrive.

Video and WordPress

You may have noticed some videos in my posts lately.  Video has become so ubiquitous on the web lately, I had to keep up.  One of the problems I had was that our camcorder has a great widescreen format, but a lot of the flash video services like YouTube don’t display widescreen formats very smoothly.

I tried a WordPress plugin called Viper’s Video Quicktags for a while, but I had a lot of problems.  While it displays things great in IE, WMV videos were broken in Firefox!  I looked at the problem on the developer’s website, and he/she had this attitude like: “Some video formats might not work well across platforms, but it’s really hard to make things compliant everywhere and I really don’t care so I’m not going to try.”  Great attitude!

Finally I found another WordPress plugin that does what I need: Coolplayer.  It works great and does everything I need.  Hopefully I’ll have some videos of Devin in the snow soon!

WP => UTF-8 [and table name change]

During some down-time I was doing some minor website maintainance lately.  One of my big changes was to upgrade WordPress to the 2.2 version, which has a lot of core changes in it.  After upgrading, I noticed some problems immediately.  Suddenly, there were all these funky characters interspersed throughout my blog posts like “•”.  At first I thought maybe wordpress was misinterpreting something, but a look at an .sql backup confirmed that these characters were hardcoded in the database.  Some extensive searching on the wordpress forums was fruitless.  There was a lot of talk about the changes to UTF-8 in WordPress 2.2, and some other people had been having similar problems, but I didn’t see any clear-cut solutions.

Continue reading “WP => UTF-8 [and table name change]”

3D thumbnails with CSS

Construction of the overlayFirst off, I am a medical student – not a web developer. Feel free to flame me all you want about standards. In fact, just skip the article and scroll straight down to the comment box right now you standards nazi. I’ll give you a topic: “IE rules, Mozilla drools”. OK, go…

Now that we got that out of the way, let’s get to the code. I came up with this idea after reading this article about png gradient overlays on aListApart. It got me thinking about all the wonderful applications of transparency.

So, I got to work. Not less than 2 hours later I had beautiful 3D effects on my image thumbnails in my photo gallery. Go ahead and check ’em out. I didn’t implement them on the front page, just on the album page. I also use a grayscale filter (that only works in IE). While the effect works great on color photos, I think that it really pops on black and white photos. (IE haters can scroll to that comment box now…)

On the left is an example of what I did. The top image is the thumbnail. The middle image is the transparent overlay image, and the bottom image is what they look like together. Here’s my HTML:


As you can see, both images are inside the anchor, which is inside the div element. The CSS required to style this involves a little positioning magic. We set the positioning on the div to “relative” (the default, but in this instance we need to declare it), and then set the positioning on the img elements to absolute. This will allow you to position the img elements “absolutely relative to” the div. Got it?

Next, we set the z-index on the overlay to some obscenely high number so that it renders in front of everything else. I used 100, but feel free to go for broke on this one. Is 1,000,000 too much? Who knows?

Feel free to have fun with it. I used the visibility attribute to hide the overlay on hover. This makes it flatten out when you hover it. Check it out in this example.

CSS codeHere is the CSS that I used in the example. Now, I’m sure there are a million uses for this. One of the ideas I’ll be implementing in my photo gallery is a little “next>>” overlay that goes over the images for navigation. (Not implemented in the current theme)

Please show me how you use it on your site by shooting me a link in comments.

I have zipped up my example files, along with the photoshop image I used to create the effect. You can download those suckers here: Example files (ZIP)

Finally, for those lazy kids out there in need of instant gratification, just unzip these files to your default-dark theme directory in zenphoto, and you can be cool like me…Default Dark Zenphoto Mod (ZIP)

[Lots of love to Zenphoto]


Hawaii and MySpace

I’m in Hawaii right now with the family.  I haven’t had much time to work on becuase I’ve been tweaking out on the MySpace page.  I finally got the MySpace page working right, so now I can chill and enjoy this wonderful vacation.  We’ve been taking lots of photos, and I posted one in the photo gallery – a gorgeous panorama shot of Waikiki beach.  I’ll post many more once we get home.