Statistics
| Branch: | Tag: | Revision:

root / ui / templates / home.html @ 35737d00

History | View | Annotate | Download (6 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 0dedf601 Christodoulos Psaltis
                <li><a href="machines" title="{% trans "manage  virtual " %}" class="primary" id="machines">
31 0dedf601 Christodoulos Psaltis
                {% trans "machines" %}</a></li>
32 0dedf601 Christodoulos Psaltis
                <li><a href="disks" title="{% trans "manage  storage " %}" class="primary" id="disks">
33 0dedf601 Christodoulos Psaltis
                {% trans "disks" %}</a></li>
34 0dedf601 Christodoulos Psaltis
                <li><a href="images" title="{% trans "manage  images" %}" class="primary" id="images">
35 0dedf601 Christodoulos Psaltis
                {% trans "images" %}</a></li>
36 0dedf601 Christodoulos Psaltis
                <li><a href="networks" title="{% trans "configure " %}" class="primary" id="networks">
37 0dedf601 Christodoulos Psaltis
                {% trans "networks" %}</a></li>
38 0dedf601 Christodoulos Psaltis
            <li><a href="files" title="{% trans "your " %}" class="secondary" id="files">
39 0dedf601 Christodoulos Psaltis
                {% trans "files" %}</a></li>
40 0dedf601 Christodoulos Psaltis
                <li><a href="desktops" title="{% trans "your " %}" class="secondary" id="desktops">
41 0dedf601 Christodoulos Psaltis
                {% trans "desktops" %}</a></li>
42 0dedf601 Christodoulos Psaltis
                <li><a href="apps" title="{% trans "your " %}" class="secondary" id="apps">
43 0dedf601 Christodoulos Psaltis
                {% trans "apps" %}</a></li>
44 cc7c5902 Dimitris Moraitis
        </ul>
45 24d0c6a9 Christodoulos Psaltis
        <div class="more-tabs"><img src="static/arrow.png" id="arrow"></img></div>
46 cc7c5902 Dimitris Moraitis
        <div class="css-panes">
47 43df43aa Markos Gogoulos
                <div id="machines-pane" class="pane" style="display:block">{% include "machines.html" %}</div>
48 ec06b07c Dimitris Moraitis
                <div id="disks-pane" class="pane"></div>
49 ec06b07c Dimitris Moraitis
                <div id="images-pane" class="pane"></div>
50 ec06b07c Dimitris Moraitis
                <div id="networks-pane" class="pane"></div>
51 50b398f6 Christodoulos Psaltis
            <div id="files-pane" class="pane"></div>
52 50b398f6 Christodoulos Psaltis
                <div id="desktops-pane" class="pane"></div>
53 50b398f6 Christodoulos Psaltis
                <div id="apps-pane" class="pane"></div>
54 cc7c5902 Dimitris Moraitis
        </div>
55 cc7c5902 Dimitris Moraitis
    </div>
56 cc7c5902 Dimitris Moraitis
    <!-- activate tabs with JavaScript -->
57 cc7c5902 Dimitris Moraitis
    <script>
58 cc7c5902 Dimitris Moraitis
                $(function() {
59 e55b8703 Christodoulos Psaltis
                    $('ul.css-tabs li').hover(function(){
60 fd76a30f Dimitris Moraitis
                            $(this).find('a:not(.current)').animate({top:'0px'},{queue:false,duration:150});
61 e55b8703 Christodoulos Psaltis
            }, function(){
62 195e8f48 Dimitris Moraitis
                $('ul.css-tabs li a:not(.current)').animate({top:'9px'},{queue:false,duration:150});
63 e55b8703 Christodoulos Psaltis
                    });
64 cc7c5902 Dimitris Moraitis
                });
65 cc7c5902 Dimitris Moraitis
        $(function() {
66 cc7c5902 Dimitris Moraitis
                $("ul.css-tabs").tabs("div.css-panes div.pane", {        
67 cc7c5902 Dimitris Moraitis
                        onBeforeClick: function(event, i) {
68 195e8f48 Dimitris Moraitis
                    $('ul.css-tabs li a').animate({top:'9px'},{queue:false,duration:150});
69 cc7c5902 Dimitris Moraitis
                                // get the pane to be opened
70 cc7c5902 Dimitris Moraitis
                                var pane = this.getPanes().eq(i);
71 ec06b07c Dimitris Moraitis
                    pane.text('');
72 cc7c5902 Dimitris Moraitis
                                // load it with a page specified in the tab's href attribute
73 cc7c5902 Dimitris Moraitis
                                pane.load(this.getTabs().eq(i).attr("href"));
74 fd76a30f Dimitris Moraitis

75 cc7c5902 Dimitris Moraitis
                        }
76 cc7c5902 Dimitris Moraitis
                });
77 cc7c5902 Dimitris Moraitis
        });
78 d932286d Christodoulos Psaltis

79 cc570918 Christodoulos Psaltis
        // what should be working
80 24d0c6a9 Christodoulos Psaltis
        /*
81 cc570918 Christodoulos Psaltis
        $(".inactive#arrow").click(function(event){
82 cc570918 Christodoulos Psaltis
            $(this).removeClass("inactive");
83 cc570918 Christodoulos Psaltis
            $(this).addClass("active");
84 24d0c6a9 Christodoulos Psaltis
            $(this).rotateAnimation(90);
85 24d0c6a9 Christodoulos Psaltis
        });
86 24d0c6a9 Christodoulos Psaltis

87 cc570918 Christodoulos Psaltis
        $(".active#arrow").click(function(event){
88 cc570918 Christodoulos Psaltis
            $(this).removeClass("active");
89 cc570918 Christodoulos Psaltis
            $(this).addClass("inactive");
90 24d0c6a9 Christodoulos Psaltis
            $(this).rotateAnimation(0);
91 24d0c6a9 Christodoulos Psaltis
        });
92 24d0c6a9 Christodoulos Psaltis
        */
93 24d0c6a9 Christodoulos Psaltis
        
94 24d0c6a9 Christodoulos Psaltis
        // what is working
95 24d0c6a9 Christodoulos Psaltis
        $("#arrow").click(function(event){
96 35737d00 Christodoulos Psaltis
            var primary = $("ul.css-tabs li a.primary");
97 35737d00 Christodoulos Psaltis
            var secondary = $("ul.css-tabs li a.secondary");
98 35737d00 Christodoulos Psaltis
            var all = $("ul.css-tabs li a");
99 35737d00 Christodoulos Psaltis

100 d932286d Christodoulos Psaltis
            $("ul.css-tabs li a.current").removeClass("current");
101 35737d00 Christodoulos Psaltis
            all.animate({top:'30px'}, {complete: function() { 
102 d932286d Christodoulos Psaltis
                $(this).hide(); 
103 35737d00 Christodoulos Psaltis
                secondary.show();
104 35737d00 Christodoulos Psaltis
                secondary.animate({top:'9px'}, {complete: function() {
105 d932286d Christodoulos Psaltis
                     $("ul.css-tabs li a.secondary#files").addClass("current");
106 d932286d Christodoulos Psaltis
                }});            
107 d932286d Christodoulos Psaltis
            }});
108 35737d00 Christodoulos Psaltis

109 d932286d Christodoulos Psaltis
            var state = false;
110 35737d00 Christodoulos Psaltis

111 68b2ba60 Christodoulos Psaltis
            $(this).rotate({animateAngle: (-180), bind:[{
112 24d0c6a9 Christodoulos Psaltis
                "click":function(){
113 cc570918 Christodoulos Psaltis
                    if (state) {
114 68b2ba60 Christodoulos Psaltis
                        $(this).rotateAnimation(-180);
115 d932286d Christodoulos Psaltis
                        $("ul.css-tabs li a.current").removeClass("current");
116 35737d00 Christodoulos Psaltis
                        all.animate({top:'30px'}, {complete: function() { 
117 d932286d Christodoulos Psaltis
                            $(this).hide(); 
118 35737d00 Christodoulos Psaltis
                            secondary.show();
119 35737d00 Christodoulos Psaltis
                            secondary.animate({top:'9px'}, {complete: function() {
120 d932286d Christodoulos Psaltis
                                 $("ul.css-tabs li a.secondary#files").addClass("current");
121 d932286d Christodoulos Psaltis
                            }});            
122 d932286d Christodoulos Psaltis
                        }});
123 cc570918 Christodoulos Psaltis
                        state = false;
124 cc570918 Christodoulos Psaltis
                        }
125 cc570918 Christodoulos Psaltis
                    else {
126 cc570918 Christodoulos Psaltis
                       $(this).rotateAnimation(0);
127 d932286d Christodoulos Psaltis
                        $("ul.css-tabs li a.current").removeClass("current");
128 35737d00 Christodoulos Psaltis
                        all.animate({top:'30px'}, {complete: function() { 
129 d932286d Christodoulos Psaltis
                            $(this).hide(); 
130 35737d00 Christodoulos Psaltis
                            primary.show();
131 35737d00 Christodoulos Psaltis
                            primary.animate({top:'9px'}, {complete: function() {
132 d932286d Christodoulos Psaltis
                                 $("ul.css-tabs li a.primary#machines").addClass("current");
133 d932286d Christodoulos Psaltis
                            }});            
134 d932286d Christodoulos Psaltis
                        }});
135 cc570918 Christodoulos Psaltis
                       state = true;
136 d932286d Christodoulos Psaltis
                       }
137 24d0c6a9 Christodoulos Psaltis
                }}]
138 24d0c6a9 Christodoulos Psaltis
            });
139 24d0c6a9 Christodoulos Psaltis
        });
140 cc570918 Christodoulos Psaltis
141 cc7c5902 Dimitris Moraitis
    </script>
142 cc7c5902 Dimitris Moraitis
</body>
143 cc7c5902 Dimitris Moraitis
</html>