diff --git a/routes/room_page_templates_preview.go b/routes/room_page_templates_preview.go index d719bfe..c0fabec 100644 --- a/routes/room_page_templates_preview.go +++ b/routes/room_page_templates_preview.go @@ -62,6 +62,72 @@ func (r *roomTableData)Tangens() float64 { return math.Tan(math.Pi / float64(r.Total())) // Math.tan(Math.PI/m); } +type arrowData struct { + Height, Width int + Radius int + StartX, StartY int + EndX, EndY int + LargeArcFlag int + Angle1X, Angle1Y int + Angle2X, Angle2Y int +} + +func (r *roomTableData)ArrowData() arrowData { + // TODO take total and indexes from room data + // also figure out size to be around the people + // and this is somewhat a win + height, width := 150.0, 150.0 + centerX, centerY := height/2, width/2 + total := 5 // 0 to 4 + startSector := 1 + endSector := 5 + if endSector < startSector { + endSector += total + } + radius := 50.0 + startAngle := 90 + float64(startSector) * ( 360.0 / float64(total) ) + endAngle := 90 + float64(endSector) * ( 360.0 / float64(total) ) + startAngleRad := startAngle * (math.Pi / float64(180)) + endAngleRad := endAngle * (math.Pi / float64(180)) + // endAngle is radius angle, so perpendicular gives direction of teh arrow + + x1 := centerX + radius * math.Cos(startAngleRad) + y1 := centerY + radius * math.Sin(startAngleRad) + x2 := centerX + radius * math.Cos(endAngleRad) + y2 := centerY + radius * math.Sin(endAngleRad) + + arrowAngleOffset := math.Pi / 4 // 45 degrees + arrowPointDirection := endAngleRad - math.Pi / 2 + arrowheadLen := 10.0 + line1Angle := arrowPointDirection - arrowAngleOffset + line2Angle := arrowPointDirection + arrowAngleOffset + line1EndX := x2 + arrowheadLen * math.Cos(line1Angle) + line1EndY := y2 + arrowheadLen * math.Sin(line1Angle) + line2EndX := x2 + arrowheadLen * math.Cos(line2Angle) + line2EndY := y2 + arrowheadLen * math.Sin(line2Angle) + + // indicates that the shorter of the two possible arcs should be used. + largeArcFlag := 0 + if math.Abs(float64(endSector) - float64(startSector)) > float64(total)/2.0 { + // specifies that the longer arc should be chosen. + largeArcFlag = 1 + } + return arrowData{ + Height: int(height), + Width: int(width), + Radius: int(radius), + StartX: int(x1), + StartY: int(y1), + EndX: int(x2), + EndY: int(y2), + LargeArcFlag: largeArcFlag, + Angle1X: int(line1EndX), + Angle1Y: int(line1EndY), + Angle2X: int(line2EndX), + Angle2Y: int(line2EndY), + } +} + func personDataFromRoom(room *roomTableData, pId rooms.PersonId) personData { person, exists := room.AllKnownPeople[pId] if !exists || !slices.Contains(room.Paricipants, pId) { diff --git a/routes/static/out.css b/routes/static/out.css index 6423337..517b889 100644 --- a/routes/static/out.css +++ b/routes/static/out.css @@ -534,10 +534,22 @@ video { --tw-backdrop-sepia: ; } +.absolute { + position: absolute; +} + .relative { position: relative; } +.left-1\/2 { + left: 50%; +} + +.top-1\/2 { + top: 50%; +} + .col-span-full { grid-column: 1 / -1; } @@ -592,6 +604,16 @@ video { flex: none; } +.-translate-x-1\/2 { + --tw-translate-x: -50%; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + +.-translate-y-1\/2 { + --tw-translate-y: -50%; + transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); +} + @keyframes pulse { 50% { opacity: .5; diff --git a/routes/templates/tableTemplates.gohtml b/routes/templates/tableTemplates.gohtml index 7bb47bf..4778fa1 100644 --- a/routes/templates/tableTemplates.gohtml +++ b/routes/templates/tableTemplates.gohtml @@ -1,95 +1,95 @@ -
expected to be called with personData
-{{ define "personBlocks" }} +{{ define "personBlocks" }} -{{ .Name }}
+{{ .Name }}({{.Index}})
expected be called with room *roomTableData
- {{ define "roomPeople" }} -