forked from mbk-lab/rui_orig
2
0
Fork 0
rui/animation.go

816 lines
23 KiB
Go

package rui
import (
"fmt"
"math"
"strconv"
"strings"
)
const (
// AnimationTag is the constant for the "animation" property tag.
// The "animation" property sets and starts animations.
// Valid types of value are []Animation and Animation
AnimationTag = "animation"
// AnimationPause is the constant for the "animation-pause" property tag.
// The "animation-pause" property sets whether an animation is running or paused.
AnimationPaused = "animation-paused"
// TransitionTag is the constant for the "transition" property tag.
// The "transition" property sets transition animation of view properties.
// Valid type of "transition" property value is Params. Valid type of Params value is Animation.
Transition = "transition"
// PropertyTag is the constant for the "property" animation property tag.
// The "property" property describes a scenario for changing a View property.
// Valid types of value are []AnimatedProperty and AnimatedProperty
PropertyTag = "property"
// Duration is the constant for the "duration" animation property tag.
// The "duration" float property sets the length of time in seconds that an animation takes to complete one cycle.
Duration = "duration"
// Delay is the constant for the "delay" animation property tag.
// The "delay" float property specifies the amount of time in seconds to wait from applying
// the animation to an element before beginning to perform the animation. The animation can start later,
// immediately from its beginning, or immediately and partway through the animation.
Delay = "delay"
// TimingFunction is the constant for the "timing-function" animation property tag.
// The "timing-function" property sets how an animation progresses through the duration of each cycle.
TimingFunction = "timing-function"
// IterationCount is the constant for the "iteration-count" animation property tag.
// The "iteration-count" int property sets the number of times an animation sequence
// should be played before stopping.
IterationCount = "iteration-count"
// AnimationDirection is the constant for the "animation-direction" animation property tag.
//The "animation-direction" property sets whether an animation should play forward, backward,
// or alternate back and forth between playing the sequence forward and backward.
AnimationDirection = "animation-direction"
// NormalAnimation is value of the "animation-direction" property.
// The animation plays forwards each cycle. In other words, each time the animation cycles,
// the animation will reset to the beginning state and start over again. This is the default value.
NormalAnimation = 0
// ReverseAnimation is value of the "animation-direction" property.
// The animation plays backwards each cycle. In other words, each time the animation cycles,
// the animation will reset to the end state and start over again. Animation steps are performed
// backwards, and timing functions are also reversed.
// For example, an "ease-in" timing function becomes "ease-out".
ReverseAnimation = 1
// AlternateAnimation is value of the "animation-direction" property.
// The animation reverses direction each cycle, with the first iteration being played forwards.
// The count to determine if a cycle is even or odd starts at one.
AlternateAnimation = 2
// AlternateReverseAnimation is value of the "animation-direction" property.
// The animation reverses direction each cycle, with the first iteration being played backwards.
// The count to determine if a cycle is even or odd starts at one.
AlternateReverseAnimation = 3
// EaseTiming - a timing function which increases in velocity towards the middle of the transition, slowing back down at the end
EaseTiming = "ease"
// EaseInTiming - a timing function which starts off slowly, with the transition speed increasing until complete
EaseInTiming = "ease-in"
// EaseOutTiming - a timing function which starts transitioning quickly, slowing down the transition continues.
EaseOutTiming = "ease-out"
// EaseInOutTiming - a timing function which starts transitioning slowly, speeds up, and then slows down again.
EaseInOutTiming = "ease-in-out"
// LinearTiming - a timing function at an even speed
LinearTiming = "linear"
)
// StepsTiming return a timing function along stepCount stops along the transition, diplaying each stop for equal lengths of time
func StepsTiming(stepCount int) string {
return "steps(" + strconv.Itoa(stepCount) + ")"
}
// CubicBezierTiming return a cubic-Bezier curve timing function. x1 and x2 must be in the range [0, 1].
func CubicBezierTiming(x1, y1, x2, y2 float64) string {
if x1 < 0 {
x1 = 0
} else if x1 > 1 {
x1 = 1
}
if x2 < 0 {
x2 = 0
} else if x2 > 1 {
x2 = 1
}
return fmt.Sprintf("cubic-bezier(%g, %g, %g, %g)", x1, y1, x2, y2)
}
// AnimatedProperty describes the change script of one property
type AnimatedProperty struct {
// Tag is the name of the property
Tag string
// From is the initial value of the property
From any
// To is the final value of the property
To any
// KeyFrames is intermediate property values
KeyFrames map[int]any
}
type animationData struct {
propertyList
keyFramesName string
}
// Animation interface is used to set animation parameters. Used properties:
// "property", "id", "duration", "delay", "timing-function", "iteration-count", and "animation-direction"
type Animation interface {
Properties
fmt.Stringer
writeTransitionString(tag string, buffer *strings.Builder)
animationCSS(session Session) string
transitionCSS(buffer *strings.Builder, session Session)
hasAnimatedPropery() bool
animationName() string
}
func parseAnimation(obj DataObject) Animation {
animation := new(animationData)
animation.init()
for i := 0; i < obj.PropertyCount(); i++ {
if node := obj.Property(i); node != nil {
if node.Type() == TextNode {
animation.Set(node.Tag(), node.Text())
} else {
animation.Set(node.Tag(), node)
}
}
}
return animation
}
func NewAnimation(params Params) Animation {
animation := new(animationData)
animation.init()
for tag, value := range params {
animation.Set(tag, value)
}
return animation
}
func (animation *animationData) hasAnimatedPropery() bool {
props := animation.getRaw(PropertyTag)
if props == nil {
ErrorLog("There are no animated properties.")
return false
}
if _, ok := props.([]AnimatedProperty); !ok {
ErrorLog("Invalid animated properties.")
return false
}
return true
}
func (animation *animationData) animationName() string {
return animation.keyFramesName
}
func (animation *animationData) normalizeTag(tag string) string {
tag = strings.ToLower(tag)
if tag == Direction {
return AnimationDirection
}
return tag
}
func (animation *animationData) Set(tag string, value any) bool {
if value == nil {
animation.Remove(tag)
return true
}
switch tag = animation.normalizeTag(tag); tag {
case ID:
if text, ok := value.(string); ok {
text = strings.Trim(text, " \t\n\r")
if text == "" {
delete(animation.properties, tag)
} else {
animation.properties[tag] = text
}
return true
}
notCompatibleType(tag, value)
return false
case PropertyTag:
switch value := value.(type) {
case AnimatedProperty:
if value.From == nil && value.KeyFrames != nil {
if val, ok := value.KeyFrames[0]; ok {
value.From = val
delete(value.KeyFrames, 0)
}
}
if value.To == nil && value.KeyFrames != nil {
if val, ok := value.KeyFrames[100]; ok {
value.To = val
delete(value.KeyFrames, 100)
}
}
if value.From == nil {
ErrorLog("AnimatedProperty.From is nil")
} else if value.To == nil {
ErrorLog("AnimatedProperty.To is nil")
} else {
animation.properties[tag] = []AnimatedProperty{value}
return true
}
case []AnimatedProperty:
props := []AnimatedProperty{}
for _, val := range value {
if val.From == nil && val.KeyFrames != nil {
if v, ok := val.KeyFrames[0]; ok {
val.From = v
delete(val.KeyFrames, 0)
}
}
if val.To == nil && val.KeyFrames != nil {
if v, ok := val.KeyFrames[100]; ok {
val.To = v
delete(val.KeyFrames, 100)
}
}
if val.From == nil {
ErrorLog("AnimatedProperty.From is nil")
} else if val.To == nil {
ErrorLog("AnimatedProperty.To is nil")
} else {
props = append(props, val)
}
}
if len(props) > 0 {
animation.properties[tag] = props
return true
} else {
ErrorLog("[]AnimatedProperty is empty")
}
case DataNode:
parseObject := func(obj DataObject) (AnimatedProperty, bool) {
result := AnimatedProperty{}
for i := 0; i < obj.PropertyCount(); i++ {
if node := obj.Property(i); node.Type() == TextNode {
propTag := strings.ToLower(node.Tag())
switch propTag {
case "from", "0", "0%":
result.From = node.Text()
case "to", "100", "100%":
result.To = node.Text()
default:
tagLen := len(propTag)
if tagLen > 0 && propTag[tagLen-1] == '%' {
propTag = propTag[:tagLen-1]
}
n, err := strconv.Atoi(propTag)
if err != nil {
ErrorLog(err.Error())
} else if n < 0 || n > 100 {
ErrorLogF(`key-frame "%d" is out of range`, n)
} else {
if result.KeyFrames == nil {
result.KeyFrames = map[int]any{n: node.Text()}
} else {
result.KeyFrames[n] = node.Text()
}
}
}
}
}
if result.From != nil && result.To != nil {
return result, true
}
return result, false
}
switch value.Type() {
case ObjectNode:
if prop, ok := parseObject(value.Object()); ok {
animation.properties[tag] = []AnimatedProperty{prop}
return true
}
case ArrayNode:
props := []AnimatedProperty{}
for _, val := range value.ArrayElements() {
if val.IsObject() {
if prop, ok := parseObject(val.Object()); ok {
props = append(props, prop)
}
} else {
notCompatibleType(tag, val)
}
}
if len(props) > 0 {
animation.properties[tag] = props
return true
}
default:
notCompatibleType(tag, value)
}
default:
notCompatibleType(tag, value)
}
case Duration:
return animation.setFloatProperty(tag, value, 0, math.MaxFloat64)
case Delay:
return animation.setFloatProperty(tag, value, -math.MaxFloat64, math.MaxFloat64)
case TimingFunction:
if text, ok := value.(string); ok {
animation.properties[tag] = text
return true
}
case IterationCount:
return animation.setIntProperty(tag, value)
case AnimationDirection:
return animation.setEnumProperty(AnimationDirection, value, enumProperties[AnimationDirection].values)
default:
ErrorLogF(`The "%s" property is not supported by Animation`, tag)
}
return false
}
func (animation *animationData) Remove(tag string) {
delete(animation.properties, animation.normalizeTag(tag))
}
func (animation *animationData) Get(tag string) any {
return animation.getRaw(animation.normalizeTag(tag))
}
func (animation *animationData) String() string {
buffer := allocStringBuilder()
defer freeStringBuilder(buffer)
buffer.WriteString("animation {")
// TODO
buffer.WriteString("}")
return buffer.String()
}
func (animation *animationData) animationCSS(session Session) string {
if animation.keyFramesName == "" {
props := animation.getRaw(PropertyTag)
if props == nil {
ErrorLog("There are no animated properties.")
return ""
}
animatedProps, ok := props.([]AnimatedProperty)
if !ok {
ErrorLog("Invalid animated properties.")
return ""
}
animation.keyFramesName = session.registerAnimation(animatedProps)
}
buffer := allocStringBuilder()
defer freeStringBuilder(buffer)
buffer.WriteString(animation.keyFramesName)
if duration, ok := floatProperty(animation, Duration, session, 1); ok && duration > 0 {
buffer.WriteString(fmt.Sprintf(" %gs ", duration))
} else {
buffer.WriteString(" 1s ")
}
buffer.WriteString(animation.timingFunctionCSS(session))
if delay, ok := floatProperty(animation, Delay, session, 0); ok && delay > 0 {
buffer.WriteString(fmt.Sprintf(" %gs", delay))
} else {
buffer.WriteString(" 0s")
}
if iterationCount, _ := intProperty(animation, IterationCount, session, 0); iterationCount >= 0 {
if iterationCount == 0 {
iterationCount = 1
}
buffer.WriteString(fmt.Sprintf(" %d ", iterationCount))
} else {
buffer.WriteString(" infinite ")
}
direction, _ := enumProperty(animation, AnimationDirection, session, 0)
values := enumProperties[AnimationDirection].cssValues
if direction < 0 || direction >= len(values) {
direction = 0
}
buffer.WriteString(values[direction])
// TODO "animation-fill-mode"
buffer.WriteString(" forwards")
return buffer.String()
}
func (animation *animationData) transitionCSS(buffer *strings.Builder, session Session) {
if duration, ok := floatProperty(animation, Duration, session, 1); ok && duration > 0 {
buffer.WriteString(fmt.Sprintf(" %gs ", duration))
} else {
buffer.WriteString(" 1s ")
}
buffer.WriteString(animation.timingFunctionCSS(session))
if delay, ok := floatProperty(animation, Delay, session, 0); ok && delay > 0 {
buffer.WriteString(fmt.Sprintf(" %gs", delay))
}
}
func (animation *animationData) writeTransitionString(tag string, buffer *strings.Builder) {
buffer.WriteString(tag)
buffer.WriteString("{")
lead := " "
writeFloatProperty := func(name string) bool {
if value := animation.getRaw(name); value != nil {
buffer.WriteString(lead)
buffer.WriteString(name)
buffer.WriteString(" = ")
writePropertyValue(buffer, name, value, "")
lead = ", "
return true
}
return false
}
if !writeFloatProperty(Duration) {
buffer.WriteString(" duration = 1")
lead = ", "
}
writeFloatProperty(Delay)
if value := animation.getRaw(TimingFunction); value != nil {
if timingFunction, ok := value.(string); ok && timingFunction != "" {
buffer.WriteString(lead)
buffer.WriteString(TimingFunction)
buffer.WriteString(" = ")
if strings.ContainsAny(timingFunction, " ,()") {
buffer.WriteRune('"')
buffer.WriteString(timingFunction)
buffer.WriteRune('"')
} else {
buffer.WriteString(timingFunction)
}
}
}
buffer.WriteString(" }")
}
func (animation *animationData) timingFunctionCSS(session Session) string {
if timingFunction, ok := stringProperty(animation, TimingFunction, session); ok {
if timingFunction, ok = session.resolveConstants(timingFunction); ok && isTimingFunctionValid(timingFunction) {
return timingFunction
}
}
return ("ease")
}
func isTimingFunctionValid(timingFunction string) bool {
switch timingFunction {
case "", EaseTiming, EaseInTiming, EaseOutTiming, EaseInOutTiming, LinearTiming:
return true
}
size := len(timingFunction)
if size > 0 && timingFunction[size-1] == ')' {
if index := strings.IndexRune(timingFunction, '('); index > 0 {
args := timingFunction[index+1 : size-1]
switch timingFunction[:index] {
case "steps":
if _, err := strconv.Atoi(strings.Trim(args, " \t\n")); err == nil {
return true
}
case "cubic-bezier":
if params := strings.Split(args, ","); len(params) == 4 {
for _, param := range params {
if _, err := strconv.ParseFloat(strings.Trim(param, " \t\n"), 64); err != nil {
return false
}
}
return true
}
}
}
}
return false
}
// IsTimingFunctionValid returns "true" if the "timingFunction" argument is the valid timing function.
func IsTimingFunctionValid(timingFunction string, session Session) bool {
if timingFunc, ok := session.resolveConstants(strings.Trim(timingFunction, " \t\n")); ok {
return isTimingFunctionValid(timingFunc)
}
return false
}
func (session *sessionData) registerAnimation(props []AnimatedProperty) string {
session.animationCounter++
name := fmt.Sprintf("kf%06d", session.animationCounter)
var cssBuilder cssStyleBuilder
cssBuilder.startAnimation(name)
fromParams := Params{}
toParams := Params{}
frames := []int{}
for _, prop := range props {
fromParams[prop.Tag] = prop.From
toParams[prop.Tag] = prop.To
if len(prop.KeyFrames) > 0 {
for frame := range prop.KeyFrames {
needAppend := true
for i, n := range frames {
if n == frame {
needAppend = false
break
} else if frame < n {
needAppend = false
frames = append(append(frames[:i], frame), frames[i+1:]...)
break
}
}
if needAppend {
frames = append(frames, frame)
}
}
}
}
cssBuilder.startAnimationFrame("from")
NewViewStyle(fromParams).cssViewStyle(&cssBuilder, session)
cssBuilder.endAnimationFrame()
if len(frames) > 0 {
for _, frame := range frames {
params := Params{}
for _, prop := range props {
if prop.KeyFrames != nil {
if value, ok := prop.KeyFrames[frame]; ok {
params[prop.Tag] = value
}
}
}
if len(params) > 0 {
cssBuilder.startAnimationFrame(strconv.Itoa(frame) + "%")
NewViewStyle(params).cssViewStyle(&cssBuilder, session)
cssBuilder.endAnimationFrame()
}
}
}
cssBuilder.startAnimationFrame("to")
NewViewStyle(toParams).cssViewStyle(&cssBuilder, session)
cssBuilder.endAnimationFrame()
cssBuilder.endAnimation()
style := cssBuilder.finish()
session.animationCSS += style
style = strings.ReplaceAll(style, "\n", `\n`)
session.runScript(`document.querySelector('style').textContent += "` + style + `"`)
return name
}
func (view *viewData) SetAnimated(tag string, value any, animation Animation) bool {
if animation == nil {
return view.Set(tag, value)
}
session := view.Session()
htmlID := view.htmlID()
session.startUpdateScript(htmlID)
updateProperty(htmlID, "ontransitionend", "transitionEndEvent(this, event)", view.session)
updateProperty(htmlID, "ontransitioncancel", "transitionCancelEvent(this, event)", view.session)
if prevAnimation, ok := view.transitions[tag]; ok {
view.singleTransition[tag] = prevAnimation
} else {
view.singleTransition[tag] = nil
}
view.transitions[tag] = animation
view.updateTransitionCSS()
session.finishUpdateScript(htmlID)
result := view.Set(tag, value)
if !result {
delete(view.singleTransition, tag)
view.updateTransitionCSS()
}
return result
}
func (style *viewStyle) animationCSS(session Session) string {
if value := style.getRaw(AnimationTag); value != nil {
if animations, ok := value.([]Animation); ok {
buffer := allocStringBuilder()
defer freeStringBuilder(buffer)
for _, animation := range animations {
if css := animation.animationCSS(session); css != "" {
if buffer.Len() > 0 {
buffer.WriteString(", ")
}
buffer.WriteString(css)
}
}
return buffer.String()
}
}
return ""
}
func (style *viewStyle) transitionCSS(session Session) string {
buffer := allocStringBuilder()
defer freeStringBuilder(buffer)
convert := map[string]string{
CellHeight: "grid-template-rows",
CellWidth: "grid-template-columns",
Row: "grid-row",
Column: "grid-column",
Clip: "clip-path",
Shadow: "box-shadow",
ColumnSeparator: "column-rule",
FontName: "font",
TextSize: "font-size",
TextLineThickness: "text-decoration-thickness",
}
for tag, animation := range style.transitions {
if buffer.Len() > 0 {
buffer.WriteString(", ")
}
if cssTag, ok := convert[tag]; ok {
buffer.WriteString(cssTag)
} else {
buffer.WriteString(tag)
}
animation.transitionCSS(buffer, session)
}
return buffer.String()
}
func (view *viewData) updateTransitionCSS() {
updateCSSProperty(view.htmlID(), "transition", view.transitionCSS(view.Session()), view.Session())
}
func (style *viewStyle) Transition(tag string) Animation {
if style.transitions != nil {
if anim, ok := style.transitions[tag]; ok {
return anim
}
}
return nil
}
func (style *viewStyle) Transitions() map[string]Animation {
result := map[string]Animation{}
for tag, animation := range style.transitions {
result[tag] = animation
}
return result
}
func (style *viewStyle) SetTransition(tag string, animation Animation) {
if animation == nil {
delete(style.transitions, tag)
} else {
style.transitions[tag] = animation
}
}
func (view *viewData) SetTransition(tag string, animation Animation) {
view.viewStyle.SetTransition(tag, animation)
if view.created {
updateCSSProperty(view.htmlID(), "transition", view.transitionCSS(view.Session()), view.Session())
}
}
// SetAnimated sets the property with name "tag" of the "rootView" subview with "viewID" id by value. Result:
// true - success,
// false - error (incompatible type or invalid format of a string value, see AppLog).
func SetAnimated(rootView View, viewID, tag string, value any, animation Animation) bool {
if view := ViewByID(rootView, viewID); view != nil {
return view.SetAnimated(tag, value, animation)
}
return false
}
// IsAnimationPaused returns "true" if an animation of the subview is paused, "false" otherwise.
// If the second argument (subviewID) is "" then a value from the first argument (view) is returned.
func IsAnimationPaused(view View, subviewID string) bool {
return boolStyledProperty(view, subviewID, AnimationPaused, false)
}
// GetTransitions returns the subview transitions. The result is always non-nil.
// If the second argument (subviewID) is "" then transitions of the first argument (view) is returned
func GetTransitions(view View, subviewID string) map[string]Animation {
if subviewID != "" {
view = ViewByID(view, subviewID)
}
if view != nil {
return view.Transitions()
}
return map[string]Animation{}
}
// GetTransition returns the subview property transition. If there is no transition for the given property then nil is returned.
// If the second argument (subviewID) is "" then transitions of the first argument (view) is returned
func GetTransition(view View, subviewID, tag string) Animation {
if subviewID != "" {
view = ViewByID(view, subviewID)
}
if view != nil {
return view.Transition(tag)
}
return nil
}
// AddTransition adds the transition for the subview property.
// If the second argument (subviewID) is "" then the transition is added to the first argument (view)
func AddTransition(view View, subviewID, tag string, animation Animation) bool {
if tag != "" {
if subviewID != "" {
view = ViewByID(view, subviewID)
}
if view != nil {
view.SetTransition(tag, animation)
return true
}
}
return false
}
// GetAnimation returns the subview animations. The result is always non-nil.
// If the second argument (subviewID) is "" then transitions of the first argument (view) is returned
func GetAnimation(view View, subviewID string) []Animation {
if subviewID != "" {
view = ViewByID(view, subviewID)
}
if view != nil {
if value := view.getRaw(AnimationTag); value != nil {
if animations, ok := value.([]Animation); ok && animations != nil {
return animations
}
}
}
return []Animation{}
}