Use a color picker for the color field (color enum picker) (#346)

libs/color-sensor/color.ts

@@ -19,21 +19,21 @@ enum LightIntensityMode {
 }
 
 const enum ColorSensorColor {
-    //% block="none" jres=colors.none blockIdentity=sensors.color
+    //% block="none" blockIdentity=sensors.__colorEnumPicker
     None,
-    //% block="black" jres=colors.black blockIdentity=sensors.color
+    //% block="black" blockIdentity=sensors.__colorEnumPicker
     Black,
-    //% block="blue" jres=colors.blue blockIdentity=sensors.color
+    //% block="blue" blockIdentity=sensors.__colorEnumPicker
     Blue,
-    //% block="green" jres=colors.green blockIdentity=sensors.color
+    //% block="green" blockIdentity=sensors.__colorEnumPicker
     Green,
-    //% block="yellow" jres=colors.yellow blockIdentity=sensors.color
+    //% block="yellow" blockIdentity=sensors.__colorEnumPicker
     Yellow,
-    //% block="red" jres=colors.red blockIdentity=sensors.color
+    //% block="red" blockIdentity=sensors.__colorEnumPicker
     Red,
-    //% block="white" jres=colors.white blockIdentity=sensors.color
+    //% block="white" blockIdentity=sensors.__colorEnumPicker
     White,
-    //% block="brown" jres=colors.brown blockIdentity=sensors.color
+    //% block="brown" blockIdentity=sensors.__colorEnumPicker
     Brown
 }
 
@@ -110,19 +110,14 @@ namespace sensors {
          * @param handler the code to run when detected
          */
         //% help=sensors/color-sensor/on-color-detected
-        //% block="on **color** %this|detected color %color"
+        //% block="on **color** %this|detected color %color=colorEnumPicker"
         //% blockId=colorOnColorDetected
         //% parts="colorsensor"
         //% blockNamespace=sensors
         //% this.fieldEditor="ports"
         //% weight=100 blockGap=12
         //% group="Color Sensor"
-        //% color.fieldEditor="gridpicker"
-        //% color.fieldOptions.columns=4
-        //% color.fieldOptions.tooltips=true
-        //% color.fieldOptions.hideRect=true
-        //% color.fieldOptions.width=268
-        onColorDetected(color: ColorSensorColor, handler: () => void) {
+        onColorDetected(color: number, handler: () => void) {
             this.setMode(ColorSensorMode.Color)
             const v = this._colorEventValue(<number>color);
             control.onEvent(this._id, v, handler);
@@ -135,19 +130,14 @@ namespace sensors {
          * @param color the color to detect
          */
         //% help=sensors/color-sensor/pause-for-color
-        //% block="pause **color** %this|for color %color"
+        //% block="pause **color** %this|for color %color=colorEnumPicker"
         //% blockId=colorPauseForColorDetected
         //% parts="colorsensor"
         //% blockNamespace=sensors
         //% this.fieldEditor="ports"
         //% weight=99 blockGap=8
         //% group="Color Sensor"
-        //% color.fieldEditor="gridpicker"
-        //% color.fieldOptions.columns=4
-        //% color.fieldOptions.tooltips=true
-        //% color.fieldOptions.hideRect=true
-        //% color.fieldOptions.width=268
-        pauseForColor(color: ColorSensorColor) {
+        pauseForColor(color: number) {
             this.setMode(ColorSensorMode.Color);
             if (this.color() != color) {
                 const v = this._colorEventValue(<number>color);
@@ -319,16 +309,11 @@ namespace sensors {
      * @param color the color sensed by the sensor, eg: ColorSensorColor.Red
      */
     //% shim=TD_ID
-    //% blockId=colorSensorColor block="color %color"
+    //% blockId=colorSensorColor block="color %color=colorEnumPicker"
     //% group="Color Sensor"
     //% weight=97
     //% help=sensors/color
-    //% color.fieldEditor="gridpicker"
-    //% color.fieldOptions.columns=4
-    //% color.fieldOptions.tooltips=true
-    //% color.fieldOptions.hideRect=true
-    //% color.fieldOptions.width=268
-    export function color(color: ColorSensorColor): ColorSensorColor {
+    export function color(color: number): ColorSensorColor {
         return color;
     }
 

libs/color-sensor/ns.ts

@@ -0,0 +1,17 @@
+
+
+namespace sensors {
+
+    /**
+     * A color enum picker
+     * @param color to use, eg: ColorSensorColor.Blue
+     */
+    //% blockId=colorEnumPicker block="%color" shim=TD_ID
+    //% weight=0 blockHidden=1 turnRatio.fieldOptions.decompileLiterals=1
+    //% color.fieldEditor="colorenum"
+    //% color.fieldOptions.colours='["#f12a21", "#ffd01b", "#006db3", "#00934b", "#ffffff", "#6c2d00", "#000000"]'
+    //% color.fieldOptions.columns=2 color.fieldOptions.className='legoColorPicker'
+    export function __colorEnumPicker(color: ColorSensorColor): number {
+        return color;
+    }
+}

libs/color-sensor/pxt.json

@@ -4,7 +4,8 @@
     "files": [
         "README.md",
         "colors.jres",
-        "color.ts"
+        "color.ts",
+        "ns.ts"
     ],
     "testFiles": [
         "test.ts"