0.1.4 • Published 10 years ago

framer-pep v0.1.4

Weekly downloads
2
License
MIT
Repository
github
Last release
10 years ago

A simple adapter to jquery's PEP for FramerJS. A PointerEvent Polyfill makes it possible to use the W3C's PointerEvent specification today. PointerEvents let you handle mouse, touch, and pen input through a single set of event handlers.

Example Usage

Tested in Framer Studio and framer-cli.

  1. Run npm install framer-pep in your prototype's directory (usually MyPrototype.framer/)
  2. Add a reference framer-pep by adding pep = require("framer-pep"). Where you do this dependson whether you're using Framer Studio or framer-cli

Framer Studio

If you're using Framer Studio, you need to create an npm.coffee file in your modules folder, per these instructions.

MyPrototype.framer/modules/npm.coffee

# npm.coffee is a simple module wrapper
exports.pep = require("framer-pep")
# You could require more npm modules that you have installed on additional lines. For example, assuming you have backbone installed:
#exports.backbone = require("backbone")

MyPrototype.framer/app.coffee

npm = require("npm") # reference to your npm wrapper module
pep = npm.pep # now you have direct access to the framer-pep npm module

framer-cli

index.coffee (or index.js)

pep = require("framer-pep")

Features

framer-pep exposes two properties, pep.PointerEvents and pep.PointerEventLayer

Here's how I like to use it:

pep = require("framer-pep")

# Replace the standard Framer objects with PEP objects
window.Events = _.extend(Events, pep.PointerEvents)
window.Layer = pep.PointerEventLayer

TestLayer = new Layer
TestLayer.center()

TestLayer.on Events.PointerDown, (e) ->
    # Will print on mouse, touch, and pen
    print "Hello from pointerdown!"

Known Issues

Dragging and ScrollComponents don't work because they're hard-coded to use touch events. You can get dragging to work (hackily) like so:

window.Events.TouchStart = Events.PointerDown
window.Events.TouchMove = Events.PointerMove
window.Events.TouchEnd = Events.PointerUp

Building

Just use npm run build. That will generate the compiled index.js from index.coffee.

0.1.4

10 years ago

0.1.3

10 years ago

0.1.2

10 years ago

0.1.1

10 years ago

0.1.0

10 years ago