

// MARK: - hue contants

var themeHue = 45


// MARK: - general color funcs

function colorHSBA(hue, saturation, brightness, alpha)
{
	return {
		"+": "BaseColor",
		gxHue: hue,
		gxSaturation: saturation,
		gxBrightness: brightness,
		gxAlpha: alpha,
	};
}

function colorMono(brightness, alpha)
{
	return {
		"+": "BaseColor",
		gxHue: 0,	// red, but it has to be some color ;)
		gxSaturation: 0,
		gxBrightness: brightness,
		gxAlpha: alpha,
	};
}

//  change alpha in a color dictionary
Object.defineProperty( Object.prototype, "withAlpha",
{ enumerable: false,
  value: function(alpha)
          {
              var result = Object.create(this);
              result.gxAlpha = alpha;
              return result;
          }
});


// MARK: - light/dark color funcs

function mainColorFunc(lightBrightness, darkBrightness)
{
    return {
        "+": "BaseColor",
        gxHue: 0,
        gxAlpha: 100,
        gxSaturation: 0,
        gxBrightness: darkBrightness,
        lightMode:
        {
            gxBrightness: lightBrightness,
        },
    };
}

function themeColorFunc(lightBrightness, darkBrightness)
{
    return {
        "+": "BaseColor",
        gxHue: themeHue,
        gxAlpha: 100,
        gxSaturation: 68,
        gxBrightness: darkBrightness,
        lightMode:
        {
            //gxSaturation: 74,
            gxBrightness: lightBrightness,
        },
    };
}

function themePaleColorFunc(lightBrightness, darkBrightness)
{
	return {
		"+": "BaseColor",
		gxHue: themeHue,
		gxAlpha: 100,
		gxSaturation: 39,
		gxBrightness: darkBrightness,
		lightMode:
		{
			//gxSaturation: 74,
			gxBrightness: lightBrightness,
		},
	}
}

function themeForeColorFunc(lightBrightness, darkBrightness)
{
    return {
        "+": "BaseColor",
        gxHue: themeHue,
        gxAlpha: 100,
        gxSaturation: (100 - darkBrightness) * 4,
        gxBrightness: darkBrightness,
        lightMode:
        {
            gxSaturation: (100 - lightBrightness) * 4,
            gxBrightness: lightBrightness,
        },
    };
}

function themeColorCombineFunc(lightColor, darkColor)
{
    return {
        "+": "BaseColor",
        gxHue: darkColor.gxHue,
        gxAlpha: darkColor.gxAlpha,
        gxSaturation: darkColor.gxSaturation,
        gxBrightness: darkColor.gxBrightness,
        lightMode: lightColor,
    };
}

function selectionColorFunc(lightBrightness, darkBrightness)
{
	return {
		"+": "BaseColor",
		gxHue: themeHue,
		gxAlpha: 100,
		gxSaturation: 39,
		gxBrightness: darkBrightness,
		lightMode:
		{
			//gxSaturation: 100 - lightBrightness / 2,
			gxBrightness: lightBrightness,
		},
	};
}

function listSelectionColorFunc(lightBrightness, darkBrightness)
{
    lightBrightness = lightBrightness || 95;
    darkBrightness = darkBrightness || 37;

	return {
		"+": "BaseColor",
		gxHue: themeHue,
		gxAlpha: 100,
		gxSaturation: 76,
		gxBrightness: darkBrightness,
		lightMode:
		{
			gxSaturation: 25,
			gxBrightness: lightBrightness,
		},
	};
}

Object.defineProperty( Object.prototype, "darken",
	{ enumerable: false,
	  value: function(percentDarker)	// expect 0 to 100, negative will lighten
			  {
				  var result = Object.create(this);

				  var factor = percentDarker/100.0
				  result.gxBrightness *= 1.0 - factor;
				  result.gxSaturation *= 1.0 + factor/5.0;

				  return result;
			  }
	});

Object.defineProperty( Object.prototype, "withSaturation",
	{ enumerable: false,
	  value: function(saturation)	// expect 0 to 100
			  {
				  var result = Object.create(this);
				  result.gxSaturation = saturation;
				  return result;
			  }
	});

Object.defineProperty( Object.prototype, "withPressed",
	{ enumerable: false,
	  value: function(pressedValue)
			  {
				  var result = Object.create(this);
				  result.gxPressedEffect = pressedValue || 10;
				  return result;
			  }
	});



markup.push({

    // MARK: - base color

    BaseColor: {
        nsClass: "GXColor",
        noPressed: {
            lightMode: { pressed: {} },
            darkMode:  { pressed: {} }
        },
        pressed: {
            gxPressedEffect: 15,
            lightMode: { gxPressedEffect: 15 },
            darkMode: { gxPressedEffect: 15 }
        },
        disabled: {
            lightMode: {
                gxAlpha: 50,
                pressed: { gxPressedEffect: 0 },
            },
            darkMode: {
                gxAlpha: 50,
                pressed: { gxPressedEffect: 0 },
            },
        },
        noLightMode: {
            lightMode: {}
        },
        withHover: {
            hover: {
                gxPressedEffect: 8,
                lightMode: { gxPressedEffect: 8 },
                darkMode: { gxPressedEffect: 8 }
            },
        },
        withOn: {
            on: {
                gxBrightness: 0,
                lightMode: { gxBrightness: 0 },
                darkMode: { gxBrightness: 0 }
            },
        },
        noDisabled: {
            disabled: {}
        },
        dimmed: {
            lightMode: { gxAlpha: 70 },
            darkMode:  { gxAlpha: 70 }
        }, 
        alphaBg: {
            gxAlpha: 10,
            lightMode: { gxAlpha: 10 },
            darkMode:  { gxAlpha: 10 }
        },
        alpha0: {
            gxAlpha: 0,
            lightMode: { gxAlpha: 0 },
            darkMode:  { gxAlpha: 0 }
        },
        alphaBg20: {
            gxAlpha: 20,
            lightMode: { gxAlpha: 20 },
            darkMode:  { gxAlpha: 20 }
        },
        alphaBg30: {
            gxAlpha: 30,
            lightMode: { gxAlpha: 30 },
            darkMode:  { gxAlpha: 30 }
        },
        blockDisabled:  {
            gxDesaturate: 70,
            gxFadeTo: { gxFadePercent: 30, gxBrightness: 40 },
            lightMode: {
                gxDesaturate: 70,
                gxFadeTo: { gxFadePercent: 30, gxBrightness: 40 }
            },
            darkMode: {
                gxDesaturate: 70,
                gxFadeTo: { gxFadePercent: 30, gxBrightness: 40 }
            }
        },
        noBlockDisabled: {
            blockDisabled: {} // swap blockDisabled for nothing
        },
        desaturate: {
            gxDesaturate: 90,
            lightMode: { gxDesaturate: 90 },
            darkMode: { gxDesaturate: 90 }
        },
    },

	// for uncolored labels etc
    ForeColor1: mainColorFunc(20, 100), // control titles etc
    ForeColor2: mainColorFunc(52, 72),  // labels etc
	ForeColor3: mainColorFunc(62, 62),  // labels etc

    // for uncolored backgrounds etc
    BackColor1: mainColorFunc(100, 18.5),  // main graph back etc
    BackColor2: mainColorFunc(85, 13.3),  // groups etc
    BackColor3: mainColorFunc(91, 24),   // controls, features etc

	// 'sidebar' is now a lie, used for more than that
    SidebarBackColor1: mainColorFunc(94, 18.5),
    SidebarBackColor2: mainColorFunc(100, 13.3),

	ListBackColor: mainColorFunc(89, 24),   // controls, features etc - in list items

	// theme blue background colors (sometimes not used for background).
 	ColorTheme1: themeColorFunc(76, 76),
 	ColorTheme2: themeColorFunc(69, 69),
 	ColorTheme3: themeColorFunc(46, 46),

	// very lightly tinted (or white) colors for use on theme blue backgrounds
    ForeColorTheme1: themeForeColorFunc(100, 100), // control titles etc

    TextSelectionColor: listSelectionColorFunc(90, 55), //themeColorFunc(82, 77),     // text selection etc
    
	SelectionColor2: selectionColorFunc(100, 100),  // block selection etc
	SelectionColor3: listSelectionColorFunc(), // colorHSBA(themeHue, 76, 37, 100),  // list selection

	BlackColor: colorMono(0, 100),
    WhiteColor: colorMono(100, 100),
    Invisible: colorMono(100, 100),
})
