Navigation

← Previous Changeset
Next Changeset →

Changeset 7042

Timestamp:

06/17/07 02:25:20 (1 year ago)

Author:

andrew

Message:

* Added functional tests for mouseenter and mouseleave.
* Ensure mouseenter and mouseleave fire in the proper scope.
* Various formatting nitpicks.

Files:

spinoffs/prototype/branches/event/src/event.js (modified) (9 diffs)
spinoffs/prototype/branches/event/test/functional/event.html (modified) (20 diffs)

Legend:

: Unmodified
: Added
: Removed
: Modified
: Copied
: Moved

spinoffs/prototype/branches/event/src/event.js

r7032	r7042
27	27	switch(event.type) {
28	28	case 'mouseover': element = event.fromElement; break;
29		case 'mouseout': element = event.toElement; break;
	29	case 'mouseout': element = event.toElement; break;
30	30	default: return null;
31	31	}
…	…
73	73	if (B.IE \|\| B.WebKit) this._type = 'keydown';
74	74	break;
75		case 'mouseenter':
76		case 'mouseleave':
	75	case 'mouseenter': case 'mouseleave':
77	76	if (B.IE) break;
78	77	this._type = type == 'mouseenter' ? 'mouseover' : 'mouseout';
79	78	this._callback = function(event) {
80	79	var rel = event.relatedTarget, cur = event.currentTarget;
81		rel = ~~rel.nodeType == Node.TEXT_NODE~~ ? rel.parentNode : rel;
	80	rel = (rel.nodeType == Node.TEXT_NODE) ? rel.parentNode : rel;
82	81	if (rel && rel !== cur && !rel.descendantOf(cur))
83		return callback(event);
	82	return callback.call(this, event);
84	83	};
85	84	}
86	85	},
	86
87	87	add: function() {
88	88	if (this.type == 'DOMContentLoaded' && this.element == document) {
89		Event.onReady(this.callback);
90		return;
	89	Event.onReady(this.callback); return;
91	90	}
92	91	this._add();
93	92	this.cache();
94	93	},
	94
95	95	cache: function() {
96	96	if (!this.element._observers) this.element._observers = {};
97		~~var local = this.element._observers[this.type];~~
98		~~if (!local) local =~~ this.element._observers[this.type] = {};
	97	if (!this.element._observers[this.type])
	98	this.element._observers[this.type] = {};
99	99	if (!this.callback.$$guid) this.callback.$$guid = Observer.guid++;
100		local[this.callback.$$guid] = this;
101		},
	100	this.element._observers[this.type][this.callback.$$guid] = this;
	101	},
	102
102	103	remove: function() {
103	104	this._remove();
…	…
108	109	// mouse button detection is terribly inconsistent
109	110	if (B.IE) {
110		~~var buttonTranslations = { 0:1, 1:4, 2:2 };~~
111	111	var isButton = function(event, code) {
112		return event.button == buttonTranslations[code];
113		};
114		}
115		else if (B.WebKit) {
	112	return event.button == ({ 0:1, 1:4, 2:2 })[code];
	113	};
	114	} else if (B.WebKit) {
116	115	var isButton = function(event, code) {
117	116	switch (code) {
…	…
121	120	}
122	121	};
	122	} else {
	123	var isButton = function(event, code) {
	124	return event.which ? (event.which === code + 1) : (event.button === code);
	125	};
123	126	}
124		~~else var isButton = function(event, code) {~~
125		~~return event.which ? event.which === code+1 : event.button === code;~~
126		};
127	127
128	128	Object.extend(Event.Methods, {
…	…
148	148
149	149	Event.prototype = Event.prototype \|\| document.createEvent("UIEvents").__proto__;
150		Object.extend(Event.prototype, instanceMethods);
151
	150	Object.extend(Event.prototype, instanceMethods);
152	151	} else if (B.IE) {
153	152	Object.extend(Observer.prototype, {
…	…
160	159	},
161	160	_remove: function() {
162		if (!this.wrapper) this.wrapper = this.element._observers[this.type][this.callback.$$guid].wrapper;
	161	if (!this.wrapper)
	162	this.wrapper = this.element._observers[this.type][this.callback.$$guid].wrapper;
163	163	this.element.detachEvent('on' + this._type, this.wrapper);
164	164	}
…	…
196	196
197	197	// applies the calling method to an array of elements
198		~~function applyToColle~~ction(args) {
	198	var applyToCollection = function(args) {
199	199	if (args[0].constructor != Array) return false;
200	200	var method = args.callee;
…	…
205	205
206	206	// onReady helper stuff
207		var readyCallbacks, timer, domReady = function() {
	207	var readyCallbacks, timer;
	208	var domReady = function() {
208	209	if (arguments.callee.done) return;
209	210	arguments.callee.done = true;
210	211	if (timer) clearInterval(timer);
211	212
212		readyCallbacks.each(function(f) { f() });
	213	readyCallbacks.each(function(f) { f(); });
213	214	readyCallbacks = null;
214	215	};
…	…
244	245	},
245	246
246		// based on work by Dan Webb, Matthias Miller, Dean Edwards and John Resig
	247	// based on work by Dan Webb, Matthias Miller, Dean Edwards, and John Resig
247	248	onReady: function(f) {
248	249	if (!readyCallbacks) {
	250	// call the handler immediately if domReady has already occurred
249	251	if (domReady.done) return f();
250	252

spinoffs/prototype/branches/event/test/functional/event.html

r7032	r7042
30	30	el = $(el);
31	31	el.className = 'passed';
32		el.update(message \|\| 'Test passed!');
	32	(el.down('span') \|\| el).update(message \|\| 'Test passed!');
33	33	},
34	34
…	…
36	36	el = $(el);
37	37	el.className = 'failed';
38		el.update(message \|\| 'Test failed');
	38	(el.down('span') \|\| el).update(message \|\| 'Test failed');
39	39	}
40	40	});
…	…
61	61	<script type="text/javascript">
62	62	var basic_callback = function(e){
63		$('basic').passed()
	63	$('basic').passed();
64	64	if ($('basic_remove')) $('basic_remove').show()
65	65	else $('basic').failed()
66		log(e)
	66	log(e);
67	67	}
68	68	$('basic').observe('click', basic_callback)
…	…
72	72	el.stopObserving('click')
73	73	$('basic_remove').remove()
74		log(e)
	74	log(e);
75	75	}).hide()
76	76	</script>
…	…
79	79
80	80	<script type="text/javascript">
81		$('basic2').observe('click', function(e){
82		if(this === window) $('basic2').failed('Window scope! (needs scope correction)')
83		else this.passed()
84		log(e)
85		})
	81	$('basic2').observe('click', function(e) {
	82	if(this === window) $('basic2').failed('Window scope! (needs scope correction)');
	83	else this.passed();
	84	log(e);
	85	});
86	86	</script>
87	87
…	…
89	89
90	90	<script type="text/javascript">
91		$('basic3').observe('click', function(evt){
92		el = $('basic3')
93		if~~(typeof evt != 'object') this.failed('Expected event object for first argument')~~
94		else this.passed('Good first argument')
95		log(evt)
96		})
	91	$('basic3').observe('click', function(evt) {
	92	el = $('basic3');
	93	if (typeof evt != 'object') this.failed('Expected event object for first argument');
	94	else this.passed('Good first argument');
	95	log(evt);
	96	});
97	97	</script>
98	98
…	…
101	101	<script type="text/javascript">
102	102	$('hijack').observe('click', function(e){
103		el = $(this.parentNode)
104		~~e.preventDefault()~~
105		~~// log(e) // this makes it fail?!?~~
	103	el = $(this.parentNode);
	104	log(e); // this makes it fail?!?
	105	e.preventDefault();
106	106
107	107	setTimeout(function() {
108	108	if (window.location.hash == '#wrong') el.failed('Hijack failed (<a href="' +
109	109	window.location.toString().replace(/#.+$/, '') + '">remove the fragment</a>)')
110		else el.passed()
	110	else el.passed();
111	111	}, 50)
112	112	})
…	…
115	115	<hr />
116	116
	117	<p id="mouseenter"><span>mouseenter test: mouse over empty space, then over text</span></p>
	118
	119	<script type="text/javascript" charset="utf-8">
	120	$('mouseenter').observe('mouseenter', function(e) {
	121	if (e.target == $('mouseenter')) this.passed();
	122	else this.failed();
	123	log(e);
	124	});
	125	</script>
	126
	127	<p id="mouseleave"><span>mouseleave test: move over text, then over empty space</span></p>
	128
	129	<script type="text/javascript" charset="utf-8">
	130	$('mouseleave').observe('mouseleave', function(e) {
	131	if (e.target == $('mouseleave')) this.passed();
	132	else this.failed();
	133	log(e);
	134	});
	135	</script>
	136
117	137	<p id="target">Event.element() test</p>
118	138
119	139	<script type="text/javascript">
120		$('target').observe('click', function(e){
121		if~~(e.element() == this && e.target == this) this.passed()~~
122		else this.failed()
123		log(e)
124		})
	140	$('target').observe('click', function(e) {
	141	if (e.element() == this && e.target == this) this.passed();
	142	else this.failed();
	143	log(e);
	144	});
125	145	</script>
126	146
…	…
129	149	<script type="text/javascript">
130	150	$('currentTarget').observe('click', function(e){
131		if(e.currentTarget !== this) this.failed()
132		else this.passed()
133		log(e)
	151	if(e.currentTarget !== this) this.failed();
	152	else this.passed();
	153	log(e);
134	154	})
135	155	</script>
…	…
140	160	$('findElement').observe('click', function(e){
141	161	if(e.findElement('p') == this && e.findElement('body') == document.body &&
142		e.findElement('foo') == null) this.passed()
143		else this.failed()
144		log(e)
	162	e.findElement('foo') == null) this.passed();
	163	else this.failed();
	164	log(e);
145	165	})
146	166	</script>
…	…
152	172	Event.observe($('left', 'middle', 'right'), 'mousedown', function(e){
153	173	if (Event['is' + this.id.capitalize() + 'Click'](e)) this.passed('Squeak!')
154		else this.failed('OH NO!')
155		log(e)
	174	else this.failed('OH NO!');
	175	log(e);
156	176	})
157	177	</script>
…	…
161	181	<script type="text/javascript">
162	182	$('context').observe('contextmenu', function(e){
163		this.passed()
164		Event.stop(e)
165		log(e)
	183	this.passed();
	184	Event.stop(e);
	185	log(e);
166	186	})
167	187	</script>
…	…
171	191	<script type="text/javascript">
172	192	$('stop').observe('click', function(e){
173		e.stop()
174		this.passed()
175		log(e)
	193	e.stop();
	194	this.passed();
	195	log(e);
176	196	})
177	197	$('container').observe('click', function(e){
178		$('stop').failed()
179		log(e)
	198	$('stop').failed();
	199	log(e);
180	200	})
181	201	</script>
…	…
185	205	<script type="text/javascript">
186	206	$('capture1').observe('click', function(e){
187		$('capture2').failed('Event capture failed')
188		log(e)
	207	$('capture2').failed('Event capture failed');
	208	log(e);
189	209	}, true)
190	210	$('capture2').observe('click', function(e){
191	211	el = $('capture2')
192		if (el.className) el.passed()
193		else el.failed('Event capture failed')
194		log(e)
	212	if (el.className) el.passed();
	213	else el.failed('Event capture failed');
	214	log(e);
195	215	})
196	216	</script>
…	…
203	223	<script type="text/javascript">
204	224	$('keyup').observe('keyup', function(e){
205		el = $('keyup_log')
206		el.passed('Key captured: the length is ' + $('keyup').value.length)
207		log(e)
	225	el = $('keyup_log');
	226	el.passed('Key captured: the length is ' + $('keyup').value.length);
	227	log(e);
208	228	})
209	229	</script>
…	…
219	239	var list = item.parentNode
220	240	$(item).remove() // wow, this stops propagation (except in Opera)
221		if(!list.childNodes.length) $('each').passed()
	241	if(!list.childNodes.length) $('each').passed();
222	242	Event.stop(e) // for Opera :)
223		log(e)
	243	log(e);
224	244	})
225	245	$('list').observe('click', function(e){
226	246	$('each').failed()
227		log(e)
	247	log(e);
228	248	})
229	249	</script>
…	…
239	259	e.stopPropagation()
240	260	$('each2').failed()
241		log(e)
	261	log(e);
242	262	})
243	263	Event.stopObserving($A($('list2').childNodes))
244	264	$('list2').observe('click', function(e){
245		$('each2').passed()
246		log(e)
	265	$('each2').passed();
	266	log(e);
247	267	})
248	268	</script>
…	…
259	279	if (str != 'foo') throw 'wrong string: ' + str
260	280	if (arr.constructor != Array) throw '3rd parameter is not an array'
261		el.passed()
	281	el.passed();
262	282	}
263	283	catch (err) { el.failed(err.toString()) }
264		log(e)
	284	log(e);
265	285	}.bindAsEventListener(document.body, 'foo', [1,2,3]))
266	286	</script>
…	…
273	293	try { el.passed(Object.inspect(e)) }
274	294	catch (err) { el.failed('Failed! Error thrown') }
275		log(e)
	295	log(e);
276	296	})
277	297	</script>
…	…
288	308	this.update('Registered two unload events, one inline ("onunload") and one regular - try to refresh, both should fire')
289	309	this._done = true
290		log(e)
291		})
292		</script>
	310	log(e);
	311	})
	312	</script>
	313
	314	<p id="custom_events">Custom events test</p>
	315
	316	<p id="custom_events_target">Lorem ipsum dolor sit amet.</p>
	317
	318	<script type="text/javascript">
	319	$('custom_events').observe('click', function(e) {
	320	var c = $('custom_events_target');
	321	Event.Custom.observe(c, 'update', function(e) {
	322	console.log(e.target);
	323	alert('update event fired!');
	324
	325	e.target.style.border = '1px solid #090';
	326	});
	327
	328	setTimeout(function() { c.update('The quick brown fox.'); }, 1000);
	329
	330	});
	331	</script>
	332
293	333	</body>
294	334	</html>

Rails Trac

Navigation

Changeset 7042

Legend:

spinoffs/prototype/branches/event/src/event.js

spinoffs/prototype/branches/event/test/functional/event.html

Download in other formats: