Does colorpicker works for AEM6.1? | Community
Skip to main content
Level 3
October 30, 2015
Solved

Does colorpicker works for AEM6.1?

  • October 30, 2015
  • 13 replies
  • 4056 views

My team is having problems regarding the color picker (/libs/granite/ui/components/foundation/form/colorpicker) using AEM 6.1 in the touch ui.

We can't add properties: editMode and freestylePallete.

The jsp rendering the the colorpicker sends the settings in an object called "modes", but the js file uses a variable called "pickerModes".

Is there a fix for this?

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

13 replies

Sham_HC
Sham_HCAccepted solution
Level 10
October 30, 2015
Level 3
November 2, 2015

Thanks from the article Sham.

We tried that, but we still can set the color picker to display edit mode and freestyle.

It only display using classic mode

Do we need to do something else beside setting the properties: freestylePaletteType="{Boolean}true" and editType="{Boolean}true"

Thanks

smacdonald2008
Level 10
November 3, 2015

Did you check the granite reference for this data type? 

EsteBusta
December 17, 2015

This is not a clear answer, the refered article (in the answer marked as 'solved') uses the properties as the documentation indicates, somehow in AEM 6.1 setting this properties don't work, so this is bug isn't it? there Is some solution for this?

Regards.

smacdonald2008
Level 10
December 17, 2015

Are you able to set the property in classic mode - as stated by another user? 

Level 3
December 17, 2015

Hello smacdonald2008,

 

I am the original author of this post and the problem wasn't fixed.

When I set the property, it is ignored and the component is rendered without it.

I sent in the above answers the javascript problem, but no solution was offered.

EsteBusta
December 18, 2015

Nop, in classic mode neither. After a lot time trying to use the colorPicker, i just decided to implement my own colorPicker by using HTML5, check this post: http://conexiogroup.com/custom-colorpicker-in-aem-6-1-touch-ui-dialog/

Clemente-3SHARE
Level 2
February 18, 2016

I just found a simple workaround for this issue in case you have extended the Color Picker component.

If you look into the /libs/granite/ui/components/foundation/form/colorpicker/render.jsp file you'll find in the line 130 this:

colorpickerJson.put("modes", pickerModes);

The problem there is that the coralui2.js file is looking for this key "pickerModes". So, when you extend this Color Picker in your /apps folder make sure to change the previous line to this:

colorpickerJson.put("pickerModes", pickerModes);

That should do the trick!

Cheers!

EsteBusta
February 19, 2016

That's right, changing the "modes" by "pickermodes" solves the selecting mode with the component, ANYWAY, i found another bugs, i.e. the pagination in the colorPicker is broken too. When you add more than 20 colors, (you add 20 nodes in the mappings folder) the pagination just crash.

After a lot time trying to do work well the colorPicker i just decided to implement my own colorPicker by using HTML5, check this post:

http://conexiogroup.com/custom-colorpicker-in-aem-6-1-touch-ui-dialog/

March 16, 2016

http://experience-aem.blogspot.com/2015/10/aem-61-touchui-rich-text-editor-color-picker-plugin.html

This article has been suggested several times, but refers to adding the color picker to the RTE. What about dialogs. The documented settings don't seem to have any effect. 

How do we use freestylePaletteType? 

https://docs.adobe.com/docs/en/aem/6-0/develop/ref/granite-ui/api/jcr_root/libs/granite/ui/components/foundation/form/colorpicker/index.html?highlight=colorpicker