Patrik Kiss

Posted on Dec 19, 2019

What's one of the ugliest piece of code you've written so far?

#discuss #programming #watercooler #uglycode

We have all written ugly code so far, that's a fact. Some are just bad, some are worse. And some other ones are just disgusting. Naturally, I'm no exception either.

For me, it's probably this one(prepare yourself):

function S1E23(){
    document.getElementById("Season3div").style.display="none";
    document.getElementById("Season4div").style.display="none";
    document.getElementById("director").style.display="block";
    document.getElementById("directorname").innerHTML="<a target=blank href=https://www.imdb.com/name/nm0236173/?ref_=tt_ov_dr>Dermott Downs</a>";
    document.getElementById("episode23buttons").style.display="block";
    document.getElementById("episode2buttons").style.display="none";
    document.getElementById("episode3buttons").style.display="none";
    document.getElementById("episode4buttons").style.display="none";
    document.getElementById("episode5buttons").style.display="none";
    document.getElementById("episode6buttons").style.display="none";
    document.getElementById("episode7buttons").style.display="none";
    document.getElementById("episode8buttons").style.display="none";
    document.getElementById("episode9buttons").style.display="none";
    document.getElementById("episode10buttons").style.display="none";
    document.getElementById("episode11buttons").style.display="none";
    document.getElementById("episode12buttons").style.display="none";
    document.getElementById("episode13buttons").style.display="none";
    document.getElementById("episode14buttons").style.display="none";
    document.getElementById("episode15buttons").style.display="none";
    document.getElementById("episode16buttons").style.display="none";
    document.getElementById("episode17buttons").style.display="none";
    document.getElementById("episode18buttons").style.display="none";
    document.getElementById("episode19buttons").style.display="none";
    document.getElementById("episode20buttons").style.display="none";
    document.getElementById("episode21buttons").style.display="none";
    document.getElementById("episode22buttons").style.display="none";
    document.getElementById("episode1buttons").style.display="none";
    document.getElementById("Season2div").style.display="none";
    document.getElementById("Season1div").style.display="block";
    document.getElementById("review").style.display="block";
    document.getElementById("reviewlink").style.display="block";
    document.getElementById("reviewlink").innerHTML="<a target=blank href=http://www.ign.com/articles/2015/05/20/the-flash-fast-enough-review>Read here</a>";

    document.getElementById("trailer").style.display="block"
    document.getElementById("promo").style.display="block"
    document.getElementById("promo").innerHTML="<a target=blank href=https://www.youtube.com/watch?v=Qx90DwHjIvk>Watch here</a>";

    document.getElementById("episodeinformation").style.display="block";
    document.getElementById("episoderate").style.display="block";
    document.getElementById("episodedate").style.display="block";
    document.getElementById("episodelength").style.display="block";
    document.getElementById("date").innerHTML="19 May 2015";
    document.getElementById("star").style.display="block";
    document.getElementById("length").innerHTML="44 min";
    document.getElementById("ratenumber").innerHTML="9.6";
    document.getElementById("episodeimage").src="s1e23.png";
    document.getElementById("episodetitle").innerHTML = "<div id=episodetitle>Season 1 Episode 23:Fast Enough</div>";
    document.getElementById("episodedescription").innerHTML="<p> Once the preparations were set for Barry to travel back in time,"+
" he traveled back to the night Nora died. However, despite this,"+
" Barry's alternative future self saw Barry and signaled him to not to interfere and proceeded"+
" to transport his younger self 20 blocks away.<br><br> Barry, in tears, obeyed. He spoke to Nora once last time,"+
" revealing his identity to her, and assured her that he and Henry are okay in the future."+
" In the present, Eobard gets into the time machine Cisco made,"+
" remarking that Rip Hunter first designed it.<br><br> Cisco warns him never to return."+
" Suddenly, a helmet with wings on top comes out of the wormhole, which Eobard takes as his signal to leave. "+
"However, Barry returns, destroying the time machine with a supersonic punch.</p>";

}

I'd written this back when I just started programming, I was a total beginner, and I made a static website about The Flash. Back then I'd thought it was really good, but now I obviously know it's not. It is seriously terrible, like for real.

And if it's not enough, I had repeated the function above around 70 times, only changing 1 line, where I set the display of the current episode to block. Thus the JS file consisted of thousands of lines of ugly code.

It's your turn now, share the worst piece of code you have written so far :D

Top comments (21)

tomassiriouala • Dec 19 '19

I once wrote a boolToInt

int boolToInt(boolean bool){
     if(bool){
          return 1;
     else{
          return 0;
     }
}

Not proud. It was my first year

Patrik Kiss • Dec 20 '19

That is ugly indeed. What were you even doing there?

Here, I corrected your code

int boolToInt(boolean bool){
     if(bool===true && bool!==false){
          return 1;
     else{
          return 0;
     }
}

MurrayVarey • Dec 19 '19

Ah, I see the problem -- you should have used a ternary operator!

Ben Sinclair • Dec 20 '19

It should use an IntegerFactory.

MurrayVarey • Dec 20 '19

Slaps forehead. Of course! Better make it Abstract, just to be sure.

Samba Diallo • Dec 19 '19

10/10, I'd include it in every file of a project for the enjoyment of those reading my code.

Casey Brooks • Dec 19 '19 • Edited

I once wrote something in JavaScript

Patrik Kiss • Dec 19 '19

Oh man, I can't imagine what you must've been through

Ben Sinclair • Dec 20 '19

shh!

frantically makes shushing motions *

Ben Lovy • Dec 19 '19

I think this snippet of ReasonML is pretty horrible, from my very first larger functional programming project:

let add_extended_room = (school, classroom) => {
  let target = ref(school.classrooms);

  if (Array.length(target^) == 0) {
    target := Array.append(target^, Array.make(1, classroom));
  } else {
    let already_included =
      Array.map((oldr: classroom) => oldr.letter, school.classrooms);
    let found = ref(false);
    let idx = ref(0) /* This will only be read later if found is toggled to true*/;
    Array.iteri(
      (i, l) =>
        if (classroom.letter == l) {
          found := true;
          idx := i;
        },
      already_included,
    );
    if (found^) {
      /* We've already seen this letter - mash the new kid list into the matching existing kid list */
      let old_classroom = school.classrooms[idx^];
      let new_classroom = {
        ...old_classroom,
        capacity:
          get_extended_capacity(classroom.letter, school.extended_day_config)
          |> int_of_string,
        kids: ref(Array.append(old_classroom.kids^, classroom.kids^)),
      };
      target^[idx^] = new_classroom;
    } else {
      /* This is a new extended day room - add it as-is, grabbing the extended day capacity */
      target :=
        Array.append(
          target^,
          Array.make(
            1,
            {
              ...classroom,
              capacity:
                get_extended_capacity(
                  classroom.letter,
                  school.extended_day_config,
                )
                |> int_of_string,
            },
          ),
        );
    };
  };

  {...school, classrooms: target^};
};

let get_extended_rooms = school => {
  /* Returns a `school` of the extended kids */
  let s = get_extended_kids(school);
  Array.fold_left(
    add_extended_room,
    {...school, classrooms: [||]},
    s.classrooms,
  );
};

It takes a list of classrooms, each containing a letter and a list of kids, and returns a subset of them, using rules from separate list of classrooms and parameters for transforming the data. It's a bit of a complicated operation by nature, but it could have been broken down or broken out into sub-steps. Writing one massive convoluted fold is not the way to go.

This technically works, but I'm seriously glad I never had to make any sort of change to it, and I can only tell you what it does now because I remember the problem, not because looking at this code means anything to me.

Petar Petrov • Dec 20 '19 • Edited

Ha! I totally have it thanks to instant messaging keeping logs of images I share,
behold!

Basically its the logic that handles how you go through a grid (keyboard keys) and handles the cases where you go left right top bottom and there is no key...

thepracticaldev.s3.amazonaws.com/i...

mlaj • Dec 20 '19 • Edited

I had to work in this code, but didn't create it.

Page rendering made of only PHP echo statements in a Zend framework controller (not view!). There was html, CSS, js, jquery and PHP conditions in this spaghetti mess. The code was around 800 lines long and was a very important part of the website. That site also had 3 very different versions of jquery running on different pages.

That was one of the first things I worked on during my internship after graduating. I almost cried the first time I saw it.

Tech2Blog.com • Dec 21 '19

I think we could have given more checks to this simple bash script which was used to backup the website automatically using Cron job.

Chris Shaffer • Dec 19 '19

I’m just impressed that you didn’t use jQuery.

Patrik Kiss • Dec 19 '19 • Edited

Well, I wrote this code when we had only been learning web development for like 1 month.

Jquery or any kind of framework wasn't even mentioned for the next 2 months(yeah it was a slow course, and we had learned Java more back then). We only learned basics like HTML, CSS, JS(the very very basics)

And I started using that little knowledge I had to make a website

Even with so little knowledge about JS, I was far ahead of anyone in the course