https://github.com/255bits/poly-image-reader

cross-platform camera/image upload functionality for browsers, phones and tablets
https://github.com/255bits/poly-image-reader

Last synced: about 2 months ago
JSON representation

cross-platform camera/image upload functionality for browsers, phones and tablets

• Host: GitHub
• URL: https://github.com/255bits/poly-image-reader
• Owner: 255BITS
• Created: 2012-05-08T00:56:58.000Z (over 12 years ago)
• Default Branch: master
• Last Pushed: 2012-05-09T04:23:25.000Z (over 12 years ago)
• Last Synced: 2024-04-09T16:40:30.655Z (9 months ago)
• Language: CoffeeScript
• Size: 129 KB
• Stars: 2
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
poly-image-reader

===========

A cross-platform camera/image library for browsers, phones and tablets.

### Browsers ###

HTML5 Drag and Drop is supported.

Webcams are not currently supported, but feel free to add them and issue a pull request.

### Phones or Tablets ###

Camera or media library upload is supported.

Usage

===========

Requires jquery.  Try to use a new version.

### Installing via CDN ###

or alternatively download the .coffee file and compile it yourself.

### Using ###

After linking to the script tag, add this function:

    // The part of the document you want to drag and drop to, or turn into a camera

    // or media upload

    var $contentArea = $('.image-media-area');

    var options = {

      content: "Drag and Drop to upload" // Content to display in the drag and drop area

    };

    polyImageReader($contentArea, options, function(file, data) {

      // file is a data structure containing meta-information about the file

      // such as 'name'

      // data is base64 encoded

      doSomethingWith(data);

    });

###Previewing###

You don't need to use a phone or tablet to test how this looks.  Just use the

following url parameter:  `polyPreview`

####polyPreview options####

- tablet ([example](LINK))

- phone ([example](LINK))

###Styling###

Poly Reader places everything in CSS classes, so feel free to style to your hearts content. 

####List of CSS classes####

  *span.poly-content.browser - the text string inside the html5 drag and drop area