Rank: Advanced Member
Groups: Member
Joined: 3/3/2008(UTC)
Posts: 185
Thanks: 8 times
|
Hi, We are looking into this http://demo.aurigma.com/PhotoEditor/Wondering, how can we hide the 'control panel' on top? And also, is that possible to change the Crop display? We would like to have 2 layers of crop marking.. Please have a look on the attached photo for illustration As we would like to show the customer about the safezone. Please advise. Thanks. ChingYen attached the following image(s):
|
|
|
|
|
|
Rank: Advanced Member
Groups: Member
Joined: 5/29/2010(UTC)
Posts: 1,310
Thanks: 8 times
Was thanked: 111 time(s) in 111 post(s)
|
Hello Ching-Yen, Thanks for taking interest in our software. Quote:Wondering, how can we hide the 'control panel' on top?
Please open PhotoEditorSample.ascx of Photo Editor source project, find class="PhotoEditorSampleControlPane, and just comment the whole div element which contains this class. You are able to implement the code allowing to hide/show this panel by demand.Quote: And also, is that possible to change the Crop display?
Unfortunately, it is not possible.Quote: the user did a selection on the crop area, but, didn't click on the "crop", so, when the user click on the other tab like "effects", the crop area will be gone.
This behavior is set by design. User should click “Apply crop” button before switching the tabs. Quote:We found that when the user selection were in low res, the color of the crop area will change to other color like red or yellow. Just wondering, is there anyway we can show in Text as well??
Sure, you can set some warning message. You need to open \PhotoEditor\Scripts\Effects\CropEffect.js file, and add your code in this method:Code:
_onRectangleChanging: function(evt) {
/// <private />
var controller = $find(this._controllerId);
var qm = $find(controller.get_qualityMeterId());
var rr = $find(controller.get_rectangleRubberbandId());
if (rr) {
var rect = rr.get_rectangle();
var resolution = rect.width * controller.get_resizeRatio();
resolution /= (this._orientation == "Portrait") ?
this._cropFormats[this._selectedSize].width :
this._cropFormats[this._selectedSize].height;
if (qm) {
qm.set_resolution(resolution);
var maxResolution = qm.get_maximumResolution();
if (resolution < maxResolution / 3) {
rr.set_outlineColor("#FF0000");
/* Add code to show warning message that the crop resolution is too low */
}
else if (resolution < maxResolution * 2 / 3) {
rr.set_outlineColor("#DBDB00");
}
else {
rr.set_outlineColor("#24B600");
}
}
}
},
The source code of Photo Editor component is available completely to edit it according to your requirements. Please feel free to let me know if you have any questions. |
Best regards,
Dmitry Obukhov
Technical Support. Aurigma, Inc.
|
|
|
|
|
|
Rank: Advanced Member
Groups: Member
Joined: 3/3/2008(UTC)
Posts: 185
Thanks: 8 times
|
Thanks for the reply.
Here is another question. We found that whenever user click on the "crop", it will actually just select an area in the image and highlight them with the crop ratio. Just wondering, can it be always Center Crop?
Example: if the photo is 3 x 4
and the using select 1 x 1 ratio, then the preselect region will be 3 x 3 (means it will select full width, and center 3" of the height)
So, if the photo is 3 x 3, then the selected area will be the fill image.
|
|
|
|
|
|
Rank: Advanced Member
Groups: Member
Joined: 5/29/2010(UTC)
Posts: 1,310
Thanks: 8 times
Was thanked: 111 time(s) in 111 post(s)
|
Hello Ching-Yen,
Please explain it more detailed. It would be great is send some image to illustrate your explanation.
|
Best regards,
Dmitry Obukhov
Technical Support. Aurigma, Inc.
|
|
|
|
|
|
Rank: Advanced Member
Groups: Member
Joined: 3/3/2008(UTC)
Posts: 185
Thanks: 8 times
|
Hi, Please have a look on the attachment. The "Current.jpg" is when I upload a photo in landscape, and I click on "12x12" crop, it will generate a crop zone @ the center of the photo. But, what we need is "New.jpg" which it will generate a crop zone which will max out the crop area (Center crop of the photo) ChingYen attached the following image(s):
|
|
|
|
|
|
Rank: Advanced Member
Groups: Member
Joined: 5/29/2010(UTC)
Posts: 1,310
Thanks: 8 times
Was thanked: 111 time(s) in 111 post(s)
|
Hello, You need to comment, or just remove these lines: Code: //var w = newRect[2] / 8;
//var h = newRect[3] / 8;
//newRect[2] -= w * 2;
//newRect[3] -= h * 2;
in the \PhotoEditor\Scripts\Effects\CropEffect.js file. |
Best regards,
Dmitry Obukhov
Technical Support. Aurigma, Inc.
|
 1 user thanked Dmitry.Obukhov for this useful post.
|
|
|
|
Rank: Advanced Member
Groups: Member
Joined: 3/3/2008(UTC)
Posts: 185
Thanks: 8 times
|
Is that possible that we get the crop area (the x, y, width, and height) value while we click on the "show full image button".
And also which crop size (button) has been choose. Thanks.
|
|
|
|
|
|
Rank: Advanced Member
Groups: Member
Joined: 5/29/2010(UTC)
Posts: 1,310
Thanks: 8 times
Was thanked: 111 time(s) in 111 post(s)
|
Hello Ching-Yen,
Could you please explain what you want to get eventually? |
Best regards,
Dmitry Obukhov
Technical Support. Aurigma, Inc.
|
|
|
|
|
|
Rank: Advanced Member
Groups: Member
Joined: 3/3/2008(UTC)
Posts: 185
Thanks: 8 times
|
Dmitry.Obukhov wrote:Hello Ching-Yen,
Could you please explain what you want to get eventually? Hi, When the user click on the "show full image", We would like to know which "crop size" is being selected, and will auto apply the "apply crop". In other words, the user can just select the crop size, and click on the "Show full image" to get the cropped image. (Skip the step for pressing the apply crop button). If there is no "Crop Size" being selected, then, it will not process anything but prompt using must select a crop size. Thanks.
|
|
|
|
|
|
Rank: Advanced Member
Groups: Member
Joined: 5/29/2010(UTC)
Posts: 1,310
Thanks: 8 times
Was thanked: 111 time(s) in 111 post(s)
|
Hello Ching-Yen, Thanks for the explanation. To implement this functionality you should call _onApplyButtonClick() method when click “Show full image” button. Here is the code snippet how to do it: Code:
<% = ClientID.ToString() %>_stopWarning = function()
{
//Crop the image
$find($find("PhotoEditorSample1_PhotoEditorController1").getEffectIdByType('Aurigma.PhotoEditor.Effects.CropEffect'))._onApplyButtonClick();
var photoEditor = $find(<% = "\"" + PhotoEditorController1.ClientID + "\"" %>);
photoEditor.set_showExitMessage(false);
return true;
}
This handler is located in the PhotoEditor\PhotoEditor\ PhotoEditorSample.ascx file. |
Best regards,
Dmitry Obukhov
Technical Support. Aurigma, Inc.
|
|
|
|
|
|
Rank: Advanced Member
Groups: Member
Joined: 3/3/2008(UTC)
Posts: 185
Thanks: 8 times
|
Thanks. But, how we know which crop size is being chosen? We need to know the value from code behind.. (As the crop in the image is just a ration, but not the actual size in inch).
|
|
|
|
|
|
Rank: Advanced Member
Groups: Member
Joined: 5/29/2010(UTC)
Posts: 1,310
Thanks: 8 times
Was thanked: 111 time(s) in 111 post(s)
|
Hello Ching-Yen,
_onApplyButtonClick (\PhotoEditor\Scripts\Effects\CropEffect.js) includes an array with crop rectangle size. Please check it. |
Best regards,
Dmitry Obukhov
Technical Support. Aurigma, Inc.
|
|
|
|
|
|
Rank: Advanced Member
Groups: Member
Joined: 3/3/2008(UTC)
Posts: 185
Thanks: 8 times
|
Dmitry.Obukhov wrote:Hello Ching-Yen,
_onApplyButtonClick (\PhotoEditor\Scripts\Effects\CropEffect.js) includes an array with crop rectangle size. Please check it. Hi, do you mean by this? this._oldRect = new Array(rect.x, rect.y, rect.width, rect.height); This will only tell the size to be cropped on the image, but, not telling us which button did the user selected (Example: 12" x 12", 4" x 6") so that we can print to the correct size. Please advise.
|
|
|
|
|
|
Rank: Advanced Member
Groups: Member
Joined: 5/29/2010(UTC)
Posts: 1,310
Thanks: 8 times
Was thanked: 111 time(s) in 111 post(s)
|
Hello Ching-Yen, You are able to get this crop size in inches. You just need to divide width and height by image resolution, e.g.: Code: alert(Math.round(rect.height / bv._bitmap$verticalResolution) + " " + Math.round(rect.width / bv._bitmap$horizontalResolution));
|
Best regards,
Dmitry Obukhov
Technical Support. Aurigma, Inc.
|
|
|
|
|
|
Rank: Advanced Member
Groups: Member
Joined: 3/3/2008(UTC)
Posts: 185
Thanks: 8 times
|
Dmitry.Obukhov wrote:Hello Ching-Yen, You are able to get this crop size in inches. You just need to divide width and height by image resolution, e.g.: Code: alert(Math.round(rect.height / bv._bitmap$verticalResolution) + " " + Math.round(rect.width / bv._bitmap$horizontalResolution));
Hi, This will only show the "image size in inch", but not the user selected size. Or should i called them "format" to avoid confusion? Let say, the user uploaded the photo which is 3" x 6 ", and select a format of "12 x 12", this will lead the user max to have a physical photo of 3" x 3". So, during our print out, we need to manually enlarge it, please correct me if I am wrong on this part. So, we need to know the user is select the format of "12 x 12" or 6" x 6". In short, we would like to know which is the last selected "format (Crop size) button". Please advise.
|
|
|
|
|
|
Rank: Advanced Member
Groups: Member
Joined: 5/29/2010(UTC)
Posts: 1,310
Thanks: 8 times
Was thanked: 111 time(s) in 111 post(s)
|
Hello Ching-Yen, Sorry for the delay. You can get the number of selected button in the _onSizeButtonClick() method: Code:
if (this._selectedSize == -1) {
this._cropFormats[index].button.className = "SimpleEffectSelectButton";
this._selectedSize = index;
alert(this._selectedSize);
this._update();
}
else {
if (this._selectedSize == index) {
this._cropFormats[index].button.className = "SimpleEffectButton";
this._selectedSize = -1;
alert(this._selectedSize);
this._update();
}
else {
this._cropFormats[index].button.className = "SimpleEffectSelectButton";
this._cropFormats[this._selectedSize].button.className = "SimpleEffectButton";
this._selectedSize = index;
alert(this._selectedSize);
this._updateRubberband();
}
This method is located in the \PhotoEditor\Scripts\Effects\CropEffect.js file. |
Best regards,
Dmitry Obukhov
Technical Support. Aurigma, Inc.
|
|
|
|
|
|
Rank: Advanced Member
Groups: Member
Joined: 3/3/2008(UTC)
Posts: 185
Thanks: 8 times
|
Thanks for all the support have been given. Perhaps this will be the last 2 question we having..
Let say, we do store in the session that what format customer has been chose, and know the x, y, width and high of the crop area.
How can we programmatically load the crop area while the page load?
Please advise.
|
|
|
|
|
|
Rank: Advanced Member
Groups: Member
Joined: 5/29/2010(UTC)
Posts: 1,310
Thanks: 8 times
Was thanked: 111 time(s) in 111 post(s)
|
Hello Ching-Yen, You need to add these lines: Code:
//Select size of arbitrary crop size
$find($find("PhotoEditorSample1_PhotoEditorController1").getEffectIdByType('Aurigma.PhotoEditor.Effects.CropEffect'))._selectedSize = 3 ;
//Update rubberband
$find($find("PhotoEditorSample1_PhotoEditorController1").getEffectIdByType('Aurigma.PhotoEditor.Effects.CropEffect'))._update();
in the beginning of Sys.Application.add_load(function(e, t) method, which is located in the PhotoEditor\PhotoEditorSample.ascx file. Let me know, if you have any questions. |
Best regards,
Dmitry Obukhov
Technical Support. Aurigma, Inc.
|
|
|
|
|
|
Rank: Advanced Member
Groups: Member
Joined: 3/3/2008(UTC)
Posts: 185
Thanks: 8 times
|
Dmitry.Obukhov wrote:Hello Ching-Yen, You need to add these lines: Code:
//Select size of arbitrary crop size
$find($find("PhotoEditorSample1_PhotoEditorController1").getEffectIdByType('Aurigma.PhotoEditor.Effects.CropEffect'))._selectedSize = 3 ;
//Update rubberband
$find($find("PhotoEditorSample1_PhotoEditorController1").getEffectIdByType('Aurigma.PhotoEditor.Effects.CropEffect'))._update();
in the beginning of Sys.Application.add_load(function(e, t) method, which is located in the PhotoEditor\PhotoEditorSample.ascx file. Let me know, if you have any questions. Hi, this will only select the crop area by center crop, but, what if the user did shifted the crop area? We need to restore the x,y, width and height, plus the orientation of cropping. Please advise.... The basic idea we want to archive is, when, the user navigate to another page, and click on the "back", it will see what they did previously.
|
|
|
|
|
|
Rank: Advanced Member
Groups: Member
Joined: 5/29/2010(UTC)
Posts: 1,310
Thanks: 8 times
Was thanked: 111 time(s) in 111 post(s)
|
Hello Ching-Yen,
Sorry for the long delay.
I spent many time to approach necessary effect. Unfortunately, it is not possible to implement this functionality. |
Best regards,
Dmitry Obukhov
Technical Support. Aurigma, Inc.
|
|
|
|
|
|
Forum Jump
You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.