lainwir3d/dolibarr
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add of tyext when overing

Browse Source
This commit is contained in:
hystepik 2023-03-20 16:38:45 +01:00
parent 4a1dabc3d7
commit fab9d26254
4 changed files with 34 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
htdocs/core/lib/files.lib.php
View File

@ -3321,30 +3321,32 @@ function getFilesUpdated(&$file_list, SimpleXMLElement $dir, $path = '', $pathre
* Function to manage the drag and drop file.
* We use global variable $object
*
* @return string Js script to display
* @param string $htmlname The id of the component where we need to drag and drop
* @return string Js script to display
*/
function dragAndDropFileUpload()
function dragAndDropFileUpload($htmlname)
{
global $object;
//TODO: Find a way to display text over div
$out = "<script>";
$out .= "\n/* JS CODE TO ENABLE DRAG AND DROP OF FILE */\n";
global $object, $langs;
$out = "";
$out .= '<div id="'.$htmlname.'Message" class="dragDropAreaMessage hidden"><span>'.img_picto("", 'download').'<br>'.$langs->trans("DropFileToAddItToObject").'</span></div>';
$out .= "\n<!-- JS CODE TO ENABLE DRAG AND DROP OF FILE -->\n";
$out .= "<script>";
$out .= '
jQuery(document).ready(function() {
counterdragdrop = 0;
$("#'.$htmlname.'").addClass("cssDragDropArea");
$(".cssDragDropArea").on("dragenter", function(ev) {
// Entering drop area. Highlight area
counterdragdrop++;
$(".cssDragDropArea").addClass("highlightDragDropArea");
console.log("We add class highlightDragDropArea")
$(this).addClass("highlightDragDropArea");
$("#'.$htmlname.'Message").removeClass("hidden");
ev.preventDefault();
});
$(".cssDragDropArea").on("dragleave", function(ev) {
// Going out of drop area. Remove Highlight
counterdragdrop--;
if (counterdragdrop === 0) {
$(".cssDragDropArea").removeClass("highlightDragDropArea");
}
console.log("We remove class highlightDragDropArea")
$("#'.$htmlname.'Message").addClass("hidden");
$(this).removeClass("highlightDragDropArea");
});
$(".cssDragDropArea").on("dragover", function(ev) {

4
htdocs/core/lib/functions.lib.php
View File

@ -2040,10 +2040,10 @@ function dol_get_fiche_head($links = array(), $active = '', $title = '', $notab
}
if (!$notab || $notab == -1 || $notab == -2 || $notab == -3) {
$out .= "\n".'<div class="tabBar'.($notab == -1 ? '' : ($notab == -2 ? ' tabBarNoTop' : (($notab == -3 ? ' noborderbottom' : '').' tabBarWithBottom'))).(!empty($dragdropfile) ? ' cssDragDropArea' : '').'">'."\n";
$out .= "\n".'<div id="dragDropAreaTabBar" class="tabBar'.($notab == -1 ? '' : ($notab == -2 ? ' tabBarNoTop' : (($notab == -3 ? ' noborderbottom' : '')))).'">'."\n";
}
if (!empty($dragdropfile)) {
print dragAndDropFileUpload();
$out .= dragAndDropFileUpload("dragDropAreaTabBar");
}
$parameters = array('tabname' => $active, 'out' => $out);
$reshook = $hookmanager->executeHooks('printTabsHead', $parameters); // This hook usage is called just before output the head of tabs. Take also a look at "completeTabsHead"

1
htdocs/langs/en_US/main.lang
View File

@ -1227,3 +1227,4 @@ LastPasswordChangeDate=Last password change date
PublicVirtualCardUrl=Virtual business card page URL
PublicVirtualCard=Virtual business card
TreeView=Tree view
DropFileToAddItToObject=Drop a file to add it to this object

19
htdocs/theme/eldy/global.inc.php
View File

@ -7596,17 +7596,30 @@ div.clipboardCPValue.hidewithsize {
/* ============================================================================== */
.cssDragDropArea{
border: 2px rgba(123, 123, 123, .2) dashed !important;
padding: 10px !important;
position: relative;
border: 2px rgba(123, 123, 123, .2) dashed !important;
padding: 10px !important;
}
.highlightDragDropArea{
border: 2px #000 dashed !important;
background-color: #666 !important;
}
.highlightDragDropArea > *{
.highlightDragDropArea * {
pointer-events: none;
}
.highlightDragDropArea * :not(.dragDropAreaMessage *){
opacity:0.5;
filter: blur(3px) grayscale(100%);
}
.dragDropAreaMessage {
position: absolute;
left:50%;
top:50%;
transform: translate(-50%, -50%);
text-align:center;
/*BIEN PLACER CETTE DIV */
}
/* ============================================================================== */
/* CSS style used for small screen */
/* ============================================================================== */