| 10 |
10 |
console.log('set dimentions');
|
| 11 |
11 |
ui.wizard.relocation = $(window).width();
|
| 12 |
12 |
console.log(ui.wizard.relocation);
|
| 13 |
|
$('.vm-wizard-carousel').children('div').width(ui.wizard.relocation);
|
|
13 |
$('.vm-wizard-carousel').children('div.step').width(ui.wizard.relocation);
|
| 14 |
14 |
},
|
| 15 |
15 |
|
| 16 |
16 |
// sets the width and height of the carousel and its divs when the screen is resized (in PIXELS)
|
| ... | ... | |
| 34 |
34 |
|
| 35 |
35 |
move_to_step: function(prev_btn, next_btn) {
|
| 36 |
36 |
var speed =500;
|
|
37 |
|
|
38 |
// carousel movement when right or left arrow is pressed
|
|
39 |
$(document).keydown(function(e) {
|
|
40 |
if(e.keyCode==39) {
|
|
41 |
go_next();
|
|
42 |
return false;
|
|
43 |
}
|
|
44 |
else if(e.keyCode==37) {
|
|
45 |
go_prev();
|
|
46 |
return false;
|
|
47 |
}
|
|
48 |
});
|
|
49 |
|
| 37 |
50 |
// when the button "next" is pressed show the next step (if there is a next step)
|
| 38 |
51 |
next_btn.click(function(e){
|
| 39 |
52 |
e.preventDefault();
|
|
53 |
go_next();
|
|
54 |
})
|
|
55 |
|
|
56 |
// when the button "previous" is pressed show the previous step (if there is a previous step)
|
|
57 |
prev_btn.click(function(e){
|
|
58 |
e.preventDefault();
|
|
59 |
go_prev();
|
|
60 |
|
|
61 |
});
|
|
62 |
|
|
63 |
|
|
64 |
function go_next() {
|
|
65 |
console.log('going next!');
|
| 40 |
66 |
console.log('you clicked next!')
|
| 41 |
67 |
if(ui.wizard.current_step < ui.wizard.vm.total_step){
|
| 42 |
|
prev_btn.find('span').html('PREVIOUS');
|
| 43 |
68 |
ui.wizard.current_step++;
|
| 44 |
69 |
ui.wizard.current_position -=ui.wizard.relocation;
|
|
70 |
$('.vm-wizard-carousel').finish();
|
| 45 |
71 |
$('.vm-wizard-carousel').animate({left: ui.wizard.current_position+'px'}, speed);
|
| 46 |
72 |
ui.wizard.indicate_step(ui.wizard.current_step);
|
| 47 |
73 |
ui.wizard.set_movement_tags(ui.wizard.current_step, prev_btn, next_btn);
|
| ... | ... | |
| 53 |
79 |
}
|
| 54 |
80 |
else {
|
| 55 |
81 |
console.log('This is the last step.');
|
|
82 |
ui.wizard.close('.bottom', '#vm-wizard', '.overlay-area');
|
| 56 |
83 |
}
|
| 57 |
|
})
|
|
84 |
}
|
| 58 |
85 |
|
| 59 |
|
// when the button "previous" is pressed show the previous step (if there is a previous step)
|
| 60 |
|
prev_btn.click(function(e){
|
| 61 |
|
e.preventDefault();
|
|
86 |
function go_prev() {
|
| 62 |
87 |
if(ui.wizard.current_step > 1){
|
| 63 |
88 |
ui.wizard.current_step--;
|
| 64 |
89 |
ui.wizard.current_position +=ui.wizard.relocation;
|
|
90 |
$('.vm-wizard-carousel').finish();
|
| 65 |
91 |
$('.vm-wizard-carousel').animate({left: ui.wizard.current_position+'px'}, speed);
|
| 66 |
92 |
ui.wizard.indicate_step(ui.wizard.current_step);
|
| 67 |
93 |
ui.wizard.set_movement_tags(ui.wizard.current_step, prev_btn, next_btn);
|
|
94 |
|
|
95 |
if(ui.wizard.current_step == 3) {
|
|
96 |
setTimeout(function() { $('.vm-name').find('input').focus() }, speed/2);
|
|
97 |
}
|
| 68 |
98 |
}
|
| 69 |
99 |
else {
|
| 70 |
100 |
console.log('This is the 1st step.')
|
|
101 |
ui.wizard.close('.bottom', '#vm-wizard', '.overlay-area');
|
| 71 |
102 |
}
|
| 72 |
|
})
|
|
103 |
}
|
| 73 |
104 |
},
|
| 74 |
105 |
|
| 75 |
106 |
// sets the width and height of the steps and of the carousel (in PIXELS)
|
| 76 |
|
initialize_relocation: function(){
|
|
107 |
initialize_relocation: function(start_btns){
|
| 77 |
108 |
console.log('initialize_relocation');
|
| 78 |
|
ui.wizard.adjust_to_resized_screen();
|
| 79 |
|
ui.wizard.set_dimensions();
|
|
109 |
start_btns.click(function(e) {
|
|
110 |
e.preventDefault();
|
|
111 |
ui.wizard.reset();
|
|
112 |
ui.wizard.adjust_to_resized_screen();
|
|
113 |
ui.wizard.set_dimensions();
|
|
114 |
})
|
| 80 |
115 |
},
|
|
116 |
|
| 81 |
117 |
// for the carousel index
|
| 82 |
118 |
indicate_step: function(step) {
|
| 83 |
119 |
$('.wizard .top .sub-menu[data-step]').hide();
|
| ... | ... | |
| 86 |
122 |
$('.nums').children().find('a:contains("'+ui.wizard.current_step+'")').parent('li').addClass('current');
|
| 87 |
123 |
},
|
| 88 |
124 |
|
| 89 |
|
|
|
125 |
// changes the text of next and previous buttons
|
| 90 |
126 |
set_movement_tags: function(step, left_btn, right_btn) {
|
| 91 |
127 |
if (step==1) {
|
| 92 |
128 |
left_btn.find('span').html('CANCEL');
|
|
129 |
right_btn.find('span').html('NEXT');
|
| 93 |
130 |
}
|
| 94 |
131 |
else if(step==ui.wizard.vm.total_step) {
|
|
132 |
left_btn.find('span').html('PREVIOUS');
|
| 95 |
133 |
right_btn.find('span').html('CREATE');
|
| 96 |
134 |
}
|
| 97 |
135 |
else {
|
| 98 |
136 |
left_btn.find('span').html('PREVIOUS');
|
| 99 |
137 |
right_btn.find('span').html('NEXT');
|
| 100 |
138 |
}
|
|
139 |
},
|
|
140 |
|
|
141 |
close: function(bottom_area, main_area, total_area) {
|
|
142 |
$(bottom_area).hide();
|
|
143 |
$(main_area).slideUp();
|
|
144 |
$(total_area).slideUp();
|
|
145 |
},
|
|
146 |
|
|
147 |
// manually sets elements to a initial state
|
|
148 |
reset: function() {
|
|
149 |
ui.wizard.current_step = 1;
|
|
150 |
ui.wizard.current_position = 0;
|
|
151 |
|
|
152 |
$('.vm-wizard-carousel').css({left: ui.wizard.current_position+'px'});
|
|
153 |
$('.bottom').show();
|
|
154 |
$('#vm-wizard').find('.current').removeClass('current');
|
|
155 |
ui.wizard.indicate_step(ui.wizard.current_step);
|
|
156 |
$('#vm-wizard').find('.snf-checkbox-checked').addClass('snf-checkbox-unchecked').removeClass('snf-checkbox-checked');
|
|
157 |
$('#vm-wizard').find('.default').removeClass('snf-checkbox-unchecked').addClass('snf-checkbox-checked');
|
|
158 |
$('.details').hide();
|
|
159 |
$('.wizard .top .sub-menu ul li:first-child a').addClass('current');
|
|
160 |
ui.pickResources('small');
|
|
161 |
$('.wizard .step-2 .options li a:contains(DRBD)').addClass('current')
|
|
162 |
$('.vm-name input').val('');
|
|
163 |
$('.advanced-conf-options').hide();
|
|
164 |
$('.snf-color-picker').hide();
|
|
165 |
|
|
166 |
|
| 101 |
167 |
}
|
|
168 |
|
| 102 |
169 |
}
|
| 103 |
170 |
|
| 104 |
171 |
|
| ... | ... | |
| 114 |
181 |
e.preventDefault();
|
| 115 |
182 |
})
|
| 116 |
183 |
|
| 117 |
|
ui.wizard.initialize_relocation();
|
|
184 |
ui.wizard.initialize_relocation(new_vm_btn);
|
| 118 |
185 |
ui.wizard.move_to_step(prev_btn, next_btn);
|
| 119 |
186 |
ui.wizard.set_movement_tags(ui.wizard.current_step, prev_btn, next_btn);
|
| 120 |
|
|
|
187 |
|
| 121 |
188 |
|
| 122 |
189 |
});
|