[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]
[Noalyss-commit] [noalyss] 15/39: Select Box : improve position in float
From: |
Dany De Bontridder |
Subject: |
[Noalyss-commit] [noalyss] 15/39: Select Box : improve position in floating element |
Date: |
Sat, 11 Jul 2020 13:20:39 -0400 (EDT) |
sparkyx pushed a commit to branch master
in repository noalyss.
commit 09398054ce087dfab174729fa2ff71ec13c2c0bd
Author: Dany De Bontridder <danydb@noalyss.eu>
AuthorDate: Wed Jun 3 11:45:48 2020 +0200
Select Box : improve position in floating element
---
html/js/scripts.js | 3 +
include/lib/select_box.class.php | 123 +++++++++++++++++++++++++++++++--------
2 files changed, 101 insertions(+), 25 deletions(-)
diff --git a/html/js/scripts.js b/html/js/scripts.js
index 631f6a8..404e99e 100644
--- a/html/js/scripts.js
+++ b/html/js/scripts.js
@@ -2969,6 +2969,8 @@ function init_scroll()
up.innerHTML = '<a class="icon"
onclick="document.getElementById(\'go_up\').hide()"
style="float:right;font-size:70%"></a> <a class="icon" href="#up_top"
></a><a href="javascript:show_calc()" class="icon"></a>';
document.body.appendChild(up);
window.onscroll = function () {
+ if ( document.getElementById("select_box_content") )
+ {
document.getElementById("select_box_content").setStyle({display:"none"})};
if (document.viewport.getScrollOffsets().top > 0) {
if ($('go_up').visible() == false) {
$('go_up').setOpacity(0.65);
@@ -2979,6 +2981,7 @@ function init_scroll()
$('go_up').hide();
}
}
+
}
/**
* Confirm a form thanks a modal dialog Box, it returns true if we agree
otherwise
diff --git a/include/lib/select_box.class.php b/include/lib/select_box.class.php
index 82c5547..28e6bc7 100644
--- a/include/lib/select_box.class.php
+++ b/include/lib/select_box.class.php
@@ -36,7 +36,8 @@ class Select_Box
private $cnt;
private $filter; //!< allow a dynamic not case sensitive search
var $default_value;
-
+ private $position ; //!< change depending if we are in an absolute block
or not
+
/**
* Default constructor
* @param type $p_id javascript DOMid
@@ -52,6 +53,98 @@ class Select_Box
$this->default_value=-1;
$this->style_box="";
$this->filter="";
+ $this->position="normal";
+ }
+ public function get_position()
+ {
+ return $this->position;
+ }
+
+ public function set_position($position)
+ {
+ if ( ! in_array($position,array("normal","in-absolute") ) ) {
+ throw new Exception("SB0005",EXC_PARAM_VALUE);
+ }
+ $this->position=$position;
+ return $this;
+ }
+
+ private function compute_position()
+ {
+ $list_id=sprintf('%s_list', $this->id);
+ switch ($this->position)
+ {
+ case "normal":
+
+ // Show when click
+ $javascript=sprintf('$("%s_bt").onclick=function() {
+ try {
+ var newDiv=$("select_box%s");
+ var pos=$("%s_bt").cumulativeOffset();
+
newDiv.setStyle({display:"block",position:"fixed",top:pos.top+25+"px",left:pos.left+5+"px"});
+
+ if ( $("search_%s") ) { $("search_%s").focus();}
+
+ } catch(e) {
+ alert(e.message);
+ }
+ }
+ ', $this->id, $this->id, $this->id, $list_id,
$list_id);
+ // Hide when out of the zone
+
$javascript.=sprintf('$("select_box%s").onmouseleave=function() {
+ try {
+ var newDiv=$("select_box%s");
+ newDiv.setStyle({display:"none"});
+ } catch(e) {
+ alert(e.message);
+ }
+ }',$this->id,$this->id);
+ break;
+ case "in-absolute":
+ // Show when click
+ $javascript=sprintf('
+ $("%s_bt").onclick=function() {
+ try {
+
+
+ if (!
document.getElementById("select_box_content") ) {
+
+ var newDiv=new Element("div");
+ newDiv.id="select_box_content";
+ document.body.appendChild(newDiv);
+ newDiv.addClassName("select_box");
+
$("select_box_content").onmouseleave=function() {
+ try {
+ var newDiv=$("select_box_content");
+ newDiv.setStyle({display:"none"});
+ } catch(e) {
+ alert(e.message);
+ }
+ }
+ } else {
+ var
newDiv=document.getElementById("select_box_content");
+ }
+ newDiv.innerHTML=$("select_box%s").innerHTML;
+ var pos=$("%s_bt").cumulativeOffset();
+ var nTop=pos.top;
+ var viewport = document.viewport.getDimensions();
+ if ( nTop> viewport.height-newDiv.getHeight()-20)
{ nTop-=newDiv.getHeight()-5}
+
+
newDiv.setStyle({display:"block",position:"absolute",top:nTop+"px",left:pos.left+5+"px","z-index":999});
+
+ if ( $("search_%s") ) { $("search_%s").focus();}
+ } catch(e) {
+ alert(e.message);
+ }
+ }
+ ', $this->id, $this->id, $this->id, $list_id,
$list_id);
+
+ break;
+
+ default:
+ break;
+ }
+ return $javascript;
}
function input()
@@ -59,36 +152,16 @@ class Select_Box
$list_id=sprintf('%s_list',$this->id);
// Show when click
- $javascript=sprintf('$("%s_bt").onclick=function() {
- try {
- var newDiv=$("select_box%s");
- var pos=$("%s_bt").cumulativeOffset();
-
newDiv.setStyle({display:"block",position:"fixed",top:pos.top+25+"px",left:pos.left+5+"px"});
-
- if ( $("search_%s") ) { $("search_%s").focus();}
-
- } catch(e) {
- alert(e.message);
- }
- }
- ', $this->id, $this->id, $this->id, $list_id,$list_id);
+ $javascript=$this->compute_position();
+
- // Hide when out of the zone
- $javascript.=sprintf('$("select_box%s").onmouseleave=function() {
- try {
- var newDiv=$("select_box%s");
- newDiv.setStyle({display:"none"});
- } catch(e) {
- alert(e.message);
- }
- }',$this->id,$this->id);
// display the button
- printf('<input type="button" class="smallbutton icon" id="%s_bt"
value="%s ▾">',
+ printf('<input type="button" class="smallbutton icon " id="%s_bt"
value="%s ▾" >',
$this->id, $this->value);
printf('<input type="hidden" id="%s" name="%s" value="%s">', $this->id,
$this->id, $this->default_value);
- printf('<div class="select_box" id="select_box%s" style="%s">',
+ printf('<div class="select_box " id="select_box%s" style="%s">',
$this->id, $this->style_box);
// Show the filter if there is one,
- [Noalyss-commit] [noalyss] 11/39: #1583: [Cosmétique] Liste de catégories de fiches, espace avant les (), (continued)
- [Noalyss-commit] [noalyss] 11/39: #1583: [Cosmétique] Liste de catégories de fiches, espace avant les (), Dany De Bontridder, 2020/07/11
- [Noalyss-commit] [noalyss] 08/39: #1798 French calendar, Dany De Bontridder, 2020/07/11
- [Noalyss-commit] [noalyss] 09/39: Compatility PHP7.4, Dany De Bontridder, 2020/07/11
- [Noalyss-commit] [noalyss] 02/39: Bug Database:lo_unlink unknown variable, Dany De Bontridder, 2020/07/11
- [Noalyss-commit] [noalyss] 06/39: Compatibility postgresql 12, Dany De Bontridder, 2020/07/11
- [Noalyss-commit] [noalyss] 03/39: Fix problem with redirect, Dany De Bontridder, 2020/07/11
- [Noalyss-commit] [noalyss] 12/39: CSS : new background-selected for a row in table, Dany De Bontridder, 2020/07/11
- [Noalyss-commit] [noalyss] 16/39: task #0001413: Duplication d'opération 2 - le retour, Dany De Bontridder, 2020/07/11
- [Noalyss-commit] [noalyss] 18/39: Task #1803 : export detail of an operation in PDF, Dany De Bontridder, 2020/07/11
- [Noalyss-commit] [noalyss] 14/39: task #0001801: CARD : mise à jour fiche , effacement et modification, Dany De Bontridder, 2020/07/11
- [Noalyss-commit] [noalyss] 15/39: Select Box : improve position in floating element,
Dany De Bontridder <=
- [Noalyss-commit] [noalyss] 17/39: task #0001801: CARD : mise à jour fiche , effacement et modification, Dany De Bontridder, 2020/07/11
- [Noalyss-commit] [noalyss] 25/39: Code : not direct access to $_GET Bug : javascript didn't work, Dany De Bontridder, 2020/07/11
- [Noalyss-commit] [noalyss] 26/39: Bug : compatibility PHP7.4, Dany De Bontridder, 2020/07/11
- [Noalyss-commit] [noalyss] 13/39: JS : improve code alternate_row_color, Dany De Bontridder, 2020/07/11
- [Noalyss-commit] [noalyss] 19/39: Set new version, Dany De Bontridder, 2020/07/11
- [Noalyss-commit] [noalyss] 23/39: warning about undefined $this->f_id_dest, Dany De Bontridder, 2020/07/11
- [Noalyss-commit] [noalyss] 22/39: Error with card, Dany De Bontridder, 2020/07/11
- [Noalyss-commit] [noalyss] 27/39: Cosmetic #1808 : Ma au lieu de Me dans le calendrier, Dany De Bontridder, 2020/07/11
- [Noalyss-commit] [noalyss] 24/39: Cosmetic : disconnect, Dany De Bontridder, 2020/07/11
- [Noalyss-commit] [noalyss] 21/39: Install show choosen password for admin, Dany De Bontridder, 2020/07/11