Image Edit (opens the Image in the Edit Console) | Community
Skip to main content
L
Lakshmi99
Level 2
December 21, 2023
Solved

Image Edit (opens the Image in the Edit Console)

  • December 21, 2023
  • 1 reply
  • 760 views

Hi Team,

I tried to find out the existing OOTB code of Image Edit (opens the Image in the Edit Console) but not able to find the exact location. Could someone help me to provide the path for the same? PFB screenshot for the reference. Thank you!

 

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by lukasz-m

edit option implementation is located under: /libs/cq/gui/components/authoring/dialog/fileupload/render.jsp

search for below code

ValueMap editBtnVM = new ValueMapDecorator(new HashMap<String, Object>()); editBtnVM.put("granite:class", "cq-FileUpload-edit"); editBtnVM.put("variant", "quiet"); editBtnVM.put("text", "Edit");

As I have mention in my original message, entire implementation is under /libs/cq/gui/components/authoring/dialog/fileupload - browse files under above location in case you need information about other aspects.

1 reply

lukasz-m
Community Advisor
lukasz-mCommunity Advisor
Community Advisor
December 21, 2023

Hi @lakshmi99,

Code related to Edit button is located under following location /libs/cq/gui/components/authoring/dialog/fileupload/clientlibs/fileupload/js/fileupload.js

Search for below code, which is responsible for handling Edit button action

channel.off("click" + FILEUPLOAD_EVENT_NAMESPACE, _editButtonSelector).on("click" + FILEUPLOAD_EVENT_NAMESPACE, _editButtonSelector, function (event) { // "cq-FileUpload-edit" button is only present if the fileupload holds a fileReference var $target = $(event.currentTarget); var fileReference = $target.data("cqFileuploadFilereference"); var viewInAdminURI = $target.data("cqFileuploadViewinadminuri"); var url = Granite.URITemplate.expand(viewInAdminURI, { item: fileReference }); if(url.startsWith("/") || url.startsWith("http")){ open(Granite.HTTP.externalize(url)); } else { console.warn(`Opening URL was blocked. Suspicious URL was detected (${url})`); } });

All other code for fileupload widget can be found under: /libs/cq/gui/components/authoring/dialog/fileupload

    L
    Lakshmi99Author
    Level 2
    December 26, 2023

    Thank you @lukasz-m. Could you also please help me to provide the node path for "edit" option in the dialog. I got the location for image editor properties but not the edit option in the dialog.

     

    lukasz-m
    Community Advisor
    lukasz-mCommunity AdvisorAccepted solution
    Community Advisor
    December 26, 2023

    edit option implementation is located under: /libs/cq/gui/components/authoring/dialog/fileupload/render.jsp

    search for below code

    ValueMap editBtnVM = new ValueMapDecorator(new HashMap<String, Object>()); editBtnVM.put("granite:class", "cq-FileUpload-edit"); editBtnVM.put("variant", "quiet"); editBtnVM.put("text", "Edit");

    As I have mention in my original message, entire implementation is under /libs/cq/gui/components/authoring/dialog/fileupload - browse files under above location in case you need information about other aspects.

    Terms & ConditionsAccessibility statement

    Loading footer...