cropit

WebJar for cropit

License	MIT
GroupId	org.webjars.npm
ArtifactId	cropit
Last Version	0.5.1
Release Date	Nov 25, 2016
Type	jar
Description	cropit WebJar for cropit
Project URL	http://webjars.org
Source Code Management	https://github.com/scottcheng/cropit

Download cropit

Filename	Size
cropit-0.5.1.pom
cropit-0.5.1.jar	35 KB
cropit-0.5.1-sources.jar	22 bytes
cropit-0.5.1-javadoc.jar	22 bytes

How to add to project

Apache Maven

<!-- https://jarcasting.com/artifacts/org.webjars.npm/cropit/ -->
<dependency>
    <groupId>org.webjars.npm</groupId>
    <artifactId>cropit</artifactId>
    <version>0.5.1</version>
</dependency>

Gradle Groovy

// https://jarcasting.com/artifacts/org.webjars.npm/cropit/
implementation 'org.webjars.npm:cropit:0.5.1'

Gradle Kotlin

// https://jarcasting.com/artifacts/org.webjars.npm/cropit/
implementation ("org.webjars.npm:cropit:0.5.1")

Apache Buildr

'org.webjars.npm:cropit:jar:0.5.1'

Apache Ivy

<dependency org="org.webjars.npm" name="cropit" rev="0.5.1">
  <artifact name="cropit" type="jar" />
</dependency>

Groovy Grape

@Grapes(
@Grab(group='org.webjars.npm', module='cropit', version='0.5.1')
)

Scala SBT

libraryDependencies += "org.webjars.npm" % "cropit" % "0.5.1"

Leiningen

[org.webjars.npm/cropit "0.5.1"]

Dependencies

compile (1)

Group / Artifact	Type	Version
org.webjars.npm : jquery	jar	[1.9,)

Project Modules

There are no modules declared in this project.

cropit

Customizable crop and zoom.

See demos and docs here.

Built on top of Yufei Liu's Image Editor.

Installation

# Install cropit with bower
$ bower install cropit

# or with npm
$ npm install cropit

Migrating to v0.5

v0.5 introduced rotation feature and improved performance, as well as a breaking changes in markup structure and class names.

Markup in v0.4:

<div class="image-editor">
  <!-- .cropit-image-preview-container is needed for background image to work -->
  <div class="cropit-image-preview-container">
    <div class="cropit-image-preview"></div>
  </div>
  <!-- Other stuff -->
</div>

New markup in v0.5:

<div class="image-editor">
  <div class="cropit-preview"></div>
  <!-- Other stuff -->
</div>

Note that .cropit-image-preview-container element is no longer needed, and all you need is a .cropit-preview (previously .cropit-image-preview) whether or not you want image background that goes beyond the preview area. New markup structure (after cropit is initialized) is as follows:

.cropit-preview
  .cropit-preview-background-container
    img.cropit-preview-background
  .cropit-preview-image-container
    img.cropit-preview-image

Note the class name changes:

.cropit-image-preview              => .cropit-preview
.cropit-image-background-container => .cropit-preview-background-container
.cropit-image-background           => .cropit-preview-background

Make sure to update class names in your selectors.

Development

• Build: webpack
  • Watch for changes and rebuild: webpack -w
• Test: npm test
  • Test specific file: jest <filename>
• Lint: npm run jshint -s

License

MIT

Versions

Version
0.5.1 Nov 25, 2016