found_drama

Courage!



    Tag Archive for 'code'

    #webdev gang sign

    WebDev Gang Sign

    High nerdery; join us.


    #2.3: in transit

    F_D in transit to WordPress 2.3

    Plugging in the new native tagging API was a snap (10 minutes max). There’s a built-in migrator for existing Ultimate Tag Warrior tags (bonus) so getting this rolled out to the live environment should will go nice and smooth.

    The bummer part is with the “conflict” reported on the Extended Live Archives plug-in that we’re using for the archives here. What’s weird (at least to me) is that the reported issue talks about “problems when editing or creating new posts due to the database changes” whereas I couldn’t even get the plug-in to work at all in my sandbox environment (wouldn’t load Taxonomy or Folksonomy clusters). So now we must decide whether to strip it out, wait for the fix (or try to fix it my own self), or re-invent my archives all together. I’m leaning toward the latter because of some other UI tweaks that I’m considering (may as well do it all at once, eh?)


    #notes, updates, errata

    misfortune

    • jQuery makes JavaScript webdev so easy it’s almost stupid; 5 minutes of experimenting with the jCarousel extension followed by 10 minutes of wiring it up and then 10 minutes of CSS followed by 5 minutes of jamming it all through SVN1 and a home-rolled Twitter marquee is born.
    • Been on a good consistent writing run the past week or so.  30 minutes here, 90 there…  Same ol’ project but a re-write has been in the cards for a while.  So the time spent outlining and brainstorming is definitely time well spent.  It’s funny though, where I keep getting “stuck”…
    • Garden is winding down.  Packed 4 qts. of tomatoes tonight, so that’s good.  It’s doubtful that we’ll actually get a fall crop of peas; the beets and carrots I’m still hopeful for (but just barely).
    • Plowing through Stross’ Accelerando; I recall trying to read the CC-licensed PDF last year and didn’t get too far but holding the book in my hands and flipping pages?  Man, it’s good stuff!  Also: Bruce Sterling has a new collection coming out2.

    currently playing: Junior Boys “Like A Child”

    1. What can I say?  It’s been since May…[]
    2. Anyone know where we can pre-order a signed copy?  A. keeps asking me to give her ideas for birthday present(s) and I’m pretty deficient in that department.[]

    #IE hackery (follow-up #1)

    While A. committed herself to more work this evening, so did I…

    I decided to follow up on this morning’s post and put forth a good faith effort at solving as many of the IE-specific issues in my CSS as I could re: Ortho…

    The good news? It’s legible and more/less looking good (at least w/r/t/ the main content regions) in Internet Explorer 61, which is to say that the parts you (my dear reader) actually read look almost exactly like I’ve intended them2. In a way, I feel like asking myself Well what did you accomplish? But that much should be easy. Ortho went from looking like a gothic kid’s worst regurgitation3 to looking like the (I hope) classy bit that I intended it to be. But there’s still a ways to go:

    • ul.menu is missing border-bottom in IE6 (despite “standards compliance mode”)
    • the last img in the Flickr badge sometimes drops down a full 75+ pixels despite (what appears to be) adequate clearance (width and height-wise) and proper overflow rules (and “standards compliance mode”)
    • the paragraphs seem squashed together in IE (not sure yet if this is an issue with line-height or margin-bottom…)
    • and of course there are the many issues with the #footer that don’t even need describing…

    At any rate…  We’re a far-cry from where we were this morning.

    1. At the moment, our Windows PC resources are quite limited. I’m reticent to put IE7 on the final remaining machine because I hear it (IE7) plays nice with min-width and max-height (etc.) and generally follows the rules. Well, most of the rules. And since I still have about 20% of my readership on IE (shame on y’all) and 87% of that on IE6… Alas, I need to do a little bending here.[]
    2. It turned out to be the min-width and max-width bits of CSS. They really confuse the living shit out of the IE.[]
    3. Black on black on black and wide as hell…[]

    #IE hackery

    After last weekend’s (perceived?) success getting Ortho up and running here, I was feeling pretty good.  Got it loaded into Subversion and was off and running.

    Until I got my first look at it in IE6 today.  Yuck.  Even after switching to a strict doctype it is almost totally and completely illegible.  Working on that.  Fortunately, most of our readership is on Firefox (or an otherwise standards-compliant browser).  It seems there are ways around this.  It’s apparently all about not using width and padding.  Or some such thing.

    We’ll see how that goes…


    #introducing Ortho

    We deployed our “Pemulis” version of K2 here on found_drama back in October; it has served us well but truth be told it carries a bit more bloat that we need. There’s the main style.css which carries hooks for plug-ins I don’t use (among other things) and then there’s Prototype and then there are all of those ancillary images. It was just a bit much.

    Plus there was a snow storm this weekend and it was an excuse to brush up on my webdev skills instead of shovelling.

    Benefits? A slimmed down, minimalist design with few graphics and few external files (CSS, JavaScript, etc.) makes for fast load times. Should be more accessible now, too — w/r/t/ plussed-up browser font sizes, screen readers and so on… Wrapped up most of the testing tonight, too. So far, everything holds together. Some minor differences (mostly behavioral) between Camino/Firefox and Safari. Haven’t checked it in any version of IE yet (chime in if you see something). That said, I’m sure there will be tweaks throughout the coming weeks. Especially when it comes to any of the items on my existing “to-do/follow-up” list. (i.e., fixing the Flickr badge’s behavior in Safari, IE layout “adjustments”, etc.)

    But so far, so good…

    currently listening: Pete’s “Yesterday, Today, Tomorrow


    #jQuery is teh hotness

    Number 6 on my goal sheet for ‘07 was to put myself into a position where I felt comfortable describing myself as possessing CSS mastery. I acknowledge that this is the most difficult to quantify. And even then, it isn’t really about CSS (which is easy enough on it’s own, I suppose) but how CSS fits in with DOM and JavaScript &c.

    At any rate, as I pursue this particular area of expertise, making up little projects for myself as I go, I seem only to reinforce the “CSS as adjective” aspect. CSS for special effects is useless without some JavaScript mechanism to bring it in and play with it, eh? (Tell me something I don’t know?) But again, the “CSS mastery” project is just an excuse to get my way around all of the other ancillary garbage; to put all those pieces together.1

    Now: how does jQuery fit into all this?

    Well, in two ways.

    My first “CSS project” of the year was to take my Flickr badge (above, just below the header) and convert it from the stock “horizontal table” version into the free-form CSS version.

    Easy enough.

    But I have some other ideas for it. Nothing CRAZY, nothing that’s going to violate my terms-of-service or anything like that — but just a thing or two that might liven it up a bit. Again: nothing crazy but nothing that can be accomplished strictly with CSS.

    Now, I’d heard about jQuery through work. Sounded like an elegant, effective, and lightweight way to address a lot the JavaScript “problems” that I typically see. And in the other corner? The Prototype library — which I’d come across through my WordPress adventures (and seen referenced in a few other places).

    Before we go any further: I sense that “jQuery vs. Prototype” is quickly becoming the “Mac vs. Windows” or the “Linux vs. everything else” of the JavaScript world. I do not wish to ignite that here. However2:

    This evening I sat down (on a lark) with the most recent copies of both the jQuery and Prototype libraries. I had a particular effect in mind; a little bit of trickery that I wanted to effect in the above-mentioned Flickr badge. I started with Prototype because (full disclosure) it’s already deployed here because K2 uses it. Now… I had an idea of how to do this particular manipulation with straight-up DOM code. But that wasn’t the point. The point was to do a little compare/contrast. And after an hour of trying to comb through the Prototype API docs (because the tutorials and “tips” that I found were … well, lacking), I gave up.

    Ten minutes later, I had the effect working perfectly through jQuery. Perfectly. And 7 of the 10 minutes were spent tweaking the CSS and not the jQuery calls (which did exactly what I expected them to do).

    And considering the size differences (20kb vs. 72kb), I believe the winner here may be clear. (For me at least.)

    Unfortunately, this means that now I need to considering going back to the drawing board with the F_D site again…

    1. I feel like this is the part where I need to insert the disclaimer about how so much of my recent work at work is less technical and it’s (not) funny how quick some of the knowledge tries to slip away from you when you’re not using it every day.[]
    2. …and perhaps that’s a loaded transition…[]

    #Saturday evening brain dump

    The Hibernation Session (CD label)A. and I went out last night and did it up proper. Dinner out with some friends and then bounced over to the Half. Craig Mitchell was indeed playing there last night (and a right energetic set, at that) and thus did we get down. Dropped him a couple mixes, too. Hope he enjoys them. And then on our walk home:

    Pseudo-skating #454

    Pretend ice-skating on some frozen over patch in Battery Park. Too much fun.

    Took it easy today. Taped up the hallway in prep for possibly painting tomorrow. A. had her first day off in … well, since New Years and she treated herself to a massage. I wrapped up the Rails tutorial that I started earlier in the week and determined that I have a ways to go. I think I have a project or two in mind for where to go from here to build out that skillset. But the tutorial wasn’t really written in a way that I’m taking much away from. Models? Controllers? Views? At any rate, it was good to get some exposure and dip my fingers in some code again.

    Now, what to do with the rest of the weekend?


    #wrestling with rails

    For various reasons, I decided to give TextMate another try (as I may be hitting Smultron’s upper limits). One of the reasons was to because I felt like trying my hand at a few Rails tutorials and TextMate is supposed to be the de facto standard editing environment for that kind of development1 — and thus begins our chicken-and-egg question.

    Anyway: day one of our TextMate evaluation period and I figure: No time to lose, better get crackin’ on a tutorial or two… In particular, I have my eye on this tutorial from over on the Apple developer site; it seemed to apply most directly to my specific aims in learning the language and appeared to take the most direct approach. A quick install of MySQL and Locomotive later and I’m ready to go…

    But we don’t get very far, do we?

    The instructions in the tutorial conflict with each other and make some assumptions about what you have (or have not done) with respect to setting up your $ENV and $PATH (etc.) On the one hand, they mention Locomotive by name as a “golden-path” method to get up and running and on the other, they’re linking out to the Hivelogic build tutorial. At any rate, there is a disconnect — and I’m fairly convinced it has to do with what is or isn’t in the $PATH; specifically, Rails doesn’t seem to know where to find “rubygems” and I’m pretty confident that it has to do with Locomotive and its “Bundles”. For example:

    1. The article says to set up the project on the command line using rails expenses — but it doesn’t like that. Apparently, “rails” cannot be found. But that’s no problem. Locomotive takes care of this set up on your behalf anyway.
    2. Next it says to throw script/server into the command line. I’ll admit that I skipped this one. Again: Locomotive is more than happy to do this on your behalf.
    3. Where we get into trouble is with the migration generator:

    $ script/generate migration accounts
    ./script/../config/boot.rb:18:in `require': No such file to load -- rubygems (LoadError)
    from ./script/../config/boot.rb:18
    from script/generate:2:in `require'
    from script/generate:2

    …? Not seeing a way to do this through Locomotive, I try to work my way backwards through the code. The error message certainly gives me the right breadcrumbs. Perhaps I’m still too novice with Ruby itself to fully determine what it means. I’ve got enough experience with other languages to make a guess: just like it says, it can’t fine “rubygems” but only because that file isn’t where the script expects it to be. A quick Spotlight search for “rubygems” uncovers 21 files and 8 directories (all buried deep within that “Bundles” directory that Locomotive has installed for itself.

    So why the mismatch?

    At this stage, I’m not certain. Which is a drag because I was expecting a much cleaner install, a much cleaner first impression. How am I supposed to “get” the beauty of this full stack framework when the only thing it wants to do for me is choke and throw errors? Alas, we’ll call it an unsuccessful night and hang up our spurs. For now.

    1. Though their marketing literature would sure have you believe that it’s the de facto standard editor for any geek textnology on OS X.[]

    #Firebug

    Firebug screen grabIf you haven’t checked out Firebug for Firefox yet… DO IT NOW.

    That is to say: if you do any kind of webdev in Firefox, you should have this bad boy in your arsenal. Though I’m usually more of a Camino man myself, this little extension has put me into a Firefox renaissance these past couple of days. Browse through your code, mouse-over the elements to see what styles they use (and what styles are getting overridden etc.). It is certainly the cat’s pajamas, as they say…

    In combination with the developer toolbar, you’ll have everything you need to geek your way through all the sites with which you work.