diff --git a/src/dokumentor/static/css/style.css b/src/dokumentor/static/css/style.css
index abbb792..a1806ee 100644
--- a/src/dokumentor/static/css/style.css
+++ b/src/dokumentor/static/css/style.css
@@ -1002,3 +1002,15 @@ input[type=number] {
font-size: 1em;
}
+.modal-upload__btn--image {
+ width: 13px;
+}
+
+.modal-upload__bottom--operation-image,
+.modal-upload__bottom--operation-modal {
+ display: inline-block;
+}
+
+.modal-upload__bottom--operation-modal {
+ padding-left: 110px;
+}
diff --git a/src/dokumentor/static/img/rotate-left-black.svg b/src/dokumentor/static/img/rotate-left-black.svg
new file mode 100644
index 0000000..90b8406
--- /dev/null
+++ b/src/dokumentor/static/img/rotate-left-black.svg
@@ -0,0 +1,46 @@
+
+
+
diff --git a/src/dokumentor/static/img/rotate-left.svg b/src/dokumentor/static/img/rotate-left.svg
new file mode 100644
index 0000000..bedad66
--- /dev/null
+++ b/src/dokumentor/static/img/rotate-left.svg
@@ -0,0 +1,16 @@
+
+
\ No newline at end of file
diff --git a/src/dokumentor/static/img/rotate-right-black.svg b/src/dokumentor/static/img/rotate-right-black.svg
new file mode 100644
index 0000000..5087dab
--- /dev/null
+++ b/src/dokumentor/static/img/rotate-right-black.svg
@@ -0,0 +1,46 @@
+
+
+
diff --git a/src/dokumentor/static/img/rotate-right.svg b/src/dokumentor/static/img/rotate-right.svg
new file mode 100644
index 0000000..d712ec2
--- /dev/null
+++ b/src/dokumentor/static/img/rotate-right.svg
@@ -0,0 +1,13 @@
+
+
\ No newline at end of file
diff --git a/src/dokumentor/static/js/profile/asset.js b/src/dokumentor/static/js/profile/asset.js
index b6e0d9b..06ff2e9 100644
--- a/src/dokumentor/static/js/profile/asset.js
+++ b/src/dokumentor/static/js/profile/asset.js
@@ -58,17 +58,18 @@ $(document).ready(function () {
function initCropper(width, height, type) {
$uploadCrop = $('#imageCropper').croppie({
- enableExif: true,
- enforceBoundary: false,
- viewport: {
- width: width,
- height: height,
- type: type
- },
- boundary: {
- width: 300,
- height: 300
- }
+ enableExif: true,
+ enforceBoundary: false,
+ enableOrientation: true,
+ viewport: {
+ width: width,
+ height: height,
+ type: type
+ },
+ boundary: {
+ width: 300,
+ height: 300
+ }
});
}
@@ -107,7 +108,15 @@ $(document).ready(function () {
});
});
- $('#cropImageBtn').on('click', function (ev) {
+ $("#cropImageBtnLeft").on("click", function() {
+ $uploadCrop.croppie('rotate', -90);
+ });
+
+ $("#cropImageBtnRight").on("click", function() {
+ $uploadCrop.croppie('rotate', 90);
+ });
+
+ $('#cropImageBtnSave').on('click', function (ev) {
$uploadCrop.croppie('result', {
type: 'base64',
format: 'png',
diff --git a/src/dokumentor/templates/customer/profile/edit.html b/src/dokumentor/templates/customer/profile/edit.html
index a0d1065..879177c 100644
--- a/src/dokumentor/templates/customer/profile/edit.html
+++ b/src/dokumentor/templates/customer/profile/edit.html
@@ -460,8 +460,14 @@
-
-
+
+
+
+
+
+
+
+