Intended usage

  • User types in the number of the stop they want to visit. 
  • If the number matches a valid stop_id in the database, the “delete” cursor should be white; if the number does not match a valid stop_id, the “delete” cursor should be red. Hitting the delete cursor (white or red) should remove the last character entered on the keypad.
  • For valid entries, the view should switch to an audio player after 3 seconds, where we should see a timeline of audio/images for that stop. 

Setting up the database

  • We use two tables: Audio (primary key of stop_id), Images (may have multiple images per stop_id)

SETTING UP THE VIEWS


Keypad view

  • We use two blocks: Text Input Iris Keypad, Selector (takes 2 button blocks)


Text Input Iris Keypad

 

  • General Tab, Other Dependencies - [[ds:/NA-Cg-Stt-Time-Sync-Audio (Local Collection)/record/stop_id]][[ds:/NA-Cg-Stt-Time-Sync-Images (Local Collection)/record/stop_id]]
  • Specific Tab, Text - [[var:keyPadValue]]
  • Specific Tab, Maximum Length - 3
  • Specific Tab, Result Key - keyPadValue
  • Specific Tab, Launch With Play Button - checked

    Events Tab, Change - 
  •    Start the Timer - 2 seconds so the user has time to change their selection before the view switches
  •    Refresh Block - Keypad Selector (the Selector block mentioned above)
  • Go to Matching Record - Data Source: Audio; Column: stop_id; Search Value: [[var:keyPadValue]]; Matching Record Found: match this sets the value of “match”, which we will use to determine the color of the “delete” cursor
  • Refresh Block - Keypad Selector (the Selector block mentioned above)
  • Start the Timer - 2 seconds so the user has time to change their selection before the view switches


Events Tab, Launch Play 

  • Define a Data Source Filter - Data Source: Audio; Column: stop_id; Criteria: ='[[var:keyPadValue]]'; Replaces All Filters on Same Column: checked; When: [[var:match]] equal true
  • Define a Data Source Filter - Data Source: Images; Column: stop_id; Criteria: ='[[var:keyPadValue]]'; Replaces All Filters on Same Column: checked; When: [[var:match]] equal true
  • Switch to Another View - View: audio player view; History: Add to History (we do this because the audio player view can be accessed from multiple screens, and we want the “back” button to function correctly); When: [[var:match]] equal true
  • Edit View Page, Timer Expiration - all the same events as Events Tab, Launch Play
  • Edit View Page, Before Draw - Set a Variable, Variable Name: “keyPadValue”


Selector

  • Specific Tab, Match Expression - [[var:match]]
  • Specific Tab, Delete Button - name_of_button_block_1
  • Specific Tab, Blocks - 1
  • Specific Tab, Block #1 - Block: name_of_button_block_2; Match Value: false

Button Block 1

  • Specific Tab, Up and Down images are white
  • Events Tab, Button Down - 
    - Set a Variable - Variable Name: keyPadValue; Value: [[var:keyPadValue:removeLastChar]
    - Go to Matching Record - Data Source: Audio; Column: stop_id; Search Value: [[var:keyPadValue]]; Matching Record Found: match     this sets the value of “match”, which we will use to determine the color of the “delete” cursor 
  • Refresh Block - Keypad Selector 
  • Refresh Block - Iris Keypad

 

Button Block 2 - all the same as Button Block 1 except the Up and Down images are red



AUDIO PLAYER VIEW


We have a Back button and Audio block


Back button

  • Events Tab, Tap - 
  • Switch to Another View - View: previous
  • Run Script After Actions - RemoveDataSourceFilters (custom script) we need to do this AFTER we such to another view since we are switching to previous; otherwise the data would only refresh for the current view
  • RemoveDataSourceFilters has the following actions:
  • Refresh Data Source for Images (request immediately & wait until finished)
  • Refresh Data Source for Audio (request immediately & wait until finished)
  • Remove Data Source Filters on Images
  • Remove Data Source Filters on Audio

Audio block

  • Events Tab, Done - all the same events as Back button Tap