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 |