Skip to content
This repository has been archived by the owner on Feb 26, 2022. It is now read-only.

Commit

Permalink
revert widget changes to event listener parameters; then remove 'widg…
Browse files Browse the repository at this point in the history 
…et' parameter
  • Loading branch information
@mykmelez
mykmelez committed Dec 7, 2010
1 parent 632c2ee commit 7950b2f
Show file tree
Hide file tree
Showing 5 changed files with 71 additions and 82 deletions.
25 changes: 8 additions & 17 deletions packages/addon-kit/docs/widget.md
View file
Expand Up @@ -61,28 +61,20 @@ Widgets emit the following types of [events](#guide/events).

### click ###

This event is emitted when the widget is clicked. Listeners are passed an event
object that has a single property named `emitter` whose value is the widget that
was clicked.
This event is emitted when the widget is clicked.

### message ###

This event is emitted when the widget's content scripts post a message.
Listeners are passed an event object that has two properties named `emitter` and
`data`. `emitter` is the widget that was clicked. `data` is the message posted
by the content script.
Listeners are passed the message as their first argument.

### mouseover ###

This event is emitted when the user moves the mouse over the widget. Listeners
are passed an event object that has a single property named `emitter` whose
value is the widget that was clicked.
This event is emitted when the user moves the mouse over the widget.

### mouseout ###

This event is emitted when the user moves the mouse away from the widget.
Listeners are passed an event object that has a single property named `emitter`
whose value is the widget that was clicked.

## Examples ##

Expand All @@ -98,7 +90,7 @@ create your content scripts in separate files and pass their URLs using the
widgets.Widget({
label: "Widget with an image and a click handler",
contentURL: "http://www.google.com/favicon.ico",
onClick: function(event) {
onClick: function() {
require("tabs").activeTab.url = "http://www.google.com/";
}
});
Expand All @@ -107,10 +99,10 @@ create your content scripts in separate files and pass their URLs using the
widgets.Widget({
label: "Widget with changing image on mouseover",
contentURL: "http://www.yahoo.com/favicon.ico",
onMouseover: function(event) {
onMouseover: function() {
this.contentURL = "http://www.bing.com/favicon.ico";
},
onMouseout: function(event) {
onMouseout: function() {
this.contentURL = "http://www.yahoo.com/favicon.ico";
}
});
Expand All @@ -134,11 +126,10 @@ create your content scripts in separate files and pass their URLs using the
'setTimeout(function() {' +
' document.location = "http://www.flickr.com/explore/";' +
'}, 5 * 60 * 1000);',
onMessage: function(event) {
var imgSrc = event.data;
onMessage: function(imgSrc) {
this.contentURL = imgSrc;
},
onClick: function(event) {
onClick: function() {
require("tabs").activeTab.url = this.contentURL;
}
});
Expand Down
8 changes: 4 additions & 4 deletions packages/addon-kit/lib/widget.js
View file
Expand Up @@ -154,9 +154,9 @@ const Widget = Trait.compose(Loader, Trait.compose({
console.exception(e)
},

_onEvent: function Widget__onEvent(type, target, eventObj, domNode) {
_onEvent: function Widget__onEvent(type, target, eventData, domNode) {
if (target === this._public) {
this._emitEventObject(type, eventObj);
this._emit(type, eventData);

// Special case for click events: if the widget doesn't have a click
// handler, but it does have a panel, display the panel.
Expand Down Expand Up @@ -512,7 +512,7 @@ BrowserWindow.prototype = {
allow: item.widget.allow,
onMessage: function(message) {
require("timer").setTimeout(function() {
eventBus._emit("event", "message", item.widget, { data: message });
eventBus._emit("event", "message", item.widget, message);
}, 0);
}
});
Expand All @@ -536,7 +536,7 @@ BrowserWindow.prototype = {

// Proxy event to the widget
require("timer").setTimeout(function() {
eventBus._emit("event", EVENTS[e.type], item.widget, {}, item.node);
eventBus._emit("event", EVENTS[e.type], item.widget, null, item.node);
}, 0);
};

Expand Down
110 changes: 55 additions & 55 deletions packages/addon-kit/tests/test-widget.js
View file
Expand Up @@ -108,9 +108,9 @@ exports.testConstructor = function(test) {
content: "oh yeah",
contentScript: "postMessage(document.body.innerHTML);",
contentScriptWhen: "ready",
onMessage: function ({ emitter: widget, data: message }) {
test.assertEqual(widget.content, message, "content matches");
widget.destroy();
onMessage: function (message) {
test.assertEqual(this.content, message, "content matches");
this.destroy();
doneTest();
}
}));
Expand All @@ -121,9 +121,9 @@ exports.testConstructor = function(test) {
content: "<div>oh yeah</div>",
contentScript: "postMessage(document.body.innerHTML);",
contentScriptWhen: "ready",
onMessage: function ({ emitter: widget, data: message }) {
test.assertEqual(widget.content, message, "content matches");
widget.destroy();
onMessage: function (message) {
test.assertEqual(this.content, message, "content matches");
this.destroy();
doneTest();
}
}));
Expand All @@ -136,11 +136,11 @@ exports.testConstructor = function(test) {
"tag: document.body.firstElementChild.tagName, " +
"content: document.body.firstElementChild.innerHTML});",
contentScriptWhen: "ready",
onMessage: function ({ emitter: widget, data: message }) {
onMessage: function (message) {
test.assertEqual(message.title, "foo", "title matches");
test.assertEqual(message.tag, "P", "element matches");
test.assertEqual(message.content, "bar", "element content matches");
widget.destroy();
this.destroy();
doneTest();
}
}));
Expand All @@ -153,11 +153,11 @@ exports.testConstructor = function(test) {
"tag: document.body.firstElementChild.tagName, " +
"content: document.body.firstElementChild.innerHTML});",
contentScriptWhen: "ready",
onMessage: function ({ emitter: widget, data: message }) {
onMessage: function (message) {
test.assertEqual(message.title, "foo", "title matches");
test.assertEqual(message.tag, "P", "element matches");
test.assertEqual(message.content, "bar", "element content matches");
widget.destroy();
this.destroy();
doneTest();
}
}));
Expand All @@ -170,9 +170,9 @@ exports.testConstructor = function(test) {
"evt.initEvent('click', true, true ); " +
"document.getElementById('me').dispatchEvent(evt);",
contentScriptWhen: "ready",
onClick: function({ emitter: widget }) {
onClick: function() {
test.pass("onClick called");
widget.destroy();
this.destroy();
doneTest();
}
}));
Expand All @@ -185,9 +185,9 @@ exports.testConstructor = function(test) {
"evt.initEvent('mouseover', true, true ); " +
"document.getElementById('me').dispatchEvent(evt);",
contentScriptWhen: "ready",
onMouseover: function({ emitter: widget }) {
onMouseover: function() {
test.pass("onMouseover called");
widget.destroy();
this.destroy();
doneTest();
}
}));
Expand All @@ -200,9 +200,9 @@ exports.testConstructor = function(test) {
"evt.initEvent('mouseout', true, true ); " +
"document.getElementById('me').dispatchEvent(evt);",
contentScriptWhen: "ready",
onMouseout: function({ emitter: widget }) {
onMouseout: function() {
test.pass("onMouseout called");
widget.destroy();
this.destroy();
doneTest();
}
}));
Expand All @@ -215,9 +215,9 @@ exports.testConstructor = function(test) {
"evt.initEvent('click', true, true ); " +
"document.body.firstElementChild.dispatchEvent(evt);",
contentScriptWhen: "ready",
onClick: function({ emitter: widget }) {
onClick: function() {
test.pass("onClick called");
widget.destroy();
this.destroy();
doneTest();
}
}));
Expand All @@ -230,9 +230,9 @@ exports.testConstructor = function(test) {
"evt.initEvent('mouseover', true, true ); " +
"document.body.firstElementChild.dispatchEvent(evt);",
contentScriptWhen: "ready",
onMouseover: function({ emitter: widget }) {
onMouseover: function() {
test.pass("onMouseover called");
widget.destroy();
this.destroy();
doneTest();
}
}));
Expand All @@ -245,9 +245,9 @@ exports.testConstructor = function(test) {
"evt.initEvent('mouseout', true, true ); " +
"document.body.firstElementChild.dispatchEvent(evt);",
contentScriptWhen: "ready",
onMouseout: function({ emitter: widget }) {
onMouseout: function() {
test.pass("onMouseout called");
widget.destroy();
this.destroy();
doneTest();
}
}));
Expand All @@ -270,14 +270,14 @@ exports.testConstructor = function(test) {
content: "<div id='me'>foo</div>",
contentScript: "document.addEventListener('DOMContentLoaded', function() postMessage(1), false);",
contentScriptWhen: "ready",
onMessage: function({ emitter: widget, data: message }) {
if (!widget.flag) {
widget.content = "<div id='me'>bar</div>";
widget.flag = 1;
onMessage: function(message) {
if (!this.flag) {
this.content = "<div id='me'>bar</div>";
this.flag = 1;
}
else {
test.assertEqual(widget.content, "<div id='me'>bar</div>");
widget.destroy();
test.assertEqual(this.content, "<div id='me'>bar</div>");
this.destroy();
doneTest();
}
}
Expand All @@ -291,17 +291,17 @@ exports.testConstructor = function(test) {
contentURL: url1,
contentScript: "postMessage(document.location.href);",
contentScriptWhen: "ready",
onMessage: function({ emitter: widget, data: message }) {
if (!widget.flag) {
test.assertEqual(widget.contentURL.toString(), url1);
onMessage: function(message) {
if (!this.flag) {
test.assertEqual(this.contentURL.toString(), url1);
test.assertEqual(message, url1);
widget.contentURL = url2;
widget.flag = 1;
this.contentURL = url2;
this.flag = 1;
}
else {
test.assertEqual(widget.contentURL.toString(), url2);
test.assertEqual(this.contentURL.toString(), url2);
test.assertEqual(message, url2);
widget.destroy();
this.destroy();
doneTest();
}
}
Expand All @@ -314,9 +314,9 @@ exports.testConstructor = function(test) {
tooltip: "foo",
contentScript: "document.addEventListener('DOMContentLoaded', function() postMessage(1), false);",
contentScriptWhen: "start",
onMessage: function({ emitter: widget, data: message }) {
test.assertEqual(widget.tooltip, "foo", "tooltip matches");
widget.destroy();
onMessage: function(message) {
test.assertEqual(this.tooltip, "foo", "tooltip matches");
this.destroy();
doneTest();
}
}));
Expand All @@ -327,9 +327,9 @@ exports.testConstructor = function(test) {
content: "oh yeah",
contentScript: "document.addEventListener('DOMContentLoaded', function() postMessage(1), false);",
contentScriptWhen: "start",
onMessage: function({ emitter: widget, data: message }) {
test.assertEqual(widget.tooltip, widget.label, "tooltip fallbacks to label");
widget.destroy();
onMessage: function(message) {
test.assertEqual(this.tooltip, this.label, "tooltip fallbacks to label");
this.destroy();
doneTest();
}
}));
Expand All @@ -342,10 +342,10 @@ exports.testConstructor = function(test) {
content: "<div id='me'>foo</div>",
contentScript: "document.addEventListener('DOMContentLoaded', function() postMessage(1), false);",
contentScriptWhen: "start",
onMessage: function({ emitter: widget, data: message }) {
widget.tooltip = "bar";
test.assertEqual(widget.tooltip, "bar", "tooltip gets updated");
widget.destroy();
onMessage: function(message) {
this.tooltip = "bar";
test.assertEqual(this.tooltip, "bar", "tooltip gets updated");
this.destroy();
doneTest();
}
}));
Expand Down Expand Up @@ -411,17 +411,17 @@ exports.testConstructor = function(test) {
width: 200,
contentScript: "document.addEventListener('DOMContentLoaded', function() postMessage(1), false);",
contentScriptWhen: "ready",
onMessage: function({ emitter: widget, data: message }) {
test.assertEqual(widget.width, 200);
onMessage: function(message) {
test.assertEqual(this.width, 200);

let node = widgetNode(0);
test.assertEqual(widget.width, node.style.minWidth.replace("px", ""));
test.assertEqual(widget.width, node.firstElementChild.style.width.replace("px", ""));
widget.width = 300;
test.assertEqual(widget.width, node.style.minWidth.replace("px", ""));
test.assertEqual(widget.width, node.firstElementChild.style.width.replace("px", ""));
test.assertEqual(this.width, node.style.minWidth.replace("px", ""));
test.assertEqual(this.width, node.firstElementChild.style.width.replace("px", ""));
this.width = 300;
test.assertEqual(this.width, node.style.minWidth.replace("px", ""));
test.assertEqual(this.width, node.firstElementChild.style.width.replace("px", ""));

widget.destroy();
this.destroy();
doneTest();
}
}));
Expand Down Expand Up @@ -476,9 +476,9 @@ exports.testPanelWidget3 = function testPanelWidget3(test) {
"evt.initEvent('click', true, true ); " +
"document.body.firstElementChild.dispatchEvent(evt);",
contentScriptWhen: "ready",
onClick: function({ emitter: widget }) {
onClick: function() {
onClickCalled = true;
widget.panel.show();
this.panel.show();
},
panel: require("panel").Panel({
contentURL: "data:text/html,<body>Look ma, a panel!</body>",
Expand Down
2 changes: 1 addition & 1 deletion python-lib/cuddlefish/templates.py
View file
Expand Up @@ -6,7 +6,7 @@
var widget = widgets.Widget({
label: "Mozilla website",
contentURL: "http://www.mozilla.org/favicon.ico",
onClick: function(event) {
onClick: function() {
tabs.open("http://www.mozilla.org/");
}
});
Expand Down
8 changes: 3 additions & 5 deletions static-files/md/dev-guide/events.md
View file
Expand Up @@ -59,9 +59,7 @@ you can assign a listener function to this property as an alternative to
calling the object's `on()` method.

For example: the [`widget`](#modules/addon-kit/widget) object emits an event
when the widget is clicked. The widget supplies a single argument to the
listener, an event object with a property named `emitter` whose value is the
widget itself.
when the widget is clicked.

The following add-on creates a widget and assigns a listener to the
`onClick` property of the `options` object supplied to the widget's
Expand All @@ -73,7 +71,7 @@ constructor. The listener loads the Google home page:
widgets.Widget({
label: "Widget with an image and a click handler",
contentURL: "http://www.google.com/favicon.ico",
onClick: function(event) {
onClick: function() {
tabs.open("http://www.google.com/");
}
});
Expand All @@ -89,7 +87,7 @@ widget's `on()` method:
contentURL: "http://www.google.com/favicon.ico"
});

widget.on("click", function(event) {
widget.on("click", function() {
tabs.open("http://www.google.com/");
});

Expand Down

0 comments on commit 7950b2f

Please sign in to comment.