Skip to content

Commit

Permalink
Format code with Prettier
Browse files Browse the repository at this point in the history
  • Loading branch information
@theodorejb
theodorejb committed Nov 7, 2024
1 parent b2fe7a1 commit 7486379
Show file tree
Hide file tree
Showing 8 changed files with 248 additions and 151 deletions.
7 changes: 7 additions & 0 deletions .prettierignore
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
.idea/
node_modules/
demo/build/
src/*.js
src/*.d.ts
package-lock.json
*.md
5 changes: 5 additions & 0 deletions .prettierrc
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
{
"tabWidth": 4,
"trailingComma": "all",
"printWidth": 100
}
6 changes: 6 additions & 0 deletions CHANGELOG.md
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,10 @@
# Changelog

## [0.9.1] - 2024-11-07
### Changed
- Removed unnecessary variables.
- Code is now formatted with Prettier.

## [0.9.0] - 2024-10-23
### Fixed
- Cropt now clamps image drags to the viewport boundary, rather than ignoring the delta if it would go past the boundary. This fixes unexpected gaps between the image and viewport edges. ([#5]).
Expand Down Expand Up @@ -62,6 +67,7 @@ This is the initial pre-release after forking from [Foliotek/Croppie](https://gi

[#1]: https://github.com/devtheorem/cropt/pull/1
[#5]: https://github.com/devtheorem/cropt/pull/5
[0.9.1]: https://github.com/devtheorem/cropt/compare/v0.9.0...v0.9.1
[0.9.0]: https://github.com/devtheorem/cropt/compare/v0.8.9...v0.9.0
[0.8.9]: https://github.com/devtheorem/cropt/compare/v0.8.8...v0.8.9
[0.8.8]: https://github.com/devtheorem/cropt/compare/v0.8.6...v0.8.8
Expand Down
104 changes: 78 additions & 26 deletions demo/index.html
View file
Original file line number Diff line number Diff line change
@@ -1,22 +1,30 @@
<!DOCTYPE html>
<html lang ="en">
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" >
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Cropt - lightweight image cropper</title>

<meta property="og:title" content="Cropt - lightweight JavaScript image cropper">
<meta property="og:type" content="website">
<meta property="og:url" content="https://devtheorem.github.io/cropt">
<meta property="og:image" content="https://devtheorem.github.io/cropt/hero.png">
<meta property="og:title" content="Cropt - lightweight JavaScript image cropper" />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://devtheorem.github.io/cropt" />
<meta property="og:image" content="https://devtheorem.github.io/cropt/hero.png" />

<link rel="icon" href="cropt.png" />
<link rel="stylesheet" href="build/cropt.css" />
<link rel="stylesheet" href="build/bs-custom.css">
<link rel="stylesheet" href="build/bs-custom.css" />
<script src="build/bootstrap.bundle.min.js"></script>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/atom-one-dark.min.css" media="(prefers-color-scheme: dark)">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/atom-one-light.min.css" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)">
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/atom-one-dark.min.css"
media="(prefers-color-scheme: dark)"
/>
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/atom-one-light.min.css"
media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/languages/javascript.min.js"></script>

Expand Down Expand Up @@ -55,13 +63,24 @@ <h1 class="display-2 mt-2">
<img class="logo light-only" src="cropt-color.svg" />
Cropt
</h1>
<p class="lead mt-3">Cropt is a modern, lightweight image cropper with zero dependencies.</p>

<p class="lead mt-3">
Cropt is a modern, lightweight image cropper with zero dependencies.
</p>

<p class="mb-4">
<a href="https://github.com/devtheorem/cropt" class="btn btn-primary">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-github" viewBox="0 0 16 16">
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z"/>
</svg>
<svg
xmlns="http://www.w3.org/2000/svg"
width="16"
height="16"
fill="currentColor"
class="bi bi-github"
viewBox="0 0 16 16"
>
<path
d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z"
/>
</svg>
View Readme
</a>
</p>
Expand All @@ -80,17 +99,27 @@ <h2>Demo</h2>
</div>
<div class="col-5 text-end">
<button id="result-btn" class="btn btn-primary">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-crop" viewBox="0 0 16 16">
<path d="M3.5.5A.5.5 0 0 1 4 1v13h13a.5.5 0 0 1 0 1h-2v2a.5.5 0 0 1-1 0v-2H3.5a.5.5 0 0 1-.5-.5V4H1a.5.5 0 0 1 0-1h2V1a.5.5 0 0 1 .5-.5zm2.5 3a.5.5 0 0 1 .5-.5h8a.5.5 0 0 1 .5.5v8a.5.5 0 0 1-1 0V4H6.5a.5.5 0 0 1-.5-.5z"/>
</svg>
<svg
xmlns="http://www.w3.org/2000/svg"
width="16"
height="16"
fill="currentColor"
class="bi bi-crop"
viewBox="0 0 16 16"
>
<path
d="M3.5.5A.5.5 0 0 1 4 1v13h13a.5.5 0 0 1 0 1h-2v2a.5.5 0 0 1-1 0v-2H3.5a.5.5 0 0 1-.5-.5V4H1a.5.5 0 0 1 0-1h2V1a.5.5 0 0 1 .5-.5zm2.5 3a.5.5 0 0 1 .5-.5h8a.5.5 0 0 1 .5.5v8a.5.5 0 0 1-1 0V4H6.5a.5.5 0 0 1-.5-.5z"
/>
</svg>
Get Result
</button>
</div>
</div>
<div class="row">
<div class="col-12 col-md-7">
<pre class="border border-5 border-primary border-top-0 border-end-0 border-bottom-0"
><code class="language-javascript hljs" id="code-el"></code></pre>
<pre
class="border border-5 border-primary border-top-0 border-end-0 border-bottom-0"
><code class="language-javascript hljs" id="code-el"></code></pre>
</div>
<div class="col-12 col-md-5">
<form>
Expand All @@ -105,11 +134,23 @@ <h2>Demo</h2>
</div>
<div class="mb-2">
<label for="widthRange" class="form-label">Viewport width</label>
<input id="widthRange" type="range" class="form-range" min="25" max="275" />
<input
id="widthRange"
type="range"
class="form-range"
min="25"
max="275"
/>
</div>
<div class="mb-3">
<label for="heightRange" class="form-label">Viewport height</label>
<input id="heightRange" type="range" class="form-range" min="25" max="275" />
<input
id="heightRange"
type="range"
class="form-range"
min="25"
max="275"
/>
</div>
<div class="mb-3">
<div class="form-floating">
Expand All @@ -124,18 +165,29 @@ <h2>Demo</h2>
<div class="mb-3">
<label for="imgFile" class="form-label">Choose image</label>
<input id="imgFile" class="form-control" type="file" accept="image/*" />
</div>
</div>
</form>
</div>
</div>
</div>

<div class="modal fade" id="resultModal" tabindex="-1" aria-labelledby="resultModalLabel" aria-hidden="true">
<div
class="modal fade"
id="resultModal"
tabindex="-1"
aria-labelledby="resultModalLabel"
aria-hidden="true"
>
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="resultModalLabel">Result</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
<button
type="button"
class="btn-close"
data-bs-dismiss="modal"
aria-label="Close"
></button>
</div>
<div class="modal-body text-center"></div>
</div>
Expand Down
17 changes: 17 additions & 0 deletions package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

84 changes: 43 additions & 41 deletions package.json
View file
Original file line number Diff line number Diff line change
@@ -1,43 +1,45 @@
{
"name": "cropt",
"version": "0.9.0",
"description": "A lightweight JavaScript image cropper",
"files": [
"src/cropt.*"
],
"types": "./src/cropt.d.ts",
"type": "module",
"main": "./src/cropt.js",
"devDependencies": {
"bootstrap": "^5.3.3",
"gh-pages": "^6.2.0",
"grunt": "^1.6.1",
"grunt-cli": "^1.5.0",
"grunt-contrib-copy": "^1.0.0",
"grunt-contrib-sass": "^2.0.0",
"http-server": "^14.1.1",
"sass": "^1.77.6",
"typescript": "^5.6.3"
},
"scripts": {
"deploy": "gh-pages -d ./demo",
"prepare": "tsc && grunt --gruntfile Gruntfile.cjs",
"start": "http-server ./demo"
},
"repository": {
"type": "git",
"url": "git+https://github.com/devtheorem/cropt.git"
},
"keywords": [
"crop",
"cropper",
"image",
"cropping"
],
"author": "Theodore Brown <theodorejb@outlook.com>",
"license": "MIT",
"bugs": {
"url": "https://github.com/devtheorem/cropt/issues"
},
"homepage": "http://devtheorem.github.io/cropt/"
"name": "cropt",
"version": "0.9.0",
"description": "A lightweight JavaScript image cropper",
"files": [
"src/cropt.*"
],
"types": "./src/cropt.d.ts",
"type": "module",
"main": "./src/cropt.js",
"devDependencies": {
"bootstrap": "^5.3.3",
"gh-pages": "^6.2.0",
"grunt": "^1.6.1",
"grunt-cli": "^1.5.0",
"grunt-contrib-copy": "^1.0.0",
"grunt-contrib-sass": "^2.0.0",
"http-server": "^14.1.1",
"prettier": "^3.3.3",
"sass": "^1.77.6",
"typescript": "^5.6.3"
},
"scripts": {
"deploy": "gh-pages -d ./demo",
"prepare": "tsc && grunt --gruntfile Gruntfile.cjs",
"format": "prettier . --write",
"start": "http-server ./demo"
},
"repository": {
"type": "git",
"url": "git+https://github.com/devtheorem/cropt.git"
},
"keywords": [
"crop",
"cropper",
"image",
"cropping"
],
"author": "Theodore Brown <theodorejb@outlook.com>",
"license": "MIT",
"bugs": {
"url": "https://github.com/devtheorem/cropt/issues"
},
"homepage": "http://devtheorem.github.io/cropt/"
}
Loading

0 comments on commit 7486379

Please sign in to comment.