Skip to content

Releases: zhanziyang/vue-croppa

v1.3.7

16 Jul 16:09
Compare
Choose a tag to compare

Change Log:

v1.3.6

19 Apr 17:05
Compare
Choose a tag to compare

Change Log:

v1.3.4

15 Apr 13:05
Compare
Choose a tag to compare

Change Log:

v1.3.3

08 Apr 15:06
Compare
Choose a tag to compare

Change Log:

  • Support listening to native events like "click", "dbclick", "mousedown" etc.
<croppa v-model="croppa" @click="alert('clicked')"></croppa>

v1.3.2

06 Apr 12:16
Compare
Choose a tag to compare

Change Log:

v1.3.0

13 Mar 13:10
Compare
Choose a tag to compare

Change Log:

  • New props: auto-sizing
    If it is set to true, width and height will not work. Instead, croppa will adjust itself to it's container(.croppa-container)'s size. It's useful to make croppa's dimension responsive.
    Demo: https://codepen.io/zhanziyang/pen/bvVKzL
    Fix #76

v1.2.1

28 Feb 12:51
Compare
Choose a tag to compare

Change Log:

Merge #74: return false instead of throwing error when the selected file is invalid.

v1.2.0

28 Jan 01:11
b404725
Compare
Choose a tag to compare

Change Log:

  • New prop: passive
    (1.2.0) Switch to passive mode. Croppa in passive mode will sync state with another croppa if they v-model the same object. Also it will not have self-control - user can't manipulate image on passive croppa. This is useful as a preview component.

    These states will be synced:

    ['imgData', 'img', 'imgSet', 'originalImage', 'naturalHeight', 'naturalWidth', 'orientation', 'scaleRatio']

    Fix #68
    Demo

  • New prop: image-border-radius
    (1.2.0) Set rounded corders to image. Note that this has effect on the output image.

    Fix #67
    Demo

  • New method addClipPlugin(func) to add clip plugin to clip the image. Example:

    // Add a clip plugin to make a circle clip on image
    onInit(vm) {
      this.croppa.addClipPlugin(function (ctx, x, y, w, h) {
        /*
         * ctx: canvas context
         * x: start point (top-left corner) x coordination
         * y: start point (top-left corner) y coordination
         * w: croppa width
         * h: croppa height
        */
        ctx.beginPath()
        ctx.arc(x + w / 2, y + h / 2, w / 2, 0, 2 * Math.PI, true)
        ctx.closePath()
      })
    },

    Demo

v1.1.5

25 Dec 06:37
Compare
Choose a tag to compare

Change Log:

  • Fix typo that causes file-type-mismatch event not working properly. (#56)

v1.1.4

02 Dec 02:51
af362a7
Compare
Choose a tag to compare

Change Log:

  • A new prop: replace-drop. If :replace-drop="true", current image will be replaced by the new one on drag and drop (By default you need to remove the current image to drop a new one). For backward compatibility, it's default value is false. #53
  • Fixed "window is not defined" error on SSR. #52