/*
* table of content drag and drop
*/
var dx = 0, dy = 0;
var drag = function ( e ) {
e.dataTransfer.setData ( "Text", e.target.id );
dx = e.target.offsetLeft - e.x;
dy = e.target.offsetTop - e.y;
}
var allowDrop = function ( e ) {
e.preventDefault ();
}
var drop = function ( e ) {
e.preventDefault ();
var id = e.dataTransfer.getData ( "Text" );
var dropped = document.getElementById ( id );
dropped.style.cssText = "position:fixed;left:"
+ (e.x + dx) + "px;top:" + (e.y + dy) + "px;width:15em;"
+ "border:1px solid #ccc;margin:0px!important;"
+ "border-top: 1px solid #ccc!important;"
+ "z-index:2;box-shadow:rgba(80, 80, 80, 0.5) 0px 2px 4px;"
+ "background-color:rgba(240, 240, 240, 0.80);";
}
var page = document.getElementById ( "content" );
if ( page ) {
page.setAttribute ( "ondragover", "allowDrop(event);" );
page.setAttribute ( "ondrop", "drop(event);" );
}
var toc = document.getElementById ( "toc" );
if ( toc ) {
toc.setAttribute ( "draggable", "true" );
toc.setAttribute ( "ondragstart", "drag(event);" )
}