I’m working on a geography quiz that will hopefully go live in fewer than 24 hours, but silly me, I thought I’d switch to tertremo to implement something relatively straightforward for a quick win. Hours later…

Granted, looking at the git commit, it was pretty straightforward actually. But I’m still in the awkward beginner phase where I spend a large chunk of time not having a clue what I’m doing.

The biggest thing I had trouble with was figuring out how to add onClick behaviour to an a tag without it actually hitting what was in the href.

Frankly, I have no idea what the code does, but I basically went through a bunch of github repos looking for people who had made calls to preventDefault and ultimately came up with this for a Util.elm file:

module Util exposing (..)

import Html exposing (Attribute)
import Html.Events exposing (onWithOptions)
import Json.Decode exposing (succeed)


onMouseDownPreventDefault : msg -> Attribute msg
onMouseDownPreventDefault msg =
    onWithOptions "mousedown" preventDefault (succeed msg)


preventDefault : Html.Events.Options
preventDefault =
    { stopPropagation = False
    , preventDefault = True
    }

Then, in the main file: import Util exposing (onMouseDownPreventDefault)

And then basically instead of onClick, I replace it with onMouseDownPreventDefault such as in the following: a [ href "#", onMouseDownPreventDefault (ShowOnMap strongestEarthquake) ] [ text strongestEarthquake.place ]

I tend to fail upwards in programming and this is yet another case of that. I will understand it someday. Just like how I’m slowly, very slowly, coming to grasp with Maybe.