draggable_DC

Make DC's windows draggable

目前為 2014-06-04 提交的版本,檢視 最新版本

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

You will need to install an extension such as Tampermonkey to install this script.

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

// ==UserScript==
// @name		draggable_DC
// @author		Ladoria
// @version		0.21
// @grant       none
// @description	Make DC's windows draggable
// @match		http://www.dreadcast.net/Main
// @require     http://code.jquery.com/jquery-latest.min.js
// @copyright	2012+, Ladoria
// @namespace GTFO
// ==/UserScript==

// DEBUG Don't touch those damn things!
var global_debug = false;
var event_debug = (global_debug) ? true : false;
var loading_debug = (global_debug) ? true : false;
var setting_debug = (global_debug) ? true : false;
// /DEBUG

// VARIABLES Don't touch those damn things!
var zIndex = 310000;
var dragging = false;
var DC_draggable = new Array();
// / VARIABLES

/* 	How to :
	- Chaque indice du tableau doit être l'identifiant unique de l'élément à rendre déplaçable sur l'interface de DC.
	- Créer un indice du tableau DC_draggable contenant un tableau vide afin faire remonter l'élément au premier plan suite à un appuie sur le clic gauche de votre souris. (CF ligne pour 'zone_centre')
	- Créer un indice du tableau DC_draggable contenant un tableau contentant un indice 'checkbox' afin d'activer la possibilité de déplacement de l'élément.
*/

// SETTABLE Touche those nice things!
DC_draggable['zone_centre'] = new Array();

DC_draggable['zone_gauche'] = new Array();
DC_draggable['zone_gauche']['checkbox'] = '<div style="height:0px;width:0px;margin-right:-13px;z-index:999999;"><input type="checkbox" name="zone_gauche" class="DC_draggable"></div>';

DC_draggable['zone_droite'] = new Array();
DC_draggable['zone_droite']['checkbox'] = '<div style="height:0px;width:0px;margin-right:-13px;z-index:999999;"><input type="checkbox" name="zone_droite" class="DC_draggable"></div>';

DC_draggable['zone_informations_lieu'] = new Array();
DC_draggable['zone_informations_lieu']['checkbox'] = '<div style="top:-11px;left:-15px;height:0px;width:0px;margin-right:-13px;z-index:999999;"><input type="checkbox" name="zone_informations_lieu" class="DC_draggable"></div>';

DC_draggable['zone_informations_combat'] = new Array();
DC_draggable['zone_informations_combat']['checkbox'] = '<div style="top:-11px;left:-15px;height:0px;width:0px;margin-right:-13px;z-index:999999;"><input type="checkbox" name="zone_informations_combat" class="DC_draggable"></div>';

DC_draggable['db_combat'] = new Array();
DC_draggable['db_combat']['checkbox'] = '<div style="top:-36px;left:-10px;height:0px;width:0px;margin-right:-13px;z-index:999999;"><input type="checkbox" name="db_combat" class="DC_draggable"></div>';
// /SETTABLE

jQuery.noConflict();

$(document).ready( function() {
	// make the element in given array (DC_draggabele model) draggables
	function set_DC_draggable(make_draggable) {
		var to_drag = Object.keys(make_draggable);
		
		if(setting_debug) console.log('setting draggable options for: ' + to_drag);
	
		for(var i = 0; i < to_drag.length; i++) {
			var element = to_drag[i];
			var selector = '#' + element;
			
			if(loading_debug) console.log('\n' + element + ': ' + ((0 != $(selector).length) ? 'founded, process...' : 'missing, skip...'));
			
			if(0 != $(selector).length) {
				DC_draggable[element]['draggable'] = false;
				DC_draggable[element]['offset'] = $(selector).offset();
				
				$(selector).addClass('DC_draggable');
				
				if(undefined != DC_draggable[element]['checkbox']) {
					$(selector + ' div').first().before(DC_draggable[element]['checkbox']);
					
					$('input[type=checkbox][name=' + element +'].DC_draggable').click( function() {
						if($(this).is(':checked'))
							enableDrag($(this).attr('name'));
						else
							disableDrag($(this).attr('name'));
						
						if(event_debug) console.log('checked: ' + $(this).attr('name'));
					});
					if(loading_debug) console.log('event:click:checkbox: done');
					
					// place the element to its original area
					$(selector).dblclick( function() {
						if(true == DC_draggable[$(this).attr('id')]['draggable'])
							$('#' + $(this).attr('id')).offset(DC_draggable[$(this).attr('id')]['offset']);
						
						if(event_debug) console.log('Reinitialized: ' + $(this).attr('id'));
					});
					if(loading_debug) console.log('event:doubleclick: done');
					
					// set size end background of element while dragging
					$(selector).bind('drag', function(event) {
						if(true == DC_draggable[$(this).attr('id')]['draggable']) {
							if(!dragging) {
								dragging = true;
								$('#' + $(this).attr('id')).css('backgroundColor','rgba(172, 0, 0, 0.6)');
								$('#' + $(this).attr('id')).css('bottom','auto');
								
								if(event_debug) console.log('dragging: ' + $(this).attr('id'));
							}
						}
					});
					if(loading_debug) console.log('event:drag: done');
					
					// set original background of element at the end of drag
					$(selector).mouseup( function() {
						if(dragging) {
							dragging = false;
							
							$('#' + $(this).attr('id')).css('backgroundColor', DC_draggable[$(this).attr('id')]['backgroundColor']);
							
							if(event_debug) if(!dragging) console.log('end of drag: ' + $(this).attr('id'));
						}
					});
					if(loading_debug) console.log('event:mouseup: done');
				}
				
				// puts the element on foreground
				$(selector).mousedown( function() {
					zIndex++;
					$('#' + $(this).attr('id')).zIndex(zIndex);
					
					if(event_debug) console.log('foregrounded: ' + $(this).attr('id'));
				});
				if(loading_debug) console.log('event:mousedown: done');
			}
		}
	}
	
	// need that to let the javascript display all element after the 'ready' state of the DOM
	setTimeout( function() {
		if(setting_debug) console.log('delayed loading.');
	
		set_DC_draggable(DC_draggable);
	}, 1000);
	
	// enabling dragging of element
	function enableDrag(id) {
		$('#' + id).draggable();
		$('#' + id).css('cursor','move');
		DC_draggable[id]['draggable'] = true;
		DC_draggable[id]['backgroundColor'] = $('#' + id).css('backgroundColor');
		
		if(undefined == DC_draggable[id]['offset'])
			DC_draggable[id]['offset'] = $('#' + id).offset();
			
		if(setting_debug) console.log('drag enabled: ' + id);
	}
	// disable dragging of element
	function disableDrag(id) {
		$('#' + id).draggable('destroy');
		$('#' + id).addClass('');
		$('#' + id).css('cursor','auto');
		DC_draggable[id]['draggable'] = false;
		
		if(setting_debug) console.log('drag disabled: ' + id);
	}
	
	// set draggable element 'after' combat's interface loading
	$(document).ajaxSend( function(a,b,c) {
		if(c.url == '/Interface/Fight') {
			if(event_debug) console.log('fight\'s interface is requesting.');
			
			setTimeout( function() {
				if(setting_debug) console.log('delayed loading.');
				
				var DC_draggable_fight = new Array();
				DC_draggable_fight['zone_informations_combat'] = DC_draggable['zone_informations_combat'];
				DC_draggable_fight['db_combat'] = DC_draggable['db_combat'];
				
				set_DC_draggable(DC_draggable_fight);
			}, 1000);
		}
	});
});