1 Reply Latest reply: Apr 25, 2017 5:25 AM by Johann Bauer RSS

    [Extension editor] Custom color picker properties

    Eric Hannert

      hi comm,

       

      i was trying out the color picker in my extension, but i didn't get it to work!!

      so i have a properties.js File with the properties and a css file where i want to use the selected color for background

      of a bar!!

       

      Hope someone can help!!!

       

      define( [], function ( ) {

         var palette = [

              "#b0afae",

              "#7b7a78",

              "#545352",

              "#4477aa",

              "#7db8da",

              "#b6d7ea",

              "#46c646",

              "#f93f17",

              "#ffcf02",

              "#276e27",

              "#ffffff",

              "#000000"

          ];

      return {

        

                  type : "items",

                  component : "accordion",

                  items : {

                      dimensions : {

                          uses : "dimensions",

                          min : 1,

                          max : 1

                      },

                      measures : {

                          uses : "measures",

                          min : 1,

                          max : 1

                      },

                      sorting : {

                          uses : "sorting"

                      },

                      settings : {

                          uses : "settings",

                          items: {

                                MyStringProp: {

                                      ref: "eingabe",

                                  type: "string",

                                  label: "Bitte eingeben!(TEST)"

                                },

                              MyColorPicker: {

                                  label:"Farbpalette",

                                  component: "color-picker",

                                  ref: "farbe",

                                  type: "integer",

                                  defaultValue: 5

                              }

                          }

                      }

                  }

              }

      });

       

      -----------------------------------------------------------------------------

      .chart .bar {

          float:left;

          height:32px;

          clear:right;

          background-color: palette[layout.farbe];

          border: 1px solid black;

          border-radius: 0px 9px 9px 0px;

      }

        • Re: [Extension editor] Custom color picker properties
          Johann Bauer

          Hello Eric,

          Im not sure if you allready got your problem solved, but im facing the same issue with the color picker.

          If im picking a color, i always get "undefined" as return.

           

          But when im changing the hierarchy of the Code to this:

          If I make an own tab for the Color Picker, it works!

           

          ..... 

                      type : "items",

                      component : "accordion",

                      items : {

                          dimensions : {

                              uses : "dimensions",

                              min : 1,

                              max : 1

                          },

                          measures : {

                              uses : "measures",

                              min : 1,

                              max : 1

                          },

                                  MyColorPicker: {

                                      label:"Farbpalette",

                                      component: "color-picker",

                                      ref: "farbe",

                                      type: "integer",

                                      defaultValue: 5

                                  },

                          sorting : {

                              uses : "sorting"

                          },

                          settings : {

                              uses : "settings",

                              items: {

                                    MyStringProp: {

                                          ref: "eingabe",

                                      type: "string",

                                      label: "Bitte eingeben!(TEST)"

                                    }

                              }

                          }

                      }

                  }

          });