Changeset 9210


Ignore:
Timestamp:
May 23, 2011, 3:11:34 PM (14 years ago)
Author:
dennisw
Message:

Playing with interface.

Location:
src/django_gheat/website
Files:
3 edited

Legend:

Unmodified
Added
Removed

  • src/django_gheat/website/static/heatmap.js

    r9207 r9210  
    77                controls: [
    88                                new OpenLayers.Control.Navigation(),
    9                                 new OpenLayers.Control.PanZoomBar(),
    10                                 new OpenLayers.Control.ScaleLine(),
     9                                //new OpenLayers.Control.PanZoomBar(),
     10                                //new OpenLayers.Control.ScaleLine(),
    1111                                new OpenLayers.Control.LayerSwitcher(),
    1212                                new OpenLayers.Control.MousePosition({ 'displayProjection' : projection_wgs }),

  • src/django_gheat/website/static/style.css

    r9175 r9210  
    11body,html{
    2         height:100%;
    3         margin:0;
    4         padding:0;
    5         font-family:Arial,Helvetica,sans-serif;
    6         font-size:12px;
    7         background-color:#999;
    8 }
    9 
    10 #wrapper{
    11         width:100%;
    12         height:100%;
    13         margin:0 auto -20px;
    14         word-wrap: break-word;
    15         border:1px;
    16         border-color:black;
    17 }
    18 
    19 #contentcontainer{
    20         float:left;
    21         background-image:url('/static/img/bg.jpg');
    22         background-repeat: no-repeat;
    23         background-color:#000;
    24         width:450px;
    25         height:100%;
     2  height:100%;
     3  width:100%;
     4  margin:0;
     5  padding:0;
     6  font-family:Arial,Helvetica,sans-serif;
     7  font-size:12px;
     8  background-color:#999;
    269}
    2710
    2811#heatmap{
    29         height:100%;
    30 }
    31 
    32 #heatmapwrapper{
    33         height:100%;
    34         margin-left:450px;
     12  position:absolute;
     13  height:100%;
     14  width:100%;
     15  top:0px;
     16  bottom:0px;
     17  left:0px;
     18  right:0px;
    3519}
    3620
    3721#header{
    38         width:400px;
    39         height:100px;
    40         background-image:url('/static/img/header.jpg');
    41         padding-top:21px;
    42         padding-left:50px;
     22  position:absolute;
     23  left:160px;
     24  right:160px;
     25  top:-2px;
     26  min-width:600px;
     27  background-color:#FFF;
     28  border:2px solid #CC0000;
     29  z-index:1;
    4330}
    4431
    45 #content{
    46         //background-color:#666;
    47         width:100%;
    48         margin-top:20px;
    49         margin:10px;
     32#header_title{
     33  width:100%;
     34  height:26px;
     35  top:0px;
     36  background-color:#CC0000;
     37  padding-left:5px;
     38  padding-right:5px;
    5039}
    5140
    52 #footer{
    53         background-color:#BABABA;
    54         height:17px;
    55         width:450px;
    56         margin:0 auto;
    57         clear:both;
    58         font-size:12px;
    59         color:#666;
    60         text-align:center;
    61         padding-top:3px;
    62         position:absolute;
    63         bottom:0;
     41#header_content{
     42  width:100%;
     43  padding:5px;
     44}
     45
     46#filters{
     47  position:absolute;
     48  left:-2px;
     49  top:100px;
     50  width:150px;
     51  background-color:#FFF;
     52  border:2px solid #CC0000;
     53  z-index:1;
     54}
     55
     56#filters_title{
     57  width:140px;
     58  height:26px;
     59  top:0px;
     60  background-color:#CC0000;
     61  padding-left:5px;
     62  padding-right:5px;
     63}
     64
     65#filters_content{
     66  width:140px;
     67  padding:5px;
    6468}
    6569       
    6670h1{
    67         color:#C20000;
    68         margin-bottom:-5px;
    69         //text-align:right;
    70         margin-right:15px;
    71         border-bottom:1px solid #C20000;
     71  color:#C20000;
     72  //text-align:right;
     73  margin-right:15px;
     74  border-bottom:1px solid #C20000;
    7275}
    7376
    7477A:link{
    75         color:#666;
     78  color:#000;
    7679}
    7780
    7881A:visited{
    79         color:#666;
     82  color:#E3E3E3;
    8083}
    8184
    8285A:active{
    83         color:#666;
     86  color:#E3E3E3;
    8487}
    8588
    8689A:hover{
    87         color:#444;
     90  color:#B8B8B8;
    8891}

  • src/django_gheat/website/templates/home.html

    r9207 r9210  
    66  <script type="text/javascript" language="Javascript" src="{{ STATIC_URL }}heatmap.js"></script>
    77  <script type="text/javascript" language="Javascript" src="{{ STATIC_URL }}heatmap_extensions.js"></script>
     8  <script language="javascript" type="text/javascript">
     9    function toggleDiv(div){
     10      if(document.getElementById(div + '_content').style.display != 'block'){
     11        document.getElementById(div + '_content').style.display = 'block';
     12      }
     13      else{
     14        document.getElementById(div + '_content').style.display = 'none';
     15      }
     16    }
     17  </script>
    818</head>
    919<body onload="init()">
    10   <div id="wrapper">
    11     <div id="contentcontainer">
    12       <div id="header">
    13         <a href="index.html"><img src="/static/img/logo.jpg" border="0" style="float: left;"/></a>
    14         &nbsp; <font style="font-size:24px; color:white;">Stichting Wireless Leiden</font><br />
    15         &nbsp; <font style="font-size:46px; color:white;">Heatmap</font>
    16       </div>
    17       <div id="content">
    18         <h1>Info</h1><br />
    19         Info
    20         <form method="get" action="">
    21           Gebruiker: <input type="text" id="user" name="user" size="25"/> <br />
    22           Meetrondje: <input type="text" id="dataset" name="dataset" size="25"/> <br />
    23           WirelessLeiden Node: <input type="text" id="wlnode" name="wlnode" size="25"/> <br />
    24           Encrypted: <input type="checkbox" id="enc" name="enc"/> <br />
    25           Datum: <input type="text" id="date" name="date" size="25"/> <br />
    26           Colour: <input type="text" id="colour" name="colour" size="25"/> <br />
    27           Layernaam: <input type="text" id="lname" name="lname" size="25"/> <br />
    28           <input type="button" value="Add filter" onClick="filters()"/>
    29         </form>
    30         <div id="nodelist"></div>
    31       </div>
    32       <div id="footer"> <a href="http://www.wirelessleiden.nl/">wirelessleiden.nl</a> </div>
     20  <div id="heatmap"></div>
     21  <div id="header">
     22    <div id="header_title">
     23      <font style="font-size:24px; color:white;" onclick="toggleDiv('header')">Stichting Wireless Leiden - Heatmap
     24      <a href="http://www.wirelessleiden.nl/" style="float: right;">wirelessleiden.nl</a></font>
    3325    </div>
    34     <div id="heatmapwrapper">
    35     <div id="heatmap"></div>
     26    <div id="header_content">
     27    test
     28    </div>
     29  </div>
     30  <div id="filters">
     31    <div id="filters_title">
     32      <font style="font-size:24px; color:white;" onclick="toggleDiv('filters')">Filters</font>
     33    </div>
     34    <div id="filters_content">
     35      <form method="get" action="">
     36        User: <input type="text" id="user" name="user" size="14"/> <br />
     37        Set: <input type="text" id="dataset" name="dataset" size="14"/> <br />
     38        WirelessLeiden Node: <input type="text" id="wlnode" name="wlnode" size="14"/> <br />
     39        Encrypted: <input type="checkbox" id="enc" name="enc"/> <br />
     40        Date: <input type="text" id="date" name="date" size="14"/> <br />
     41        Colour: <input type="text" id="colour" name="colour" size="14"/> <br />
     42        Layername: <input type="text" id="lname" name="lname" size="14"/> <br />
     43        <input type="button" value="Add filter" onClick="filters()"/>
     44      </form>
    3645    </div>
    3746  </div>
    3847</body>
    3948</html>
     49
     50
     51
     52
     53
     54
     55
     56
     57
     58
     59
     60
     61
     62
     63<body>
     64<!-- Collapsible panel, with separate CSS and JavaScript -->
     65<div style="width:170px;">
     66  <div class="squarebox">
     67    <div class="squareboxgradientcaption" style="height:20px; cursor: pointer;" onclick="togglePannelStatus(this.nextSibling)">
     68      <div style="float: left">
     69      </div>
     70      <div style="float: right; vertical-align: middle">
     71      </div>
     72    </div>
     73    <div class="squareboxcontent">
     74    </div>
     75  </div>
     76</div>
     77</body>
     78</html>
Note: See TracChangeset for help on using the changeset viewer.