Add prefill options

.gitignore

@@ -1,4 +1,5 @@
 .DS_Store
+.idea/
 dev/
 node_modules/
 dist/

PictureInput.vue

@@ -88,6 +88,10 @@ export default {
       type: [String, File],
       default: ''
     },
+    prefillOptions: {
+      type: Object,
+      default: {}
+    },
     crop: {
       type: Boolean,
       default: true
@@ -126,7 +130,7 @@ export default {
   watch: {
     prefill () {
       if (this.prefill) {
-        this.preloadImage(this.prefill)
+        this.preloadImage(this.prefill, this.prefillOptions)
       } else {
         this.removeImage()
       }
@@ -157,7 +161,7 @@ export default {
   mounted () {
     this.updateStrings()
     if (this.prefill) {
-      this.preloadImage(this.prefill)
+      this.preloadImage(this.prefill, this.prefillOptions)
     }
 
     this.$nextTick(() => {
@@ -425,7 +429,8 @@ export default {
       }
       reader.readAsArrayBuffer(file.slice(0, 65536))
     },
-    preloadImage (source) {
+    preloadImage (source, options) {
+      options = Object.assign({}, options)
       if (typeof source === 'object') {
         this.imageSelected = true
         this.image = ''
@@ -447,10 +452,10 @@ export default {
       })
       .then(imageBlob => {
         let e = { target: { files: [] } }
-        const fileName = source.split('/').slice(-1)[0]
-        let fileType = fileName.split('.').slice(-1)[0]
-        fileType = fileType.replace('jpg', 'jpeg')
-        e.target.files[0] = new File([imageBlob], fileName, { type: 'image/' + fileType })
+        const fileName = options.fileName || source.split('/').slice(-1)[0]
+        let mediaType = options.mediaType || ('image/' + options.fileType || fileName.split('.').slice(-1)[0])
+        mediaType = mediaType.replace('jpg', 'jpeg')
+        e.target.files[0] = new File([imageBlob], fileName, { type: mediaType })
         this.onFileChange(e)
       })
       .catch(err => {

README.md

@@ -89,6 +89,12 @@ You can find an example project here: https://github.com/alessiomaffeis/vue-pict
 - **removeButtonClass**: (string, optional) the class which will be applied to the 'Remove Photo' button.
   Default value: 'btn btn-secondary button secondary'.
 - **prefill**: (image url or File object, optional) use this to specify the path to a default image (or a File object) to prefill the input with. Default value: empty.
+- **prefillOptions**: (object, optional) use this if you prefill with a data uri scheme to specify a file name and a media or file type:
+```
+  fileName: (string, optional) the file name
+  fileType: (string, optional) the file type of the image, i.e. "png", or
+  mediaType: (string, optional) the media type of the image, i.e. "image/png"
+```
 - **toggleAspectRatio**: (boolean, optional) set *:toggleAspectRatio="true"* to show a button for toggling the canvas aspect ratio (Landscape/Portrait) on a non-square canvas. Default value: false.
 - **autoToggleAspectRatio**: (boolean, optional) set *:autoToggleAspectRatio="true"* to enable automatic canvas aspect ratio change to match the selected picture's. Default value: false.
 - **aspectButtonClass**: (string, optional) the class which will be applied to the 'Landscape/Portrait' button.