Value of document variable inside shadow dom - shadow-dom

What is the value of document variable inside shadow-dom?
In this jsfiddle we can see that it searches for the app node in the parent document and alerts its value. Does that mean that shadow-dom doesn't have a separate document variable and can access parent's document?

As you can see here, the shadow DOM can access the parent 'document':
https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_shadow_DOM

Related

Why some properties are hidden from Object Inspector when more than one item is selected?

I've noticed that some properties disappear from the Object Inspector when selecting more than one item.
Why does this happen and how to control this behavior when creating a component?
Example:
Add 2 buttons (TButton) to a form and select one of them.
In the Object Inspector you can see all TButton's published properties (Note that there's also the Constraints property).
Add the other button to the current selection (Click while pressing Shift key).
As you can see, some properties have been hidden from Object Inspector (Note that the Constraints is no more visible).
Whether a property is displayed when multiple objects are selected is controlled by the property editor configured for that property. Property editors (descended from TPropertyEditor in DesignEditors.pas) have a GetAttributes method that returns a set of attributes that apply to the editor. If the set includes paMultiSelect, then the property will be displayed.
Given that the property value is displayed as the constraint values, rather than just (TSizeConstraints), I conclude that that property is not using the generic TClassProperty editor. That editor sets paMultiSelect, but based on your pictures, the property editor to TSizeConstraints doesn't. It was probably an oversight.
You could try registering your own property editor. Find the property editor currently registered for TSizeConstraints (by searching the source code for TSizeConstraints, for instance) and, in a design-time package, declare a new class descended from that one. Override GetAttributes to return the value you need. Finally, follow examples elsewhere in the code to call RegisterPropertyEditor.

Instanciate object in parent with parameters

I'm trying to make a simple list editor in Dart, with Polymer, but I have some problems.
I will start by showing a screenshot of what it will look like.
design of the app
The left drawer is filled dynamically at run-time (a rest api is used to get the items).
The items are "MLayers" and clicking the button should add the corresponding "Layer" to the right part of the app.
The thing is I can't find a way to do this! I tried to launch a customEvent when the button is clicked but the method responsible of adding the new layer need the layer name (and I can't find a way to add parameters to customEvents...).
What do you recommand?
The structure of the app is:
mainApp
_ Drawer
__ MLayer
__ Layer
I think the class responsible of adding Layers should be the Drawer (in fact it contain the drawer AND the content). The Layer constructor should use the name (or ID) of the MLayer to display corresponding properties (lets say the MLayer "Dense" has properties "name" and "size"; the Layer is in fact an instance, while the MLayer is the maquette).
Thanks for the read!
EDIT: as requested, here's the code
Ok, so I didn't find the right way to do it, so I simply broke encapsulation by adding a property "MLayerDrawer" to my "MLayer" object and calling its method...
I'm still open to suggestions because this clearly isn't the right way to do it, it just work but is really dirty.

Set child property sooner than OnBeforePrint

I would like to set the StartNewPage property of my child band from code based on some data from my database. I am using this to force a pagebreak if it is needed. If I try to modify this property in the OnBeforePrint event, it seems to ignore it on the first page of every report, then it starts to work on pages after that. Is there any way to set that property even sooner than OnBeforePrint? I am using FastReport 5.0.
Set child band's StartNewPage property when main band (TfrxMasterData for example) is printed

How does Component.setVisible() method work?

I have some experience with GWT . In GWT , widget.setVisible() method will add style="display:none" style to widget. But component of vaadin wouldn't . I checked with firebug , I can't see my component while set component's visible to false. Why ?
I think that should be also have hidden style instead of not containing. I reallize that vaadin's codes were server side. But sometimes , if I would like to just hidden (set style display to none) , has there anyway to accomplish this instead of using css ?
I don't understand concept of what different between without adding component and setVisible(false) ?
As you already noticed, an invisible component is not transferred from server to browser, and from browser's point of view the component doesn't exist. This approach has to benefits:
Less data to transfer from server to client
Security: User cannot inspect invisible components' generated HTML with tools like Firebug because those doesn't exist on the browser.
So basically from browser's point of view it's the same thing that you don't add it to the UI at all. But usually it's just easier to toggle component's visibility instead of adding and removing it from its parent.
If you want to hide components with CSS, you can do it by defining your own theme and adding a style for that there. Then just apply the style for the component you want to hide by using the addStyleName method.
SETVISIBLE Sets the visibility of the component.
Visible components are drawn in the user interface, while invisible ones are not. The effect is not merely a cosmetic CSS change - no information about an invisible component will be sent to the client. The effect is thus the same as removing the component from its parent.
So as the documentation says invisible components are not not visible.

Actionscript: Position elements one after another automatically

Is it possible to make Sprites position themselves one after another automatically.
Similar to display:display-block in CSS.
For example i'm adding Sprites to some parent in a row, the way they are in xml skin file and they are automatically position themselves next to each other.
Is there an event, which tells that a child were added to the parent?
I could implement some extended Sprite, to position pushed elements automatically, by calculating where the last element is located?
Why the hell Actionscipt doesn't have something like CSS in it? It's a pain in the ass to build UI inside it, compared to HTML...
Madness...
In case of "raw" ActionScript you should either search for an appropriate library or do it your self. ActionScript doesn't define any CSS like logic.
On the other hand Flex does, but you will not find any CSS that let you define layout. CSS is used to modify visual appearance of containers and components in Flex. Layout is usually done with the layout property of the container classes provided by Flex. For example yo can use a Group and set its layout property to an instance of HorizontalLayout or VerticalLayout. This will automatically position all child components of the group either in x or in y direction. In case of using Flex you cannot use sprites directly, but there are many components you can use. Maybe there is one for your purposes.
See the Flex API documentation. The spark.components package will be a good starting point.

Resources