Skip to content

gauravtiwari5050/OpenPicker

Repository files navigation

OpenPicker

OpenPicker is an open source and self hosted file picker for your websites.

Installation

Deploy to Heroku

Deploy

Deploy to your server using npm

$ npm i -g openpicker
$ npm install -g coffee-script

Start the server

$ openpicker

Add Javascript to your site

<script type="text/javascript">
      (function(window,document) {
        window.openpicker = {};
        var op = document.createElement('script'); op.type = 'text/javascript'; op.async = true;
        op.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + '<ADD_YOUR_SERVER_HERE>/script/v1.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(op, s);
      })(window,document);
    </script>  

Pick single image

OpenPicker defaults to picking Image

    openpicker.getImage(function(openpickerResponse){
            $('#image').attr('src',openpickerResponse.file.url);
    });

Pick multiple images

OpenPicker defaults to picking Image

    openpicker.getImages(function(openpickerResponse){
            console.log(openpickerResponse.files);
    });

Pick single file of any type

OpenPicker defaults to picking Image

    openpicker.getFile(function(openpickerResponse){
            console.log(openpickerResponse.file);
    });

Pick files by mimetype (more details on options in the sections below)

OpenPicker defaults to picking Image

    openpicker.getFile(
        {
            mimetypes: 'application/pdf'
        }
        function(openpickerResponse){
            console.log(openpickerResponse.file);
        }
    );

Crop/Rotate Image before uploading

OpenPicker defaults to picking Image

    openpicker.getImage(
        {
            conversions:['crop','rotate'],
            cropRatio:16/9,
        }
        function(openpickerResponse){
            console.log(openpickerResponse.file);
        }
    );

Pick multiples files of any type

OpenPicker defaults to picking Image

    openpicker.getFiles(function(openpickerResponse){
            console.log(openpickerResponse.files);
    });

Server Configuration

OpenPicker expects a properties.conf file in the working directory. You can set the following options. You can set all the options in environment variables as well. Environment variables are given preference if set while reading a property.

FILESTORES=disk,s3 <comma seperated list, default: disk, only s3 and disk are supported as of now>
UPLOAD_DIRECTORY=<full path to disk location where you want to save files, default is ./uploads>
TEMPORARY_DIRECTORY=<full path to disk location where you want to save files temporarily, default is ./tmp> 

ALLOWED_MIME_TYPES_REGEX = regex to give allowed mime types , default is 
/.(avi|wmv|flv|mpg|3gp|mkv|mp4|mpeg|mpeg-1|mpeg-2|mpeg-3|mpeg-4|mp3|wav|xlsx?|zip|7z|docx?|pptx?|pdf|jpe?g|png|gif|csv|comma-separated-values)$/i

ALLOWED_IMAGE_TYPES_REGEX = regex to give allowed image types , default is 
/.(jpe?g|png|gif)$/i

MIN_SIZE=minimum file size in bytes
MAX_SIZE=maximum file size in bytes
S3_BUCKET = name of s3 bucket
AWS_ACCESS_KEY_ID= Aws access key if you have configured s3 as a filestore
AWS_SECRET_ACCESS_KEY = Aws secret access key
AWS_REGION = Aws Region of the bucket where you are uploading the files

Client Configuration

Available Fileupload Channels

- MY_COMPUTER  : Allows uploading file from current device

Client Options -

All these are optional , pass these while invoking openpicker.getFile()

- mimetypes : Comma seperated list of mimetypes (Ex: image/*,application/pdf)
- conversions : ['crop','rotate'] 
- cropRatio : Ex 16/9 - used while cropping the image
- channels : ['MY_COMPUTER'] - lets the client control channels to be used in the picker

OpenPicker uses a number of open source projects to work properly:

And of course OpenOpicker itself is open source with a public repository on GitHub.

Todos

  • Write Tests
  • Add more channels
  • Add more filestores

Contributors

License

MIT

About

Open source and self hosted file picker for websites.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published