bgColor and fgColor are now just constants

This commit is contained in:
Vojtěch Fošnár 2023-02-19 15:54:17 +01:00
parent a3173a5bca
commit 732f5c241f
No known key found for this signature in database
GPG key ID: 657727E71C40859A
3 changed files with 34 additions and 31 deletions

View file

@ -39,6 +39,11 @@ seed: 1,`
var floatRE = regexp.MustCompile(`(\d+)\.(\d+)`) var floatRE = regexp.MustCompile(`(\d+)\.(\d+)`)
const (
BG_COLOR = color.N7
FG_COLOR = color.N1
)
func (r *Runner) run(js string) (goja.Value, error) { func (r *Runner) run(js string) (goja.Value, error) {
vm := (*goja.Runtime)(r) vm := (*goja.Runtime)(r)
return vm.RunString(js) return vm.RunString(js)
@ -681,7 +686,7 @@ func extractPathData(roughPaths []roughPath) ([]string, error) {
return paths, nil return paths, nil
} }
func ArrowheadJS(r *Runner, bgColor string, arrowhead d2target.Arrowhead, stroke string, strokeWidth int) (arrowJS, extraJS string) { func ArrowheadJS(r *Runner, arrowhead d2target.Arrowhead, stroke string, strokeWidth int) (arrowJS, extraJS string) {
// Note: selected each seed that looks the good for consistent renders // Note: selected each seed that looks the good for consistent renders
switch arrowhead { switch arrowhead {
case d2target.ArrowArrowhead: case d2target.ArrowArrowhead:
@ -705,7 +710,7 @@ func ArrowheadJS(r *Runner, bgColor string, arrowhead d2target.Arrowhead, stroke
`[[-20, 0], [-10, 5], [0, 0], [-10, -5], [-20, 0]]`, `[[-20, 0], [-10, 5], [0, 0], [-10, -5], [-20, 0]]`,
strokeWidth, strokeWidth,
stroke, stroke,
bgColor, BG_COLOR,
) )
case d2target.FilledDiamondArrowhead: case d2target.FilledDiamondArrowhead:
arrowJS = fmt.Sprintf( arrowJS = fmt.Sprintf(
@ -736,7 +741,7 @@ func ArrowheadJS(r *Runner, bgColor string, arrowhead d2target.Arrowhead, stroke
`node = rc.circle(-20, 0, 8, { strokeWidth: %d, stroke: "%s", fill: "%s", fillStyle: "solid", fillWeight: 1, seed: 4 })`, `node = rc.circle(-20, 0, 8, { strokeWidth: %d, stroke: "%s", fill: "%s", fillStyle: "solid", fillWeight: 1, seed: 4 })`,
strokeWidth, strokeWidth,
stroke, stroke,
bgColor, BG_COLOR,
) )
case d2target.CfOneRequired: case d2target.CfOneRequired:
arrowJS = fmt.Sprintf( arrowJS = fmt.Sprintf(
@ -758,17 +763,17 @@ func ArrowheadJS(r *Runner, bgColor string, arrowhead d2target.Arrowhead, stroke
`node = rc.circle(-20, 0, 8, { strokeWidth: %d, stroke: "%s", fill: "%s", fillStyle: "solid", fillWeight: 1, seed: 5 })`, `node = rc.circle(-20, 0, 8, { strokeWidth: %d, stroke: "%s", fill: "%s", fillStyle: "solid", fillWeight: 1, seed: 5 })`,
strokeWidth, strokeWidth,
stroke, stroke,
bgColor, BG_COLOR,
) )
} }
return return
} }
func Arrowheads(r *Runner, bgColor string, connection d2target.Connection, srcAdj, dstAdj *geo.Point) (string, error) { func Arrowheads(r *Runner, connection d2target.Connection, srcAdj, dstAdj *geo.Point) (string, error) {
arrowPaths := []string{} arrowPaths := []string{}
if connection.SrcArrow != d2target.NoArrowhead { if connection.SrcArrow != d2target.NoArrowhead {
arrowJS, extraJS := ArrowheadJS(r, bgColor, connection.SrcArrow, connection.Stroke, connection.StrokeWidth) arrowJS, extraJS := ArrowheadJS(r, connection.SrcArrow, connection.Stroke, connection.StrokeWidth)
if arrowJS == "" { if arrowJS == "" {
return "", nil return "", nil
} }
@ -806,7 +811,7 @@ func Arrowheads(r *Runner, bgColor string, connection d2target.Connection, srcAd
} }
if connection.DstArrow != d2target.NoArrowhead { if connection.DstArrow != d2target.NoArrowhead {
arrowJS, extraJS := ArrowheadJS(r, bgColor, connection.DstArrow, connection.Stroke, connection.StrokeWidth) arrowJS, extraJS := ArrowheadJS(r, connection.DstArrow, connection.Stroke, connection.StrokeWidth)
if arrowJS == "" { if arrowJS == "" {
return "", nil return "", nil
} }

View file

@ -42,6 +42,9 @@ const (
MIN_ARROWHEAD_STROKE_WIDTH = 2 MIN_ARROWHEAD_STROKE_WIDTH = 2
appendixIconRadius = 16 appendixIconRadius = 16
BG_COLOR = color.N7
FG_COLOR = color.N1
) )
var multipleOffset = geo.NewVector(d2target.MULTIPLE_OFFSET, -d2target.MULTIPLE_OFFSET) var multipleOffset = geo.NewVector(d2target.MULTIPLE_OFFSET, -d2target.MULTIPLE_OFFSET)
@ -119,7 +122,7 @@ func arrowheadDimensions(arrowhead d2target.Arrowhead, strokeWidth float64) (wid
return clippedStrokeWidth * widthMultiplier, clippedStrokeWidth * heightMultiplier return clippedStrokeWidth * widthMultiplier, clippedStrokeWidth * heightMultiplier
} }
func arrowheadMarker(isTarget bool, id string, bgColor string, connection d2target.Connection) string { func arrowheadMarker(isTarget bool, id string, connection d2target.Connection) string {
arrowhead := connection.DstArrow arrowhead := connection.DstArrow
if !isTarget { if !isTarget {
arrowhead = connection.SrcArrow arrowhead = connection.SrcArrow
@ -217,7 +220,7 @@ func arrowheadMarker(isTarget bool, id string, bgColor string, connection d2targ
case d2target.DiamondArrowhead: case d2target.DiamondArrowhead:
polygonEl := d2themes.NewThemableElement("polygon") polygonEl := d2themes.NewThemableElement("polygon")
polygonEl.ClassName = "connection" polygonEl.ClassName = "connection"
polygonEl.Fill = bgColor polygonEl.Fill = BG_COLOR
polygonEl.Stroke = connection.Stroke polygonEl.Stroke = connection.Stroke
polygonEl.Attributes = fmt.Sprintf(`stroke-width="%d"`, connection.StrokeWidth) polygonEl.Attributes = fmt.Sprintf(`stroke-width="%d"`, connection.StrokeWidth)
@ -260,7 +263,7 @@ func arrowheadMarker(isTarget bool, id string, bgColor string, connection d2targ
circleEl := d2themes.NewThemableElement("circle") circleEl := d2themes.NewThemableElement("circle")
circleEl.Cy = radius circleEl.Cy = radius
circleEl.R = radius - strokeWidth circleEl.R = radius - strokeWidth
circleEl.Fill = bgColor circleEl.Fill = BG_COLOR
circleEl.Stroke = connection.Stroke circleEl.Stroke = connection.Stroke
circleEl.Attributes = fmt.Sprintf(`stroke-width="%d"`, connection.StrokeWidth) circleEl.Attributes = fmt.Sprintf(`stroke-width="%d"`, connection.StrokeWidth)
@ -281,7 +284,7 @@ func arrowheadMarker(isTarget bool, id string, bgColor string, connection d2targ
offset, 0., offset, 0.,
offset, height, offset, height,
) )
modifierEl.Fill = bgColor modifierEl.Fill = BG_COLOR
modifierEl.Stroke = connection.Stroke modifierEl.Stroke = connection.Stroke
modifierEl.ClassName = "connection" modifierEl.ClassName = "connection"
modifierEl.Attributes = fmt.Sprintf(`stroke-width="%d"`, connection.StrokeWidth) modifierEl.Attributes = fmt.Sprintf(`stroke-width="%d"`, connection.StrokeWidth)
@ -290,7 +293,7 @@ func arrowheadMarker(isTarget bool, id string, bgColor string, connection d2targ
modifierEl.Cx = offset/2.0 + 2.0 modifierEl.Cx = offset/2.0 + 2.0
modifierEl.Cy = height / 2.0 modifierEl.Cy = height / 2.0
modifierEl.R = offset / 2.0 modifierEl.R = offset / 2.0
modifierEl.Fill = bgColor modifierEl.Fill = BG_COLOR
modifierEl.Stroke = connection.Stroke modifierEl.Stroke = connection.Stroke
modifierEl.ClassName = "connection" modifierEl.ClassName = "connection"
modifierEl.Attributes = fmt.Sprintf(`stroke-width="%d"`, connection.StrokeWidth) modifierEl.Attributes = fmt.Sprintf(`stroke-width="%d"`, connection.StrokeWidth)
@ -319,7 +322,7 @@ func arrowheadMarker(isTarget bool, id string, bgColor string, connection d2targ
if !isTarget { if !isTarget {
gEl.Transform = fmt.Sprintf("scale(-1) translate(-%f, -%f)", width, height) gEl.Transform = fmt.Sprintf("scale(-1) translate(-%f, -%f)", width, height)
} }
gEl.Fill = bgColor gEl.Fill = BG_COLOR
gEl.Stroke = connection.Stroke gEl.Stroke = connection.Stroke
gEl.ClassName = "connection" gEl.ClassName = "connection"
gEl.Attributes = fmt.Sprintf(`stroke-width="%d"`, connection.StrokeWidth) gEl.Attributes = fmt.Sprintf(`stroke-width="%d"`, connection.StrokeWidth)
@ -475,7 +478,7 @@ func makeLabelMask(labelTL *geo.Point, width, height int) string {
) )
} }
func drawConnection(writer io.Writer, bgColor string, fgColor string, labelMaskID string, connection d2target.Connection, markers map[string]struct{}, idToShape map[string]d2target.Shape, sketchRunner *d2sketch.Runner) (labelMask string, _ error) { func drawConnection(writer io.Writer, labelMaskID string, connection d2target.Connection, markers map[string]struct{}, idToShape map[string]d2target.Shape, sketchRunner *d2sketch.Runner) (labelMask string, _ error) {
opacityStyle := "" opacityStyle := ""
if connection.Opacity != 1.0 { if connection.Opacity != 1.0 {
opacityStyle = fmt.Sprintf(" style='opacity:%f'", connection.Opacity) opacityStyle = fmt.Sprintf(" style='opacity:%f'", connection.Opacity)
@ -485,7 +488,7 @@ func drawConnection(writer io.Writer, bgColor string, fgColor string, labelMaskI
if connection.SrcArrow != d2target.NoArrowhead { if connection.SrcArrow != d2target.NoArrowhead {
id := arrowheadMarkerID(false, connection) id := arrowheadMarkerID(false, connection)
if _, in := markers[id]; !in { if _, in := markers[id]; !in {
marker := arrowheadMarker(false, id, bgColor, connection) marker := arrowheadMarker(false, id, connection)
if marker == "" { if marker == "" {
panic(fmt.Sprintf("received empty arrow head marker for: %#v", connection)) panic(fmt.Sprintf("received empty arrow head marker for: %#v", connection))
} }
@ -499,7 +502,7 @@ func drawConnection(writer io.Writer, bgColor string, fgColor string, labelMaskI
if connection.DstArrow != d2target.NoArrowhead { if connection.DstArrow != d2target.NoArrowhead {
id := arrowheadMarkerID(true, connection) id := arrowheadMarkerID(true, connection)
if _, in := markers[id]; !in { if _, in := markers[id]; !in {
marker := arrowheadMarker(true, id, bgColor, connection) marker := arrowheadMarker(true, id, connection)
if marker == "" { if marker == "" {
panic(fmt.Sprintf("received empty arrow head marker for: %#v", connection)) panic(fmt.Sprintf("received empty arrow head marker for: %#v", connection))
} }
@ -531,7 +534,7 @@ func drawConnection(writer io.Writer, bgColor string, fgColor string, labelMaskI
fmt.Fprint(writer, out) fmt.Fprint(writer, out)
// render sketch arrowheads separately // render sketch arrowheads separately
arrowPaths, err := d2sketch.Arrowheads(sketchRunner, bgColor, connection, srcAdj, dstAdj) arrowPaths, err := d2sketch.Arrowheads(sketchRunner, connection, srcAdj, dstAdj)
if err != nil { if err != nil {
return "", err return "", err
} }
@ -590,7 +593,7 @@ func drawConnection(writer io.Writer, bgColor string, fgColor string, labelMaskI
if length > 0 { if length > 0 {
position = size / length position = size / length
} }
fmt.Fprint(writer, renderArrowheadLabel(fgColor, connection, connection.SrcLabel, position, size, size)) fmt.Fprint(writer, renderArrowheadLabel(connection, connection.SrcLabel, position, size, size))
} }
if connection.DstLabel != "" { if connection.DstLabel != "" {
// TODO use arrowhead label dimensions https://github.com/terrastruct/d2/issues/183 // TODO use arrowhead label dimensions https://github.com/terrastruct/d2/issues/183
@ -599,19 +602,19 @@ func drawConnection(writer io.Writer, bgColor string, fgColor string, labelMaskI
if length > 0 { if length > 0 {
position -= size / length position -= size / length
} }
fmt.Fprint(writer, renderArrowheadLabel(fgColor, connection, connection.DstLabel, position, size, size)) fmt.Fprint(writer, renderArrowheadLabel(connection, connection.DstLabel, position, size, size))
} }
fmt.Fprintf(writer, `</g>`) fmt.Fprintf(writer, `</g>`)
return return
} }
func renderArrowheadLabel(fgColor string, connection d2target.Connection, text string, position, width, height float64) string { func renderArrowheadLabel(connection d2target.Connection, text string, position, width, height float64) string {
labelTL := label.UnlockedTop.GetPointOnRoute(connection.Route, float64(connection.StrokeWidth), position, width, height) labelTL := label.UnlockedTop.GetPointOnRoute(connection.Route, float64(connection.StrokeWidth), position, width, height)
textEl := d2themes.NewThemableElement("text") textEl := d2themes.NewThemableElement("text")
textEl.X = labelTL.X + width/2 textEl.X = labelTL.X + width/2
textEl.Y = labelTL.Y + float64(connection.FontSize) textEl.Y = labelTL.Y + float64(connection.FontSize)
textEl.Fill = fgColor textEl.Fill = FG_COLOR
textEl.ClassName = "text-italic" textEl.ClassName = "text-italic"
textEl.Style = fmt.Sprintf("text-anchor:%s;font-size:%vpx", "middle", connection.FontSize) textEl.Style = fmt.Sprintf("text-anchor:%s;font-size:%vpx", "middle", connection.FontSize)
textEl.Content = RenderText(text, textEl.X, height) textEl.Content = RenderText(text, textEl.X, height)
@ -1449,12 +1452,7 @@ func appendOnTrigger(buf *bytes.Buffer, source string, triggers []string, newCon
//go:embed fitToScreen.js //go:embed fitToScreen.js
var fitToScreenScript string var fitToScreenScript string
const ( const DEFAULT_THEME int64 = 0
BG_COLOR = color.N7
FG_COLOR = color.N1
DEFAULT_THEME int64 = 0
)
var DEFAULT_DARK_THEME *int64 = nil // no theme selected var DEFAULT_DARK_THEME *int64 = nil // no theme selected
@ -1512,7 +1510,7 @@ func Render(diagram *d2target.Diagram, opts *RenderOpts) ([]byte, error) {
markers := map[string]struct{}{} markers := map[string]struct{}{}
for _, obj := range allObjects { for _, obj := range allObjects {
if c, is := obj.(d2target.Connection); is { if c, is := obj.(d2target.Connection); is {
labelMask, err := drawConnection(buf, BG_COLOR, FG_COLOR, labelMaskID, c, markers, idToShape, sketchRunner) labelMask, err := drawConnection(buf, labelMaskID, c, markers, idToShape, sketchRunner)
if err != nil { if err != nil {
return nil, err return nil, err
} }
@ -1551,7 +1549,7 @@ func Render(diagram *d2target.Diagram, opts *RenderOpts) ([]byte, error) {
backgroundEl.Y = float64(top) backgroundEl.Y = float64(top)
backgroundEl.Width = float64(w) backgroundEl.Width = float64(w)
backgroundEl.Height = float64(h) backgroundEl.Height = float64(h)
backgroundEl.Fill = color.N7 backgroundEl.Fill = BG_COLOR
// generate elements that will be appended to the SVG tag // generate elements that will be appended to the SVG tag
upperBuf := &bytes.Buffer{} upperBuf := &bytes.Buffer{}

View file

@ -112,13 +112,13 @@ func Luminance(colorString string) (float64, error) {
} }
const ( const (
N1 = "N1" N1 = "N1" // foreground color
N2 = "N2" N2 = "N2"
N3 = "N3" N3 = "N3"
N4 = "N4" N4 = "N4"
N5 = "N5" N5 = "N5"
N6 = "N6" N6 = "N6"
N7 = "N7" N7 = "N7" // background color
// Base Colors: used for containers // Base Colors: used for containers
B1 = "B1" B1 = "B1"