A Pen by Riley Shaw.

index.slim

.vert
  h1#flasher
  textarea placeholder="Paste text here"

script.coffee

# state variables
playerMode = 'input'
down = {}
wordIndex = 0
words = []
lastWord = 0
pauseFlag = 0

# key codes
keyEnter = 13
keySpace = 32
keyLeft = 37
keyUp = 38
keyRight = 39
keyDown = 40

$input = $('textarea')
$flasher = $('#flasher')
speed = 160
pausers = /[,;.!?]/

cycle = (direction = 1) ->
  if (down.right? and direction is 1) or (down.left? and direction is -1)
    wordIndex += direction
    wordIndex = Math.min Math.max(wordIndex, 0), lastWord
    word = words[wordIndex]
    $flasher.text word    
    setTimeout cycle, speed, direction

faster = ->
  if speed > 5 then speed -= 5 else speed = 0
  
slower = ->
  speed += 5
  
keyHandler = (e, type) ->
  key = e.which
  
  if key is keyEnter and playerMode is 'input'
    if type is 'press'
      if not down.enter?
        words = $input.val().split /\s+/
        wordIndex = 0
        lastWord = words.length
        $input.hide()
        $flasher.show()
        $flasher.text words[wordIndex]
        playerMode = 'flash'
    else # keyup
      down.enter = null
      
  else switch key
    when keyEnter
      if type is 'press'
        if not down.enter?
          down.enter = true
          $flasher.hide()
          $input.show()
          playerMode = 'input'
      else # keyup
        down.enter = null
    when keySpace then 0  
    when keyLeft
      if type is 'press'
        if not down.left?
          down.left = true
          if e.shiftKey is true
            wordIndex = 0
            $flasher.text words[wordIndex]
          else
            cycle(-1)
      else down.left = null
    when keyRight
      if type is 'press'
        if not down.right?
          down.right = true
          cycle()
      else down.right = null
    when keyUp
      if type is 'press' then faster()
    when keyDown
      if type is 'press' then slower()
  
$(document).bind
  keydown: (e) ->
    keyHandler e, 'press'
  keyup: (e) ->
    keyHandler e, 'release'

Simple-Flash-Reader-(with-input).markdown

Simple Flash Reader (with input)

Pretty awesome.

Instructions:

• Paste some content into the textarea
• Press ENTER: Load textarea content into flash reader, or recall textarea
• Hold RIGHT: Read loaded content through a series of flashing words
• Press or hold UP: Increase speed
• Press or hold DOWN: Decrease speed

Working title: "Newsflash"

...more coming soon :)

A Pen by Riley Shaw on CodePen.

License.

style.sass

@import "compass"
$size: 120px
$background: #282828
$color: #e0e0e0

=placeholder
  &:-moz-placeholder
    @content    
  &::-moz-placeholder
    @content
  &:-ms-input-placeholder
    @content
  &::-webkit-input-placeholder
    @content

html, body
  height: 100%
  width: 100%

body
  background: $background
  
.vert
  height: 100%
  text-align: center
  &:before
    content: ''
    display: inline-block
    height: 100%
    vertical-align: middle
    margin-right: -0.25em

#flasher, textarea
  display: inline-block
  vertical-align: middle
  font-family: TimesNewRoman, "Times New Roman", Times, Baskerville, Georgia, serif

h1
  font-size: $size
  color: $color

textarea
  height: 40%
  min-height: 180px
  max-height: 95%
  width: 50%
  min-width: 360px
  max-width: 95%
  padding: 6px 6px
  color: #333
  background: #dbdbdb
  outline: none
  +placeholder
    font-size: 60px
    text-align: center
    color: #b0b0b0