Revision 5dc52783

b/snf-cyclades-app/synnefo/helpdesk/static/css/extra.css
102 102 
.subnav-fixed h2 { display: block }
103 103 

  		





  104
  104
  
    
.account-form { float: right; margin-top: 2px; margin-bottom: 0}


  		





  105
  
  
    
.info-block { margin-top: 30px; background-color: #fff}


  		





  
  105
  
    
.info-block { margin-top: 30px; background-color: #fff; padding:0;}


  		





  106
  106
  
    

  		





  107
  107
  
    
.info-block h3 .badge {   font-size: 0.8em; padding: 5px 8px; background-color:#659CEF;}


  		





  108
  108
  
    
.info-block table { margin-bottom: 0 }


  		





  109
  109
  
    
.object-details h5 { float: right; margin-top: 10px; margin-right: 10px; font-size: 1em; color: #D9397E }


  		





  110
  
  
    
.object-anchor { margin-bottom: 70px }


  		





  
  110
  
    
.object-anchor { margin-bottom: 5px; height:15px; }


  		





  111
  111
  
    

  		





  112
  112
  
    

  		





  113
  113
  
    
.subnav a.deleted { color: #F00 !important }


  		





  114
  114
  
    

  		





  115
  115
  
    

  		





  116
  116
  
    
/* new styles olga */


  		





  
  117
  
    

  		





  117
  118
  
    
h1 a:hover						{ text-decoration:none; }


  		





  118
  119
  
    
.search-query 					{ border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; }


  		





  119
  120
  
    
a								{ color:#659CEF; }


  		





  120
  121
  
    
a:hover							{ color:#2956B2 }


  		





  121
  122
  
    

  		





  122
  
  
    
h3								{ font-size:21px; cursor:pointer;}


  		





  
  123
  
    
h3								{ font-size:21px; cursor:pointer; margin:20px;}


  		





  123
  124
  
    
h4								{ font-size:18px; margin-bottom:1em; }


  		





  124
  125
  
    
input:focus,


  		





  125
  126
  
    
textarea:focus 					{


  		





  ......




  145
  146
  
    
.nav-tabs > .active > a, 


  		





  146
  147
  
    
.nav-tabs > .active > a:hover	{ background-color:#F5F5F5; color:#2956B2; font-weight:bold;}


  		





  147
  148
  
    
.nav-tabs > li					{ margin-bottom:-2px; }


  		





  148
  
  
    
.badge							{ border-radius:4px; -moz-border-radius:4px;  -webkit-border-radius:5px; }


  		





  
  149
  
    
.badge							{ border-radius:4px; -moz-border-radius:4px;  -webkit-border-radius:4px; }


  		





  149
  150
  
    
.object-details .badge			{ margin-right:8px; }


  		





  150
  151
  
    
.label-success, 


  		





  151
  152
  
    
.badge-success					{ background-color:#8BBA00 }


  		





  152
  153
  
    
.badge-important				{ background-color: #F81A23; }


  		





  153
  154
  
    
.badge-info						{ background-color:#659CEF } 


  		





  154
  
  
    

  		





  155
  155
  
    
.show-hide-tabs					{ margin:2em 0; }		


  		





  156
  
  
    
.show-hide-all					{ float:right; margin:0; line-height:27px;}


  		





  
  156
  
    
.show-hide-all					{ float:right; margin:20px; line-height:27px;}


  		





  157
  157
  
    
.toggle	.badge					{ font-size:14px; padding:5px 9px; }


  		





  158
  158
  
    
.toggle	.badge:hover			{ cursor:pointer;  }


  		





  159
  159
  
    
.show-hide-tabs .badge			{ background-color:#8BBA00; }


  		





  160
  160
  
    
.show-hide-tabs .badge:hover	{ background-color:#789B0F }


  		





  161
  161
  
    
.show-hide-all .badge			{ background-color:#8BBA00; }


  		





  162
  
  
    
.show-hide-all .badge:hover		{ background-color:#789B0F }


  		





  163
  
  
    
/*.show-hide-all .badge			{ background-color:#D61153; }


  		





  164
  
  
    
.show-hide-all .badge:hover		{ background-color:#9F0C3E }*/


  		





  165
  
  
    

  		





  
  162
  
    
.show-hide-all .badge:hover		{ background-color:#789B0F } 


  		





  166
  163
  
    
.vms h3, 


  		





  167
  
  
    
.vms h4							{ color:#D61153 }


  		





  168
  
  
    
.vms h3:hover					{ color:#9F0C3E }


  		





  
  164
  
    
.vms h4							{ color:#E42867 }


  		





  
  165
  
    
.vms h3:hover,


  		





  
  166
  
    
.vms h4:hover					{ color:#9F0C3E }


  		





  169
  167
  
    
.networks h3, 


  		





  170
  168
  
    
.networks h4					{ color:#F46906 }


  		





  171
  
  
    
.networks h3:hover				{ color:#D65C04 }


  		





  
  169
  
    
.networks h3:hover,


  		





  
  170
  
    
.networks h4:hover				{ color:#D65C04 }


  		





  172
  171
  
    
.account h3, 


  		





  173
  172
  
    
.account h4						{ color:#2956B2 }


  		





  174
  
  
    
.account h3:hover				{ color:#213D75 }


  		





  
  173
  
    
.account h3:hover,


  		





  
  174
  
    
.account h4:hover				{ color:#213D75 }


  		





  
  175
  
    
.object-details					{ padding:20px;  }


  		





  
  176
  
    
.object-details	h4				{ cursor:pointer; }


  		





  
  177
  
    
h4 .badge						{ padding:6px 9px 2px; background:url(../img/glyphicons-halflings.png) 160px 43px transparent;}


  		





  
  178
  
    
h4.expanded .badge				{ background-position: 185px 43px}


  		





  
  179
  
    
.row2							{ background-color:#EDEDED; }


  		












  

    
      b/snf-cyclades-app/synnefo/helpdesk/static/js/common.js
    
  






  31
  31
  
    
  


  		





  32
  32
  
    
  // hide/show expand/collapse 


  		





  33
  33
  
    
  


  		





  34
  
  
    
  $('.subnav a').click(function(){


  		





  
  34
  
    
  $('.subnav .dropdown-menu a').click(function(){


  		





  35
  35
  
    
  	$('.info-block-content, .show-hide-all').show();


  		





  36
  36
  
    
  })


  		





  37
  37
  
    
  


  		





  38
  
  
    
  function  checkBadgeExpanded(el){


  		





  39
  
  
    
  	if (el.hasClass('expanded')){


  		





  40
  
  
    
  		el.html( txt_tab[1]);


  		





  41
  
  
    
  	} else {


  		





  42
  
  
    
  		el.html( txt_tab[0]);


  		





  43
  
  
    
  	}


  		





  44
  
  
    
  }


  		





  45
  38
  
    
  	


  		





  46
  
  
    
  var txt_tab = ['+ Show Info','- Hide Info'];


  		





  
  39
  
    
  


  		





  47
  40
  
    
  var txt_all = ['+ Expand all','- Collapse all'];


  		





  48
  41
  
    
  


  		





  49
  
  
    
  $('.show-hide-tabs span').html(txt_tab[0]); 	 


  		





  
  42
  
    

  		





  50
  43
  
    
  $('.show-hide-all span').html(txt_all[0]); 	 


  		





  51
  44
  
    
  


  		





  52
  45
  
    
  


  		





  53
  46
  
    
  $('.show-hide-all').click(function(){


  		





  54
  47
  
    
  	var badgeAll = $(this).children('span');	


  		





  55
  
  
    
  	var tabs = $(this).parents('.info-block').find('.show-hide-tabs');


  		





  56
  48
  
    
  	badgeAll.toggleClass('open');


  		





  
  49
  
    
  	var tabs = $(this).parent('.info-block').find('.object-details-content') 


  		





  57
  50
  
    
  	


  		





  
  51
  
    
  	console.info(tabs);


  		





  58
  52
  
    
  	if (badgeAll.hasClass('open')){


  		





  59
  53
  
    
  		badgeAll.html( txt_all[1]);


  		





  60
  54
  
    
  		tabs.each(function() {


  		





  61
  
  
    
	  		$(this).next().show('slow');


  		





  62
  
  
    
		    $(this).children('span').addClass('expanded');


  		





  63
  
  
    
		    checkBadgeExpanded($(this).children('span'));


  		





  
  55
  
    
	  		$(this).show();


  		





  
  56
  
    
	  		$(this).siblings('h4').addClass('expanded');


  		





  64
  57
  
    
	    });


  		





  65
  58
  
    
  		


  		





  66
  59
  
    
  		


  		





  67
  60
  
    
  	} else {


  		





  68
  61
  
    
  		badgeAll.html( txt_all[0]);


  		





  69
  62
  
    
  		tabs.each(function() {


  		





  70
  
  
    
	  		$(this).next().hide('slow');


  		





  71
  
  
    
		    $(this).children('span').removeClass('expanded');


  		





  72
  
  
    
		    checkBadgeExpanded($(this).children('span'));


  		





  
  63
  
    
	  		$(this).hide();


  		





  
  64
  
    
	  		$(this).siblings('h4').removeClass('expanded');


  		





  
  65
  
    
 


  		





  73
  66
  
    
	    });


  		





  74
  67
  
    
  	}


  		





  75
  68
  
    
	


  		





  76
  69
  
    
  	 


  		





  77
  70
  
    
  });   


  		





  78
  71
  
    

  		





  79
  
  
    
  		    


  		





  80
  
  
    
  $('.show-hide-tabs').click(function(){	


  		





  
  72
  
    
 


  		





  
  73
  
    
  


  		





  
  74
  
    
  $('.object-details h4').click(function(){	


  		





  81
  75
  
    
  	


  		





  82
  
  
    
  	$(this).next().toggle('slow');


  		





  83
  
  
    
  	var badge = $(this).children('span');


  		





  84
  
  
    
  	badge.toggleClass('expanded');


  		





  85
  
  
    
  	checkBadgeExpanded(badge);


  		





  86
  
  
    

  		





  
  76
  
    
  	$(this).siblings('.object-details-content').toggle();


  		





  
  77
  
    
  	$(this).toggleClass('expanded');


  		





  
  78
  
    
  	 


  		





  87
  79
  
    
  }); 


  		





  88
  80
  
    
  


  		





  
  81
  
    
  


  		





  89
  82
  
    
  $('.info-block h3').click(function(){


  		





  90
  83
  
    
  	$(this).next('.info-block-content').toggle();


  		





  91
  84
  
    
  	$(this).prev('.show-hide-all').toggle();


  		





  92
  85
  
    
  })  


  		





  
  86
  
    
   


  		





  93
  87
  
    
	


  		





  94
  88
  
    
})


  		





  95
  89
  
    

  		












  

    
      b/snf-cyclades-app/synnefo/helpdesk/templates/helpdesk/account.html
    
  






  67
  67
  
    
        <h3>Virtual machines <span class="badge badge-info">Total: {{ vms|length }}</span></h3>


  		





  68
  68
  
    
        <div class="info-block-content">


  		





  69
  69
  
    
	        {% for vm in vms %}


  		





  
  70
  
    
	        <!-- {% cycle 'row1' 'row2' as rowcls %}  -->


  		





  70
  71
  
    
	        {% include "helpdesk/vms_list.html" %}


  		





  71
  72
  
    
	        {% empty %}


  		





  72
  73
  
    
	        <p>No virtual machines available for this account</p>


  		





  ......




  81
  82
  
    
        <h3>Networks <span class="badge badge-info">Total: {{ networks|length }}</span></h3>


  		





  82
  83
  
    
        <div class="info-block-content">


  		





  83
  84
  
    
	        {% for network in networks %}


  		





  
  85
  
    
	        <!--{% cycle 'row1' 'row2' as rowcls %}-->


  		





  84
  86
  
    
	        {% include "helpdesk/networks_list.html" %}


  		





  85
  87
  
    
	        {% empty %}


  		





  86
  88
  
    
	        <p>No networks available for this account</p>


  		












  

    
      b/snf-cyclades-app/synnefo/helpdesk/templates/helpdesk/networks_list.html
    
  






  1
  1
  
    
{% load helpdesk_tags %}


  		





  2
  2
  
    
<div class="object-anchor" id="network-{{network.pk}}"></div>


  		





  3
  3
  
    
<div class="network-details object-details">


  		





  4
  
  
    
    <h4>{{ network.name }}</h4>


  		





  
  4
  
    
    <h4>{{ network.name }} <span class="badge">&nbsp;</span></h4>


  		





  5
  5
  
    
    <span class="badge badge-info">ID: {{ network.pk }}</span>


  		





  6
  6
  
    
    {{ network|network_deleted_badge|safe }}


  		





  7
  
  
    
    <div class="show-hide-tabs toggle">


  		





  8
  
  
    
    	<span class="badge">&nbsp;</span>


  		





  9
  
  
    
    </div>


  		





  
  7
  
    
    


  		





  10
  8
  
    
    <div class="network-details-content object-details-content">


  		





  11
  9
  
    
        <ul class="nav nav-tabs">


  		





  12
  10
  
    
		    <li class="active"><a href="#details{{ network.pk }}" data-toggle="tab">Details</a></li>


  		





  ......




  18
  16
  
    
		            <dt>Name</dt><dd>{{ network.name }}</dd>


  		





  19
  17
  
    
		            <dt>Public</dt><dd>{{ network.public }}</dd>


  		





  20
  18
  
    
		            <dt>User ID</dt><dd>{{ network.userid }}</dd>


  		





  21
  
  
    
		            <dt>Created</dt><dd>{{ network.created }}( {{ network.created|timesince }} <strong>ago</strong>)</dd>


  		





  22
  
  
    
		            <dt>Updated</dt><dd>{{ network.updated }}( {{ network.created|timesince }} <strong>ago</strong>)</dd>


  		





  
  19
  
    
		            <dt>Created</dt><dd>{{ network.created }} ({{ network.created|timesince }} <strong>ago</strong>)</dd>


  		





  
  20
  
    
		            <dt>Updated</dt><dd>{{ network.updated }} ({{ network.created|timesince }} <strong>ago</strong>)</dd>


  		





  23
  21
  
    
		            <dt>State</dt><dd>{{ network.get_state_display }} ({{ network.state }})</dd>


  		





  24
  22
  
    
		        </dl>


  		





  25
  23
  
    
			</div>


  		












  

    
      b/snf-cyclades-app/synnefo/helpdesk/templates/helpdesk/vms_list.html
    
  






  1
  1
  
    
{% load helpdesk_tags %}


  		





  2
  2
  
    
<div class="object-anchor" id="vm-{{vm.pk}}"></div>


  		





  3
  
  
    
<div class="vm-details object-details">


  		





  4
  
  
    
    <h4> {{ vm.name }}</h4>


  		





  
  3
  
    
<div class="vm-details object-details {{ rowcls }}">


  		





  
  4
  
    
    <h4>{{ vm.name }} <span class="badge">&nbsp;</span></h4>


  		





  5
  5
  
    
    <span class="badge badge-info">ID: {{ vm.pk }}</span>


  		





  6
  6
  
    
    {{ vm|vm_status_badge|safe }}


  		





  7
  7
  
    
    <span class="badge badge-info">{{ vm|vm_public_ip }}</span>


  		





  ......




  10
  10
  
    
        <span class="ram">{{ vm.flavor.ram}}MB</span>


  		





  11
  11
  
    
        <span class="disk">{{ vm.flavor.disk }}GB</span>


  		





  12
  12
  
    
    </span>


  		





  13
  
  
    
    <div class="show-hide-tabs toggle">


  		





  14
  
  
    
    	<span class="badge">&nbsp;</span>


  		





  15
  
  
    
    </div>


  		





  
  13
  
    
     


  		





  16
  14
  
    
    <div class="vm-details-content object-details-content">


  		





  17
  15
  
    
        


  		





  18
  16
  
    
        <ul class="nav nav-tabs">


  		





  ......




  27
  25
  
    
		            <dt>ID</dt><dd>{{ vm.pk }}</dd>


  		





  28
  26
  
    
		            <dt>Name</dt><dd>{{ vm.name }}</dd>


  		





  29
  27
  
    
		            <dt>User id</dt><dd>{{ vm.userid }}</dd>


  		





  30
  
  
    
		            <dt>Created</dt><dd>{{ vm.created }}( {{ vm.created|timesince }} <strong>ago</strong>)</dd>


  		





  31
  
  
    
		            <dt>Updated</dt><dd>{{ vm.updated }} ( {{ vm.updated|timesince }} <strong>ago</strong>)</dd>


  		





  
  28
  
    
		            <dt>Created</dt><dd>{{ vm.created }} ({{ vm.created|timesince }} <strong>ago</strong>)</dd>


  		





  
  29
  
    
		            <dt>Updated</dt><dd>{{ vm.updated }} ({{ vm.updated|timesince }} <strong>ago</strong>)</dd>


  		





  32
  30
  
    
		            <dt>Suspended</dt><dd>{{ vm.suspended }}</dd>


  		





  33
  31
  
    
		            <dt>Deleted</dt><dd>{{ vm.deleted }}</dd>


  		





  34
  32
  
    
		            <dt>Image id</dt><dd>{{ vm.imageid }}</dd>


  		












Also available in:
  Unified diff