Statistics
| Branch: | Tag: | Revision:

root / ui / templates / home.html @ 24d0c6a9

History | View | Annotate | Download (4.1 kB)

1 d7f0ad6e provetza
{% load i18n %}
2 cc7c5902 Dimitris Moraitis
<!DOCTYPE html>
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 24d0c6a9 Christodoulos Psaltis
    <script src="static/jQueryRotate.js"></script>
8 e55b8703 Christodoulos Psaltis
        <link rel="stylesheet" type="text/css" href="static/main.css"/>        
9 5153f2a9 Dimitris Moraitis
    <link href='http://fonts.googleapis.com/css?family=PT+Sans' rel='stylesheet' type='text/css' />
10 5153f2a9 Dimitris Moraitis
11 cc7c5902 Dimitris Moraitis
</head>
12 cc7c5902 Dimitris Moraitis
<body>
13 cc7c5902 Dimitris Moraitis
    <div id="wrapper">
14 ec06b07c Dimitris Moraitis
        <div id='user'>
15 ec06b07c Dimitris Moraitis
            <a href="#">{% trans "username" %}</a> &nbsp;|&nbsp; <a href="#">{% trans "settings" %}</a>
16 ec06b07c Dimitris Moraitis
            {% get_available_languages as LANGUAGES %}
17 421369dc user
            {% for lang in LANGUAGES %}
18 ec06b07c Dimitris Moraitis
                &nbsp;|&nbsp;
19 ec06b07c Dimitris Moraitis
                <a {% if  == lang.0 %}class="current_lang" {% else %}  href="/lang/?l={{lang.0}}" {% endif %}>{{lang.0}}</a> 
20 421369dc user
            {% endfor %}
21 421369dc user
        </div>
22 3b363b8e Christodoulos Psaltis
        <div id='header'>
23 cc7c5902 Dimitris Moraitis
            <a href="/" class="logo">
24 3b363b8e Christodoulos Psaltis
                <img src="static/nefo.png" alt="+nefo"/>
25 cc7c5902 Dimitris Moraitis
            </a>
26 03b3fa7e Christodoulos Psaltis
            <div class='fatborder'></div>
27 cc7c5902 Dimitris Moraitis
        </div>
28 cc7c5902 Dimitris Moraitis
        <!-- tabs -->
29 cc7c5902 Dimitris Moraitis
        <ul class="css-tabs">
30 24d0c6a9 Christodoulos Psaltis
                <li><a href="machines" title="{% trans "manage  virtual " %}" id="machines">{% trans "machines" %}
31 24d0c6a9 Christodoulos Psaltis
                </a></li>
32 cf0eb36b Markos Gogoulos
                <li><a href="disks" title="{% trans "manage  storage " %}" id="disks">{% trans "disks" %}</a></li>
33 cf0eb36b Markos Gogoulos
                <li><a href="images" title="{% trans "manage  images" %}" id="images">{% trans "images" %}</a></li>
34 cf0eb36b Markos Gogoulos
                <li><a href="networks" title="{% trans "configure " %}" id="networks">{% trans "networks" %}</a></li>
35 50b398f6 Christodoulos Psaltis
            <li><a href="files" title="{% trans "your " %}" id="files">{% trans "files" %}</a></li>
36 50b398f6 Christodoulos Psaltis
                <li><a href="desktops" title="{% trans "your " %}" id="desktops">{% trans "desktops" %}</a></li>
37 50b398f6 Christodoulos Psaltis
                <li><a href="apps" title="{% trans "your " %}" id="apps">{% trans "apps" %}</a></li>
38 cc7c5902 Dimitris Moraitis
        </ul>
39 24d0c6a9 Christodoulos Psaltis
        <div class="more-tabs"><img src="static/arrow.png" id="arrow"></img></div>
40 cc7c5902 Dimitris Moraitis
        <div class="css-panes">
41 43df43aa Markos Gogoulos
                <div id="machines-pane" class="pane" style="display:block">{% include "machines.html" %}</div>
42 ec06b07c Dimitris Moraitis
                <div id="disks-pane" class="pane"></div>
43 ec06b07c Dimitris Moraitis
                <div id="images-pane" class="pane"></div>
44 ec06b07c Dimitris Moraitis
                <div id="networks-pane" class="pane"></div>
45 50b398f6 Christodoulos Psaltis
            <div id="files-pane" class="pane"></div>
46 50b398f6 Christodoulos Psaltis
                <div id="desktops-pane" class="pane"></div>
47 50b398f6 Christodoulos Psaltis
                <div id="apps-pane" class="pane"></div>
48 cc7c5902 Dimitris Moraitis
        </div>
49 cc7c5902 Dimitris Moraitis
    </div>
50 cc7c5902 Dimitris Moraitis
    <!-- activate tabs with JavaScript -->
51 cc7c5902 Dimitris Moraitis
    <script>
52 cc7c5902 Dimitris Moraitis
                $(function() {
53 e55b8703 Christodoulos Psaltis
                    $('ul.css-tabs li').hover(function(){
54 fd76a30f Dimitris Moraitis
                            $(this).find('a:not(.current)').animate({top:'0px'},{queue:false,duration:150});
55 e55b8703 Christodoulos Psaltis
            }, function(){
56 195e8f48 Dimitris Moraitis
                $('ul.css-tabs li a:not(.current)').animate({top:'9px'},{queue:false,duration:150});
57 e55b8703 Christodoulos Psaltis
                    });
58 cc7c5902 Dimitris Moraitis
                });
59 cc7c5902 Dimitris Moraitis
        $(function() {
60 cc7c5902 Dimitris Moraitis
                $("ul.css-tabs").tabs("div.css-panes div.pane", {        
61 cc7c5902 Dimitris Moraitis
                        onBeforeClick: function(event, i) {
62 195e8f48 Dimitris Moraitis
                    $('ul.css-tabs li a').animate({top:'9px'},{queue:false,duration:150});
63 cc7c5902 Dimitris Moraitis
                                // get the pane to be opened
64 cc7c5902 Dimitris Moraitis
                                var pane = this.getPanes().eq(i);
65 ec06b07c Dimitris Moraitis
                    pane.text('');
66 cc7c5902 Dimitris Moraitis
                                // load it with a page specified in the tab's href attribute
67 cc7c5902 Dimitris Moraitis
                                pane.load(this.getTabs().eq(i).attr("href"));
68 fd76a30f Dimitris Moraitis

69 cc7c5902 Dimitris Moraitis
                        }
70 cc7c5902 Dimitris Moraitis
                });
71 cc7c5902 Dimitris Moraitis
        });
72 24d0c6a9 Christodoulos Psaltis
        // what should work
73 24d0c6a9 Christodoulos Psaltis
        /*
74 24d0c6a9 Christodoulos Psaltis
        $("#arrow").click(function(event){
75 24d0c6a9 Christodoulos Psaltis
            $(this).addClass("clicked");
76 24d0c6a9 Christodoulos Psaltis
            $(this).rotateAnimation(90);
77 24d0c6a9 Christodoulos Psaltis
        });
78 24d0c6a9 Christodoulos Psaltis

79 24d0c6a9 Christodoulos Psaltis
        $(".clicked").click(function(event){
80 24d0c6a9 Christodoulos Psaltis
            $(this).removeClass("clicked");
81 24d0c6a9 Christodoulos Psaltis
            $(this).rotateAnimation(0);
82 24d0c6a9 Christodoulos Psaltis
        });
83 24d0c6a9 Christodoulos Psaltis
        */
84 24d0c6a9 Christodoulos Psaltis
        
85 24d0c6a9 Christodoulos Psaltis
        // what is working
86 24d0c6a9 Christodoulos Psaltis
        var counter = 1;
87 24d0c6a9 Christodoulos Psaltis
        var angle;
88 24d0c6a9 Christodoulos Psaltis

89 24d0c6a9 Christodoulos Psaltis
        $("#arrow").click(function(event){
90 24d0c6a9 Christodoulos Psaltis
            $(this).rotate({animateAngle: (90), bind:[{
91 24d0c6a9 Christodoulos Psaltis
                "click":function(){
92 24d0c6a9 Christodoulos Psaltis
                    if (counter % 2 == 0)
93 24d0c6a9 Christodoulos Psaltis
                        $(this).rotateAnimation(90);
94 24d0c6a9 Christodoulos Psaltis
                    else
95 24d0c6a9 Christodoulos Psaltis
                       $(this).rotateAnimation(0); 
96 24d0c6a9 Christodoulos Psaltis
                    counter += 1;
97 24d0c6a9 Christodoulos Psaltis
                }}]
98 24d0c6a9 Christodoulos Psaltis
            });
99 24d0c6a9 Christodoulos Psaltis
        });
100 cc7c5902 Dimitris Moraitis
    </script>
101 cc7c5902 Dimitris Moraitis
</body>
102 cc7c5902 Dimitris Moraitis
</html>