用asp.net的silverlight控件做播放器例子

// ----------------------------------------------------------------------- // Copyright (C) Microsoft Corporation. All rights reserved. // ----------------------------------------------------------------------- // SilverlightMedia.js // MediaPlayer component Type.registerNamespace('Sys.UI.Silverlight'); Sys.UI.Silverlight._DomElement = function(element, visible) { // <summary>Represents a Silverlight element.</summary> // <param name="element">The Silverlight element.</param> // <param name="visible" type="Boolean">Specifies whether the element is expected to be initially visible.</param> this._element = element; this._visible = !!visible; this._bindAutoAnimations(element, element.Name); } Sys.UI.Silverlight._DomElement.prototype = { _events: null, _animations: null, _enabled: true, _mouseOver: false, get_element: function() { // <value>The Silverlight element</value> return this._element; }, get_enabled: function() { // <value type="Boolean">Determines whether the DomElement responds to Silverlight events.</value> return this._enabled; }, set_enabled: function(value) { if (value !== this.get_enabled()) { // e.g. might make the element look grayed out or increase its alpha this._enabled = value; this._play(value ? "enable" : "disable"); // If element becomes disabled while the mouse is over // play the mouse_leave animation as well, otherwise the element remains // stuck in the mouse_enter state. if (!value && this._mouseOver) { this._play("leave"); this._mouseOver = false; } } }, get_visible: function() { // <value type="Boolean">Toggles the Silverlight element's visibility.</value> return this._visible; }, set_visible: function(value) { if (value !== this.get_visible()) { this._visible = value; if (!this._play(value ? "show" : "hide")) { // if no show/hide animation then directly set the element visibility this.get_element().visibility = value ? 0 : 1; } } }, _bindAutoAnimations: function(element, name) { this._animations = { "show": element.findName(name + "_Show"), "hide": element.findName(name + "_Hide"), "enable": element.findName(name + "_Enable"), "disable": element.findName(name + "_Disable"), "leave": element.findName(name + "_MouseLeave") } if (this._animations["leave"]) { // no need to hook these events if there's no MouseLeave event // we only hook these to play // _MouseLeave when the element becomes disabled. this.bindEvent("mouseEnter", name + "_MouseEnter", this._onEnter); this.bindEvent("mouseLeave", name + "_MouseLeave", this._onLeave); } }, bindEvent: function(eventName, animationName, callback, callbackOwner) { // helper that reduces code necessary to bind a silverlight event to a function // and have it play an animation by name // if get_enabled() is false, animations don't play and callbacks aren't called. // For example, a disabled button does nothing even though a MouseEnter // storyboard exists for it. var element = this.get_element(); var animation = null; if (animationName) { animation = element.findName(animationName); } // no animation found and theres no callback, no reason to hook the event if (!animation && !callback) return; if (callback) { callback = Function.createDelegate(callbackOwner || this, callback); } var handler = this._createEventHandler(animation, callback); var token = element.addEventListener(eventName, handler); // save token in _events so we can automatically removeEventListener in dispose if (!this._events) { this._events = []; } // handler is not actually needed because only the token is used to remove the event // but access to the handler is needed by some QA automation in order to simulate // actual silverlight UI events like mouseEnter. this._events[this._events.length] = { eventName: eventName, token: token, handler: handler }; }, _createEventHandler: function(animation, callback) { return Function.createDelegate(this, function(sender, args) { if (!this.get_enabled()) return; // if callback exists, it can return false to cancel animation if any if (callback && !callback(sender, args)) return; if (animation) { animation.begin(); } }); }, dispose: function() { if (this._events) { var element = this.get_element(); for (var i = 0, l = this._events.length; i < l; i++) { var e = this._events[i]; element.removeEventListener(e.eventName, e.token); } this._events = null; } this._animations = null; this._element = null; }, _onEnter: function() { this._mouseOver = true; return true; }, _onLeave: function() { this._mouseOver = false; return true; }, _play: function(name) { var a = this._animations[name]; if (a) { a.begin(); return true; } return false; } } Sys.UI.Silverlight._DomElement.registerClass('Sys.UI.Silverlight._DomElement', null, Sys.IDisposable); Sys.UI.Silverlight._Button = function(element, visible, repeatInterval, clickCallback, doubleClickCallback, callbackOwner, states) { // <summary> // Makes a Silverlight element behave like a button. Clicking it calls the click callback. Double clicking it calls // the double click callback. If given, repeats the click event continuously while pressed. If a state list is given, // supports a mutli-state button where each click toggles it's state. // </summary> Sys.UI.Silverlight._Button.initializeBase(this, [element, visible]); element.cursor = "Hand"; this._repeatInterval = repeatInterval; this._clickDelegate = clickCallback ? Function.createDelegate(callbackOwner, clickCallback) : null; this._doubleClickDelegate = doubleClickCallback ? Function.createDelegate(callbackOwner, doubleClickCallback) : null; this._elements = []; if (states) { // button has child states for (var i = 0; i < states.length; i++) { var e = element.findName(states[i]); // States may not actually exist in the UI and are optional. // For example, a PlayPauseButton that doesn't have play/pause symbols. // But we still keep track of the state of the button. // Only the first state item is assumed to be visible by default, i === 0, // for example, by default a PlayPauseButton has the PlaySymbol visible and PauseSymbol not visible. this._elements[i] = e ? new Sys.UI.Silverlight._DomElement(e, i === 0) : null; } } } Sys.UI.Silverlight._Button.prototype = { _down: false, _last: 0, _state: 0, _repeatTimeout: null, _repeatClickDelegate: null, set_enabled: function(value) { Sys.UI.Silverlight._Button.callBaseMethod(this, "set_enabled", [value]); this.get_element().cursor = value ? "Hand" : "