| OLD | NEW |
| 1 Sky Style Language | 1 Sky Style Language |
| 2 ================== | 2 ================== |
| 3 | 3 |
| 4 Planed changes | 4 Planed changes |
| 5 -------------- | 5 -------------- |
| 6 | 6 |
| 7 Add //-to-end-of-line comments to be consistent with the script | 7 Add //-to-end-of-line comments to be consistent with the script |
| 8 language. | 8 language. |
| 9 | 9 |
| 10 | 10 |
| (...skipping 305 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 316 // for example, TransitioningColorStyleValue would store | 316 // for example, TransitioningColorStyleValue would store |
| 317 // { | 317 // { |
| 318 // initial: /* color at time of transition */, | 318 // initial: /* color at time of transition */, |
| 319 // target: /* color at end of transition */, | 319 // target: /* color at end of transition */, |
| 320 // start: /* time at start of transition */, | 320 // start: /* time at start of transition */, |
| 321 // } | 321 // } |
| 322 // ...which would enable it to update appropriately, and would also | 322 // ...which would enable it to update appropriately, and would also |
| 323 // let other transitions that come later know that you were half-way | 323 // let other transitions that come later know that you were half-way |
| 324 // through a transition so they can shorten their time accordingly | 324 // through a transition so they can shorten their time accordingly |
| 325 // | 325 // |
| 326 // best practices: if you're storing values on the state object, |
| 327 // then remove the values once they are no longer needed. For |
| 328 // example, when your transition ends, set the object to null. |
| 329 // |
| 326 // best practices: if you're a style value that contains multiple | 330 // best practices: if you're a style value that contains multiple |
| 327 // style values, then before you call their resolve you should | 331 // style values, then before you call their resolve you should |
| 328 // replace the state with a state that is specific to them, and | 332 // replace the state with a state that is specific to them, and |
| 329 // when you get it back you should insert that value into your | 333 // when you get it back you should insert that value into your |
| 330 // state somehow. For example, in a resolve()r with two child | 334 // state somehow. For example, in a resolve()r with two child |
| 331 // style values a and b: | 335 // style values a and b: |
| 332 // let ourState; | 336 // let ourState; |
| 333 // if (settings.firstTime) | 337 // if (settings.firstTime) |
| 334 // ourState = { a: null, b: null }; | 338 // ourState = { a: null, b: null }; |
| 335 // else | 339 // else |
| 336 // ourState = settings.state; | 340 // ourState = settings.state; |
| 337 // settings.state = ourState.a; | 341 // settings.state = ourState.a; |
| 338 // let aResult = a.resolve(node, settings); | 342 // let aResult = a.resolve(node, settings); |
| 339 // ourState.a = settings.state; | 343 // ourState.a = settings.state; |
| 340 // settings.state = ourState.b; | 344 // settings.state = ourState.b; |
| 341 // let aResult = b.resolve(node, settings); | 345 // let aResult = b.resolve(node, settings); |
| 342 // ourState.b = settings.state; | 346 // ourState.b = settings.state; |
| 343 // settings.state = ourState; | 347 // settings.state = ourState; |
| 344 // return a + b; // or whatever | 348 // return a + b; // or whatever |
| 349 // |
| 350 // best practices: if you're a style value that contains multiple |
| 351 // style values, and all those style values are storing null, then |
| 352 // store null yourself, instead of storing many nulls of your own. |
| 353 |
| 354 // attribute Boolean wasStateSet; |
| 355 Boolean getShouldSaveState(); |
| 356 // returns true if state is not null, and either state was set |
| 357 // since the last reset, or firstTime is false. |
| 358 |
| 345 } | 359 } |
| 346 | 360 |
| 347 class Property : StyleNode { | 361 class Property : StyleNode { |
| 348 constructor (AbstractStyleDeclaration parentNode, PropertyHandle property, Abs
tractStyleValue? initialValue = null); | 362 constructor (AbstractStyleDeclaration parentNode, PropertyHandle property, Abs
tractStyleValue? initialValue = null); |
| 349 readonly attribute AbstractStyleDeclaration parentNode; | 363 readonly attribute AbstractStyleDeclaration parentNode; |
| 350 readonly attribute PropertyHandle property; | 364 readonly attribute PropertyHandle property; |
| 351 readonly attribute AbstractStyleValue value; | 365 readonly attribute AbstractStyleValue value; |
| 352 | 366 |
| 353 void setValue(AbstractStyleValue? newValue); | 367 void setValue(AbstractStyleValue? newValue); |
| 354 // updates value and calls markDirty() | 368 // updates value and calls markDirty() |
| (...skipping 145 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 500 // invoke element.renderNode.cascadedValueDirty(property, pseudoElement); fo
r each | 514 // invoke element.renderNode.cascadedValueDirty(property, pseudoElement); fo
r each |
| 501 // currently registered consumer element/pseudoElement pair | 515 // currently registered consumer element/pseudoElement pair |
| 502 | 516 |
| 503 void register((Element or RenderNode) consumer, String pseudoElement = ''); //
O(1) | 517 void register((Element or RenderNode) consumer, String pseudoElement = ''); //
O(1) |
| 504 void unregister((Element or RenderNode) consumer, String pseudoElement = '');
// O(N) | 518 void unregister((Element or RenderNode) consumer, String pseudoElement = '');
// O(N) |
| 505 // registers an element/pseudoElement or renderNode/pseudoElement pair with | 519 // registers an element/pseudoElement or renderNode/pseudoElement pair with |
| 506 // this StyleDeclaration so that a property/value on the style declaration | 520 // this StyleDeclaration so that a property/value on the style declaration |
| 507 // is marked dirty, the relevant render node is informed and can then update | 521 // is marked dirty, the relevant render node is informed and can then update |
| 508 // its property cache accordingly | 522 // its property cache accordingly |
| 509 | 523 |
| 524 |
| 510 getter AbstractStyleValue? (PropertyHandle property); | 525 getter AbstractStyleValue? (PropertyHandle property); |
| 511 // looks up the Property object for /property/, and returns its value | 526 // looks up the Property object for /property/, and returns its value |
| 512 // null if property is missing | 527 // null if property is missing |
| 513 | 528 |
| 514 setter void (PropertyHandle property, AbstractStyleValue value); | 529 setter void (PropertyHandle property, AbstractStyleValue value); |
| 515 // verify that value.parentNode is null | 530 // verify that value.parentNode is null |
| 516 // if there is no Property object for /property/, creates one | 531 // if there is no Property object for /property/, creates one |
| 517 // else calls its update() method to change the value | 532 // else calls its update() method to change the value |
| 518 // update value's parentNode | 533 // update value's parentNode |
| 519 // invoke consumer.renderNode.cascadedValueChanged(property); for each | 534 // invoke consumer.renderNode.cascadedValueChanged(property); for each |
| (...skipping 100 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 620 // internal state: | 635 // internal state: |
| 621 // - back pointer to backing Node, if we're not a ghost | 636 // - back pointer to backing Node, if we're not a ghost |
| 622 // - cache of resolved property values, mapping as follows: | 637 // - cache of resolved property values, mapping as follows: |
| 623 // - pseudoElement, property => StyleValue object, resolved value, StyleVal
ueResolverSettings, cascade dirty bit, value dirty bit | 638 // - pseudoElement, property => StyleValue object, resolved value, StyleVal
ueResolverSettings, cascade dirty bit, value dirty bit |
| 624 // - property state map (initially empty), as follows: | 639 // - property state map (initially empty), as follows: |
| 625 // - pseudoElement, property => object | 640 // - pseudoElement, property => object |
| 626 | 641 |
| 627 any getProperty(PropertyHandle property, GetPropertySettings? settings = null)
; | 642 any getProperty(PropertyHandle property, GetPropertySettings? settings = null)
; |
| 628 // looking at the cached data for the given pseudoElement: | 643 // looking at the cached data for the given pseudoElement: |
| 629 // if there's a cached value: | 644 // if there's a cached value: |
| 630 // if settings.forceCache is true, return the value | 645 // if settings.forceCache is true, return the cached value |
| 631 // if neither dirty bit is set, return the cached resolved value | 646 // if neither dirty bit is set, return the cached value |
| 632 // if the cascade dirty bit is not set (value dirty is set) then | 647 // if the cascade dirty bit is not set (value dirty is set) then |
| 633 // resolve the value using the same StyleValue object | 648 // resolve the value using the same StyleValue object |
| 634 // - with firstTime=false on the resolver settings | 649 // - with firstTime=false on the resolver settings |
| 635 // - with the cached state object if any | 650 // - with the cached state object if any |
| 651 // - jump to "cache" below |
| 636 // if settings.forceCache is true, return null | 652 // if settings.forceCache is true, return null |
| 637 // - if there's an override declaration with the property (with | 653 // - if there's an override declaration with the property (with |
| 638 // the pseudo or without), then get the value object from there and | 654 // the pseudo or without), then get the value object from there and |
| 639 // jump to "resolve" below. | 655 // jump to "resolve" below. |
| 640 // - if there's an element and it has a style declaration with the property | 656 // - if there's an element and it has a style declaration with the property |
| 641 // (with the pseudo or without), then get the value object from there | 657 // (with the pseudo or without), then get the value object from there |
| 642 // and jump to "resolve" below. | 658 // and jump to "resolve" below. |
| 643 // - if it's not an inherited property, or if there's no parent, then get t
he | 659 // - if it's not an inherited property, or if there's no parent, then get t
he |
| 644 // default value and jump to "resolve" below. | 660 // default value and jump to "resolve" below. |
| 645 // - call the parent render node's getProperty() with the same property | 661 // - call the parent render node's getProperty() with the same property |
| 646 // but no settings, then cache that value as the value for this element | 662 // but no settings, then cache that value as the value for this element |
| 647 // with the given pseudoElement, with no StyleValue object, no resolver | 663 // with the given pseudoElement, with no StyleValue object, no resolver |
| 648 // settings, and set the state to null. | 664 // settings, and set the state to null. |
| 649 // resolve: | 665 // resolve: |
| 650 // - get a new resolver settings object | 666 // - get a new resolver settings object |
| 651 // - if the obtained StyleValue object is different than the | 667 // - if the obtained StyleValue object is different than the |
| 652 // cached StyleValue object, or if there is no cached object, then set | 668 // cached StyleValue object, or if there is no cached object, then set |
| 653 // the resolver settings to firstTime=true, otherwise it's the same obj
ect | 669 // the resolver settings to firstTime=true, otherwise it's the same obj
ect |
| 654 // and set firstTime=false. | 670 // and set firstTime=false. |
| 655 // - set the resolver settings' state to the current state for this | 671 // - set the resolver settings' state to the current state for this |
| 656 // pseudoElement/property combination | 672 // pseudoElement/property combination |
| 657 // - using the obtained StyleValue object, call resolve(), | 673 // - using the obtained StyleValue object, call resolve(), |
| 658 // passing it this node and the resolver settings object. | 674 // passing it this node and the resolver settings object. |
| 659 // - update the cache with the obtained value and resolver settings, | 675 // - jump to "cache" below |
| 660 // resetting the dirty bits; update the state similarly | 676 // cache: |
| 677 // - update the cache with the obtained value and resolver settings |
| 678 // - reset the dirty bits |
| 679 // - if the resolver settings' getShouldSaveState() method returns false, |
| 680 // then discard any cached state, otherwise, cache the new state |
| 661 | 681 |
| 662 readonly attribute RenderNodeStyleDeclarationList overrideStyles; | 682 readonly attribute RenderNodeStyleDeclarationList overrideStyles; |
| 663 // mutable; initially empty | 683 // mutable; initially empty |
| 664 // this is used when isGhost is true, and can also be used more generally t
o | 684 // this is used when isGhost is true, and can also be used more generally t
o |
| 665 // override styles from the layout manager (e.g. to animate a new node into
view) | 685 // override styles from the layout manager (e.g. to animate a new node into
view) |
| 666 | 686 |
| 667 private void cascadedValueChanged(PropertyHandle property, String pseudoElemen
t = ''); | 687 private void cascadedValueChanged(PropertyHandle property, String pseudoElemen
t = ''); |
| 668 private void cascadedValueDirty(PropertyHandle property, String pseudoElement
= ''); | 688 private void cascadedValueDirty(PropertyHandle property, String pseudoElement
= ''); |
| 669 // - set the appropriate dirty bit on the cached data for this property/pseu
doElement pair | 689 // - set the appropriate dirty bit on the cached data for this property/pseu
doElement pair |
| 670 // - cascade dirty for cascadedValueChanged | 690 // - cascade dirty for cascadedValueChanged |
| (...skipping 321 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 992 ``` | 1012 ``` |
| 993 | 1013 |
| 994 The other elements don't have any default styles. | 1014 The other elements don't have any default styles. |
| 995 | 1015 |
| 996 These declarations are all shared between all the elements (so e.g. if | 1016 These declarations are all shared between all the elements (so e.g. if |
| 997 you reach in and change the declaration that was added to a ``span`` | 1017 you reach in and change the declaration that was added to a ``span`` |
| 998 element, you're going to change the styles of all the other | 1018 element, you're going to change the styles of all the other |
| 999 default-hidden elements). (In other words, in the code snippets above, | 1019 default-hidden elements). (In other words, in the code snippets above, |
| 1000 the ``d`` variable is initialised in shared code, and only the | 1020 the ``d`` variable is initialised in shared code, and only the |
| 1001 addStyles() call is per-element.) | 1021 addStyles() call is per-element.) |
| OLD | NEW |