VP-217: Clean up the Video Player HTML template and controls

Description

We can probably tidy up the template for the Video Player, making changes such as

• slightly shorter class names
• remove jQuery UI class names
• remove hard-coded strings (in favor of a scheme that supports localization)
• double-check choice of element types for consistency (e.g. <button> vs <input> vs <div>

We also need to clean up the code and ensure correct interactions.

Comments

• Anastasia Cheetham commented 2012-01-03T14:42:10.019-0500

  Joseph started a thread on the wai-xtech list asking for general advice on Video Player controls. The responses provide some useful links:

  http://lists.w3.org/Archives/Public/wai-xtech/2011Dec/0009.html

• Anastasia Cheetham commented 2012-01-03T15:07:38.206-0500

  Regarding tooltips on the controls: I tried adding the Tooltip component as a Renderer decorator, and discovered FLUID-4571. I'm going to double-check with Tona as to how important tooltips are for the "minimally viable" Player to decide how to proceed.

• Anastasia Cheetham commented 2012-01-03T17:16:58.103-0500

  Contemplating the 'captions' button in the interface: It could be implemented as a toggle button, or it could be implemented as a checkbox (styled appropriately). Which is more semantically correct?

  The WAI-ARIA authoring guide's design patterns section (http://www.w3.org/TR/wai-aria-practices/#aria_ex) says buttons are for "user-triggered actions" whereas checkboxes are something that can have three values (true/false/mixed). To me, it seems that a toggle button is more semantically appropriate for the captions control: the user is triggering the show/hide of the captions. I will make it a toggle button.

• Anastasia Cheetham commented 2012-01-03T17:18:12.060-0500

  Tona and James both feel that tooltips are important for the minimally viable Player. I've emailed the fluid-work mailing list about FLUID-4571.

• Anastasia Cheetham commented 2012-01-06T10:21:05.154-0500

  Reconsidering toggle buttons for Play and Volume muting, etc.

  Semantically, I still think toggle buttons are correct, but I can't see how to use the Renderer to autobind the button to a value in the model: The the 'value' of a button is it's label, not it's state. I think I'll have to switch to checkboxed.

• Anastasia Cheetham commented 2012-01-06T11:48:53.241-0500

  I've filed a JIRA about Renderer support for toggle buttons (FLUID-4573) and one for switching the checkboxes to toggle boxes once supported (FLUID-4574).

• Anastasia Cheetham commented 2012-02-02T10:49:31.284-0500

  I've gone over the finer points of the caption menu interactions and summarized the results on the wiki, at http://wiki.fluidproject.org/display/fluid/Video+Player+interactions

• Michelle D'Souza commented 2012-02-14T13:25:32.734-0500

  Merged into project repo at f7aab18f274ad6d24f22ec25463a2342a926ea67