Skip to content

Instantly share code, notes, and snippets.

@RayPS
Last active September 6, 2017 11:37
Show Gist options
  • Save RayPS/6f21122eb12d6a85d5f2670c11de29a2 to your computer and use it in GitHub Desktop.
Save RayPS/6f21122eb12d6a85d5f2670c11de29a2 to your computer and use it in GitHub Desktop.
Simple Framer InputLayer Class
class InputLayer extends Layer
constructor: (options={}) ->
options.html = "<input type='text' value=''>"
super options
@define "input",
get: ->
return @querySelector("input")
# Usage:
textField = new InputLayer
height: 40
# "InputLayer.input" returns an <Input> element
# so you can do whatever you want:
textField.input.placeholder = "Type something here"
# Or edit style with CSS:
textField.input.style.marginLeft = "10px"
# Or event:
textField.input.addEventListener "input", ->
print this.value
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment