MediaWiki: Common.js
From ShareRice Wiki (AFN)
| Line 1: | Line 1: | ||
/* Any JavaScript here will be loaded for all users on every page load. */ | /* Any JavaScript here will be loaded for all users on every page load. */ | ||
| + | var _asianfuse = { | ||
| + | maxWidth: 425, | ||
| + | maxHeight: 350, | ||
| + | containers: [], | ||
| + | embeds: [], | ||
| + | restores: [], | ||
| + | container: function(id){ return(jQuery('#af-media-embed-container_' + id)); }, | ||
| + | embed: function(id){ return(jQuery('#af-media-embed_' + id)); }, | ||
| + | restore: function(id){ return(jQuery('#af-media-restore_' + id)); }, | ||
| + | ratio: function(id) { return(_asianfuse.container(id_num).height() / _asianfuse.embed(id_num).height()); }, | ||
| + | is_maximized: function(id) { | ||
| + | return parseInt(this.container(id).height()) == (this.maxHeight * this.ratio(id)) && parseInt(this.container(id).width()) == parseInt(_asianfuse.maxWidth); | ||
| + | } | ||
| + | } | ||
| − | + | function setDefaults() { | |
| − | + | jQuery('.afv').each(function(i, el) { | |
| − | + | id_num = this.id.split('_', 2)[1] | |
| − | |||
| − | |||
| − | |||
| − | |||
| − | + | _asianfuse.containers[id_num] = { height: _asianfuse.container(id_num).height(), width: _asianfuse.container(id_num).width(), ratio: _asianfuse.ratio(id_num) } | |
| − | + | _asianfuse.embeds[id_num] = { height: _asianfuse.embed(id_num).height(), width: _asianfuse.embed(id_num).width() } | |
| − | + | }); | |
| − | |||
| − | this. | + | } |
| − | + | ||
| + | function setMouseDownEvents() { | ||
| + | jQuery('.afv').mousedown(function(e) { | ||
| + | id_num = this.id.split('_', 2)[1]; | ||
| + | |||
| + | if( e.which != 1 || _asianfuse.is_maximized(id_num) ) { return; } | ||
| + | |||
| + | _asianfuse.container(id_num).width(_asianfuse.maxWidth + 'px'); | ||
| + | _asianfuse.container(id_num).height((_asianfuse.maxHeight * _asianfuse.containers[id_num].ratio) + 'px'); | ||
| + | |||
| + | _asianfuse.embed(id_num).width(_asianfuse.maxWidth + 'px'); | ||
| + | _asianfuse.embed(id_num).height(_asianfuse.maxHeight + 'px'); | ||
// Reset the width relative to the width of the embedded video, | // Reset the width relative to the width of the embedded video, | ||
// because we cannot count on it's parent element's calculated width to cause this to display as expected | // because we cannot count on it's parent element's calculated width to cause this to display as expected | ||
| − | + | _asianfuse.restore(id_num).width((_asianfuse.maxWidth * 0.98) + 'px'); | |
| − | + | _asianfuse.restore(id_num).show(); | |
| − | } | + | }); |
| − | + | } | |
| − | |||
| − | |||
| − | |||
| − | |||
| − | + | function setRestoreEvents() { | |
| − | + | jQuery('div.restore').click(function(e) { | |
| − | + | id_num = this.id.split('_', 2)[1] | |
| − | |||
| − | + | if( _asianfuse.is_maximized(id_num) ) { | |
| − | + | _asianfuse.restore(id_num).hide(); | |
| − | + | _asianfuse.embed(id_num).width(_asianfuse.embeds[id_num].width + 'px'); | |
| − | + | _asianfuse.embed(id_num).height(_asianfuse.embeds[id_num].height + 'px'); | |
| − | |||
| − | |||
| − | + | _asianfuse.container(id_num).width(_asianfuse.containers[id_num].width + 'px'); | |
| − | + | _asianfuse.container(id_num).height(_asianfuse.containers[id_num].height + 'px'); | |
| − | + | } | |
| − | + | }); | |
| − | |||
| − | |||
| − | |||
| − | } | ||
} | } | ||
function initAsianFuseVideoPanels() { | function initAsianFuseVideoPanels() { | ||
| − | + | setDefaults(); | |
| − | + | setMouseDownEvents(); | |
| − | + | setRestoreEvents(); | |
| − | |||
} | } | ||
addOnloadHook( initAsianFuseVideoPanels ); | addOnloadHook( initAsianFuseVideoPanels ); | ||
Revision as of 02:00, 5 August 2011
/* Any JavaScript here will be loaded for all users on every page load. */
var _asianfuse = {
maxWidth: 425,
maxHeight: 350,
containers: [],
embeds: [],
restores: [],
container: function(id){ return(jQuery('#af-media-embed-container_' + id)); },
embed: function(id){ return(jQuery('#af-media-embed_' + id)); },
restore: function(id){ return(jQuery('#af-media-restore_' + id)); },
ratio: function(id) { return(_asianfuse.container(id_num).height() / _asianfuse.embed(id_num).height()); },
is_maximized: function(id) {
return parseInt(this.container(id).height()) == (this.maxHeight * this.ratio(id)) && parseInt(this.container(id).width()) == parseInt(_asianfuse.maxWidth);
}
}
function setDefaults() {
jQuery('.afv').each(function(i, el) {
id_num = this.id.split('_', 2)[1]
_asianfuse.containers[id_num] = { height: _asianfuse.container(id_num).height(), width: _asianfuse.container(id_num).width(), ratio: _asianfuse.ratio(id_num) }
_asianfuse.embeds[id_num] = { height: _asianfuse.embed(id_num).height(), width: _asianfuse.embed(id_num).width() }
});
}
function setMouseDownEvents() {
jQuery('.afv').mousedown(function(e) {
id_num = this.id.split('_', 2)[1];
if( e.which != 1 || _asianfuse.is_maximized(id_num) ) { return; }
_asianfuse.container(id_num).width(_asianfuse.maxWidth + 'px');
_asianfuse.container(id_num).height((_asianfuse.maxHeight * _asianfuse.containers[id_num].ratio) + 'px');
_asianfuse.embed(id_num).width(_asianfuse.maxWidth + 'px');
_asianfuse.embed(id_num).height(_asianfuse.maxHeight + 'px');
// Reset the width relative to the width of the embedded video,
// because we cannot count on it's parent element's calculated width to cause this to display as expected
_asianfuse.restore(id_num).width((_asianfuse.maxWidth * 0.98) + 'px');
_asianfuse.restore(id_num).show();
});
}
function setRestoreEvents() {
jQuery('div.restore').click(function(e) {
id_num = this.id.split('_', 2)[1]
if( _asianfuse.is_maximized(id_num) ) {
_asianfuse.restore(id_num).hide();
_asianfuse.embed(id_num).width(_asianfuse.embeds[id_num].width + 'px');
_asianfuse.embed(id_num).height(_asianfuse.embeds[id_num].height + 'px');
_asianfuse.container(id_num).width(_asianfuse.containers[id_num].width + 'px');
_asianfuse.container(id_num).height(_asianfuse.containers[id_num].height + 'px');
}
});
}
function initAsianFuseVideoPanels() {
setDefaults();
setMouseDownEvents();
setRestoreEvents();
}
addOnloadHook( initAsianFuseVideoPanels );