| 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 335 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 346 // cache the value | 346 // cache the value |
| 347 // if relativeDimension is true, then mark the value as provisional | 347 // if relativeDimension is true, then mark the value as provisional |
| 348 // return the value | 348 // return the value |
| 349 // otherwise use the ParsedValue's value; cache it; return it | 349 // otherwise use the ParsedValue's value; cache it; return it |
| 350 // otherwise, if a pseudo-element was specified, try again without one | 350 // otherwise, if a pseudo-element was specified, try again without one |
| 351 // otherwise, if the property is inherited and there's a parent: | 351 // otherwise, if the property is inherited and there's a parent: |
| 352 // get it from the parent (without pseudo); cache it; return it | 352 // get it from the parent (without pseudo); cache it; return it |
| 353 // otherwise, get the default value; cache it; return it | 353 // otherwise, get the default value; cache it; return it |
| 354 | 354 |
| 355 readonly attribute Boolean needsLayout; // means that a property with needsLay
out:true has changed on this node or one of its descendants | 355 readonly attribute Boolean needsLayout; // means that a property with needsLay
out:true has changed on this node or one of its descendants |
| 356 // needsLayout is set to false by the ownerLayoutManager's default layout()
method |
| 356 readonly attribute LayoutManager layoutManager; | 357 readonly attribute LayoutManager layoutManager; |
| 357 | 358 |
| 358 readonly attribute LayoutManager ownerLayoutManager; // defaults to the parent
Node.layoutManager | 359 readonly attribute LayoutManager ownerLayoutManager; // defaults to the parent
Node.layoutManager |
| 359 // if you are not the ownerLayoutManager, then ignore this StyleNode in layo
ut() and paintChildren() | 360 // if you are not the ownerLayoutManager, then ignore this StyleNode in layo
ut() and paintChildren() |
| 360 // using walkChildren() does this for you | 361 // using walkChildren() does this for you |
| 361 | 362 |
| 362 readonly attribute Boolean needsPaint; // means that either needsLayout is tru
e or a property with needsPaint:true has changed on this node or one of its desc
endants | 363 readonly attribute Boolean needsPaint; // means that either needsLayout is tru
e or a property with needsPaint:true has changed on this node or one of its desc
endants |
| 363 // needsPaint is set to false by the ownerLayoutManager's default paint() me
thod | 364 // needsPaint is set to false by the ownerLayoutManager's default paint() me
thod |
| 364 | 365 |
| 365 // only the ownerLayoutManager can change these | 366 // only the ownerLayoutManager can change these |
| (...skipping 44 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 410 Layout managers inherit from the following API: | 411 Layout managers inherit from the following API: |
| 411 | 412 |
| 412 ```javascript | 413 ```javascript |
| 413 class LayoutManager { | 414 class LayoutManager { |
| 414 readonly attribute StyleNode node; | 415 readonly attribute StyleNode node; |
| 415 constructor LayoutManager(StyleNode node); | 416 constructor LayoutManager(StyleNode node); |
| 416 | 417 |
| 417 void take(StyleNode victim); // sets victim.ownerLayoutManager = this; | 418 void take(StyleNode victim); // sets victim.ownerLayoutManager = this; |
| 418 // assert: victim hasn't been take()n yet during this layout | 419 // assert: victim hasn't been take()n yet during this layout |
| 419 // assert: victim.needsLayout == true | 420 // assert: victim.needsLayout == true |
| 420 // assert: an ancestor of victim has needsLayout == this (aka, victim is a d
escendant of this.node) | 421 // assert: an ancestor of victim has node.layoutManager == this (aka, victim
is a descendant of this.node) |
| 421 | 422 |
| 422 virtual void release(StyleNode victim); | 423 virtual void release(StyleNode victim); |
| 423 // called when the StyleNode was removed from the tree | 424 // called when the StyleNode was removed from the tree |
| 424 | 425 |
| 425 void setChildPosition(child, x, y); // sets child.x, child.y | 426 void setChildPosition(child, x, y); // sets child.x, child.y |
| 426 void setChildX(child, y); // sets child.x | 427 void setChildX(child, y); // sets child.x |
| 427 void setChildY(child, y); // sets child.y | 428 void setChildY(child, y); // sets child.y |
| 428 void setChildSize(child, width, height); // sets child.width, child.height | 429 void setChildSize(child, width, height); // sets child.width, child.height |
| 429 void setChildWidth(child, width); // sets child.width | 430 void setChildWidth(child, width); // sets child.width |
| 430 void setChildHeight(child, height); // sets child.height | 431 void setChildHeight(child, height); // sets child.height |
| (...skipping 16 matching lines...) Expand all Loading... |
| 447 // layout() has a forced width and/or height? | 448 // layout() has a forced width and/or height? |
| 448 | 449 |
| 449 virtual LayoutValueRange getIntrinsicWidth(Float? defaultWidth = null); | 450 virtual LayoutValueRange getIntrinsicWidth(Float? defaultWidth = null); |
| 450 // returns min-width, width, and max-width, normalised, defaulting to values
given in LayoutValueRange | 451 // returns min-width, width, and max-width, normalised, defaulting to values
given in LayoutValueRange |
| 451 // if argument is provided, it overrides width | 452 // if argument is provided, it overrides width |
| 452 | 453 |
| 453 virtual LayoutValueRange getIntrinsicHeight(Float? defaultHeight = null); | 454 virtual LayoutValueRange getIntrinsicHeight(Float? defaultHeight = null); |
| 454 // returns min-height, height, and max-height, normalised, defaulting to val
ues given in LayoutValueRange | 455 // returns min-height, height, and max-height, normalised, defaulting to val
ues given in LayoutValueRange |
| 455 // if argument is provided, it overrides height | 456 // if argument is provided, it overrides height |
| 456 | 457 |
| 458 void markAsLaidOut(); // sets this.node.needsLayout to false |
| 457 virtual Dimensions layout(Number? width, Number? height); | 459 virtual Dimensions layout(Number? width, Number? height); |
| 458 // returns { } | 460 // default implementation calls markAsLaidOut() and returns arguments, with
null values resolved to intrinsic dimensions |
| 461 // this should always call this.markAsLaidOut() to reset needsLayout |
| 459 // the return value should include the final value for whichever of the widt
h and height arguments that is null | 462 // the return value should include the final value for whichever of the widt
h and height arguments that is null |
| 460 // TODO(ianh): should we just grab the width and height from assumeDimension
s()? | |
| 461 | 463 |
| 462 void markAsPainted(); // sets this.node.needsPaint to false | 464 void markAsPainted(); // sets this.node.needsPaint to false |
| 463 virtual void paint(RenderingSurface canvas); | 465 virtual void paint(RenderingSurface canvas); |
| 464 // set a clip rect on the canvas for rect(0,0,this.width,this.height) | 466 // set a clip rect on the canvas for rect(0,0,this.width,this.height) |
| 465 // call the painter of each property, in order they were registered, which o
n this element has a painter | 467 // call the painter of each property, in order they were registered, which o
n this element has a painter |
| 466 // call this.paintChildren() | 468 // call this.paintChildren() |
| 467 // unset the clip | 469 // unset the clip |
| 468 // call markAsPainted() | 470 // call markAsPainted() |
| 469 | 471 |
| 470 virtual void paintChildren(RenderingSurface canvas); | 472 virtual void paintChildren(RenderingSurface canvas); |
| (...skipping 58 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 529 In the constructors for the default elements, they add to themselves | 531 In the constructors for the default elements, they add to themselves |
| 530 StyleDeclaration objects as follows: | 532 StyleDeclaration objects as follows: |
| 531 | 533 |
| 532 * ``import`` | 534 * ``import`` |
| 533 * ``template`` | 535 * ``template`` |
| 534 * ``style`` | 536 * ``style`` |
| 535 * ``script`` | 537 * ``script`` |
| 536 * ``content`` | 538 * ``content`` |
| 537 * ``title`` | 539 * ``title`` |
| 538 These all add to themselves the same declaration with value: | 540 These all add to themselves the same declaration with value: |
| 539 ```css | 541 ```javascript |
| 540 { display: { value: null } } | 542 { display: { value: null } } |
| 541 ``` | 543 ``` |
| 542 | 544 |
| 543 * ``img`` | 545 * ``img`` |
| 544 This adds to itself the declaration with value: | 546 This adds to itself the declaration with value: |
| 545 ```css | 547 ```javascript |
| 546 { display: { value: sky.ImageElementLayoutManager } } | 548 { display: { value: sky.ImageElementLayoutManager } } |
| 547 ``` | 549 ``` |
| 548 | 550 |
| 549 * ``span`` | 551 * ``span`` |
| 550 * ``a`` | 552 * ``a`` |
| 551 These all add to themselves the same declaration with value: | 553 These all add to themselves the same declaration with value: |
| 552 ```css | 554 ```javascript |
| 553 { display: { value: sky.InlineLayoutManager } } | 555 { display: { value: sky.InlineLayoutManager } } |
| 554 ``` | 556 ``` |
| 555 | 557 |
| 556 * ``iframe`` | 558 * ``iframe`` |
| 557 This adds to itself the declaration with value: | 559 This adds to itself the declaration with value: |
| 558 ```css | 560 ```javascript |
| 559 { display: { value: sky.IFrameElementLayoutManager } } | 561 { display: { value: sky.IFrameElementLayoutManager } } |
| 560 ``` | 562 ``` |
| 561 | 563 |
| 562 * ``t`` | 564 * ``t`` |
| 563 This adds to itself the declaration with value: | 565 This adds to itself the declaration with value: |
| 564 ```css | 566 ```javascript |
| 565 { display: { value: sky.ParagraphLayoutManager } } | 567 { display: { value: sky.ParagraphLayoutManager } } |
| 566 ``` | 568 ``` |
| 567 | 569 |
| 568 * ``error`` | 570 * ``error`` |
| 569 This adds to itself the declaration with value: | 571 This adds to itself the declaration with value: |
| 570 ```css | 572 ```javascript |
| 571 { display: { value: sky.ErrorLayoutManager } } | 573 { display: { value: sky.ErrorLayoutManager } } |
| 572 ``` | 574 ``` |
| 573 | 575 |
| 574 The ``div`` element doesn't have any default styles. | 576 The ``div`` element doesn't have any default styles. |
| 575 | 577 |
| 576 These declarations are all shared between all the elements (so e.g. if | 578 These declarations are all shared between all the elements (so e.g. if |
| 577 you reach in and change the declaration that was added to a ``title`` | 579 you reach in and change the declaration that was added to a ``title`` |
| 578 element, you're going to change the styles of all the other | 580 element, you're going to change the styles of all the other |
| 579 default-hidden elements). | 581 default-hidden elements). |
| OLD | NEW |