DEV Community

Patrik Kiss
Patrik Kiss

Posted on

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

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

Discussion (23)

Collapse
tomassiriouala profile image
tomassiriouala

I once wrote a boolToInt

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

Not proud. It was my first year

Collapse
weeb profile image
Patrik Kiss Author

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;
     }
}
Collapse
murrayvarey profile image
MurrayVarey

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

Collapse
moopet profile image
Ben Sinclair

It should use an IntegerFactory.

Thread Thread
murrayvarey profile image
MurrayVarey

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

Collapse
sambajahlo profile image
Samba Diallo

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

Collapse
cjbrooks12 profile image
Casey Brooks • Edited on

I once wrote something in JavaScript

Collapse
weeb profile image
Patrik Kiss Author

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

Collapse
moopet profile image
Ben Sinclair

shh!

  • frantically makes shushing motions *
Collapse
deciduously profile image
Ben Lovy

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.

Collapse
mihaylov profile image
Petar Petrov • Edited on

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...

Collapse
keptoman profile image
mlaj • Edited on

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.

Collapse
tech2blog profile image
Tech2Blog.com

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

Collapse
methodbox profile image
Chris Shaffer

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

Collapse
weeb profile image
Patrik Kiss Author • Edited on

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

Collapse
methodbox profile image
Chris Shaffer

It’s functional code, even if now you know it’s not practical or efficient.

Logically, it works, it’s just not very DRY.

Collapse
ajaymahar profile image
Ajay Kumar Mahar

print ("Hello World")

Collapse
zarium profile image
Zar Shardan

I just write legacy code from scratch...

Collapse
katnel20 profile image
Katie Nelson

I wish I could say the same for all of my code, but it would never be true 😏

Collapse
ajaymarathe profile image
Ajay Marathe

Woah, thats cool man....

Collapse
raucoustortoise profile image
Michael Mather

I had commited some horrific crimes in VBA before actually learning how to code