Revision 969d4e10 snf-cyclades-app/synnefo/ui/new_ui/ui/javascripts/common.js
| b/snf-cyclades-app/synnefo/ui/new_ui/ui/javascripts/common.js | ||
|---|---|---|
| 9 | 9 |
* here is the declaration only |
| 10 | 10 |
*/ |
| 11 | 11 |
ui.wizard = {};
|
| 12 |
ui.checkbox = {};
|
|
| 13 |
ui.radiobtn = {};
|
|
| 12 | 14 |
|
| 13 | 15 |
/* when closeEl el is clicked, its parent with class divToCloseClass slidesUp */ |
| 14 | 16 |
ui.closeDiv = function(closeEl, divToCloseClass) {
|
| ... | ... | |
| 156 | 158 |
}); |
| 157 | 159 |
} |
| 158 | 160 |
|
| 159 |
ui.checkedListItems = function (){
|
|
| 160 |
$('.list-view .items-list').find('.snf-checkbox-checked').each(function(){
|
|
| 161 |
$(this).parents('li').addClass('selected');
|
|
| 162 |
}); |
|
| 163 |
$('.list-view .items-list').find('.snf-checkbox-unchecked').each(function(){
|
|
| 164 |
$(this).parents('li').removeClass('selected');
|
|
| 165 |
}); |
|
| 166 |
}; |
|
| 161 |
|
|
| 167 | 162 |
|
| 168 | 163 |
/* |
| 169 | 164 |
* In order for the editable value functionality to work, the html markup |
| ... | ... | |
| 287 | 282 |
} |
| 288 | 283 |
|
| 289 | 284 |
|
| 290 |
/* |
|
| 291 |
* functions concerning checkboxes and radiobuttons links |
|
| 292 |
*/ |
|
| 293 |
|
|
| 294 |
ui.changeCheckboxState =function(checkbox_link) {
|
|
| 295 |
console.log(checkbox_link); |
|
| 296 |
$(checkbox_link).find('.snf-checkbox-unchecked, .snf-checkbox-checked').toggleClass('snf-checkbox-unchecked snf-checkbox-checked');
|
|
| 297 |
ui.entitiesActionsEnabled(); |
|
| 298 |
ui.checkedListItems(); |
|
| 299 |
} |
|
| 300 |
|
|
| 301 |
// to use the above functions use first the ui.checkOneRadioButton and then ui.changeRadiobuttonState |
|
| 302 |
ui.checkOneRadioButton = function(radiobtn_link) {
|
|
| 303 |
$(radiobtn_link).closest('ul').find('span.snf-radio-checked').toggleClass('snf-radio-unchecked snf-radio-checked');
|
|
| 304 |
} |
|
| 305 |
ui.changeRadiobuttonState = function(radiobtn_link) {
|
|
| 306 |
$(radiobtn_link).find('span.snf-radio-unchecked, span.snf-radio-checked').toggleClass('snf-radio-unchecked snf-radio-checked');
|
|
| 307 |
} |
|
| 308 |
|
|
| 309 |
|
|
| 310 |
|
|
| 311 |
// toggle expand arrrow and corresponding area |
|
| 285 |
// toggle expand arrrow and area |
|
| 312 | 286 |
// todo: one function for all the areas we reveal |
| 313 | 287 |
ui.expandDownArea = function(arrow_link, area) {
|
| 314 | 288 |
var arrow_link = $(arrow_link); |
| ... | ... | |
| 325 | 299 |
}); |
| 326 | 300 |
} |
| 327 | 301 |
|
| 328 |
|
|
| 302 |
// toggle checkbox and area |
|
| 303 |
ui.slideHiddenArea = function(checkbox_link, area) {
|
|
| 304 |
area.stop().slideToggle(400, function() {
|
|
| 305 |
if (area.is(':visible')) {
|
|
| 306 |
ui.checkbox.check(checkbox_link); |
|
| 307 |
} else {
|
|
| 308 |
ui.checkbox.uncheck(checkbox_link); |
|
| 309 |
} |
|
| 310 |
}); |
|
| 311 |
}; |
|
| 329 | 312 |
/* Tabs functionality |
| 330 | 313 |
* tabsEl is the div/ul with the links to the sections and the sections that |
| 331 | 314 |
* with toggle have class sectionEl. |
| ... | ... | |
| 468 | 451 |
$(this).addClass('fix-position');
|
| 469 | 452 |
var scrollBarWidth = 14; |
| 470 | 453 |
var marg = parseInt($(self).css('marginLeft')) + cmarg - scrollBarWidth;
|
| 471 |
tt = marg; |
|
| 472 | 454 |
setTimeout(function(){
|
| 473 | 455 |
$(self).animate({
|
| 474 | 456 |
'margin-left': marg, |
| ... | ... | |
| 634 | 616 |
e.preventDefault(); |
| 635 | 617 |
}); |
| 636 | 618 |
|
| 637 |
// checkbox: basic reaction on click (checked, unchecked) |
|
| 638 |
// see wizard |
|
| 639 |
$('.check').on('click', function(e){
|
|
| 640 |
e.preventDefault(); |
|
| 641 |
e.stopPropagation(); |
|
| 642 |
ui.changeCheckboxState(this); |
|
| 643 |
console.log('check clicked');
|
|
| 644 |
var parentLi = $(this).closest('li');
|
|
| 645 |
if (parentLi.hasClass('with-checkbox') && parentLi.hasClass('has-more')) {
|
|
| 646 |
$(this).parent().next('.more').stop().slideToggle(400, function() {
|
|
| 647 |
if ($(this).parent().next('.more:visible').length != 0) {
|
|
| 648 |
$(this).find('span').removeClass('snf-checkbox-unchecked').addClass('snf-checkbox-checked');
|
|
| 649 |
} else {
|
|
| 650 |
$(this).find('span').removeClass('snf-checkbox-checked').addClass('snf-checkbox-unchecked');
|
|
| 651 |
} |
|
| 652 |
}); |
|
| 653 |
} |
|
| 654 |
}); |
|
| 655 |
|
|
| 656 |
// for checkboxes created after document.ready |
|
| 657 |
$('.items-list').on('click','.check', function(e){
|
|
| 658 |
e.preventDefault(); |
|
| 659 |
e.stopPropagation(); |
|
| 660 |
ui.changeCheckboxState(this); |
|
| 661 |
}) |
|
| 662 |
|
|
| 663 |
|
|
| 664 |
$('.with-checkbox').click(function(e){
|
|
| 665 |
console.log('with-checkbox');
|
|
| 666 |
$(this).find('.check').trigger('click');
|
|
| 667 |
}); |
|
| 668 |
|
|
| 669 |
$('.with-checkbox').find('a').click(function(e){
|
|
| 670 |
e.stopPropagation(); |
|
| 671 |
}) |
|
| 672 |
$('.radio_btn').click(function(e) {
|
|
| 673 |
e.preventDefault(); |
|
| 674 |
var state = $(this).find('span');
|
|
| 675 |
if(state.hasClass('snf-radio-unchecked')) {
|
|
| 676 |
ui.checkOneRadioButton(this); |
|
| 677 |
ui.changeRadiobuttonState(this); |
|
| 678 |
} |
|
| 679 |
}); |
|
| 680 |
|
|
| 681 | 619 |
$('.main-actions li a').click(function(e){
|
| 682 | 620 |
if (!($(this).hasClass('active'))) {
|
| 683 | 621 |
e.preventDefault(); |
| ... | ... | |
| 699 | 637 |
|
| 700 | 638 |
$('.browse-files').click(function(e){
|
| 701 | 639 |
e.preventDefault(); |
| 702 |
}) |
|
| 703 |
|
|
| 704 |
Dropzone.options.filesDropzone = {
|
|
| 705 |
dictDefaultMessage:'', |
|
| 706 |
clickable: '.browse-files', |
|
| 707 |
previewsContainer: '.dropzone-files', |
|
| 708 |
createImageThumbnails: false, |
|
| 709 |
dictRemoveFile: "snf-Remove file", |
|
| 710 |
}; |
|
| 711 |
|
|
| 640 |
}); |
|
| 712 | 641 |
|
| 713 | 642 |
$('.main .files').magnificPopup({
|
| 714 | 643 |
delegate: 'a.show.image', |
| ... | ... | |
| 753 | 682 |
} |
| 754 | 683 |
}); |
| 755 | 684 |
|
| 756 |
$('.lt-bar .select').click(function(e){
|
|
| 757 |
$(this).find('span').toggleClass('snf-checkbox-checked snf-checkbox-unchecked');
|
|
| 758 |
$(this).find('em').toggle();
|
|
| 759 |
$(this).toggleClass('selected');
|
|
| 760 |
if ( $(this).find('span').hasClass('snf-checkbox-unchecked')){
|
|
| 761 |
$('.list-view li .check span').removeClass('snf-checkbox-checked');
|
|
| 762 |
$('.list-view li .check span').addClass('snf-checkbox-unchecked');
|
|
| 763 |
} else {
|
|
| 764 |
$('.list-view li .check span').addClass('snf-checkbox-checked');
|
|
| 765 |
$('.list-view li .check span').removeClass('snf-checkbox-unchecked');
|
|
| 766 |
} |
|
| 767 |
ui.entitiesActionsEnabled(); |
|
| 768 |
ui.checkedListItems(); |
|
| 769 |
}); |
|
| 685 |
|
|
| 770 | 686 |
|
| 771 | 687 |
// set filter visible |
| 772 | 688 |
$('.filter-menu .filter').click(function(e) {
|
| ... | ... | |
| 833 | 749 |
ui.detailsCustom($('#network-connected'));
|
| 834 | 750 |
ui.detailsCustom($('#vm-connected'));
|
| 835 | 751 |
ui.firewallSetup(); |
| 836 |
$('.firewall .more a').click(function(e){
|
|
| 837 |
e.preventDefault(); |
|
| 838 |
if ($(this).find('span').hasClass('snf-radio-checked')) {
|
|
| 839 |
return false; |
|
| 840 |
} |
|
| 841 |
$(this).parents('.firewall').removeAttr('data-firewall');
|
|
| 842 |
$(this).parents('.firewall').data('firewall', $(this).parent().attr('class'));
|
|
| 843 |
$(this).find('span').toggleClass('snf-radio-unchecked snf-radio-checked');
|
|
| 844 |
$(this).parent('p').siblings('p').find('span').removeClass('snf-radio-checked');
|
|
| 845 |
$(this).parent('p').siblings('p').find('span').addClass('snf-radio-unchecked');
|
|
| 846 |
ui.firewallSetup(); |
|
| 847 |
}); |
|
| 752 |
|
|
| 848 | 753 |
$('.firewall').mouseenter(function(e){
|
| 849 | 754 |
$(this).css('z-index',2);
|
| 850 | 755 |
$(this).find('.more').stop(true, true).slideDown(200);
|
Also available in: Unified diff