From 6098fc905739b7335aaad940e685b7fb9c7335ee Mon Sep 17 00:00:00 2001 From: Uwe Steinmann Date: Tue, 8 Mar 2016 06:56:58 +0100 Subject: [PATCH] much cleaner drap&drop support --- styles/bootstrap/application.js | 126 ++++++++++++++++++++-------- views/bootstrap/class.Bootstrap.php | 26 +++--- 2 files changed, 102 insertions(+), 50 deletions(-) diff --git a/styles/bootstrap/application.js b/styles/bootstrap/application.js index cfbfa30a7..c7aeda920 100644 --- a/styles/bootstrap/application.js +++ b/styles/bootstrap/application.js @@ -396,37 +396,6 @@ function allowDrop(ev) { return false; } -function onDragStartDocument(ev) { - attr_rel = $(ev.target).attr('rel'); - ev.dataTransfer.setData("id", attr_rel.split("_")[1]); - ev.dataTransfer.setData("type","document"); -} - -function onDragStartFolder(ev) { - attr_rel = $(ev.target).attr('rel'); - ev.dataTransfer.setData("id", attr_rel.split("_")[1]); - ev.dataTransfer.setData("type","folder"); -} - -function onDrop(ev) { - ev.preventDefault(); - ev.stopPropagation(); - attr_rel = $(ev.currentTarget).attr('rel'); - target_type = attr_rel.split("_")[0]; - target_id = attr_rel.split("_")[1]; - source_type = ev.dataTransfer.getData("type"); - source_id = ev.dataTransfer.getData("id"); - if(source_type == 'document') { - url = "../out/out.MoveDocument.php?documentid="+source_id+"&targetid="+target_id; - document.location = url; - } else if(source_type == 'folder') { - url = "../out/out.MoveFolder.php?folderid="+source_id+"&targetid="+target_id; - document.location = url; - } -// console.log(attr_rel); -// console.log(ev.dataTransfer.getData("type") + ev.dataTransfer.getData("id")); -} - function onAddClipboard(ev) { ev.preventDefault(); source_type = ev.originalEvent.dataTransfer.getData("type"); @@ -624,7 +593,10 @@ $(document).ready(function() { obj.on('dragenter', function (e) { e.stopPropagation(); e.preventDefault(); - $(this).css('border', '2px dotted #0B85A1'); + $(this).css('border', '2px dashed #0B85A1'); + }); + obj.on('dragleave', function (e) { + $(this).css('border', '0px solid white'); }); obj.on('dragover', function (e) { e.stopPropagation(); @@ -639,29 +611,109 @@ $(document).ready(function() { SeedDMSUpload.handleFileUpload(files,obj); }); - var clipboard = $("#main-clipboard"); + var folder = $(".table-row-folder"); + folder.on('dragenter', function (e) { + e.stopPropagation(); + e.preventDefault(); + $(e.currentTarget).css('border', '2px dashed #0B85A1'); + }); + folder.on('dragleave', function (e) { + e.stopPropagation(); + e.preventDefault(); + $(e.currentTarget).css('border', '0px solid white'); + }); + folder.on('dragover', function (e) { + e.stopPropagation(); + e.preventDefault(); + }); + folder.on('drop', function (e) { + e.preventDefault(); + e.stopPropagation(); + attr_rel = $(e.currentTarget).attr('rel'); + target_type = attr_rel.split("_")[0]; + target_id = attr_rel.split("_")[1]; + source_type = e.originalEvent.dataTransfer.getData("type"); + source_id = e.originalEvent.dataTransfer.getData("id"); + if(source_type == 'document') { + url = "../out/out.MoveDocument.php?documentid="+source_id+"&targetid="+target_id; + document.location = url; + } else if(source_type == 'folder') { + url = "../out/out.MoveFolder.php?folderid="+source_id+"&targetid="+target_id; + document.location = url; + } + }); + folder.on('dragstart', function (e) { + attr_rel = $(e.target).attr('rel'); + if(typeof attr_rel == 'undefined') + return; + e.originalEvent.dataTransfer.setData("id", attr_rel.split("_")[1]); + e.originalEvent.dataTransfer.setData("type","folder"); + }); + + var doc = $(".table-row-document"); + doc.on('dragstart', function (e) { + attr_rel = $(e.target).attr('rel'); + if(typeof attr_rel == 'undefined') + return; + e.originalEvent.dataTransfer.setData("id", attr_rel.split("_")[1]); + e.originalEvent.dataTransfer.setData("type","document"); + }); + + var clipboard = $("#main-clipboard div.alert"); clipboard.on('dragenter', function (e) { e.stopPropagation(); e.preventDefault(); - $(this).css('border', '2px dotted #0B85A1'); + $(this).css('border', '2px dashed #0B85A1'); + }); + clipboard.on('dragleave', function (e) { + $(this).css('border', '0px solid white'); + }); + clipboard.on('dragover', function (e) { + e.preventDefault(); }); clipboard.on('drop', function (e) { $(this).css('border', '0px dotted #0B85A1'); onAddClipboard(e); }); - $(document).on('dragenter', function (e) { + $("#jqtree").on('dragenter', function (e) { + attr_rel = $(e.srcElement).attr('rel'); + if(typeof attr_rel == 'undefined') + return; + $(e.srcElement).parent().css('border', '2px dashed #0B85A1'); e.stopPropagation(); e.preventDefault(); }); - $(document).on('dragover', function (e) { + $("#jqtree").on('dragleave', function (e) { + attr_rel = $(e.srcElement).attr('rel'); + if(typeof attr_rel == 'undefined') + return; + $(e.srcElement).parent().css('border', '0px solid white'); e.stopPropagation(); e.preventDefault(); }); - $(document).on('drop', function (e) { + $("#jqtree").on('dragover', function (e) { e.stopPropagation(); e.preventDefault(); }); + $("#jqtree").on('drop', function (e) { + e.stopPropagation(); + e.preventDefault(); + attr_rel = $(e.srcElement).attr('rel'); + if(typeof attr_rel == 'undefined') + return; + target_type = attr_rel.split("_")[0]; + target_id = attr_rel.split("_")[1]; + source_type = e.originalEvent.dataTransfer.getData("type"); + source_id = e.originalEvent.dataTransfer.getData("id"); + if(source_type == 'document') { + url = "../out/out.MoveDocument.php?documentid="+source_id+"&targetid="+target_id; + document.location = url; + } else if(source_type == 'folder') { + url = "../out/out.MoveFolder.php?folderid="+source_id+"&targetid="+target_id; + document.location = url; + } + }); $('div.splash').each(function(index) { var element = $(this); diff --git a/views/bootstrap/class.Bootstrap.php b/views/bootstrap/class.Bootstrap.php index e72ac94db..33b8af6fc 100644 --- a/views/bootstrap/class.Bootstrap.php +++ b/views/bootstrap/class.Bootstrap.php @@ -329,7 +329,7 @@ $(document).ready(function () { for ($i = 0; $i < count($path); $i++) { $txtpath .= "
  • "; if ($i +1 < count($path)) { - $txtpath .= "getID()."&showtree=".showtree()."\" rel=\"folder_".$path[$i]->getID()."\" ondragover=\"allowDrop(event)\" ondrop=\"onDrop(event)\">". + $txtpath .= "getID()."&showtree=".showtree()."\" rel=\"folder_".$path[$i]->getID()."\" class=\"table-row-folder\">". htmlspecialchars($path[$i]->getName()).""; } else { @@ -1308,7 +1308,7 @@ $(function() { onCreateLi: function(node, $li) { // Add 'icon' span before title if(node.is_folder) - $li.find('.jqtree-title').before(' ').attr('rel', 'folder_' + node.id).attr('ondragover', 'allowDrop(event)').attr('ondrop', 'onDrop(event)'); + $li.find('.jqtree-title').before(' ').attr('rel', 'folder_' + node.id).attr('_ondragover', 'allowDrop(event)').attr('_ondrop', 'onDrop(event)'); else $li.find('.jqtree-title').before(' '); } @@ -1351,9 +1351,9 @@ $(function() { if($folder = $dms->getFolder($folderid)) { $comment = $folder->getComment(); if (strlen($comment) > 150) $comment = substr($comment, 0, 147) . "..."; - $content .= "getID()."\" class=\"folder\" ondragover=\"allowDrop(event)\" ondrop=\"onDrop(event)\">"; - $content .= "getID()."\" draggable=\"true\" ondragstart=\"onDragStartFolder(event);\" href=\"out.ViewFolder.php?folderid=".$folder->getID()."&showtree=".showtree()."\">imgpath."folder.png\" width=\"24\" height=\"24\" border=0>\n"; - $content .= "getID()."&showtree=".showtree()."\">" . htmlspecialchars($folder->getName()) . ""; + $content .= "getID()."\" class=\"folder table-row-folder\">"; + $content .= "getID()."&showtree=".showtree()."\">imgpath."folder.png\" width=\"24\" height=\"24\" border=0>\n"; + $content .= "getID()."&showtree=".showtree()."\">" . htmlspecialchars($folder->getName()) . ""; if($comment) { $content .= "
    ".htmlspecialchars($comment).""; } @@ -1378,10 +1378,10 @@ $(function() { $version = $latestContent->getVersion(); $status = $latestContent->getStatus(); - $content .= ""; + $content .= ""; if (file_exists($dms->contentDir . $latestContent->getPath())) { - $content .= ""; + $content .= ""; if($previewer->hasPreview($latestContent)) { $content .= "getID()."&version=".$latestContent->getVersion()."&width=40\" title=\"".htmlspecialchars($latestContent->getMimeType())."\">"; } else { @@ -1425,7 +1425,7 @@ $(function() { */ function printClipboard($clipboard){ /* {{{ */ $this->contentHeading(getMLText("clipboard"), true); - echo "
    \n"; + echo "
    \n"; echo $this->mainClipboard($clipboard); echo "
    \n"; } /* }}} */ @@ -1626,7 +1626,7 @@ $(function() { $docID = $document->getID(); if(!$skipcont) - $content .= ""; + $content .= ""; if($latestContent = $document->getLatestContent()) { $previewer->createPreview($latestContent); @@ -1648,7 +1648,7 @@ $(function() { $links = SeedDMS_Core_DMS::filterDocumentLinks($user, $links); if (file_exists($dms->contentDir . $latestContent->getPath())) { - $content .= "    "; + $content .= ""; if($previewer->hasPreview($latestContent)) { $content .= "getID()."&version=".$latestContent->getVersion()."&width=".$previewwidth."\" title=\"".htmlspecialchars($latestContent->getMimeType())."\">"; } else { @@ -1726,10 +1726,10 @@ $(function() { $subdoc = SeedDMS_Core_DMS::filterAccess($subdoc, $user, M_READ); $content = ''; - $content .= "getID()."\" rel=\"folder_".$subFolder->getID()."\" class=\"folder\" ondragover=\"allowDrop(event)\" ondrop=\"onDrop(event)\">"; + $content .= "getID()."\" draggable=\"true\" rel=\"folder_".$subFolder->getID()."\" class=\"folder table-row-folder\">"; // $content .= ""; - $content .= "getID()."\" draggable=\"true\" ondragstart=\"onDragStartFolder(event);\" href=\"out.ViewFolder.php?folderid=".$subFolder->getID()."&showtree=".$showtree."\">imgpath."folder.png\" width=\"24\" height=\"24\" border=0>\n"; - $content .= "getID()."&showtree=".$showtree."\">" . htmlspecialchars($subFolder->getName()) . ""; + $content .= "getID()."\" draggable=\"false\" href=\"out.ViewFolder.php?folderid=".$subFolder->getID()."&showtree=".$showtree."\">imgpath."folder.png\" width=\"24\" height=\"24\" border=0>\n"; + $content .= "getID()."\" href=\"out.ViewFolder.php?folderid=".$subFolder->getID()."&showtree=".$showtree."\">" . htmlspecialchars($subFolder->getName()) . ""; $content .= "
    ".getMLText('owner').": ".htmlspecialchars($owner->getFullName()).", ".getMLText('creation_date').": ".date('Y-m-d', $subFolder->getDate()).""; if($comment) { $content .= "
    ".htmlspecialchars($comment)."";