Fix for emulated jmobile

This commit is contained in:
Laurent Destailleur 2016-11-08 15:55:44 +01:00
parent 9bff6f966b
commit 4cdd8e96d7
2 changed files with 54 additions and 34 deletions

View File

@ -31,6 +31,7 @@ if (empty($usedolheader))
<title>Test page</title>
<!-- Includes for JQuery (Ajax library) -->
<link rel="stylesheet" type="text/css" href="<?php echo DOL_URL_ROOT ?>/includes/jquery/css/smoothness/jquery-ui.css" />
<!-- <link rel="stylesheet" type="text/css" href="<?php echo DOL_URL_ROOT ?>/includes/jquery/plugins/datatables/media/css/jquery.dataTables.css" /> -->
<?php if ($_GET["dol_use_jmobile"] == 1) { ?>
<link rel="stylesheet" type="text/css" href="<?php echo DOL_URL_ROOT ?>/includes/jquery/plugins/mobile/jquery.mobile-latest.min.css" />
<?php } ?>
@ -38,6 +39,7 @@ if (empty($usedolheader))
<!-- Includes JS for JQuery -->
<script type="text/javascript" src="<?php echo DOL_URL_ROOT ?>/includes/jquery/js/jquery.min.js"></script>
<script type="text/javascript" src="<?php echo DOL_URL_ROOT ?>/includes/jquery/plugins/tablednd/jquery.tablednd.0.6.min.js"></script>
<!-- <script type="text/javascript" src="<?php echo DOL_URL_ROOT ?>/includes/jquery/plugins/datatables/media/js/jquery.dataTables.js"></script> -->
<script type="text/javascript" src="<?php echo DOL_URL_ROOT ?>/includes/jquery/plugins/select2/select2.min.js?version=4.0.0-beta"></script>
<?php if ($_GET["dol_use_jmobile"] == 1) { ?>
<script type="text/javascript" src="<?php echo DOL_URL_ROOT ?>/includes/jquery/plugins/mobile/jquery.mobile-latest.min.js"></script>
@ -52,9 +54,26 @@ if (empty($usedolheader))
}
else
{
$arraycss=array();
$arrayjs=array();
$arraycss=array();
$arrayjs=array();
/*
$arraycss=array('/includes/jquery/plugins/datatables/media/css/jquery.dataTables.css',
'/includes/jquery/plugins/datatables/extensions/Buttons/css/buttons.dataTables.min.css',
'/includes/jquery/plugins/datatables/extensions/ColReorder/css/colReorder.dataTables.min.css'
);
$arrayjs=array('/includes/jquery/plugins/datatables/media/js/jquery.dataTables.js',
'/includes/jquery/plugins/datatables/extensions/Buttons/js/dataTables.buttons.js',
'/includes/jquery/plugins/datatables/extensions/Buttons/js/buttons.colVis.min.js',
'/includes/jquery/plugins/datatables/extensions/Buttons/js/buttons.html5.min.js',
'/includes/jquery/plugins/datatables/extensions/Buttons/js/buttons.flash.min.js',
'/includes/jquery/plugins/datatables/extensions/Buttons/js/buttons.print.min.js',
'/includes/jquery/plugins/datatables/extensions/ColReorder/js/dataTables.colReorder.min.js',
'/includes/jszip/jszip.min.js',
'/includes/pdfmake/pdfmake.min.js',
'/includes/pdfmake/vfs_fonts.js'
);
*/
llxHeader('','','','',0,0,$arrayjs,$arraycss);
}
@ -66,7 +85,8 @@ else
<h2>
This page is a sample of page using tables. It is designed to make test with<br>
- css (add parameter &amp;theme=newtheme to test another theme or edit css of current theme)<br>
- jmobile (add parameter <a href="<?php echo $_SERVER["PHP_SELF"].'?dol_use_jmobile=1&dol_optimize_smallscreen=1'; ?>">dol_use_jmobile=1&amp;dol_optimize_smallscreen=1</a> and switch to small screen < 960 to enable view with jmobile)<br>
- jmobile (add parameter <a href="<?php echo $_SERVER["PHP_SELF"].'?dol_use_jmobile=4&dol_optimize_smallscreen=1'; ?>">dol_use_jmobile=4&amp;dol_optimize_smallscreen=1</a> and switch to small screen < 1000 to enable view with jmobile)<br>
- jmobile (add parameter <a href="<?php echo $_SERVER["PHP_SELF"].'?dol_use_jmobile=1&dol_optimize_smallscreen=1'; ?>">dol_use_jmobile=1&amp;dol_optimize_smallscreen=1</a> and switch to small screen < 570 to enable with emulated jmobile)<br>
- no javascript / usage for bind people (add parameter <a href="<?php echo $_SERVER["PHP_SELF"].'?nojs=1'; ?>">nojs=1</a> to force disable javascript)<br>
- dataTables<br>
- tablednd<br>
@ -79,10 +99,10 @@ This page is a sample of page using tables. It is designed to make test with<br>
<div class="tagtable centpercent">
<div class="tagtr">
<div class="tagtd maxwidthonsmartphone" style="overflow: hidden; white-space: nowrap;"> <!-- If you remove max-width, the jmobile overflow does not work -->
<select name="hidedetails"><option>aaaaaaaaaaaaaaafd sf sf gfd gfds fsd gfd fhfg hf dhfg hg fhfgdhfgdh gh gfdhdgf h gfdh dfhg dfgh dfgh fdgh gfd hfd hfd gs fgdf gaaaa</option><option>gdfs gdf g sdfg dfg fdsg dsfg dfs gdfs gds fgs gdfdf gd</option></select>
<select name="hidedetails" class="centpercentonsmartphone"><option>aaaaaaaaaaaaaaafd sf sf gfd gfds fsd gfd fhfg hf dhfg hg fhfgdhfgdh gh gfdhdgf h gfdh dfhg dfgh dfgh fdgh gfd hfd hfd gs fgdf gaaaa</option><option>gdfs gdf g sdfg dfg fdsg dsfg dfs gdfs gds fgs gdfdf gd</option></select>
</div>
<div class="tagtd maxwidthonsmartphone" style="overflow: hidden; white-space: nowrap;"> <!-- If you remove max-width, the jmobile overflow does not work -->
<select name="hidedetails"><option>aaaaaaaaaaaaaaafd sf sf gfd gfds fsd gfd fhfg hf dhfg hg fhfgdhfgdh gh gfdhdgf h gfdh dfhg dfgh dfgh fdgh gfd hfd hfd gs fgdf gaaaa</option><option>gdfs gdf g sdfg dfg fdsg dsfg dfs gdfs gds fgs gdfdf gd</option></select>
<select name="hidedetails" class="centpercentonsmartphone"><option>aaaaaaaaaaaaaaafd sf sf gfd gfds fsd gfd fhfg hf dhfg hg fhfgdhfgdh gh gfdhdgf h gfdh dfhg dfgh dfgh fdgh gfd hfd hfd gs fgdf gaaaa</option><option>gdfs gdf g sdfg dfg fdsg dsfg dfs gdfs gds fgs gdfdf gd</option></select>
</div>
</div>
</div>
@ -92,10 +112,10 @@ This page is a sample of page using tables. It is designed to make test with<br>
<div class="tagtable centpercent">
<form action="xxx" method="POST" class="tagtr">
<div class="tagtd maxwidthonsmartphone" style="overflow: hidden; white-space: nowrap;"> <!-- If you remove max-width, the jmobile overflow does not work -->
<select name="hidedetails"><option>aaaaaaaaaaaaaaafd sf sf gfd gfds fsd gfd fhfg hf dhfg hg fhfgdhfgdh gh gfdhdgf h gfdh dfhg dfgh dfgh fdgh gfd hfd hfd gs fgdf gaaaa</option><option>gdfs gdf g sdfg dfg fdsg dsfg dfs gdfs gds fgs gdfdf gd</option></select>
<select name="hidedetails" class="centpercentonsmartphone"><option>aaaaaaaaaaaaaaafd sf sf gfd gfds fsd gfd fhfg hf dhfg hg fhfgdhfgdh gh gfdhdgf h gfdh dfhg dfgh dfgh fdgh gfd hfd hfd gs fgdf gaaaa</option><option>gdfs gdf g sdfg dfg fdsg dsfg dfs gdfs gds fgs gdfdf gd</option></select>
</div>
<div class="tagtd maxwidthonsmartphone" style="overflow: hidden; white-space: nowrap;"> <!-- If you remove max-width, the jmobile overflow does not work -->
<select name="hidedetails"><option>aaaaaaaaaaaaaaafd sf sf gfd gfds fsd gfd fhfg hf dhfg hg fhfgdhfgdh gh gfdhdgf h gfdh dfhg dfgh dfgh fdgh gfd hfd hfd gs fgdf gaaaa</option><option>gdfs gdf g sdfg dfg fdsg dsfg dfs gdfs gds fgs gdfdf gd</option></select>
<select name="hidedetails" class="centpercentonsmartphone"><option>aaaaaaaaaaaaaaafd sf sf gfd gfds fsd gfd fhfg hf dhfg hg fhfgdhfgdh gh gfdhdgf h gfdh dfhg dfgh dfgh fdgh gfd hfd hfd gs fgdf gaaaa</option><option>gdfs gdf g sdfg dfg fdsg dsfg dfs gdfs gds fgs gdfdf gd</option></select>
</div>
</form>
</div>
@ -105,10 +125,10 @@ This page is a sample of page using tables. It is designed to make test with<br>
<table class="centpercent">
<tr>
<td class="tagtd maxwidthonsmartphone" style="overflow: hidden; white-space: nowrap;"> <!-- If you remove max-width, the jmobile overflow does not work -->
<select name="hidedetails"><option>aaaaaaaaaaaaaaafd sf sf gfd gfds fsd gfd fhfg hf dhfg hg fhfgdhfgdh gh gfdhdgf h gfdh dfhg dfgh dfgh fdgh gfd hfd hfd gs fgdf gaaaa</option><option>gdfs gdf g sdfg dfg fdsg dsfg dfs gdfs gds fgs gdfdf gd</option></select>
<select name="hidedetails" class="centpercentonsmartphone"><option>aaaaaaaaaaaaaaafd sf sf gfd gfds fsd gfd fhfg hf dhfg hg fhfgdhfgdh gh gfdhdgf h gfdh dfhg dfgh dfgh fdgh gfd hfd hfd gs fgdf gaaaa</option><option>gdfs gdf g sdfg dfg fdsg dsfg dfs gdfs gds fgs gdfdf gd</option></select>
</td>
<td class="tagtd maxwidthonsmartphone" style="overflow: hidden; white-space: nowrap;"> <!-- If you remove max-width, the jmobile overflow does not work -->
<select name="hidedetails"><option>aaaaaaaaaaaaaaafd sf sf gfd gfds fsd gfd fhfg hf dhfg hg fhfgdhfgdh gh gfdhdgf h gfdh dfhg dfgh dfgh fdgh gfd hfd hfd gs fgdf gaaaa</option><option>gdfs gdf g sdfg dfg fdsg dsfg dfs gdfs gds fgs gdfdf gd</option></select>
<select name="hidedetails" class="centpercentonsmartphone"><option>aaaaaaaaaaaaaaafd sf sf gfd gfds fsd gfd fhfg hf dhfg hg fhfgdhfgdh gh gfdhdgf h gfdh dfhg dfgh dfgh fdgh gfd hfd hfd gs fgdf gaaaa</option><option>gdfs gdf g sdfg dfg fdsg dsfg dfs gdfs gds fgs gdfdf gd</option></select>
</td>
</tr>
</table>

View File

@ -692,6 +692,30 @@ div.myavailability {
.minwidth500imp { min-width: 50px !important; }
.titlefield { width: auto; }
.titlefieldcreate { width: auto; }
#tooltip {
position: absolute;
width: <?php print dol_size(300,'width'); ?>px;
}
select {
width: 98%;
<?php if (empty($conf->dol_use_jmobile)) { ?>max-width: 100px;<?php } ?>
min-width: 40px;
}
div.divphotoref {
padding-right: 5px;
}
img.photoref, div.photoref {
border: none;
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
padding: 4px;
height: 20px;
width: 20px;
object-fit: contain;
}
}
.linkobject { cursor: pointer; }
<?php if (GETPOST("optioncss") == 'print') { ?>
@ -4640,30 +4664,6 @@ img.demothumb {
div.mainmenu {
min-width: 20px;
}
#tooltip {
position: absolute;
width: <?php print dol_size(300,'width'); ?>px;
}
select {
width: 98%;
<?php if (empty($conf->dol_use_jmobile)) { ?>max-width: 100px;<?php } ?>
min-width: 40px;
}
div.divphotoref {
padding-right: 5px;
}
img.photoref, div.photoref {
border: none;
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
padding: 4px;
height: 20px;
width: 20px;
object-fit: contain;
}
}
<?php