Statistics
| Branch: | Tag: | Revision:

root / ui / src / synnefo / templates / home.pt @ f73915d9

History | View | Annotate | Download (2.1 kB)

1
<!DOCTYPE html>
2
<html xmlns:tal="http://xml.zope.org/namespaces/tal">
3

    
4
<head>
5
	<title>$project</title>
6
	<!-- include the Tools -->
7
	<script src="static/jquery.tools.min.js"></script>
8
	<link rel="stylesheet" type="text/css" href="static/alt-main.css"/>	
9
</head>
10

    
11
<body>
12
    <div id="wrapper">
13
        <div id='nefo'><a href="/" class="logo"><img src="static/nefo.png"/></a></div>
14
        <div id="header">
15
            <div id="about">Greek Research and Technology Network - Cloud management web interface</div>
16
            <a href="/" class="logo">
17
                <h1>$project</h1>
18
            </a>
19
        </div>
20
        <!-- tabs -->
21
        <ul class="css-tabs">
22
	        <li><a href="instances" title="manage your virtual machines">instances</a></li>
23
	        <li><a href="storage" title="manage your storage volumes">disks</a></li>
24
	        <li><a href="images" title="manage boot images">images</a></li>
25
	        <li><a href="network" title="configure networking">network</a></li>
26
        </ul>
27
        <div class="css-panes">
28
	        <div class="pane" style="display:block"></div>
29
	        <div class="pane"></div>
30
	        <div class="pane"></div>
31
	        <div class="pane"></div>
32
        </div>
33
    </div>
34
    <!-- activate tabs with JavaScript -->
35
    <script>
36
		$(function() {
37
            if ($("link").attr("href") == "static/alt-main.css") {
38
			    $('ul.css-tabs li').hover(function(){
39
				    $(this).find('a').animate({top:'-3px'},{queue:false,duration:150});
40
			    }, function(){
41
				    $(this).find('a').animate({top:'0px'},{queue:false,duration:150});
42
			    });
43
            }
44
		});
45
        $(function() {
46
	        $("ul.css-tabs").tabs("div.css-panes div.pane", {	
47
		        effect: 'ajax',
48
		        onBeforeClick: function(event, i) {
49
			        // get the pane to be opened
50
			        var pane = this.getPanes().eq(i);
51

    
52
			        // load it with a page specified in the tab's href attribute
53
			        pane.load(this.getTabs().eq(i).attr("href"));
54
		        }
55
	        });
56
        });
57
        $("ul.css-tabs a").tooltip({effect: 'fade', predelay: 1000, delay: 2, position: 'top center', opacity: 0.8});
58
    </script>
59
</body>
60
</html>
61