local label
local imageHolder
local imageHolder2
local plusLabel

local function index(window, q, callback)
    frame = window:newFrame(0,0,0,-200,0,.2,1,.8)
    frame.visibility = 0
    label = window:newTextLabel("     " ..q.title.. "     ",0,0,0,0,0,0,1,.2)
    label.align = ALIGN_CENTER
    label.textColor = color.white
    label.color = color.new("#363ac8")
    label.borderColor = color.new("#363ac8")

    if not q.imageA or q.imageA == "" then
        error("Missing 'imageA' field for question!")
    end

    if not q.imageB or q.imageB == "" then
        error("Missing 'imageB' field for question!")
    end

    -- Left image: takes up 0.0 to 0.42 of width
    imageHolder = frame:newImageLabel(q.imageA)
    imageHolder:setAspectSize(imageHolder.imageWidth, imageHolder.imageHeight)
    imageHolder:setDualDim(0, 0, 0, 0, 0, 0, .4, 1)

    -- Plus sign: centered between images at 0.42 to 0.58
    plusLabel = frame:newImageLabel("assets/images/plus.png", 0, 0, 0, 0, .4125, .4, .175)
    plusLabel.square = "w"
    plusLabel.align = ALIGN_CENTER
    plusLabel.textColor = color.white
    -- plusLabel.visibility=0

    -- Right image: takes up 0.58 to 1.0 of width
    imageHolder2 = frame:newImageLabel(q.imageB)
    imageHolder2:setAspectSize(imageHolder2.imageWidth, imageHolder2.imageHeight)
    imageHolder2:setDualDim(0, 0, 0, 0, .6, 0, .4, 1)

    local correct = window:newTextButton("Correct",0,-200,0,100,0,1,.5)
    correct.color = color.new("#52b11b")
    local wrong = window:newTextButton("Wrong",0,-200,0,100,.5,1,.5)
    wrong.color = color.new("#bd2626")
    local skip = window:newTextButton("Skip",0,-100,0,100,.25,1,.5)
    skip.color = color.new("#5d5d5d")

    window.apply({
        centerY = {true},
    }, imageHolder, plusLabel, imageHolder2)

    window.apply({
        fitFont={},
        align=window.ALIGN_CENTER,
        OnReleased=function(self)
            if self.text == "Skip" then
                callback()
                return
            end
            callback(self.text == "Correct")
        end,
    }, correct, wrong, skip)
end

local function update(dt)
    label:fitFont()
end

return {
    index = index,
    update = update
}