Adventures in Crappy Markup

There are two big elementary and middle school competitions around this part of the globe. Well, “big” according to “I’ve heard of it”, which is by no means an accurate measure of, well, anything. I don’t go out of my way to look for them any more, even though… hold on, am I still eligible? Whatever. But in any case, diverting any unnecessary energy from the olympiad-proof-training is probably not a good idea now. Blah blah blah boilerplate introduction.

Okay, so from an old draft of the very site I’m working on: there’s the Invitational World Youth Mathematics Intercity Competition (IWYMIC) and the Elementary Mathematics International Contest (EMIC), they were partly merged, and somebody decided to call the result the International Mathematics Competition (IMC), which is a terrible idea because it’s word-for-word the same name they call the university-level competition and holy Zarquon they’re holding it at the same time this year!

Then later it seems they’re prefixing it with a TA (which apparently stands for Taiwan because we need to disambiguate from Thailand). That does not make it all better particularly as the new logo reverts to three letters. I don’t have any idea which version is going to win out in the end.

Well, Dr. Sun needs lots of helpers, so my *hyperbolic finger quote* volunteer job is on the informatics team, i.e. I have to edit the website. Seriously, enough background information; let me rant.

First thing is that we only have FTP access and the server’s scripting language is Visual Basic ASP with SSI and stuff (I’m not even feeling pedantic enough to research the “correct” way to refer to this miserable excuse for a system). So I have to learn a new (infamous, from what little discussion I’ve caught) language or treat the old code like black magic. So far it’s been the latter; I’m not that bored. How does this testing for equality and assignment with the same “=” work!?

Anyway, there are also a bunch of mysterious archives and stuff on the FTP server when access was handed to me, so downloading everything was confusing (did I mention I have only basic grasp of using FTP clients?) And I am sure as hell not going through the trouble to set up a local server to test things, because (1) I don’t have the faintest idea how (2) it will take too much time. This means I’m making the website in deploy-without-testing mode. Oh well.

When I first looked at the HTML code I almost threw up. Here, a small sampling. Showing is better than telling. (Names removed, natch.)

  <tr style="height: 17.4pt">
    <td nowrap style="padding-left:1.4pt; padding-right:1.4pt; padding-top:0cm; padding-bottom:0cm" bgcolor="#CCFFCC">
    <p style="margin: 0 10px"><font face="Arial" size="2">(country name)&nbsp;&nbsp;&nbsp;&nbsp;</font></td>
    <td nowrap style="padding-left:1.4pt; padding-right:1.4pt; padding-top:0cm; padding-bottom:0cm" bgcolor="#CCCCFF">
    <p style="margin: 0 10px"><font face="Arial" size="2">(person name)</font></td>
    <td nowrap style="padding-left:1.4pt; padding-right:1.4pt; padding-top:0cm; padding-bottom:0cm" bgcolor="#FFFFCC">
    <p style="margin: 0 10px"><font face="Arial" size="2"><a href="mailto:(email)">

Yes. Take a minute for everything wrong with this to sink in. Inline styles with three different units of length, a bunch of non-breaking spaces in the middle of nowhere (no, those aren’t problems with my escaping), and of course, the insane number of deprecated attributes and tags. <font> tags were deprecated in 1998 when HTML 4 came out. I don’t think I knew how to walk in 1998.

A little sleuthing noted the opening stylesheet tag “<style fprolloverstyle>” in the head, rapidly followed by a bunch of image-rollover JavaScript functions with names like “MM_swapImgRestore” (seriously? image rollovers? do these people have even a modicum of professionalism?). Revolting artifacts from FrontPage and Macromedia, respectively, living right next to each other on the same page. I cannot understand this. I need to repeat the previous sentence because of its supreme undeniable truth. I cannot understand this.

Push comes to shove, I did a quick Vim pattern substitution to strip out the deprecated tags. Actually, no, it wasn’t quick at all; I had to go through three language versions of roughly a dozen pages in three different folders. It wasn’t that insane with :args *.asp, but still only barely stomachable grudge work. After the tags were out of the way I had to go back and carefully put back <p>s and <br/>s so the pages looked right. Not fun at all.

And this, of course, was just the visible part, the page content. I can’t use custom slugs in the URL or anything ( is so cool), so I had to follow their mechanisms of choosing the subpage through a GET parameter, which gets passed down three or four includes before finally directing to the right include file through conditionals. Of course I can easily copy the ASP ifs and end-ifs around to add pages without knowing any of how the comparisons work.

Sounds good, right? The GET parameters are numbers. Like ?Page=5020 was the page about Taipei. Oh, and the file to be included was called Page_5020.asp. I cringed every time I saw it. The fastest way to figure out which file I wanted to open when I had some content was to mouseover the link on the actual website in a Firefox tab and note the URL.

Finally I thought, enough is enough, and renamed everything. Another amazing thirty-odd repetition substitution flurry made extra frustrating by the fact that one page had “2010” as its parameter and one page had “2010” in its title. Well what do you expect, the competition has been around for plenty more than two years. (And who came up with this deranged numbering scheme anyway which has one extraneous zero digit for each one that actually matters!?)

Finally, having refactored the directory system to something I could work in without shuddering every three seconds, I had a bunch of YouTube vids from previous competitions I was supposed to ‘post’. Guess what! YouTube’s embed code contains an undefined bare attribute! I just about fell out of my chair. This is the software giant, you know, not some obscure company living under a rock. And they want you to embed videos with INVALID CODE. Bring up all the omitted shudders! And more!

I give up. Okay, it’s all in the name of cross-browser compatibility (read: Internet Explorer (actually, that’s not even true; there’s something about Firefox’s HTML5 capabilities, which makes me very, very sad ): ):

Not to mention the variety of other serious redundancy errors which I repeatedly tried to ignore before finally, painfully realizing I would have to update them more than once… three tables with about a hundred rows between them with all the committee members were replicated verbatim (no language changes either; somebody was too lazy and so am I) in the three versions. Refactoring that out was awful.

Oh, and I still do not understand how to get Vim to play nice with character encodings, even though I think I understand encodings themselves pretty well.

And, just a couple of days ago, the super-duper punchline: that server is shutting down and we are more or less starting over. Dad is saying I should use Java Servlet Pages. No experience with this servlet coding whatsoever, but at least the language is pretty darn comfortable for me. And I continue to not have any idea what’s happening.


2 thoughts on “Adventures in Crappy Markup

  1. Oh right, for some reason Microsoft doesn't think any of us will be –foolish– –efficient– uncommon enough to pass the result of an assignment as a Boolean value (in those with == as equality comparison, can you do something like if (x = something) {something}?), hence the "efficiency". Also darn del tags don't work.Server shutdown ouch; you should save everything to your computer. Maybe you can as well "learn" what mistakes you should avoid (which I guess you should have known anyway) and what are the "differences" (that I wanted to call "crazinesses") of VB from the other languages…

  2. Pingback: [CIMC 2015 Part 1] Rainy Days in July (and Other Months) | BetaWorldProblems

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s