Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

minor updates/fixes to g-component, selector and menu #31

Merged
merged 4 commits into from Nov 5, 2012
Merged

minor updates/fixes to g-component, selector and menu #31

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
cfbf253
inNodes could be a NodeList so fix it to make indexOf to work
frankiefu Nov 5, 2012
363bae4
a way to set label via attribute
frankiefu Nov 5, 2012
c4fa8c9
remove unnecessary code since getDistributedNodes is working in native
frankiefu Nov 5, 2012
0500a46
show selected attribute in the examples
frankiefu Nov 5, 2012
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/g-component.html
View file
Open in desktop
Expand Up @@ -432,7 +432,7 @@
// is in inNodes, if any
var n = inTarget;
while (n && n != this) {
var i = inNodes.indexOf(n);
var i = Array.prototype.indexOf.call(inNodes, n);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can you be more specific about your use case where inNodes is a NodeList. When I wrote this method, I assumed the input would always be the result of getDistributedNodes(). Does that method return a NodeList under native ShadowDOM?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, getDistributedNodes() under native ShadowDOM returns a NodeList.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ok, not sure how I missed that. Thank you.

if (i >= 0) {
return i;
}
Expand Down
6 changes: 5 additions & 1 deletion src/g-menuitem.html
View file
Open in desktop
Expand Up @@ -5,13 +5,14 @@
* license that can be found in the LICENSE file.
*/
-->
<element name="g-menuitem" attributes="src">
<element name="g-menuitem" attributes="src, label">
<link rel="components" href="g-component.html">
<link rel="components" href="g-icon.html">
<link rel="stylesheet" href="css/g-menuitem.css" />
<template>
<g-icon id="icon"></g-icon>
<div class="label">
<span id="label"></span>
<content></content>
</div>
</template>
Expand All @@ -20,6 +21,9 @@
prototype: {
srcChanged: function() {
this.$.icon.src = this.src;
},
labelChanged: function() {
this.$.label.textContent = this.label;
}
}
});
Expand Down
12 changes: 5 additions & 7 deletions src/g-selector.html
View file
Open in desktop
Expand Up @@ -10,7 +10,7 @@
<link rel="components" href="g-selection.html">
<template>
<g-selection id="selection" on-select="selectionSelect" on-deselect="selectionDeselect"></g-selection>
<content id="items"></content>
<content id="items" select="*"></content>
</template>
<script>
this.component({
Expand All @@ -19,12 +19,10 @@
this.$.selection.multi = this.multi;
},
getItems: function() {
// TODO(sjmiles): distributedNodes not implemented natively yet
// this.childNodes is LightDOM fallback which works unless we
// are composited (in that case childNodes = <content>, and
// distributeNodes is necessary to find the actual distributions)
return this.$.items.getDistributedNodes() ||
Array.prototype.slice.call(this.childNodes, 0);
return this.$.items.getDistributedNodes();
},
getSelectedItem: function() {
return this.$.selection.getSelection();
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That's a tad nicer. :)

},
_valueToIndex: function(inValue) {
// find an item with value == inValue and return it's index
Expand Down
2 changes: 1 addition & 1 deletion workbench/menu.html
View file
Open in desktop
Expand Up @@ -17,7 +17,7 @@
</style>
</head>
<body>
<g-menu>
<g-menu selected="0">
<g-menuitem src="images/edit_page.svg">Post a Comment</g-menuitem>
<g-menuitem src="images/chat.svg">Share Link</g-menuitem>
<g-menuitem src="images/email.svg">Email Link</g-menuitem>
Expand Down
4 changes: 2 additions & 2 deletions workbench/tabs.html
View file
Open in desktop
Expand Up @@ -6,14 +6,14 @@
<link rel="components" href="../../toolkit/src/g-tabs.html">
</head>
<body>
<g-tabs>
<g-tabs selected="0">
<span>One</span>
<span>Two</span>
<span>Three</span>
<span>Four</span>
</g-tabs>
<br><br>
<g-tabs vertical="true">
<g-tabs vertical="true" selected="0">
<span>One</span>
<span>Two</span>
<span>Three</span>
Expand Down