Revision 45d9d315
| b/snf-cyclades-app/synnefo/ui/new_ui/ui/javascripts/network-wizard.js | ||
|---|---|---|
| 10 | 10 |
$('body').removeClass('with-overlay');
|
| 11 | 11 |
$('.overlay-area').fadeOut(400, function() {
|
| 12 | 12 |
$('.overlay-div').hide();
|
| 13 |
ui.wizard.network.reset('#network-wizard');
|
|
| 13 | 14 |
}); |
| 15 |
}, |
|
| 16 |
|
|
| 17 |
reset: function(area) {
|
|
| 18 |
$(area).find('input').val('');
|
|
| 19 |
$(area).find('.snf-radio-checked').not('.prechecked').toggleClass('snf-radio-checked snf-radio-unchecked');
|
|
| 20 |
$(area).find('.snf-radio-unchecked.prechecked').toggleClass('snf-radio-checked snf-radio-unchecked');
|
|
| 21 |
$(area).find('.snf-checkbox-checked').not('.prechecked').toggleClass('snf-checkbox-checked snf-checkbox-unchecked');
|
|
| 22 |
$(area).find('.snf-checkbox-unchecked.prechecked').toggleClass('snf-checkbox-checked snf-checkbox-unchecked');
|
|
| 23 |
$(area).find('li .manual .input').hide();
|
|
| 24 |
$(area).find('ul.subnet_options').parent('li').show();
|
|
| 14 | 25 |
} |
| 15 | 26 |
} |
| 16 | 27 |
|
| ... | ... | |
| 25 | 36 |
ui.wizard.network.btns.cancel = ui.wizard.network.btns.new_network.find('.bottom .nav.prev');
|
| 26 | 37 |
ui.wizard.network.btns.create = ui.wizard.network.btns.new_network.find('.bottom .nav.next');
|
| 27 | 38 |
|
| 28 |
|
|
| 29 |
// create network |
|
| 30 | 39 |
$('.network_options .check').click(function(e){
|
| 31 |
e.preventDefault(); |
|
| 32 |
$(this).parents('li').siblings().find('ul.subnet_options').parent('li').toggle();
|
|
| 40 |
e.preventDefault();
|
|
| 41 |
$(this).parents('li').siblings().find('ul.subnet_options').parent('li').toggle();
|
|
| 33 | 42 |
}); |
| 34 | 43 |
|
| 35 | 44 |
$('.network_options .radio_btn').click(function(e){
|
| ... | ... | |
| 40 | 49 |
ui.changeRadiobuttonState(this); |
| 41 | 50 |
|
| 42 | 51 |
if($(this).hasClass('manual')) {
|
| 43 |
$(this).siblings('.manual_sub').toggle();
|
|
| 52 |
$(this).siblings('.input').toggle();
|
|
| 44 | 53 |
} |
| 45 | 54 |
else {
|
| 46 |
$(this).closest('li').siblings().find('.manual_sub').hide();
|
|
| 55 |
$(this).closest('li').siblings('.manual').find('.input').hide();
|
|
| 47 | 56 |
} |
| 48 | 57 |
} |
| 49 | 58 |
|
| b/snf-cyclades-app/synnefo/ui/new_ui/ui/javascripts/vm-wizard.js | ||
|---|---|---|
| 206 | 206 |
$('.overlay-area').fadeOut(400, function() {
|
| 207 | 207 |
$('.overlay-div').hide();
|
| 208 | 208 |
}); |
| 209 |
ui.wizard.resetWizard();
|
|
| 209 |
ui.wizard.reset(); |
|
| 210 | 210 |
}, |
| 211 | 211 |
// manually sets elements to a initial state |
| 212 |
resetWizard: function() {
|
|
| 212 |
reset: function() {
|
|
| 213 | 213 |
ui.wizard.current_step = 1; |
| 214 | 214 |
$('.step').removeAttr('style');
|
| 215 | 215 |
$('.bottom').show();
|
| b/snf-cyclades-app/synnefo/ui/new_ui/ui/network_list.html | ||
|---|---|---|
| 39 | 39 |
|
| 40 | 40 |
<!-- overlays start --> |
| 41 | 41 |
<div class="overlay-area"> |
| 42 |
<a href="" class="close"><span class="snf-close"></span></a> |
|
| 42 |
|
|
| 43 | 43 |
<div id="overlay1" class="overlay-div"> |
| 44 |
<a href="" class="close"><span class="snf-close"></span></a> |
|
| 44 | 45 |
<p>Are you sure you want to reboot your machine?</p> |
| 45 | 46 |
<p class="buttons"><a href="" class="btn4">YES</a><a href="" class="btn4">NO</a></p> |
| 46 | 47 |
</div> |
| ... | ... | |
| 79 | 80 |
</li> |
| 80 | 81 |
<li class="dhcp_option"><span>Assign IP addresses automatically:</span> |
| 81 | 82 |
<a href="" class="check"> |
| 82 |
<span class="snf-checkbox-checked"></span> |
|
| 83 |
<span class="snf-checkbox-checked prechecked"></span>
|
|
| 83 | 84 |
</a> |
| 84 | 85 |
<p> |
| 85 | 86 |
If you enable DHCP on the private network, connected virtual machines will automatically be assigned an IP address based on the given subnet. You may disable this option if you want to assign IP addresses to the connected virtual machines manually. |
| ... | ... | |
| 91 | 92 |
<li> |
| 92 | 93 |
<span>Auto |
| 93 | 94 |
<a href="" class="radio_btn"> |
| 94 |
<span class="snf-radio-checked"></span> |
|
| 95 |
<span class="snf-radio-checked prechecked"></span>
|
|
| 95 | 96 |
</a> |
| 96 | 97 |
</span> |
| 97 | 98 |
</li> |
| ... | ... | |
| 101 | 102 |
<a href="" class="radio_btn manual"> |
| 102 | 103 |
<span class="snf-radio-unchecked"></span> |
| 103 | 104 |
</a> |
| 104 |
<input class="manual_sub hidden" type="text" name="network_name">
|
|
| 105 |
<span class="input"><input type="text" placeholder=""></span>
|
|
| 105 | 106 |
</span> |
| 106 | 107 |
</form> |
| 107 | 108 |
</li> |
| b/snf-cyclades-app/synnefo/ui/new_ui/ui/sass/_networks.scss | ||
|---|---|---|
| 18 | 18 |
|
| 19 | 19 |
|
| 20 | 20 |
#network-wizard {
|
| 21 |
|
|
| 22 |
a {
|
|
| 23 |
&.nav:focus {
|
|
| 24 |
border: none; |
|
| 25 |
} |
|
| 26 |
&:focus {
|
|
| 27 |
border: 1px solid $overlay-color-top; |
|
| 28 |
} |
|
| 29 |
} |
|
| 30 |
|
|
| 21 | 31 |
li {
|
| 22 | 32 |
list-style: none outside none; |
| 23 | 33 |
} |
| ... | ... | |
| 68 | 78 |
li {
|
| 69 | 79 |
display: block; |
| 70 | 80 |
margin-bottom: 13px; |
| 71 |
|
|
| 72 |
form {
|
|
| 73 |
margin: 0; |
|
| 74 |
|
|
| 75 |
input {
|
|
| 81 |
&.manual{
|
|
| 82 |
position: relative; |
|
| 83 |
.input {
|
|
| 76 | 84 |
position: absolute; |
| 77 |
display: inline-block; |
|
| 78 |
right: 0; |
|
| 79 |
width: 200px; |
|
| 80 |
height: 20px; |
|
| 81 |
font-size: 0.9em; |
|
| 82 |
|
|
| 83 |
&.hidden {
|
|
| 84 |
display: none; |
|
| 85 |
} |
|
| 85 |
right: -170px; |
|
| 86 |
width: 150px; |
|
| 87 |
bottom: 5px; |
|
| 88 |
display: none; |
|
| 86 | 89 |
} |
| 87 | 90 |
} |
| 88 |
&.manual form input {
|
|
| 89 |
right: -160px; |
|
| 90 |
width: 150px; |
|
| 91 |
} |
|
| 92 | 91 |
} |
| 93 | 92 |
span.sub_title {
|
| 94 | 93 |
float:left; |
| b/snf-cyclades-app/synnefo/ui/new_ui/ui/stylesheets/app.css | ||
|---|---|---|
| 8040 | 8040 |
overflow: hidden; |
| 8041 | 8041 |
} |
| 8042 | 8042 |
|
| 8043 |
/* line 21, ../sass/_networks.scss */ |
|
| 8043 |
/* line 23, ../sass/_networks.scss */ |
|
| 8044 |
#network-wizard a.nav:focus {
|
|
| 8045 |
border: none; |
|
| 8046 |
} |
|
| 8047 |
/* line 26, ../sass/_networks.scss */ |
|
| 8048 |
#network-wizard a:focus {
|
|
| 8049 |
border: 1px solid #636a70; |
|
| 8050 |
} |
|
| 8051 |
/* line 31, ../sass/_networks.scss */ |
|
| 8044 | 8052 |
#network-wizard li {
|
| 8045 | 8053 |
list-style: none outside none; |
| 8046 | 8054 |
} |
| 8047 |
/* line 25, ../sass/_networks.scss */
|
|
| 8055 |
/* line 35, ../sass/_networks.scss */
|
|
| 8048 | 8056 |
#network-wizard .net_wiz_main {
|
| 8049 | 8057 |
padding: 40px; |
| 8050 | 8058 |
width: 390px; |
| 8051 | 8059 |
} |
| 8052 |
/* line 31, ../sass/_networks.scss */
|
|
| 8060 |
/* line 41, ../sass/_networks.scss */
|
|
| 8053 | 8061 |
#network-wizard .snf-checkbox-checked, #network-wizard .snf-checkbox-unchecked {
|
| 8054 | 8062 |
font-size: 1.3em; |
| 8055 | 8063 |
} |
| 8056 |
/* line 34, ../sass/_networks.scss */
|
|
| 8064 |
/* line 44, ../sass/_networks.scss */
|
|
| 8057 | 8065 |
#network-wizard .subnet_options {
|
| 8058 | 8066 |
margin: 0; |
| 8059 | 8067 |
} |
| 8060 |
/* line 36, ../sass/_networks.scss */
|
|
| 8068 |
/* line 46, ../sass/_networks.scss */
|
|
| 8061 | 8069 |
#network-wizard .subnet_options li {
|
| 8062 | 8070 |
margin-bottom: 6px; |
| 8063 | 8071 |
padding-left: 155px; |
| 8064 | 8072 |
} |
| 8065 |
/* line 44, ../sass/_networks.scss */
|
|
| 8073 |
/* line 54, ../sass/_networks.scss */
|
|
| 8066 | 8074 |
#network-wizard .main {
|
| 8067 | 8075 |
padding: 40px; |
| 8068 | 8076 |
} |
| 8069 |
/* line 46, ../sass/_networks.scss */
|
|
| 8077 |
/* line 56, ../sass/_networks.scss */
|
|
| 8070 | 8078 |
#network-wizard .main a {
|
| 8071 | 8079 |
color: white; |
| 8072 | 8080 |
} |
| 8073 |
/* line 47, ../sass/_networks.scss */
|
|
| 8081 |
/* line 57, ../sass/_networks.scss */
|
|
| 8074 | 8082 |
#network-wizard .main .network_options {
|
| 8075 | 8083 |
position: relative; |
| 8076 | 8084 |
width: 36.25em; |
| 8077 | 8085 |
margin: 0 auto; |
| 8078 | 8086 |
} |
| 8079 |
/* line 49, ../sass/_networks.scss */
|
|
| 8087 |
/* line 59, ../sass/_networks.scss */
|
|
| 8080 | 8088 |
#network-wizard .main .network_options .dhcp_option p {
|
| 8081 | 8089 |
font-size: 0.75em; |
| 8082 | 8090 |
} |
| 8083 |
/* line 56, ../sass/_networks.scss */
|
|
| 8091 |
/* line 66, ../sass/_networks.scss */
|
|
| 8084 | 8092 |
#network-wizard .main .network_options .check, #network-wizard .main .network_options .radio_btn {
|
| 8085 | 8093 |
position: absolute; |
| 8086 | 8094 |
right: 0; |
| 8087 | 8095 |
} |
| 8088 |
/* line 61, ../sass/_networks.scss */
|
|
| 8096 |
/* line 71, ../sass/_networks.scss */
|
|
| 8089 | 8097 |
#network-wizard .main .network_options .network-name h2 {
|
| 8090 | 8098 |
color: white; |
| 8091 | 8099 |
font-size: 1em; |
| 8092 | 8100 |
} |
| 8093 |
/* line 68, ../sass/_networks.scss */
|
|
| 8101 |
/* line 78, ../sass/_networks.scss */
|
|
| 8094 | 8102 |
#network-wizard .main .network_options li {
|
| 8095 | 8103 |
display: block; |
| 8096 | 8104 |
margin-bottom: 13px; |
| 8097 | 8105 |
} |
| 8098 |
/* line 72, ../sass/_networks.scss */ |
|
| 8099 |
#network-wizard .main .network_options li form {
|
|
| 8100 |
margin: 0; |
|
| 8101 |
} |
|
| 8102 |
/* line 75, ../sass/_networks.scss */ |
|
| 8103 |
#network-wizard .main .network_options li form input {
|
|
| 8104 |
position: absolute; |
|
| 8105 |
display: inline-block; |
|
| 8106 |
right: 0; |
|
| 8107 |
width: 200px; |
|
| 8108 |
height: 20px; |
|
| 8109 |
font-size: 0.9em; |
|
| 8106 |
/* line 81, ../sass/_networks.scss */ |
|
| 8107 |
#network-wizard .main .network_options li.manual {
|
|
| 8108 |
position: relative; |
|
| 8110 | 8109 |
} |
| 8111 | 8110 |
/* line 83, ../sass/_networks.scss */ |
| 8112 |
#network-wizard .main .network_options li form input.hidden {
|
|
| 8113 |
display: none; |
|
| 8114 |
} |
|
| 8115 |
/* line 88, ../sass/_networks.scss */ |
|
| 8116 |
#network-wizard .main .network_options li.manual form input {
|
|
| 8117 |
right: -160px; |
|
| 8111 |
#network-wizard .main .network_options li.manual .input {
|
|
| 8112 |
position: absolute; |
|
| 8113 |
right: -170px; |
|
| 8118 | 8114 |
width: 150px; |
| 8115 |
bottom: 5px; |
|
| 8116 |
display: none; |
|
| 8119 | 8117 |
} |
| 8120 |
/* line 93, ../sass/_networks.scss */
|
|
| 8118 |
/* line 92, ../sass/_networks.scss */
|
|
| 8121 | 8119 |
#network-wizard .main .network_options span.sub_title {
|
| 8122 | 8120 |
float: left; |
| 8123 | 8121 |
} |
Also available in: Unified diff