adjust css for other browser, fix display bug

This commit is contained in:
Alexandre Cloutier
2014-08-15 11:41:37 -04:00
parent 8783f09a4a
commit 73fcdc2306
4 changed files with 98 additions and 77 deletions

View File

@@ -56,22 +56,22 @@
<tbody>
</tbody>
</table>
<div id="imgPosition">
<a href="#" id="listCollapse">
<img rsrc:src="collapse.png" class="collapse" onclick="onResizeClick()" />
</a>
</div>
<table id="searchMailFooter" class="sortable">
<thead>
<tr>
<td id="subjectHeader" class="td_header">
<td id="subjectSearchHeader" class="td_header">
<var:string label:value="Subject" /></td>
<td id="fromHeader" class="td_header">
<td id="fromSearchHeader" class="td_header">
<var:string label:value="From"/></td>
<td id="toHeader" class="td_header">
<td id="toSearchHeader" class="td_header">
<var:string label:value="To" /></td>
<td id="dateHeader" class="td_header">
<td id="dateSearchHeader" class="td_header">
<var:string label:value="Date" /></td>
<td id="buttonExpandHeader" class="td_header">
<div id="imgPosition">
<a href="#" id="listCollapse">
<img rsrc:src="collapse.png" class="collapse" onclick="onResizeClick()" />
</a></div></td>
</tr>
</thead>
<tbody class="scrollbar" id="resultsTable">

View File

@@ -4,26 +4,24 @@
TABLE#searchMailHeader
{ width: 100%; }
TABLE#searchFiltersList, TABLE#searchMailFooter
{
border: 1px solid #909090;
padding:2px;
border-radius: 3px;
}
TABLE#searchFiltersList
{
border: 1px solid #909090;
padding-top:2px;
border-radius: 3px;
display:inline-block;
max-height:105px;
height:105px;
overflow:auto;
width:674px;
width:100%;
margin-top: 1em;
}
TABLE#searchMailFooter
{
position:absolute;
border: 1px solid #909090;
border-radius: 3px;
left:10px;
width:680px;
top:240px;
@@ -54,16 +52,25 @@ TABLE#searchMailFooter
width:25%;
}
/*************** Table adjustment : search results *****************/
.resultsRow {
cursor:pointer;
TD.sortasc {
background:#bfc2bf;
background-image: url(/SOGo.woa/WebServerResources/arrow-up.png);
background-repeat: no-repeat;
background-position:right center;
}
TD.sortdesc {
background:#bfc2bf;
background-image: url(/SOGo.woa/WebServerResources/arrow-down.png);
background-repeat: no-repeat;
background-position:right center;
}
.td_header {
border: solid #909090 1px;
position:absolute;
top:-1px;
width:157px;
border-bottom: solid #909090 1px;
border-right: solid #909090 1px;
height:18px;
width:20%;
cursor:pointer;
background: -webkit-linear-gradient(left top, #f0f1f0 , #e6e7e6); /* For Safari 5.1 to 6.0 */
background: -o-linear-gradient(bottom right, #f0f1f0, #e6e7e6); /* For Opera 11.1 to 12.0 */
@@ -74,20 +81,17 @@ TABLE#searchMailFooter
.td_header:hover
{text-decoration: underline; }
#subjectHeader {
left:-1px;
border-top-left-radius: 3px;
#buttonExpandHeader {
width:3%;
border-right:0;
}
#fromHeader {
left:166px;
}
#toHeader {
left:333px;
}
#dateHeader {
left:500px;
width:168px;
border-top-right-radius: 3px;
@-moz-document url-prefix() {
#buttonExpandHeader {
width:1.5%;
border-right:0;
}
}
/*************** Button adjustment *****************/
@@ -118,9 +122,6 @@ DIV#optionsButtons
font-style:normal;
}
#changeHeader
{ width:15px}
#resizeFrame
{
text-align: -webkit-right;
@@ -133,47 +134,64 @@ DIV#optionsButtons
text-align: -webkit-center;
}
#resultsFound {
position:absolute;
bottom:25px;
right:10px;
}
#imgPosition
{ position: absolute;
right: 17px;
top: 233px;
z-index: 1;
}
#listCollapse
{ position: absolute;
top: .2em;
right: 0;
margin: 0.5em 1em; }
{ z-index: 1; }
#listCollapse img
{ position: absolute; }
#listCollapse img.collapse
{ clip: rect(0 18px 18px 0);
left: 0;
top: 0; }
top: 1px;
right: -16px; }
#listCollapse img.collapse:hover
{ clip: rect(0 36px 18px 18px);
left: -18px; }
top: 1px;
right: 2px; }
#listCollapse img.rise
{ clip: rect(18px 18px 36px 0);
left: 0;
top: -18px; }
top: -17px;
right:-16px;
}
#listCollapse img.rise:hover
{ clip: rect(18px 36px 36px 18px);
left: -18px; }
top: -17px;
right:2px; }
@-moz-document url-prefix() {
#listCollapse img
{ position: absolute; }
#listCollapse img.collapse
{ clip: rect(0 18px 18px 0);
top: 2px;
right: -16px; }
#listCollapse img.collapse:hover
{ clip: rect(0 36px 18px 18px);
top: 2px;
right: 2px; }
#listCollapse img.rise
{ clip: rect(18px 18px 36px 0);
top: -16px;
right:-16px;
}
#listCollapse img.rise:hover
{ clip: rect(18px 36px 36px 18px);
top: -16px;
right:2px; }
}
#filterButtons
{

View File

@@ -15,7 +15,7 @@ var stopOngoingSearch = false;
function onSearchClick() {
// This function updates the searchParams
var filterRows = $$(".filterRow");
var searchButton = $("searchButton").down().innerText;
var searchButton = $("searchButton").down().innerHTML;
var mailAccountsList = $("mailAccountsList").options;
if (searchButton == _("Search")) {
@@ -25,7 +25,7 @@ function onSearchClick() {
// Get the mailboxe(s)
for (i = 0; i < mailAccountsList.length ; i++) {
if (mailAccountsList[i].selected) {
searchParams.searchLocation = mailAccountsList[i].innerText;
searchParams.searchLocation = mailAccountsList[i].innerHTML;
break;
}
}
@@ -40,7 +40,7 @@ function onSearchClick() {
// Get the searchBy
for (j = 0; j < searchByOptions.length ; j++) {
if (searchByOptions[j].selected) {
filter.searchBy = searchByOptions[j].innerText;
filter.searchBy = searchByOptions[j].innerHTML;
break;
}
}
@@ -48,7 +48,7 @@ function onSearchClick() {
// Get the searchArgument
for (j = 0; j < searchArgumentsOptions.length ; j++) {
if (searchArgumentsOptions[j].selected) {
filter.searchArgument = searchArgumentsOptions[j].innerText;
filter.searchArgument = searchArgumentsOptions[j].innerHTML;
filter.negative = false;
if (filter.searchArgument == "contains") {
filter.searchArgument = "doesContain";
@@ -70,7 +70,7 @@ function onSearchClick() {
}
// Send the request only if there is at least one filter
if (searchParams.filters.length > 0) {
$("searchButton").down().innerText = _("Stop");
$("searchButton").down().innerHTML = _("Stop");
searchMails();
}
// TODO - give the user a warning or a notice that it needs at least one filter
@@ -104,15 +104,15 @@ function searchMails() {
for (i = 2; i < position; i++)
folderName += "/folder" + searchLocation[i];
var folderPath = optionsList[selectedIndex].innerText;
var folderPath = optionsList[selectedIndex].innerHTML;
}
var subfolders = [];
if (searchParams.subfolder == true) {
for (i = 0; i < nbOptions; i++) {
if ((optionsList[i].innerText.search(folderPath) != -1) && (i != selectedIndex)) {
var splitArray = optionsList[i].innerText.split("/");
if ((optionsList[i].innerHTML.search(folderPath) != -1) && (i != selectedIndex)) {
var splitArray = optionsList[i].innerHTML.split("/");
// Remove the user information since it is not required
splitArray.splice(0, 1);
var subfolder = [];
@@ -184,7 +184,7 @@ function searchMailsCallback(http) {
cell.writeAttribute("id", "noSearchResults");
cell.writeAttribute("colspan", "4");
element.innerText = _("No matches found");
element.innerHTML = _("No matches found");
cell.appendChild(element);
}
}
@@ -210,7 +210,7 @@ function searchMailsCallback(http) {
}
function onSearchEnd() {
$("searchButton").down().innerText = _("Search");
$("searchButton").down().innerHTML = _("Search");
var nbResults = $$(".resultsRow").length;
if (nbResults == 1)
$("resultsFound").innerHTML = nbResults + " " + _("result found");
@@ -219,7 +219,8 @@ function onSearchEnd() {
else
$("resultsFound").innerHTML = "";
TableKit.reloadTable($("searchMailFooter"));
TableKit.reloadSortableTable($("searchMailFooter"));
$("buttonExpandHeader").addClassName("nosort");
}
function onCancelClick() {
@@ -253,7 +254,7 @@ function onAddFilter() {
for (i = 0; i < searchByList.length; i++) {
var option = document.createElement("option");
option.writeAttribute("value", i);
option.innerHTML = searchByList[i].innerText;
option.innerHTML = searchByList[i].innerHTML;
element1.appendChild(option);
}
cell1.appendChild(element1);
@@ -265,7 +266,7 @@ function onAddFilter() {
for (i = 0; i < stringArgumentsList.length; i++) {
var option = document.createElement("option");
option.writeAttribute("value", i);
option.innerHTML = stringArgumentsList[i].innerText;
option.innerHTML = stringArgumentsList[i].innerHTML;
element2.appendChild(option);
}
cell2.appendChild(element2);
@@ -320,7 +321,7 @@ function onRemoveFilter(event) {
function onResultSelectionChange(event) {
var table = $("searchMailFooter").down("tbody");
if (event && (event.target.innerText != _("No matches found"))) {
if (event && (event.target.innerHTML != _("No matches found"))) {
var node = getTarget(event);
if (node.tagName == "SPAN")
@@ -431,7 +432,6 @@ function onResizeClick() {
var searchFiltersList = jQuery("#searchFiltersList");
var searchMailFooter = jQuery("#searchMailFooter");
var resultsTable = jQuery("#resultsTable");
var imgPosition = jQuery("#imgPosition");
var state = 'collapse';
var img = $("listCollapse").select('img').first();
@@ -444,7 +444,6 @@ function onResizeClick() {
img.removeClassName('collapse').addClassName('rise');
$("resultsFound").style.bottom = "40px;";
}});
imgPosition.animate({ top:"113px" }, {duration: 100});
});
}
else {
@@ -455,7 +454,6 @@ function onResizeClick() {
img.removeClassName('rise').addClassName('collapse');
$("resultsFound").style.bottom = "25px;";
}});
imgPosition.animate({ top:"233px" }, {duration: 100});
resultsTable.animate({height:"171px"}, 100);
}
@@ -471,5 +469,4 @@ function initSearchMailView () {
// Observers : Event.on(element, eventName[, selector], callback)
$("searchMailFooter").down("tbody").on("mousedown", "tr", onResultSelectionChange);
$("searchMailFooter").down("tbody").on("dblclick", "tr", onOpenClick);
TableKit.Sortable.init($("searchMailFooter"), {sortable : true});
}

View File

@@ -242,6 +242,12 @@ Object.extend(TableKit, {
if(op.resizable) {TableKit.Resizable.init(table);}
if(op.editable) {TableKit.Editable.init(table);}
},
reloadSortableTable : function(table){
table = $(table);
TableKit.unloadTable(table);
var op = TableKit.option('sortable', table.id);
if(op.sortable) {TableKit.Sortable.init(table);}
},
reload : function() {
for(var k in TableKit.tables) {
TableKit.reloadTable(k);