mirror of
https://github.com/subsurface/subsurface.git
synced 2025-02-19 22:16:15 +00:00
HTML: Create theme directory
Create theme directory that contains the html templates copied to the exporting directory. - dive_export.html is the main html template. - light.css and sand.css are two separte themes. - list_lib.js is the main javascript library. Signed-off-by: Gehad elrobey <gehadelrobey@gmail.com> Signed-off-by: Miika Turkia <miika.turkia@gmail.com> Signed-off-by: Dirk Hohndel <dirk@hohndel.org>
This commit is contained in:
Gehad elrobey
Dirk Hohndel
parent
e21032c99b
commit
d8c46fbdb6
5 changed files with 1120 additions and 0 deletions
139
theme/dive_export.html
Normal file
139
theme/dive_export.html
Normal file
|
|
@ -0,0 +1,139 @@
|
|||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<title>dive log export</title>
|
||||
<link rel="stylesheet" type="text/css" href="theme.css">
|
||||
<script src="file.json"></script>
|
||||
<script src="settings.json"></script>
|
||||
<script src="list_lib.js" type="text/javascript"></script>
|
||||
<script>
|
||||
//////////////////////////////////
|
||||
//advance settings window//
|
||||
|
||||
var advanced_shown=false;
|
||||
function showdiv(){
|
||||
var search = document.getElementById("advanced_search");
|
||||
if(advanced_shown==false){
|
||||
search.style.display='block';
|
||||
advanced_shown=true;
|
||||
}
|
||||
else{
|
||||
search.style.display='none';
|
||||
advanced_shown=false;
|
||||
}
|
||||
}
|
||||
function hideAdvanced(){
|
||||
if(advanced_shown==false) return;
|
||||
var search = document.getElementById("advanced_search");
|
||||
search.style.display='none';
|
||||
advanced_shown=false;
|
||||
}
|
||||
|
||||
document.onclick=check;
|
||||
function check(e)
|
||||
{
|
||||
var target = (e && e.target) || (event && event.srcElement);
|
||||
var obj = document.getElementById('advanced_search');
|
||||
var obj2 = document.getElementById('adv_srch_sp');
|
||||
if(target!=obj && target!=obj2 && target.type!="checkbox"){
|
||||
hideAdvanced();
|
||||
}
|
||||
}
|
||||
|
||||
////////////////////////////////
|
||||
|
||||
function loadSettings(){
|
||||
if(typeof settings === 'undefined')return;
|
||||
document.body.style.fontSize=settings.fontSize;
|
||||
document.body.style.fontFamily=settings.fontFamily;
|
||||
}
|
||||
|
||||
var searchingModules = new Array();
|
||||
|
||||
window.onload=function(){
|
||||
|
||||
//initialize settings
|
||||
loadSettings();
|
||||
|
||||
//initializing default searchers
|
||||
searchingModules["location"] = new SearchModule(true);
|
||||
searchingModules["divemaster"] = new SearchModule(true);
|
||||
searchingModules["buddy"] = new SearchModule(true);
|
||||
searchingModules["notes"] = new SearchModule(true);
|
||||
searchingModules["tags"] = new SearchModule(true);
|
||||
|
||||
getItems();
|
||||
|
||||
//initializing search words
|
||||
for(var i=0;i<items.length;i++){
|
||||
searchingModules["location"].Enter_search_string(items[i].location,i);
|
||||
|
||||
searchingModules["divemaster"].Enter_search_string(items[i].divemaster,i);
|
||||
|
||||
searchingModules["buddy"].Enter_search_string(items[i].buddy,i);
|
||||
|
||||
searchingModules["notes"].Enter_search_string(items[i].notes,i);
|
||||
|
||||
searchingModules["tags"].Enter_search_tag(items[i].tags,i);
|
||||
}
|
||||
|
||||
sizeofpage=10;
|
||||
showAllDives();
|
||||
}
|
||||
|
||||
function changeAdvSearch(e){
|
||||
searchingModules[e.value].enabled=e.checked;
|
||||
SearchModules(document.getElementById("search_input").value);
|
||||
}
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<center>
|
||||
<div id="header_container">
|
||||
<div id="logo"></div>
|
||||
<h1>Subsurface</h1>
|
||||
</div>
|
||||
</center>
|
||||
<div id="divePanel">
|
||||
<div id="controlbox">
|
||||
<input id="search_input" oninput="SearchModules(this.value)" placeholder="search"/><a id="adv_srch_sp" onClick="showdiv()" >Advanced Search</a>
|
||||
<div id="advanced_search">
|
||||
<input type="checkbox" onchange="changeAdvSearch(this)" value="location" checked>Location<br>
|
||||
<input type="checkbox" onchange="changeAdvSearch(this)" value="divemaster" checked>Divemaster<br>
|
||||
<input type="checkbox" onchange="changeAdvSearch(this)" value="buddy" checked>Buddy<br>
|
||||
<input type="checkbox" onchange="changeAdvSearch(this)" value="notes" checked>Notes<br>
|
||||
<input type="checkbox" onchange="changeAdvSearch(this)" value="tags" checked>Tags<br>
|
||||
</div>
|
||||
<div id="toolbox">
|
||||
<select id="no_dives_selector" onChange="setNumberOfDives(this)">
|
||||
<option>10</option>
|
||||
<option>20</option>
|
||||
<option>50</option>
|
||||
<option>100</option>
|
||||
</select>
|
||||
<button onClick="expandAll()"> Expand All </button>
|
||||
<button onClick="collapseAll()"> Collapse All </button>
|
||||
<button id="trip_button" onclick="toggleTrips();">trips</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id="header">
|
||||
<div onClick="list_sort('1')" class="item">Number</div>
|
||||
<div onClick="list_sort('2')" class="item">Date</div>
|
||||
<div onClick="list_sort('3')" class="item">Time</div>
|
||||
<div onClick="list_sort('6')" class="item_large">Location</div>
|
||||
<div onClick="list_sort('4')" class="item">Air Temp</div>
|
||||
<div onClick="list_sort('5')" class="item">Water Temp</div>
|
||||
</div>
|
||||
<div id="diveslist">
|
||||
</div>
|
||||
<center>
|
||||
<div id="controller">
|
||||
<button onClick="prev_page()"><-</button>
|
||||
<span id="pagging"></span>
|
||||
<button onClick="next_page()">-></button>
|
||||
</div>
|
||||
</center>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
201
theme/light.css
Normal file
201
theme/light.css
Normal file
|
|
@ -0,0 +1,201 @@
|
|||
body{
|
||||
min-width:680px;
|
||||
background-color:#dfdfdf;
|
||||
font-size:12px;
|
||||
font-family: 'Lobster', helvetica, arial;
|
||||
}
|
||||
|
||||
h1 {
|
||||
text-align: center;
|
||||
font-size: 70px;
|
||||
margin-top: 0;
|
||||
font-family: 'Lobster', helvetica, arial;
|
||||
text-decoration: none;
|
||||
color: #48697B;
|
||||
padding-top:30px;
|
||||
}
|
||||
|
||||
ul{
|
||||
background-color:#7899AB;
|
||||
}
|
||||
|
||||
table{
|
||||
margin:10px;
|
||||
font-size:inherit;
|
||||
}
|
||||
|
||||
tr{
|
||||
padding:6px;
|
||||
}
|
||||
|
||||
th{
|
||||
padding:4px;
|
||||
}
|
||||
|
||||
.trips{
|
||||
background-color:#5A7F9A;
|
||||
}
|
||||
|
||||
.words{
|
||||
font-size:inherit;
|
||||
font-weight:bold;
|
||||
}
|
||||
|
||||
.item{
|
||||
width:9%;
|
||||
min-width:82px;
|
||||
max-width:250px;
|
||||
float:left;
|
||||
cursor:pointer;
|
||||
overflow:hidden;
|
||||
text-overflow:ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.item_large{
|
||||
width:16%;
|
||||
min-width:200px;
|
||||
max-width:385px;
|
||||
margin-right:8px;
|
||||
float:left;
|
||||
cursor:pointer;
|
||||
overflow:hidden;
|
||||
text-overflow:ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
#logo{
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
background-image: url("poster.png");
|
||||
background-size: 150px 150px;
|
||||
background-repeat: no-repeat;
|
||||
float:left;
|
||||
}
|
||||
|
||||
#header_container{
|
||||
width:600px;
|
||||
height:auto;
|
||||
margin:50px;
|
||||
margin-bottom:100px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
ul,#header{
|
||||
border-style:solid;
|
||||
border-radius:14px;
|
||||
border-color:#7899AB;
|
||||
margin:7px;
|
||||
padding:5px 10px 5px 10px;
|
||||
}
|
||||
|
||||
input[type=checkbox]{
|
||||
height:27;
|
||||
width:27;
|
||||
margin:4px;
|
||||
}
|
||||
|
||||
#advanced_search{
|
||||
position: absolute;
|
||||
box-shadow: 1px 1px 5px #888888;
|
||||
z-index: 99;
|
||||
width: 300px;
|
||||
max-width: 30%;
|
||||
min-width: 270px;
|
||||
background-color: rgba(105,126,131,0.8);
|
||||
font-size:16px;
|
||||
color:white;
|
||||
display:none;
|
||||
max-height:40%;
|
||||
overflow:scroll;
|
||||
overflow-y:auto;
|
||||
overflow-x:hidden;
|
||||
}
|
||||
|
||||
#toolbox{
|
||||
float:right;
|
||||
height:35px;
|
||||
overflow:hidden;
|
||||
display:block;
|
||||
}
|
||||
|
||||
#header{
|
||||
height:20px;
|
||||
background-color:#5f7f8f;
|
||||
border-color:#5f7f8f;
|
||||
font-weight:bold;
|
||||
}
|
||||
|
||||
|
||||
#controller{
|
||||
min-width:200px;
|
||||
padding:10px;
|
||||
}
|
||||
|
||||
#divePanel{
|
||||
padding:5px;
|
||||
width:90%;
|
||||
margin:0% 5% 0% 5%;
|
||||
margin-bottom:50px;
|
||||
background-color: rgba(88,121,139,0.3);
|
||||
box-shadow: 10px 10px 5px #888888;
|
||||
}
|
||||
|
||||
button,#no_dives_selector{
|
||||
font-size:13px;
|
||||
min-width:55px;
|
||||
line-height:2;
|
||||
margin:0px 0px 0px 0px;
|
||||
border-radius:10px;
|
||||
opacity:0.6;
|
||||
border-style:outset;
|
||||
border-color:black;
|
||||
}
|
||||
|
||||
#no_dives_selector{
|
||||
padding:5px;
|
||||
text-indent: 0.01px;
|
||||
text-overflow: '';
|
||||
}
|
||||
|
||||
button:hover{
|
||||
background-color:#4A5F5F;
|
||||
}
|
||||
|
||||
a:hover{
|
||||
cursor: pointer;
|
||||
text-decoration:underline;
|
||||
}
|
||||
|
||||
ul:hover{
|
||||
background-color:#88A9BB;
|
||||
}
|
||||
|
||||
#search_res{
|
||||
font-size:0.6em;
|
||||
visibility:hidden;
|
||||
}
|
||||
|
||||
#search_input{
|
||||
border-radius:6px;
|
||||
max-width:30%;
|
||||
padding:3px;
|
||||
opacity:0.6;
|
||||
margin: 0px 5px 5px 5px;
|
||||
border-style:outset;
|
||||
border-color:black;
|
||||
}
|
||||
|
||||
#controlbox{
|
||||
margin:7px;
|
||||
margin-bottom:10px;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#divePanel{
|
||||
padding:4px;
|
||||
width:100%;
|
||||
margin:0% 0% 0% 0%;
|
||||
}
|
||||
}
|
||||
577
theme/list_lib.js
Normal file
577
theme/list_lib.js
Normal file
|
|
@ -0,0 +1,577 @@
|
|||
var itemsToShow = new Array(); //list of indexes to all dives to view
|
||||
var items = new Array();
|
||||
var start; //index of first element viewed in itemsToShow
|
||||
var sizeofpage; //size of viewed page
|
||||
var numberofwords=0; //just for stats
|
||||
var olditemstoshow; //to reference the indexes to all dives if changed
|
||||
//////////////////////////////////
|
||||
// //
|
||||
// View Model //
|
||||
// //
|
||||
//////////////////////////////////
|
||||
|
||||
/**
|
||||
*This Method view all items
|
||||
*View N pages each of sizeofpage size items.
|
||||
*starting from zero
|
||||
*/
|
||||
function showAllDives(){
|
||||
for(var i=0 ; i < items.length ; i++){
|
||||
itemsToShow.push(i);
|
||||
}
|
||||
olditemstoshow = itemsToShow;
|
||||
start=0;
|
||||
viewInPage();
|
||||
}
|
||||
|
||||
/**
|
||||
*This function view the 'itemstoshow' in pages.
|
||||
*It start from 'start' variable.
|
||||
*It showes N pages each of sizeofpage size.
|
||||
*/
|
||||
function viewInPage(){
|
||||
var end = start + sizeofpage -1;
|
||||
if(end >= itemsToShow.length ) end = itemsToShow.length-1;
|
||||
updateView(start,end);
|
||||
}
|
||||
|
||||
/**
|
||||
*addHTML this Method puts the HTML of items of given indexes
|
||||
*@param {array} indexes array of indexes to put in HTML
|
||||
*/
|
||||
function updateView(start,end){
|
||||
var divelist = document.getElementById('diveslist');
|
||||
divelist.innerHTML="";
|
||||
for(var i=start;i<=end;i++){
|
||||
divelist.innerHTML+='<ul id="'+itemsToShow[i]+'" onclick="toggleExpantion(this)"</ul>';
|
||||
expand(document.getElementById(itemsToShow[i]));
|
||||
items[itemsToShow[i]].expanded = true;
|
||||
};
|
||||
view_pagging(start,end);
|
||||
}
|
||||
|
||||
/**
|
||||
*addHTML this Method puts the HTML of items of given indexes
|
||||
*@param {array} indexes array of indexes to put in HTML
|
||||
*/
|
||||
function addHTML(indexes){
|
||||
var divelist = document.getElementById('diveslist');
|
||||
divelist.innerHTML="";
|
||||
for(var i=0;i<indexes.length;i++){
|
||||
divelist.innerHTML+='<ul id="'+indexes[i]+'" onclick="toggleExpantion(this)"</ul>';
|
||||
expand(document.getElementById(indexes[i]));
|
||||
itemsToShow[indexes[i]].expanded = true;
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
*This Method shows items in a range [start,end]
|
||||
*@param {integer} start start from this index
|
||||
*@param {integer} finish at this index.
|
||||
*/
|
||||
function view_in_range(start,end){
|
||||
var ind = new Array();
|
||||
if(end>=itemsToShow.length)end=itemsToShow.length-1;
|
||||
for(var i=start ; i <= end ; i++){
|
||||
ind.push(i);
|
||||
}
|
||||
addHTML(ind);
|
||||
view_pagging(start,end);
|
||||
}
|
||||
|
||||
|
||||
function prev_page(){
|
||||
var end = start+sizeofpage-1;
|
||||
if(start-sizeofpage>0){
|
||||
start-=sizeofpage;
|
||||
}
|
||||
else{
|
||||
start=0;
|
||||
}
|
||||
if(end-sizeofpage>0){
|
||||
end-=sizeofpage;
|
||||
}
|
||||
if(end>=itemsToShow.length){
|
||||
end = itemsToShow.length-1;
|
||||
}
|
||||
updateView(start,end)
|
||||
}
|
||||
|
||||
function next_page(){
|
||||
var end = start+sizeofpage-1;
|
||||
if(end+sizeofpage<itemsToShow.length){
|
||||
end+=sizeofpage;
|
||||
}
|
||||
else{
|
||||
end=itemsToShow.length-1;
|
||||
}
|
||||
if(start+sizeofpage<itemsToShow.length){
|
||||
start+=sizeofpage;
|
||||
}
|
||||
updateView(start,end)
|
||||
}
|
||||
|
||||
///////////////////////////////////////////////
|
||||
|
||||
function view_pagging(start,end){
|
||||
var page = document.getElementById("pagging");
|
||||
page.innerHTML= (start+1)+' to '+(end+1) + ' of '+ (itemsToShow.length) +' dives';
|
||||
}
|
||||
|
||||
function expandAll(){
|
||||
for(var i=start;i<start+sizeofpage;i++){
|
||||
if(i>=itemsToShow.length) break;
|
||||
unexpand(document.getElementById(itemsToShow[i]));
|
||||
items[itemsToShow[i]].expanded = false;
|
||||
}
|
||||
}
|
||||
|
||||
function collapseAll(){
|
||||
for(var i=start;i<start+sizeofpage;i++){
|
||||
if(i>=itemsToShow.length) break;
|
||||
expand(document.getElementById(itemsToShow[i]));
|
||||
items[itemsToShow[i]].expanded = true;
|
||||
}
|
||||
}
|
||||
|
||||
function setNumberOfDives(e){
|
||||
var value = e.options[e.selectedIndex].value;
|
||||
sizeofpage=parseInt(value);
|
||||
var end = start + sizeofpage -1;
|
||||
view_in_range(start,end);
|
||||
}
|
||||
|
||||
function toggleExpantion(ul){
|
||||
if(!items[ul.id].expanded)
|
||||
{
|
||||
expand(ul);
|
||||
items[ul.id].expanded = true;
|
||||
}
|
||||
else
|
||||
{
|
||||
unexpand(ul);
|
||||
items[ul.id].expanded = false;
|
||||
}
|
||||
}
|
||||
|
||||
function expand(ul){
|
||||
ul.innerHTML = getlimited(items[ul.id]);
|
||||
ul.style.padding='2px 10px 2px 10px';
|
||||
}
|
||||
function unexpand(ul){
|
||||
ul.innerHTML = getExpanded(items[ul.id]);
|
||||
ul.style.padding='3px 10px 3px 10px';
|
||||
}
|
||||
|
||||
///////////////////////////////////////
|
||||
//
|
||||
// Dive Model
|
||||
//
|
||||
//////////////////////////////////////
|
||||
|
||||
function getlimited (dive) {
|
||||
return '<div style="height:20px"><div class="item">'+dive.subsurface_number+'</div>'+
|
||||
'<div class="item">'+dive.date+'</div>'+
|
||||
'<div class="item">'+dive.time+'</div>'+
|
||||
'<div class="item_large">'+dive.location+'</div>'+
|
||||
'<div class="item">'+dive.temperature.air+'</div>'+
|
||||
'<div class="item">'+dive.temperature.water+'</div></div>';
|
||||
};
|
||||
|
||||
function getExpanded (dive) {
|
||||
return '<table><tr><td class="words">Date: </td><td>'+dive.date+
|
||||
'</td><td class="words">     Time: </td><td>'+dive.time +
|
||||
'</td><td class="words">     Location: </td><td>'+'<a onclick=\"Search_list_Modules(\''+dive.location+'\')\">'
|
||||
+dive.location +'</a>'+
|
||||
'</td></tr></table><table><tr><td class="words">Rating:</td><td>'+putRating(dive.rating)+
|
||||
'</td><td class="words">   Visibilty:</td><td>'+putRating(dive.visibility)+
|
||||
'</td></tr></table>'+
|
||||
'<table><tr><td class="words">Air temp: </td><td>'+dive.temperature.air+
|
||||
'</td><td class="words">    Water temp: </td><td>'+dive.temperature.water +
|
||||
'</td></tr></table><table><tr><td class="words">DiveMaster: </td><td>'+dive.divemaster +
|
||||
'</td></tr><tr><td class="words"><p>Buddy: </p></td><td>'+dive.buddy +
|
||||
'</td></tr><tr><td class="words">Suit: </td><td>'+dive.suit +
|
||||
'</td></tr><tr><td class="words">Tags: </td><td>'+putTags(dive.tags)+
|
||||
'</td></tr></table><div style="margin:10px;"><p class="words">Notes: </p>' + dive.notes +'</div>';
|
||||
};
|
||||
|
||||
function putTags(tags){
|
||||
var result="";
|
||||
for(var i in tags){
|
||||
result+='<a onclick=\"Search_list_Modules(\''+tags[i]+'\')\">'+tags[i]+'</a>';
|
||||
if(i<tags.length-1)
|
||||
result+=', ';
|
||||
}
|
||||
return result;
|
||||
}
|
||||
|
||||
function putRating(rating){
|
||||
var result;
|
||||
result='<div>';
|
||||
for(var i=0;i<rating;i++)
|
||||
result+=' ★ ';
|
||||
for(var i=rating;i<5;i++)
|
||||
result+=' ☆ ';
|
||||
result+='</div>';
|
||||
return result;
|
||||
}
|
||||
|
||||
///////////////////////////////////////
|
||||
//
|
||||
// Sorting
|
||||
//
|
||||
/////////////////////////////////////
|
||||
|
||||
/*
|
||||
this variables keep the state of
|
||||
each col. sorted asc or des
|
||||
*/
|
||||
var number = true;
|
||||
var time = true;
|
||||
var date = true;
|
||||
var air = true;
|
||||
var water = true;
|
||||
var locat = true;
|
||||
|
||||
function list_sort(sortOn){
|
||||
switch(sortOn){
|
||||
case '1' ://number
|
||||
if(number){
|
||||
sort_it(sortOn,cmpNumAsc);
|
||||
number = 1 - number;
|
||||
}
|
||||
else{
|
||||
sort_it(sortOn,cmpNumDes);
|
||||
number = 1 - number;
|
||||
}
|
||||
break;
|
||||
case '2' ://date
|
||||
if(date){
|
||||
sort_it(sortOn,cmpDateAsc);
|
||||
date = 1 - date;
|
||||
}
|
||||
else{
|
||||
sort_it(sortOn,cmpDateDes);
|
||||
date = 1 - date;
|
||||
}
|
||||
break;
|
||||
case '3'://time
|
||||
if(time){
|
||||
sort_it(sortOn,cmpTimeDes);
|
||||
time = 1 - time;
|
||||
}
|
||||
else{
|
||||
sort_it(sortOn,cmpTimeAsc);
|
||||
time = 1 - time;
|
||||
}
|
||||
break;
|
||||
case '4'://Air temp
|
||||
if(air){
|
||||
sort_it(sortOn,cmpAtempDes);
|
||||
air = 1 - air;
|
||||
}
|
||||
else{
|
||||
sort_it(sortOn,cmpAtempAsc);
|
||||
air = 1 - air;
|
||||
}
|
||||
break;
|
||||
case '5'://Water temp
|
||||
if(water){
|
||||
sort_it(sortOn,cmpWtempDes);
|
||||
water = 1 - water;
|
||||
}
|
||||
else{
|
||||
sort_it(sortOn,cmpWtempAsc);
|
||||
water = 1 - water;
|
||||
}
|
||||
break;
|
||||
case '6'://Water temp
|
||||
if(locat){
|
||||
sort_it(sortOn,cmpLocationDes);
|
||||
locat = 1 - locat;
|
||||
}
|
||||
else{
|
||||
sort_it(sortOn,cmpLocationAsc);
|
||||
locat = 1 - locat;
|
||||
}
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
function cmpLocationAsc(j,iSmaller){
|
||||
return items[j].location < items[iSmaller].location ;
|
||||
}
|
||||
|
||||
function cmpLocationDes(j,iSmaller){
|
||||
return items[j].location > items[iSmaller].location ;
|
||||
}
|
||||
|
||||
function cmpNumAsc(j,iSmaller){
|
||||
return items[j].subsurface_number < items[iSmaller].subsurface_number ;
|
||||
}
|
||||
function cmpNumDes(j,iSmaller){
|
||||
return items[j].subsurface_number > items[iSmaller].subsurface_number ;
|
||||
}
|
||||
function cmpTimeAsc(j,iSmaller){
|
||||
return items[j].time < items[iSmaller].time ;
|
||||
}
|
||||
function cmpTimeDes(j,iSmaller){
|
||||
return items[j].time > items[iSmaller].time ;
|
||||
}
|
||||
function cmpDateAsc(j,iSmaller){
|
||||
return items[j].date < items[iSmaller].date ;
|
||||
}
|
||||
function cmpDateDes(j,iSmaller){
|
||||
return items[j].date > items[iSmaller].date ;
|
||||
}
|
||||
function cmpAtempAsc(j,iSmaller){
|
||||
return parseInt(items[j].temperature.air) < parseInt(items[iSmaller].temperature.air) ;
|
||||
}
|
||||
function cmpAtempDes(j,iSmaller){
|
||||
return parseInt(items[j].temperature.air) > parseInt(items[iSmaller].temperature.air) ;
|
||||
}
|
||||
function cmpWtempAsc(j,iSmaller){
|
||||
return parseInt(items[j].temperature.water) < parseInt(items[iSmaller].temperature.water) ;
|
||||
}
|
||||
function cmpWtempDes(j,iSmaller){
|
||||
return parseInt(items[j].temperature.water) > parseInt(items[iSmaller].temperature.water) ;
|
||||
}
|
||||
|
||||
function sort_it(sortOn,function_){
|
||||
var res = new Array();
|
||||
var visited = new Array(itemsToShow.length);
|
||||
for(var j=0;j<itemsToShow.length;j++){
|
||||
visited[j]=0;
|
||||
}
|
||||
for(var i=0;i< itemsToShow.length ;i++){
|
||||
for(var j=0;j<itemsToShow.length;j++)
|
||||
if(visited[j] == false)
|
||||
var iSmaller=j;
|
||||
for(var j=0;j<itemsToShow.length;j++){
|
||||
if(function_(itemsToShow[j],itemsToShow[iSmaller])){
|
||||
if(visited[j] == false){
|
||||
iSmaller = j;
|
||||
}
|
||||
}
|
||||
}
|
||||
visited[iSmaller] = true;
|
||||
res.push(itemsToShow[iSmaller]);
|
||||
}
|
||||
itemsToShow = res;
|
||||
start=0;
|
||||
viewInPage();
|
||||
}
|
||||
|
||||
///////////////////////////////////////
|
||||
//
|
||||
// Searching
|
||||
//
|
||||
//////////////////////////////////////
|
||||
function Set(){
|
||||
this.keys = new Array();
|
||||
}
|
||||
|
||||
Set.prototype.contains = function(key){
|
||||
return (this.keys.indexOf(key) >= 0) ? true : false;
|
||||
}
|
||||
|
||||
Set.prototype.push = function(key) {
|
||||
if(!this.contains(key)){
|
||||
this.keys.push(key);
|
||||
}
|
||||
};
|
||||
|
||||
Set.prototype.isEmpty = function() {
|
||||
return this.keys.length<=0? true:false;
|
||||
};
|
||||
|
||||
Set.prototype.forEach = function(do_){
|
||||
this.keys.forEach(do_);
|
||||
};
|
||||
|
||||
Set.prototype.Union = function(another_set){
|
||||
if (another_set == null) {
|
||||
return;
|
||||
}
|
||||
for(var i=0; i<another_set.keys.length ;i++){
|
||||
this.push(another_set.keys[i]);
|
||||
};
|
||||
};
|
||||
|
||||
////////////////////////////////////////
|
||||
|
||||
function Node(value){
|
||||
this.children = new Array();
|
||||
this.value=value;
|
||||
this.key= new Set();
|
||||
}
|
||||
///////////////////////////////////////
|
||||
function Search_list_Modules(searchfor){
|
||||
document.getElementById("search_input").value=searchfor;
|
||||
SearchModules(searchfor);
|
||||
}
|
||||
|
||||
function SearchModules(searchfor){
|
||||
var resultKeys = new Set();//set
|
||||
|
||||
if(searchfor.length<=0){
|
||||
//exit searching mode
|
||||
document.getElementById("search_input").style.borderColor="initial";
|
||||
start=0;
|
||||
itemsToShow=olditemstoshow;
|
||||
viewInPage();
|
||||
return;
|
||||
}
|
||||
|
||||
searchingModules.forEach(function(x){
|
||||
resultKeys.Union(x.search(searchfor));
|
||||
});
|
||||
|
||||
if(searchingModules["location"].enabled==true)
|
||||
resultKeys.Union(searchingModules["location"].search(searchfor));
|
||||
|
||||
if(searchingModules["divemaster"].enabled==true)
|
||||
resultKeys.Union(searchingModules["divemaster"].search(searchfor));
|
||||
|
||||
if(searchingModules["buddy"].enabled==true)
|
||||
resultKeys.Union(searchingModules["buddy"].search(searchfor));
|
||||
|
||||
if(searchingModules["notes"].enabled==true)
|
||||
resultKeys.Union(searchingModules["notes"].search(searchfor));
|
||||
|
||||
if(searchingModules["tags"].enabled==true)
|
||||
resultKeys.Union(searchingModules["tags"].search(searchfor));
|
||||
|
||||
if(resultKeys.isEmpty()){
|
||||
//didn't find keys
|
||||
document.getElementById("search_input").style.borderColor="red";
|
||||
itemsToShow=[];
|
||||
viewInPage();
|
||||
|
||||
return;
|
||||
}
|
||||
//found keys
|
||||
document.getElementById("search_input").style.borderColor="initial";
|
||||
itemsToShow = resultKeys.keys;
|
||||
start=0;
|
||||
viewInPage();
|
||||
}
|
||||
///////////////////////////////////////
|
||||
function SearchModule(enabled){
|
||||
this.head = new Node();
|
||||
this.enabled=enabled;
|
||||
}
|
||||
|
||||
SearchModule.prototype.Enter_search_string = function(str,diveno){
|
||||
if(str==""||!str) return;
|
||||
var res = str.toLowerCase().split(" ");
|
||||
for(var i=0;i<res.length;i++){
|
||||
insertIn(res[i],diveno,this.head);
|
||||
numberofwords++;
|
||||
}
|
||||
}
|
||||
|
||||
SearchModule.prototype.Enter_search_tag = function(tags,diveno){
|
||||
if(!tags) return;
|
||||
for(var i=0;i<tags.length;i++){
|
||||
insertIn(tags[i],diveno,this.head);
|
||||
numberofwords++;
|
||||
}
|
||||
}
|
||||
|
||||
SearchModule.prototype.search = function(x){
|
||||
return searchin(x.toLowerCase(),this.head);
|
||||
}
|
||||
////////////////////////////////////////
|
||||
|
||||
function insertIn(value,key,node){
|
||||
node.key.push(key);
|
||||
if(value.length<=0) return;
|
||||
|
||||
var this_char = value[0];
|
||||
value = value.substring(1,value.length);
|
||||
|
||||
var i;
|
||||
for(i =0;i<node.children.length;i++){
|
||||
if(node.children[i].value==this_char){
|
||||
return insertIn(value,key,node.children[i]);
|
||||
}
|
||||
}
|
||||
node.children[i] = new Node(this_char);
|
||||
insertIn(value,key,node.children[i]);
|
||||
}
|
||||
|
||||
function searchin(value,node){
|
||||
if(value.length<=0 || node.children.length <= 0) return node.key;
|
||||
|
||||
var this_char = value[0];
|
||||
value = value.substring(1,value.length);
|
||||
|
||||
for(var i =0;i<node.children.length;i++){
|
||||
if(node.children[i].value[0]==this_char){
|
||||
return searchin(value,node.children[i]);
|
||||
}
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
//trips
|
||||
|
||||
var tripsShown;
|
||||
|
||||
function toggleTrips(){
|
||||
var trip_button = document.getElementById('trip_button');
|
||||
if(tripsShown){
|
||||
tripsShown=false;
|
||||
trip_button.style.backgroundColor="#dfdfdf";
|
||||
viewInPage();
|
||||
}else{
|
||||
showtrips();
|
||||
trip_button.style.backgroundColor="#5f7f8f";
|
||||
tripsShown=true;
|
||||
}
|
||||
}
|
||||
|
||||
function showtrips(){
|
||||
var divelist = document.getElementById('diveslist');
|
||||
divelist.innerHTML="";
|
||||
for(var i=0;i<trips.length;i++){
|
||||
divelist.innerHTML+='<ul id="trip_'+i+'" class="trips" onclick="toggle_trip_expansion('+i+')">'
|
||||
+trips[i].name+' ( '+trips[i].dives.length+' dives)'+'</ul>'+'<div id="trip_dive_list_'+i+'"></div>';
|
||||
};
|
||||
for(var i=0;i<trips.length;i++){
|
||||
unexpand_trip(i);
|
||||
}
|
||||
}
|
||||
|
||||
function toggle_trip_expansion(trip){
|
||||
if(trips[trip].expanded ==true){
|
||||
unexpand_trip(trip);
|
||||
}else{
|
||||
expand_trip(trip);
|
||||
}
|
||||
}
|
||||
|
||||
function expand_trip(trip){
|
||||
trips[trip].expanded = true;
|
||||
var d = document.getElementById("trip_dive_list_"+trip);
|
||||
for(var j in trips[trip].dives){
|
||||
d.innerHTML+='<ul id="'+trips[trip].dives[j].number+'" onclick="toggleExpantion(this)" onmouseover="highlight(this)"'+
|
||||
' onmouseout="unhighlight(this)">'+getlimited(trips[trip].dives[j])+'</ul>';
|
||||
}
|
||||
}
|
||||
|
||||
function unexpand_trip(trip){
|
||||
trips[trip].expanded = false;
|
||||
var d = document.getElementById("trip_dive_list_"+trip);
|
||||
d.innerHTML='';
|
||||
}
|
||||
|
||||
function getItems(){
|
||||
var count = 0;
|
||||
for(var i in trips){
|
||||
for(var j in trips[i].dives){
|
||||
items[count++]=trips[i].dives[j];
|
||||
}
|
||||
}
|
||||
}
|
||||
BIN
theme/poster.png
Normal file
BIN
theme/poster.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 37 KiB |
203
theme/sand.css
Normal file
203
theme/sand.css
Normal file
|
|
@ -0,0 +1,203 @@
|
|||
body{
|
||||
min-width:680px;
|
||||
background-color:#F7F4DD;
|
||||
font-size:12px;
|
||||
font-family: 'Lobster', helvetica, arial;
|
||||
}
|
||||
|
||||
h1 {
|
||||
text-align: center;
|
||||
font-size: 70px;
|
||||
margin-top: 0;
|
||||
font-family: 'Lobster', helvetica, arial;
|
||||
text-decoration: none;
|
||||
color: #213394;
|
||||
padding-top:30px;
|
||||
}
|
||||
|
||||
ul{
|
||||
background-color:#FFD18F;
|
||||
}
|
||||
|
||||
table{
|
||||
margin:10px;
|
||||
font-size:inherit;
|
||||
}
|
||||
|
||||
tr{
|
||||
padding:6px;
|
||||
}
|
||||
|
||||
th{
|
||||
padding:4px;
|
||||
}
|
||||
|
||||
.trips{
|
||||
background-color:#EFC15F;
|
||||
}
|
||||
|
||||
.words{
|
||||
font-size:inherit;
|
||||
font-weight:bold;
|
||||
}
|
||||
|
||||
.item{
|
||||
width:9%;
|
||||
min-width:82px;
|
||||
max-width:250px;
|
||||
float:left;
|
||||
cursor:pointer;
|
||||
overflow:hidden;
|
||||
text-overflow:ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.item_large{
|
||||
width:16%;
|
||||
min-width:200px;
|
||||
max-width:385px;
|
||||
margin-right:8px;
|
||||
float:left;
|
||||
cursor:pointer;
|
||||
overflow:hidden;
|
||||
text-overflow:ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
#logo{
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
background-image: url("poster.png");
|
||||
background-size: 150px 150px;
|
||||
background-repeat: no-repeat;
|
||||
float:left;
|
||||
}
|
||||
|
||||
#header_container{
|
||||
width:600px;
|
||||
height:auto;
|
||||
margin:50px;
|
||||
margin-bottom:100px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
ul,#header{
|
||||
border-style:solid;
|
||||
border-radius:14px;
|
||||
border-color: #F30;
|
||||
margin:7px;
|
||||
padding:5px 10px 5px 10px;
|
||||
border-width: 1px;
|
||||
}
|
||||
|
||||
input[type=checkbox]{
|
||||
height:27;
|
||||
width:27;
|
||||
margin:4px;
|
||||
}
|
||||
|
||||
#advanced_search{
|
||||
position: absolute;
|
||||
box-shadow: 1px 1px 5px #F30;
|
||||
z-index: 99;
|
||||
width: 300px;
|
||||
max-width: 30%;
|
||||
min-width: 270px;
|
||||
background-color:rgba(239,193,127,0.87);
|
||||
font-size:16px;
|
||||
display:none;
|
||||
max-height:40%;
|
||||
overflow:scroll;
|
||||
overflow-y:auto;
|
||||
overflow-x:hidden;
|
||||
}
|
||||
|
||||
#toolbox{
|
||||
float:right;
|
||||
height:35px;
|
||||
overflow:hidden;
|
||||
display:block;
|
||||
}
|
||||
|
||||
#header{
|
||||
height:20px;
|
||||
background-color:#EFC15F;
|
||||
font-weight:bold;
|
||||
}
|
||||
|
||||
|
||||
#controller{
|
||||
min-width:200px;
|
||||
padding:10px;
|
||||
}
|
||||
|
||||
#divePanel{
|
||||
padding:5px;
|
||||
width:90%;
|
||||
margin:0% 5% 0% 5%;
|
||||
margin-bottom:50px;
|
||||
background-color:rgba(253, 195, 141, 0.43);
|
||||
box-shadow: 7px 7px 5px rgba(215, 107, 27, 0.43);
|
||||
}
|
||||
|
||||
button,#no_dives_selector{
|
||||
font-size:13px;
|
||||
min-width:55px;
|
||||
line-height:2;
|
||||
margin:0px 0px 0px 0px;
|
||||
border-radius:10px;
|
||||
opacity:0.6;
|
||||
border-style:outset;
|
||||
border-color: #F30;
|
||||
background-color:#F7F4DD;
|
||||
border-width: 1px;
|
||||
color:#111354;
|
||||
}
|
||||
|
||||
#no_dives_selector{
|
||||
padding:5px;
|
||||
text-indent: 0.01px;
|
||||
text-overflow: '';
|
||||
}
|
||||
|
||||
button:hover{
|
||||
background-color:#EFC17F;
|
||||
}
|
||||
|
||||
a:hover{
|
||||
cursor: pointer;
|
||||
text-decoration:underline;
|
||||
}
|
||||
|
||||
ul:hover{
|
||||
background-color:#EFC17F;
|
||||
}
|
||||
|
||||
#search_res{
|
||||
font-size:0.6em;
|
||||
visibility:hidden;
|
||||
}
|
||||
|
||||
#search_input{
|
||||
border-radius:6px;
|
||||
max-width:30%;
|
||||
padding:3px;
|
||||
opacity:0.6;
|
||||
margin: 0px 5px 5px 5px;
|
||||
border-style:outset;
|
||||
border-color:black;
|
||||
}
|
||||
|
||||
#controlbox{
|
||||
margin:7px;
|
||||
margin-bottom:10px;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#divePanel{
|
||||
padding:4px;
|
||||
width:100%;
|
||||
margin:0% 0% 0% 0%;
|
||||
}
|
||||
}
|
||||
Loading…
Add table
Reference in a new issue