Statistics
| Branch: | Tag: | Revision:

root / ui / templates / home.html @ e690c75d

History | View | Annotate | Download (2.2 kB)

1 cc7c5902 Dimitris Moraitis
<!DOCTYPE html>
2 cc7c5902 Dimitris Moraitis
3 cc7c5902 Dimitris Moraitis
<head>
4 b303ba05 Christodoulos Psaltis
        <title>{{ project }}</title>
5 cc7c5902 Dimitris Moraitis
        <!-- include the Tools -->
6 cc7c5902 Dimitris Moraitis
        <script src="static/jquery.tools.min.js"></script>
7 b446b2bf Christodoulos Psaltis
        <link rel="stylesheet" type="text/css" href="static/alt-main.css"/>        
8 5153f2a9 Dimitris Moraitis
    <link href='http://fonts.googleapis.com/css?family=PT+Sans' rel='stylesheet' type='text/css' />
9 5153f2a9 Dimitris Moraitis
10 cc7c5902 Dimitris Moraitis
</head>
11 cc7c5902 Dimitris Moraitis
12 cc7c5902 Dimitris Moraitis
<body>
13 cc7c5902 Dimitris Moraitis
    <div id="wrapper">
14 906972b1 Dimitris Moraitis
        <div id='user'><a href="#">username</a> &nbsp;|&nbsp; <a href="#">settings</a></div>
15 cc7c5902 Dimitris Moraitis
        <div id='nefo'><a href="/" class="logo"><img src="static/nefo.png"/></a></div>
16 cc7c5902 Dimitris Moraitis
        <div id="header">
17 cc7c5902 Dimitris Moraitis
            <div id="about">Greek Research and Technology Network - Cloud management web interface</div>
18 cc7c5902 Dimitris Moraitis
            <a href="/" class="logo">
19 b303ba05 Christodoulos Psaltis
                <h1>{{ project }}</h1>
20 cc7c5902 Dimitris Moraitis
            </a>
21 cc7c5902 Dimitris Moraitis
        </div>
22 cc7c5902 Dimitris Moraitis
        <!-- tabs -->
23 cc7c5902 Dimitris Moraitis
        <ul class="css-tabs">
24 b446b2bf Christodoulos Psaltis
                <li><a href="alt-instances" title="manage your virtual machines" id="instances">instances</a></li>
25 5153f2a9 Dimitris Moraitis
                <li><a href="disks" title="manage your storage volumes" id="disks">disks</a></li>
26 5153f2a9 Dimitris Moraitis
                <li><a href="images" title="manage boot images" id="images">images</a></li>
27 5153f2a9 Dimitris Moraitis
                <li><a href="networks" title="configure networking" id="networks">networks</a></li>
28 cc7c5902 Dimitris Moraitis
        </ul>
29 cc7c5902 Dimitris Moraitis
        <div class="css-panes">
30 cc7c5902 Dimitris Moraitis
                <div class="pane" style="display:block"></div>
31 cc7c5902 Dimitris Moraitis
                <div class="pane"></div>
32 cc7c5902 Dimitris Moraitis
                <div class="pane"></div>
33 cc7c5902 Dimitris Moraitis
                <div class="pane"></div>
34 cc7c5902 Dimitris Moraitis
        </div>
35 cc7c5902 Dimitris Moraitis
    </div>
36 cc7c5902 Dimitris Moraitis
    <!-- activate tabs with JavaScript -->
37 cc7c5902 Dimitris Moraitis
    <script>
38 cc7c5902 Dimitris Moraitis
                $(function() {
39 cc7c5902 Dimitris Moraitis
            if ($("link").attr("href") == "static/alt-main.css") {
40 cc7c5902 Dimitris Moraitis
                            $('ul.css-tabs li').hover(function(){
41 453e8925 Christodoulos Psaltis
                                    $(this).find('a').animate({top:'0px'},{queue:true, duration:'slow'});
42 cc7c5902 Dimitris Moraitis
                            });
43 cc7c5902 Dimitris Moraitis
            }
44 cc7c5902 Dimitris Moraitis
                });
45 cc7c5902 Dimitris Moraitis
        $(function() {
46 cc7c5902 Dimitris Moraitis
                $("ul.css-tabs").tabs("div.css-panes div.pane", {        
47 cc7c5902 Dimitris Moraitis
                        effect: 'ajax',
48 cc7c5902 Dimitris Moraitis
                        onBeforeClick: function(event, i) {
49 cc7c5902 Dimitris Moraitis
                                // get the pane to be opened
50 cc7c5902 Dimitris Moraitis
                                var pane = this.getPanes().eq(i);
51 cc7c5902 Dimitris Moraitis

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