Fix:Situ8

%YAML 1.2
---
_CONFIG_:
    include:
        - http://www.situ8.org/*
    test_urls:
        - http://www.situ8.org/register
    name: Situ8
    description: Accessibility/ usability fixes and WAI-ARIA landmark roles.
    locale: en-GB
    authors:
        - "[[User:NickFreear]]"
    created: 2013-07-24T19:53:00
    ignore_defaults: true
    DOCS: http://freear.org.uk/accessify-spec
    license_url: http://nfreear.mit-license.org
    #http://accessifywiki.org/License


# Landmarks and other basics.
.navbar:
    role: navigation
    aria-label: Main menu

.breadcrumb:
    role: navigation
    aria-label: Breadcrumb trail

"#footer":
    role: contentinfo

a[target = '_blank']:
    title: Opens in a new window


a.btn, a.downloadLink:
    role: button


# Sign in form.
"#openid_username, #openid_identifier":
    aria-labelledby: "#openid_input_area p"


# Register form.
form[action = '/register'] input:not(.btn):
    required: ""

"#username, #email, #firstname, #lastname, #password, #confirm_password, #captcha":
    required: ""

input#username:
    pattern: "[^\\s]{4,}"

input#email:
    type: email

input#password:
    pattern: "[^\\s]{8,}"

input#confirm_password:
    oninput: "setCustomValidity(value!=password.value ? 'Error, the passwords should match' : '')"
    _note: TODO/SPEC - Hmm, this is Javascript - not allowed :(.

input#captcha:
    aria-label: Enter the CAPTCHA code exactly as it appears


# Other forms.
"#newMediaObjectForm":
    aria-label: Create a new Media Object (MO)

"#create-section-btns":
    aria-label: Select the type of Media Object (MO)

"#inputTitle, #labelText, #inputDate":
    required: ""

"#inputDate":
    aria-label: Date and time
    readonly: <REMOVE>
    _note: TODO/SPEC - Need option to call DOM `element.removeAttribute()`.

.btn-datePicker:
    title: Date-time picker widget
    _note: Hey, seems to be keyboard navigable at least! (Bootstrap date-time picker Javascript)

"#inputSubject":
    role: listbox
    aria-labelledby: label[for = 'inputSubject']

"#inputSubject .select-row":
    role: option
    tabindex: 0
    _note: Needs testing/ more work!


"#google_map_canvas":
    aria-label: Google map

"#downloadForm":
    aria-label: View and download your Media Objects.

"#downloadForm [type = 'checkbox']":
    title: Tick to download


#End.