Revision 935e59b9
| b/snf-cyclades-app/synnefo/ui/new_ui/ui/javascripts/vm-wizard.js | ||
|---|---|---|
| 11 | 11 |
expand_down: undefined |
| 12 | 12 |
}, |
| 13 | 13 |
speed: 500, |
| 14 |
semaphore:1, |
|
| 14 | 15 |
|
| 15 | 16 |
setDimensions: function() {
|
| 16 | 17 |
$('.vm-wizard-carousel').css('width', 100 * ui.wizard.total_step + '%');
|
| 17 | 18 |
$('.vm-wizard-carousel .step').css('width', 100 / ui.wizard.total_step + '%');
|
| 18 | 19 |
}, |
| 19 | 20 |
getCurrent: function(){
|
| 20 |
return $('.step').filter('.current');
|
|
| 21 |
return $('.step').filter('.current').first();
|
|
| 21 | 22 |
}, |
| 22 | 23 |
|
| 23 | 24 |
getNextStep: function() {
|
| ... | ... | |
| 45 | 46 |
}, |
| 46 | 47 |
|
| 47 | 48 |
move: function(step, pos) {
|
| 48 |
|
|
| 49 |
ui.wizard.semaphore = 0; |
|
| 49 | 50 |
ui.wizard.focusFun(); |
| 50 | 51 |
ui.wizard.indicateStep(ui.wizard.current_step); |
| 51 | 52 |
ui.wizard.setMovementTags(ui.wizard.current_step, ui.wizard.btns.previous, ui.wizard.btns.next); |
| 52 | 53 |
$('body').css('overflow','hidden');
|
| 53 | 54 |
// the current visible pane |
| 54 |
current = this.getCurrent(); |
|
| 55 |
var current = this.getCurrent();
|
|
| 55 | 56 |
// Set next pane position on the right of the current one |
| 56 | 57 |
// Add current to the next pane, so that it will become |
| 57 | 58 |
// visible |
| 58 |
console.log('1');
|
|
| 59 | 59 |
step.css({
|
| 60 | 60 |
left: pos.toString() + '%' |
| 61 | 61 |
}).addClass("current");
|
| 62 |
|
|
| 62 |
console.log(current,'current'); |
|
| 63 | 63 |
// identify the current scroll position. Use it to |
| 64 | 64 |
// set next pane top position. We assume all panes |
| 65 | 65 |
// are within the scroll context of the main window. |
| 66 | 66 |
step.css({
|
| 67 | 67 |
top: this.getScrollOffset() + 'px' |
| 68 | 68 |
}); |
| 69 |
window.scroll(0, 0); |
|
| 70 |
$('.step').finish().animate({
|
|
| 69 |
$('.step').stop(false,true).animate({
|
|
| 71 | 70 |
marginLeft: (-pos).toString() + '%' |
| 72 | 71 |
}, {
|
| 73 |
complete: _.bind(function() {
|
|
| 72 |
complete: _.bind(function() {
|
|
| 74 | 73 |
// assuming all the following take place |
| 75 | 74 |
// instantaneously within a single browser |
| 76 | 75 |
// render cycle, no flickering should occur. |
| 77 | 76 |
current.removeClass("current");
|
| 77 |
window.scroll(0, 0); |
|
| 78 | 78 |
step.css({
|
| 79 | 79 |
left: '0', |
| 80 | 80 |
top: '0' |
| ... | ... | |
| 86 | 86 |
if (ui.wizard.current_step == 3 ){
|
| 87 | 87 |
$('.vm-name input').first().focus();
|
| 88 | 88 |
} |
| 89 |
ui.wizard.semaphore =1; |
|
| 89 | 90 |
}, this) |
| 90 | 91 |
}); |
| 92 |
|
|
| 91 | 93 |
}, |
| 92 | 94 |
|
| 93 | 95 |
goNext: function() {
|
| ... | ... | |
| 97 | 99 |
ui.wizard.close(); |
| 98 | 100 |
return; |
| 99 | 101 |
} |
| 100 |
ui.wizard.current_step++; |
|
| 101 |
ui.wizard.move(next, 100); |
|
| 102 |
if (ui.wizard.semaphore == 1) {
|
|
| 103 |
ui.wizard.current_step++; |
|
| 104 |
ui.wizard.move(next, 100); |
|
| 105 |
} |
|
| 102 | 106 |
}, |
| 103 | 107 |
|
| 104 | 108 |
goPrev: function() {
|
| ... | ... | |
| 107 | 111 |
ui.wizard.close(); |
| 108 | 112 |
return; |
| 109 | 113 |
} |
| 110 |
ui.wizard.current_step--; |
|
| 111 |
ui.wizard.move(prev, -100); |
|
| 114 |
if (ui.wizard.semaphore == 1) {
|
|
| 115 |
ui.wizard.current_step--; |
|
| 116 |
ui.wizard.move(prev, -100); |
|
| 117 |
} |
|
| 112 | 118 |
}, |
| 113 | 119 |
|
| 114 | 120 |
initEvents: function() {
|
| ... | ... | |
| 117 | 123 |
|
| 118 | 124 |
$(document).keydown(function(e) {
|
| 119 | 125 |
var exp = $('.vm-name input').is(':focus') && $('.vm-name input').val().length>0 && ui.wizard.current_step ==3;
|
| 120 |
console.log('exp',exp);
|
|
| 121 | 126 |
// right arrow keyCode == 39 |
| 122 | 127 |
if ($('.wizard:visible').length != 0) {
|
| 123 | 128 |
if (e.keyCode == 39 && ui.wizard.current_step != (ui.wizard.total_step) &&(!exp)) {
|
| ... | ... | |
| 403 | 408 |
/* focus and tabs functionality */ |
| 404 | 409 |
|
| 405 | 410 |
$('a').keyup(function(e) {
|
| 411 |
|
|
| 406 | 412 |
var self = this; |
| 407 | 413 |
if (e.keyCode == 9 || e.which == 9) {
|
| 408 |
if (e.shiftKey) {} else {
|
|
| 414 |
if (e.shiftKey) {
|
|
| 415 |
alert(e); |
|
| 416 |
} else {
|
|
| 409 | 417 |
//Focus next input |
| 410 | 418 |
if ($(self).attr('data-next')) {
|
| 411 | 419 |
$(self).focusout(function(e) {
|
| 412 | 420 |
var classname = $(self).data('next');
|
| 413 |
console.log('tab goes to ', classname);
|
|
| 414 | 421 |
$('.' + classname + '').first().focus();
|
| 415 | 422 |
}); |
| 416 | 423 |
} |
Also available in: Unified diff