Vars & functions to control tab dragging

New dragSrcEl variable and 4 x functions to hand start, over, drop and
end
Means tabs can now be dragged & all references appropriately swapped
This commit is contained in:
Matt Pass
2012-06-21 07:56:10 +01:00
parent d6a5f486d7
commit c1f4740b68

View File

@@ -23,6 +23,7 @@ var ICEcoder = {
stickyTab: false, // If we have a sticky tab open or not
stickyTabWindow: false, // Target variable for the sticky tab window
pluginIntervalRefs: [], // Array of plugin interval refs
dragSrcEl: null, // Tab element being dragged
// Don't consider these tags as part of nesting as they're singles, JS, PHP or Ruby code blocks
tagNestExceptions: ["!DOCTYPE","meta","link","img","br","hr","input","script","?php","?","%"],
@@ -50,6 +51,16 @@ var ICEcoder = {
top.document.getElementById('accountLogin').style.top = "-50px";
setTimeout(function() {top.document.getElementById('accountLoginContainer').style.display = "none";},300);
}
// Add drag based events to our tabs
var tabs = document.querySelectorAll('.tab');
[].forEach.call(tabs, function(tab) {
// not used: dragenter, dragleave
tab.addEventListener('dragstart', ICEcoder.handleDragStart, false);
tab.addEventListener('dragover', ICEcoder.handleDragOver, false);
tab.addEventListener('drop', ICEcoder.handleDrop, false);
tab.addEventListener('dragend', ICEcoder.handleDragEnd, false);
});
},
// Set our layout according to the browser size
@@ -1572,5 +1583,56 @@ var ICEcoder = {
zipIt: function(tgt) {
tgt=tgt.replace(top.fullPath+"/","").replace(/\//g,"|");
top.ICEcoder.filesFrame.contentWindow.frames['fileControl'].location.href="plugins/zip-it/index.php?zip="+tgt;
},
// Tab dragging start
handleDragStart: function(e) {
this.style.opacity = '0.2';
ICEcoder.dragSrcEl = this;
e.dataTransfer.effectAllowed = 'move';
e.dataTransfer.setData('text/html', this.innerHTML);
},
// Tab dragging over tabs
handleDragOver: function(e) {
if (e.preventDefault) {e.preventDefault()}
e.dataTransfer.dropEffect = 'move';
return false;
},
// Tab dropping on target
handleDrop: function(e) {
if (e.stopPropagation) {e.stopPropagation()}
if (ICEcoder.dragSrcEl != this) {
ICEcoder.dragSrcEl.innerHTML = this.innerHTML.split(" ")[0] + ICEcoder.dragSrcEl.innerHTML.substr(ICEcoder.dragSrcEl.innerHTML.indexOf(" "),ICEcoder.dragSrcEl.innerHTML.length);
this.innerHTML = e.dataTransfer.getData('text/html').split(" ")[0] + this.innerHTML.substr(ICEcoder.dragSrcEl.innerHTML.indexOf(" "),ICEcoder.dragSrcEl.innerHTML.length);
var dragID = ICEcoder.dragSrcEl.id.substr(3,ICEcoder.dragSrcEl.id.length)*1;
var dropID = this.id.substr(3,this.id.length)*1;
if(dragID==top.ICEcoder.selectedTab) {
var a; // array value
var b = dragID-1;
var c = dropID-1;
a = top.ICEcoder.changedContent;
a[b]=[a[c],a[c]=a[b]][0];
a = top.ICEcoder.openFiles;
a[b]=[a[c],a[c]=a[b]][0];
a = top.ICEcoder.openFileMDTs;
a[b]=[a[c],a[c]=a[b]][0];
a = top.ICEcoder.cMInstances;
a[b]=[a[c],a[c]=a[b]][0];
top.ICEcoder.switchTab(dropID);
}
}
return false;
},
// Tab drag ending
handleDragEnd: function(e) {
this.style.opacity = '1';
}
};