fix: Handle Joyce Geometry Applet color specifications #33
@ -51,8 +51,9 @@ jQuery.getScript 'https://www.geogebra.org/apps/deployggb.js', =>
|
|||||||
jApp.height,
|
jApp.height,
|
||||||
appletOnLoad: (api: AppletObject) =>
|
appletOnLoad: (api: AppletObject) =>
|
||||||
elements: JoyceElements := {}
|
elements: JoyceElements := {}
|
||||||
|
backgroundRGB := [255, 255, 255] as RGB
|
||||||
for child of jApp.children
|
for child of jApp.children
|
||||||
dispatchJcommand api, child, elements
|
dispatchJcommand api, child, elements, backgroundRGB
|
||||||
api.setCoordSystem -10, 10 + jApp.width, -10, 10 + jApp.height
|
api.setCoordSystem -10, 10 + jApp.width, -10, 10 + jApp.height
|
||||||
api.setAxesVisible false, false
|
api.setAxesVisible false, false
|
||||||
api.setGridVisible false
|
api.setGridVisible false
|
||||||
@ -90,21 +91,26 @@ type XYZ = RGB
|
|||||||
// api, consulting and extending by side effect the elements that are
|
// api, consulting and extending by side effect the elements that are
|
||||||
// present in that applet
|
// present in that applet
|
||||||
function dispatchJcommand(
|
function dispatchJcommand(
|
||||||
api: AppletObject, param: Element, elements: JoyceElements): void
|
api: AppletObject,
|
||||||
|
param: Element,
|
||||||
|
elements: JoyceElements
|
||||||
|
backgroundRGB: RGB): void
|
||||||
val := param.getAttribute 'value'
|
val := param.getAttribute 'value'
|
||||||
unless val return
|
unless val return
|
||||||
attr := param.getAttribute 'name'
|
attr := param.getAttribute 'name'
|
||||||
backgroundHex .= '#FFFFFF'
|
|
||||||
switch attr
|
switch attr
|
||||||
'background'
|
'background'
|
||||||
backgroundHex = `#${val}`
|
backgroundHex := `#${val}`
|
||||||
api.setGraphicsOptions 1, bgColor: backgroundHex
|
api.setGraphicsOptions 1, bgColor: backgroundHex
|
||||||
|
newback := colorsea(backgroundHex).rgb()
|
||||||
|
for i of [0..2]
|
||||||
|
backgroundRGB[i] = newback[i]
|
||||||
'title'
|
'title'
|
||||||
api.evalCommand `TitlePoint = Corner(1,1)
|
api.evalCommand `TitlePoint = Corner(1,1)
|
||||||
Text("${val}", TitlePoint + (2,5))`
|
Text("${val}", TitlePoint + (2,5))`
|
||||||
/e\[\d+\]/
|
/e\[\d+\]/
|
||||||
num := parseInt(attr.slice(2))
|
num := parseInt(attr.slice(2))
|
||||||
{commands, callbacks, parts} := jToG val, elements, num, backgroundHex
|
{commands, callbacks, parts} := jToG val, elements, num, backgroundRGB
|
||||||
if commands.length
|
if commands.length
|
||||||
lastTried .= 0
|
lastTried .= 0
|
||||||
if commands.filter((&)).every (cmd) =>
|
if commands.filter((&)).every (cmd) =>
|
||||||
@ -129,7 +135,7 @@ function jToG(
|
|||||||
jCom: string,
|
jCom: string,
|
||||||
elements: JoyceElements,
|
elements: JoyceElements,
|
||||||
index: number,
|
index: number,
|
||||||
backgroundHex: string): Commander
|
backgroundRGB: RGB): Commander
|
||||||
[jname, klass, method, data, ...colors] := jCom.split ';'
|
[jname, klass, method, data, ...colors] := jCom.split ';'
|
||||||
cmdr .= freshCommander()
|
cmdr .= freshCommander()
|
||||||
unless klass in classHandler
|
unless klass in classHandler
|
||||||
@ -169,7 +175,7 @@ function jToG(
|
|||||||
else // we have to decorate
|
else // we have to decorate
|
||||||
dimension .= cmdr.parts.findLastIndex .includes name
|
dimension .= cmdr.parts.findLastIndex .includes name
|
||||||
cmdr.callbacks.push (api: AppletObject, parts: DimParts) =>
|
cmdr.callbacks.push (api: AppletObject, parts: DimParts) =>
|
||||||
trace := klass is 'polygon'
|
trace := false // e.g., klass is 'polygon'
|
||||||
// Operate in order faces, lines, point, caption so that
|
// Operate in order faces, lines, point, caption so that
|
||||||
// we can adjust components after setting overall color, etc.
|
// we can adjust components after setting overall color, etc.
|
||||||
|
|
||||||
@ -184,11 +190,13 @@ function jToG(
|
|||||||
console.log 'Hiding face', face if trace
|
console.log 'Hiding face', face if trace
|
||||||
api.setVisible face, false
|
api.setVisible face, false
|
||||||
else
|
else
|
||||||
faceRGB := joyce2rgb(colors[3] or 'brighter', backgroundHex)
|
faceRGB := joyce2rgb(colors[3] or 'brighter', backgroundRGB)
|
||||||
|
deep := ['circle', 'polygon', 'sector']
|
||||||
|
filling := deep.includes(klass) ? 0.7 : 0.2
|
||||||
for each face of parts[2]
|
for each face of parts[2]
|
||||||
console.log 'Coloring face', face, 'to', colors[3] if trace
|
console.log 'Coloring face', face, 'to', colors[3] if trace
|
||||||
api.setVisible face, true
|
api.setVisible face, true
|
||||||
api.setFilling face, 0.3
|
api.setFilling face, filling
|
||||||
api.setColor face, ...faceRGB
|
api.setColor face, ...faceRGB
|
||||||
|
|
||||||
// Lines default to black:
|
// Lines default to black:
|
||||||
@ -198,8 +206,7 @@ function jToG(
|
|||||||
console.log 'Hiding line', line if trace
|
console.log 'Hiding line', line if trace
|
||||||
api.setVisible line, false
|
api.setVisible line, false
|
||||||
else
|
else
|
||||||
black: RGB := [0, 0, 0]
|
lineRGB := joyce2rgb(colors[2] or 'black', backgroundRGB)
|
||||||
lineRGB := colors[2] ? joyce2rgb colors[2], backgroundHex : black
|
|
||||||
for each line of parts[1]
|
for each line of parts[1]
|
||||||
console.log 'Coloring line', line, 'to', colors[2] if trace
|
console.log 'Coloring line', line, 'to', colors[2] if trace
|
||||||
api.setVisible line, true
|
api.setVisible line, true
|
||||||
@ -214,7 +221,7 @@ function jToG(
|
|||||||
console.log 'Hiding point', point if trace
|
console.log 'Hiding point', point if trace
|
||||||
api.setVisible point, false
|
api.setVisible point, false
|
||||||
else if dimension is 0 or colors[1] // Need to color the points
|
else if dimension is 0 or colors[1] // Need to color the points
|
||||||
ptRGB := colors[1] ? joyce2rgb colors[1], backgroundHex
|
ptRGB := colors[1] ? joyce2rgb colors[1], backgroundRGB
|
||||||
: pointDefaultRGB name, method
|
: pointDefaultRGB name, method
|
||||||
for each point of parts[0]
|
for each point of parts[0]
|
||||||
console.log 'Coloring point', point, 'to', colors[1] if trace
|
console.log 'Coloring point', point, 'to', colors[1] if trace
|
||||||
@ -251,7 +258,7 @@ function jToG(
|
|||||||
unless parts[0].includes ex2 then ex2 = `Centroid(${ex2})`
|
unless parts[0].includes ex2 then ex2 = `Centroid(${ex2})`
|
||||||
`(4*${ex1}+${ex2})/5`
|
`(4*${ex1}+${ex2})/5`
|
||||||
api.evalCommand `${textName} = Text("${jname}", ${locationExpr})`
|
api.evalCommand `${textName} = Text("${jname}", ${locationExpr})`
|
||||||
api.setColor textName, ...joyce2rgb colors[0], backgroundHex
|
api.setColor textName, ...joyce2rgb colors[0], backgroundRGB
|
||||||
// and hide the underlying GeoGebra label
|
// and hide the underlying GeoGebra label
|
||||||
api.setLabelVisible name, false
|
api.setLabelVisible name, false
|
||||||
else if colors[0]
|
else if colors[0]
|
||||||
@ -267,7 +274,6 @@ function jToG(
|
|||||||
api.setLabelVisible name, show
|
api.setLabelVisible name, show
|
||||||
|
|
||||||
// window[hideListener] = (arg) =>
|
// window[hideListener] = (arg) =>
|
||||||
// console.log('Hello', arg, 'disappearing', name)
|
|
||||||
// api.setVisible name, false
|
// api.setVisible name, false
|
||||||
// api.registerObjectUpdateListener name, hideListener
|
// api.registerObjectUpdateListener name, hideListener
|
||||||
if cmdr.ends // line or sector
|
if cmdr.ends // line or sector
|
||||||
@ -283,22 +289,51 @@ function jToG(
|
|||||||
function invisible(cname: string): boolean
|
function invisible(cname: string): boolean
|
||||||
cname is '0' or cname is 'none'
|
cname is '0' or cname is 'none'
|
||||||
|
|
||||||
function joyce2rgb(cname: string, backgroundHex: string): RGB
|
function joyce2rgb(cname: string, backgroundRGB?: RGB): RGB
|
||||||
|
whiteRGB: RGB := [255, 255, 255]
|
||||||
|
bg: RGB := backgroundRGB or whiteRGB
|
||||||
switch cname
|
switch cname
|
||||||
|
// RGB values from Duck Duck Go search on "[COLOR] rgb"
|
||||||
/black/i
|
/black/i
|
||||||
[0,0,0]
|
[0,0,0]
|
||||||
|
/blue/i
|
||||||
|
[0,0,255]
|
||||||
/cyan/i
|
/cyan/i
|
||||||
[0,255,255]
|
[0,255,255]
|
||||||
|
/darkgray/i
|
||||||
|
[128,128,128]
|
||||||
|
/^gray/i
|
||||||
|
[169,169,169]
|
||||||
|
/green/i
|
||||||
|
[0,255,0]
|
||||||
/lightgray/i
|
/lightgray/i
|
||||||
[211,211,211]
|
[211,211,211]
|
||||||
|
/magenta/i
|
||||||
|
[255,0,255]
|
||||||
|
/orange/i
|
||||||
|
[255,165,0]
|
||||||
/pink/i
|
/pink/i
|
||||||
[255,192,203]
|
[255,192,203]
|
||||||
/red/i
|
/red/i
|
||||||
[255,0,0]
|
[255,0,0]
|
||||||
|
/white/i
|
||||||
|
[255,255,255]
|
||||||
|
/yellow/i
|
||||||
|
[255,255,0]
|
||||||
|
/random/i
|
||||||
|
colorsea.random().lighten(40).rgb()
|
||||||
|
/background/i
|
||||||
|
bg
|
||||||
/brighter/i
|
/brighter/i
|
||||||
colorsea(backgroundHex).lighten(20).rgb()
|
colorsea(bg).lighten(30).rgb()
|
||||||
/darker/i
|
/darker/i
|
||||||
colorsea(backgroundHex).darken(20).rgb()
|
colorsea(bg).darken(20).rgb()
|
||||||
|
/^[0-9A-F]{6}$/i
|
||||||
|
colorsea(`#${cname}`).rgb()
|
||||||
|
/^\d+,\d+,\d+$/
|
||||||
|
// HSB specification
|
||||||
|
[H,S,B] := cname.split(',').map (s) => parseInt s
|
||||||
|
colorsea.hsv(H, S, B).rgb()
|
||||||
else
|
else
|
||||||
console.log 'Could not parse color:', cname
|
console.log 'Could not parse color:', cname
|
||||||
[128, 128, 128]
|
[128, 128, 128]
|
||||||
@ -306,11 +341,11 @@ function joyce2rgb(cname: string, backgroundHex: string): RGB
|
|||||||
function pointDefaultRGB(name: string, method: string): RGB
|
function pointDefaultRGB(name: string, method: string): RGB
|
||||||
// Need to short-circuit with green for pivot point, once that is implemented
|
// Need to short-circuit with green for pivot point, once that is implemented
|
||||||
switch method
|
switch method
|
||||||
'free'
|
'free'
|
||||||
[255, 0, 0]
|
joyce2rgb 'red'
|
||||||
/.*[Ss]lider$/
|
/.*[Ss]lider$/
|
||||||
[255, 165, 0]
|
joyce2rgb 'orange'
|
||||||
else [0,0,0]
|
else joyce2rgb 'black'
|
||||||
|
|
||||||
function geoname(jname: JoyceName, elements: JoyceElements): GeoName
|
function geoname(jname: JoyceName, elements: JoyceElements): GeoName
|
||||||
numCode .= 0n
|
numCode .= 0n
|
||||||
|
Loading…
Reference in New Issue
Block a user