| 1 |
// All backend JS for collections |
| 2 |
|
| 3 |
jQuery(document).ready(function($) { |
| 4 |
|
| 5 |
maxCollection = function(){}; |
| 6 |
|
| 7 |
maxCollection.prototype = { |
| 8 |
fields: '', |
| 9 |
form_updated: false, |
| 10 |
modalCurrentPage: 0, |
| 11 |
item_maxwidth: 0, |
| 12 |
} |
| 13 |
|
| 14 |
// init |
| 15 |
maxCollection.prototype.init = function() |
| 16 |
{ |
| 17 |
// LIST |
| 18 |
$('.collection_remove').on('click', $.proxy(this.confirmRemoveCollection, this)); |
| 19 |
|
| 20 |
/****** ONLY THE COLLECTION FORM ****/ |
| 21 |
if ($('#collection_edit').length == 0) |
| 22 |
return; |
| 23 |
|
| 24 |
$('.mb-preview-window').draggable(); |
| 25 |
$('.button-picker .picker-wrapper').on('click', $.proxy(this.addButtontoCollection, this)); |
| 26 |
|
| 27 |
//$(document).on('mouseenter', '.sortable.buttons .item', $.proxy(this.showTrash, this)); |
| 28 |
//$(document).on('mouseleave', '.sortable.buttons .item', $.proxy(this.hideTrash, this)); |
| 29 |
$(document).on('click', '.sortable.buttons .button-remove', $.proxy(this.removeButton, this)); |
| 30 |
|
| 31 |
if ( typeof collectionFieldMap != 'undefined') |
| 32 |
this.fields = $.parseJSON(collectionFieldMap); |
| 33 |
|
| 34 |
|
| 35 |
// Limit this to the collection edit screen */ |
| 36 |
$(document).on('keyup','.mb_ajax_save input[type="text"]', $.proxy(this.update_preview,this)); |
| 37 |
$(document).on('keyup change','.mb_ajax_save input', $.proxy(this.update_preview,this)); |
| 38 |
$(document).on('change','.mb_ajax_save select', $.proxy(this.update_preview, this)); |
| 39 |
|
| 40 |
this.initSortable(); |
| 41 |
|
| 42 |
// popup selection |
| 43 |
$(document).on('click','button[name="picker_popup"]', $.proxy(this.togglePickerPopup, this)); |
| 44 |
|
| 45 |
$(document).on('updatePreviewWindow', $.proxy(this.updatePlacement, this)); // event from other scripts possible |
| 46 |
$(document).on('mbFormSaved', $.proxy(function () { this.form_updated = false; this.toggleSaveIndicator(false); },this)); |
| 47 |
$(window).on('beforeunload', $.proxy(function () { if (this.form_updated) return maxcol_wp.leave_page; }, this)); |
| 48 |
|
| 49 |
$(document).on('click', '#exportCollection', $.proxy(this.exportCollection, this)); |
| 50 |
|
| 51 |
this.updatePlacement(); |
| 52 |
this.updatePlacement(); // running this twice yields better results |
| 53 |
|
| 54 |
// init, if there are not buttons selected, open selector ( i.e. new collection ) |
| 55 |
if ($('input[name="sorted"]').val() == '') |
| 56 |
this.togglePickerPopup(); |
| 57 |
} |
| 58 |
|
| 59 |
// add a button to the collection on screen, buttons are passed by param. |
| 60 |
maxCollection.prototype.addButtontoCollection = function (button) |
| 61 |
{ |
| 62 |
var $button = $(button).clone(); |
| 63 |
var btn_id = $button.data('id'); |
| 64 |
$button.find('.button_name').remove(); |
| 65 |
|
| 66 |
//$button.css('height','auto'); |
| 67 |
|
| 68 |
var addbtn = $button; |
| 69 |
|
| 70 |
// find span w/ button data |
| 71 |
var bdata = addbtn.find('.button_data').text(); |
| 72 |
addbtn.find('.button_data').remove(); |
| 73 |
addbtn.append('<input type="hidden" name="button-data-' + btn_id + '" value="' + bdata + '">'); |
| 74 |
|
| 75 |
this.addButtontoPreview($button.clone()); |
| 76 |
|
| 77 |
// get data from it and add input type hidden to the sortable. |
| 78 |
$(addbtn).appendTo('.mb_collection_selection .sortable '); |
| 79 |
|
| 80 |
$('.mb_collection_selection .sortable').sortable('refresh'); |
| 81 |
|
| 82 |
// add new buttons to sort array ( and thus to selection ) |
| 83 |
var order = $(".mb_collection_selection .sortable").sortable('toArray', {attribute: 'data-id'}) |
| 84 |
var count = order.length; |
| 85 |
order = order.toString(); |
| 86 |
$('input[name="sorted"]').val(order); |
| 87 |
|
| 88 |
$.proxy( this.updateColPreview({ action: 'new_button', data: bdata, button_id: btn_id, button_count: count }), this); |
| 89 |
|
| 90 |
} |
| 91 |
|
| 92 |
/* Update the social options preview */ |
| 93 |
maxCollection.prototype.updateColPreview = function (args) |
| 94 |
{ |
| 95 |
|
| 96 |
if (typeof args.action !== 'undefined') |
| 97 |
{ |
| 98 |
var action = args.action; |
| 99 |
} |
| 100 |
else |
| 101 |
action = ''; |
| 102 |
|
| 103 |
var nonce = $('input[name="block_nonce"]').val(); |
| 104 |
var collection_id = $('input[name="collection_id"]').val(); |
| 105 |
var collection_type = $('input[name="collection_type"]').val(); |
| 106 |
var count = args.button_count; |
| 107 |
var index = (count-1); |
| 108 |
|
| 109 |
if (action == 'new_button') |
| 110 |
{ |
| 111 |
var ajax_data = { |
| 112 |
block_name : 'social', |
| 113 |
block_action : 'ajax_new_button', |
| 114 |
action : 'mbpro_collection_block', |
| 115 |
nonce: nonce, |
| 116 |
collection_id: collection_id, |
| 117 |
collection_type: collection_type, |
| 118 |
block_data : {data : args.data, button_id: args.button_id, index: index }, |
| 119 |
// button_id: args.button_id, |
| 120 |
} |
| 121 |
$.proxy(this.ajaxNewButton(ajax_data), this); |
| 122 |
} |
| 123 |
|
| 124 |
// update interface, probably via ajax. |
| 125 |
|
| 126 |
} |
| 127 |
|
| 128 |
maxCollection.prototype.addButtontoPreview = function($button) |
| 129 |
{ |
| 130 |
|
| 131 |
$button.find('input').remove(); |
| 132 |
$button.find('.dashicons').remove(); |
| 133 |
var button_id = $button.data('id'); |
| 134 |
var $preview = $("<span class='mb-collection-item' data-id='" + button_id + "'></span>").append($button.children()); |
| 135 |
|
| 136 |
$preview.appendTo('.mb-preview-window .maxcollection'); |
| 137 |
this.updatePlacement(); |
| 138 |
} |
| 139 |
|
| 140 |
maxCollection.prototype.ajaxNewButton = function(data) |
| 141 |
{ |
| 142 |
|
| 143 |
var url = mb_ajax.ajaxurl; |
| 144 |
|
| 145 |
$.ajax({ |
| 146 |
type: "POST", |
| 147 |
url: url, |
| 148 |
data: data, |
| 149 |
|
| 150 |
}).done($.proxy(this.ajaxNewButtonDone, this)); |
| 151 |
|
| 152 |
} |
| 153 |
|
| 154 |
maxCollection.prototype.ajaxNewButtonDone = function (result) |
| 155 |
{ |
| 156 |
var json = $.parseJSON(result); |
| 157 |
$('.mb_tab[data-tab="social-options"]').children('.inside').append(json.body); |
| 158 |
$('.no-buttons').hide(); |
| 159 |
$(document).trigger('reInitConditionals'); // do again conditionals |
| 160 |
} |
| 161 |
|
| 162 |
|
| 163 |
// update the live preview. |
| 164 |
maxCollection.prototype.update_preview = function(e) |
| 165 |
{ |
| 166 |
|
| 167 |
e.preventDefault(); |
| 168 |
|
| 169 |
this.toggleSaveIndicator(true); |
| 170 |
|
| 171 |
var target = $(e.target); |
| 172 |
var id = $(target).attr('id'); |
| 173 |
|
| 174 |
// for multi-fields the id is not bound to an update function. |
| 175 |
if (typeof $(target).data('target') !== 'undefined') |
| 176 |
id = $(target).data('target'); |
| 177 |
|
| 178 |
|
| 179 |
var data = this.fields[id]; |
| 180 |
|
| 181 |
if (typeof data == 'undefined') |
| 182 |
return; // field doesn't have updates |
| 183 |
|
| 184 |
if (typeof data.css != 'undefined') |
| 185 |
{ |
| 186 |
|
| 187 |
value = target.val(); |
| 188 |
if (typeof data.css_unit != 'undefined' && value.indexOf(data.css_unit) == -1) |
| 189 |
value += data.css_unit; |
| 190 |
|
| 191 |
//$('.output .result').find('a').css(data.css, value); |
| 192 |
|
| 193 |
this.putCSS(data, value); |
| 194 |
} |
| 195 |
if (typeof data.attr != 'undefined') |
| 196 |
{ |
| 197 |
$('.output .result').find('a').attr(data.attr, target.val()); |
| 198 |
} |
| 199 |
if (typeof data.func != 'undefined') |
| 200 |
{ |
| 201 |
|
| 202 |
eval('this.'+ data.func + '(target)'); |
| 203 |
} |
| 204 |
|
| 205 |
this.updatePlacement(); // update the window size |
| 206 |
}; |
| 207 |
|
| 208 |
maxCollection.prototype.putCSS = function(data,value,state) |
| 209 |
{ |
| 210 |
state = state || 'both'; |
| 211 |
|
| 212 |
|
| 213 |
var element = '.maxcollection'; |
| 214 |
|
| 215 |
if (typeof data.csspart != 'undefined') |
| 216 |
{ |
| 217 |
var parts = data.csspart.split(","); |
| 218 |
for(i=0; i < parts.length; i++) |
| 219 |
{ |
| 220 |
var cpart = parts[i]; |
| 221 |
//var fullpart = element; |
| 222 |
if (element !== '.' + cpart) |
| 223 |
var fullpart = element + " ." + cpart; |
| 224 |
else |
| 225 |
var fullpart = element; // lot of stuff on .maxcollection main element |
| 226 |
|
| 227 |
|
| 228 |
$('.mb-preview-wrapper').find(fullpart).css(data.css, value); |
| 229 |
} |
| 230 |
} |
| 231 |
else |
| 232 |
$('.output .result').find(element).css(data.css, value); |
| 233 |
|
| 234 |
|
| 235 |
} |
| 236 |
|
| 237 |
/* Check the position ( horizontal - vertical ) of the buttons and change accordingly. */ |
| 238 |
maxCollection.prototype.updatePlacement = function () |
| 239 |
{ |
| 240 |
|
| 241 |
var orientation = $('#orientation').val(); |
| 242 |
|
| 243 |
if (typeof orientation != 'undefined' && orientation !== 'auto') |
| 244 |
{ |
| 245 |
this.pushPreview(orientation); |
| 246 |
|
| 247 |
} |
| 248 |
else if (orientation == 'auto') |
| 249 |
{ |
| 250 |
var placement = $('#placement').val(); |
| 251 |
if (placement == 'static-left' || placement == 'static-right') |
| 252 |
orientation = 'vertical'; |
| 253 |
else |
| 254 |
orientation = 'horizontal'; |
| 255 |
|
| 256 |
this.pushPreview(orientation); |
| 257 |
} |
| 258 |
|
| 259 |
} |
| 260 |
|
| 261 |
maxCollection.prototype.updateCollectionName = function () |
| 262 |
{ |
| 263 |
// needs escaping! |
| 264 |
var name = $('#collection_name').val(); |
| 265 |
|
| 266 |
name = name.MBescapeHTML(); |
| 267 |
|
| 268 |
var line = $('.mb-message.shortcode').html(); |
| 269 |
if (line) |
| 270 |
{ |
| 271 |
line = line.replace(/\[maxcollection name="(.*)"]/gi, '[maxcollection name="' + name + '"]'); |
| 272 |
$('.mb-message.shortcode').html( line ); |
| 273 |
} |
| 274 |
|
| 275 |
|
| 276 |
} |
| 277 |
|
| 278 |
var __entityMap = { |
| 279 |
"&": "&", |
| 280 |
"<": "<", |
| 281 |
">": ">", |
| 282 |
'"': '"', |
| 283 |
"'": ''', |
| 284 |
"/": '/' |
| 285 |
}; |
| 286 |
|
| 287 |
String.prototype.MBescapeHTML = function() { |
| 288 |
return String(this).replace(/[&<>"'\/]/g, function (s) { |
| 289 |
return __entityMap[s]; |
| 290 |
}); |
| 291 |
} |
| 292 |
|
| 293 |
|
| 294 |
/* Update for social block, make {tags} to be more meaningful in the preview */ |
| 295 |
maxCollection.prototype.parseTags = function (target) |
| 296 |
{ |
| 297 |
var option = $(target).parents('.social-option'); |
| 298 |
var index = $('.social-option').index(option); |
| 299 |
var button = $('.mb-preview-window .mb-collection-item').eq(index); |
| 300 |
var social_button = $(option).find('.maxbutton'); |
| 301 |
|
| 302 |
|
| 303 |
|
| 304 |
var network = $(option).find('[data-target="network"] :selected').text(); |
| 305 |
var count = 0; |
| 306 |
var replacements = { network_name : network, count: count }; |
| 307 |
|
| 308 |
|
| 309 |
// objects |
| 310 |
var text = $(button).find('.mb-text'); |
| 311 |
var text2 = $(button).find('.mb-text2'); |
| 312 |
|
| 313 |
|
| 314 |
//strings |
| 315 |
var social_text = $(social_button).find('.mb-text').text(); |
| 316 |
var social_text2 = $(social_button).find('.mb-text2').text(); |
| 317 |
|
| 318 |
$(text).text(social_text); |
| 319 |
$(text2).text(social_text2); |
| 320 |
|
| 321 |
|
| 322 |
this.replaceTags(text, replacements); |
| 323 |
this.replaceTags(text2, replacements); |
| 324 |
|
| 325 |
} |
| 326 |
|
| 327 |
maxCollection.prototype.replaceTags = function (element, replacements) |
| 328 |
{ |
| 329 |
var text = $(element).text(); |
| 330 |
|
| 331 |
if (typeof $(element).data('original') == 'undefined') |
| 332 |
{ |
| 333 |
$(element).data('original', text); |
| 334 |
} |
| 335 |
else // use original text for this |
| 336 |
{ |
| 337 |
text = $(element).data('original'); |
| 338 |
} |
| 339 |
|
| 340 |
$.each(replacements, function (index, el) |
| 341 |
{ |
| 342 |
|
| 343 |
text = text.replace('{' + index + '}', el); |
| 344 |
$(element).text(text); |
| 345 |
}); |
| 346 |
} |
| 347 |
|
| 348 |
maxCollection.prototype.pushPreview = function(orientation) |
| 349 |
{ |
| 350 |
|
| 351 |
var $window = $('.mb-preview-window.output'); |
| 352 |
var $items = $('.mb-preview-window .mb-collection-item'); |
| 353 |
var height = $('.mb-preview-window .maxcollection').height() + 75; |
| 354 |
|
| 355 |
$items.css('float','left'); |
| 356 |
|
| 357 |
if( $window.css('position') == 'relative') |
| 358 |
return; // don't size on mobile views. |
| 359 |
|
| 360 |
if (orientation == 'horizontal') |
| 361 |
{ |
| 362 |
$window.css('width', $('#maxbuttons').css('width') ); |
| 363 |
$window.css('top', 'auto'); |
| 364 |
$window.css('bottom', '10px'); |
| 365 |
$window.css('height', height + 'px'); |
| 366 |
$window.css('right', '10px'); |
| 367 |
$window.css('left', 'auto'); |
| 368 |
$items.css('clear', 'none'); |
| 369 |
|
| 370 |
} |
| 371 |
if (orientation == 'vertical') |
| 372 |
{ |
| 373 |
$window.css('width', '30%'); |
| 374 |
$window.css('right', '20px'); |
| 375 |
$window.css('top', '25%'); |
| 376 |
$window.css('height', height + 'px'); |
| 377 |
$window.css('left','auto'); |
| 378 |
$window.css('bottom', 'auto'); |
| 379 |
$items.css('clear','both'); |
| 380 |
} |
| 381 |
|
| 382 |
|
| 383 |
} |
| 384 |
|
| 385 |
maxCollection.prototype.exportCollection = function () |
| 386 |
{ |
| 387 |
var nonce = $('input[name="block_nonce"]').val(); |
| 388 |
var collection_id = $('input[name="collection_id"]').val(); |
| 389 |
var collection_type = $('input[name="collection_type"]').val(); |
| 390 |
|
| 391 |
var ajax_data = { |
| 392 |
block_name : 'export', |
| 393 |
block_action : 'export', |
| 394 |
action : 'mbpro_collection_block', |
| 395 |
nonce: nonce, |
| 396 |
collection_id: collection_id, |
| 397 |
collection_type: collection_type, |
| 398 |
block_data : {}, |
| 399 |
} |
| 400 |
|
| 401 |
var url = mb_ajax.ajaxurl; |
| 402 |
|
| 403 |
$.ajax({ |
| 404 |
type: "POST", |
| 405 |
url: url, |
| 406 |
data: ajax_data, |
| 407 |
|
| 408 |
}).done( |
| 409 |
function (result) |
| 410 |
{ |
| 411 |
var json = $.parseJSON(result); |
| 412 |
var location = json.data.location; |
| 413 |
window.location.href = location; |
| 414 |
} |
| 415 |
); |
| 416 |
|
| 417 |
} |
| 418 |
|
| 419 |
|
| 420 |
maxCollection.prototype.checkPicker = function () |
| 421 |
{ |
| 422 |
if ($('.mb_collection_picker').is(':visible')) |
| 423 |
this.initButtonPicker(); |
| 424 |
} |
| 425 |
|
| 426 |
/* Init sortable interface */ |
| 427 |
maxCollection.prototype.initSortable = function () |
| 428 |
{ |
| 429 |
var mbc = this; |
| 430 |
|
| 431 |
$('.mb_collection_selection .sortable').sortable({ |
| 432 |
|
| 433 |
placeholder: 'sortable-placeholder', |
| 434 |
connectWith: '.maxcollection', |
| 435 |
start: function(event, ui){ |
| 436 |
iBefore = ui.item.index(); |
| 437 |
}, |
| 438 |
create: function(event, ui) { |
| 439 |
// var order = $(".mb_collection_selection .sortable").sortable('toArray', {attribute: 'data-id'}).toString(); |
| 440 |
var order = $(this).sortable('toArray', {attribute: 'data-id'}).toString(); |
| 441 |
$('input[name="sorted"]').val(order); |
| 442 |
$('input[name="previous_selection"]').val(order); |
| 443 |
}, |
| 444 |
update: function(event, ui) { |
| 445 |
iAfter = ui.item.index(); |
| 446 |
// var order = $(".mb_collection_selection .sortable").sortable('toArray', {attribute: 'data-id'}).toString(); |
| 447 |
var order = $(this).sortable('toArray', {attribute: 'data-id'}).toString(); |
| 448 |
$('input[name="sorted"]').val(order); |
| 449 |
|
| 450 |
mbc.updateListOrder('.maxcollection .mb-collection-item', iBefore, iAfter); |
| 451 |
mbc.updateListOrder('.social_block .social-option', iBefore, iAfter); |
| 452 |
}, |
| 453 |
|
| 454 |
|
| 455 |
}); |
| 456 |
} |
| 457 |
|
| 458 |
|
| 459 |
// removes button from the current collection. |
| 460 |
maxCollection.prototype.removeButton = function (e) |
| 461 |
{ |
| 462 |
e.preventDefault(); |
| 463 |
|
| 464 |
var old_sort = $('input[name="sorted"]').val(); |
| 465 |
var parent = $(e.currentTarget).parents('.item'); |
| 466 |
var items = $('.mb_collection_selection .sortable .item'); |
| 467 |
var index = items.index(parent); |
| 468 |
|
| 469 |
$(e.currentTarget).parents('.item').remove(); |
| 470 |
$('.maxcollection .mb-collection-item:eq(' + index + ')').remove(); |
| 471 |
$('.social_block .social-option:eq(' + index + ')').remove(); |
| 472 |
|
| 473 |
$('.mb_collection_selection .sortable').sortable('refresh'); |
| 474 |
var order = $(".mb_collection_selection .sortable").sortable('toArray', {attribute: 'data-id'}).toString(); |
| 475 |
$('input[name="sorted"]').val(order); |
| 476 |
|
| 477 |
this.toggleSaveIndicator(true); |
| 478 |
|
| 479 |
} |
| 480 |
|
| 481 |
maxCollection.prototype.updateListOrder = function (el, before, after) |
| 482 |
{ |
| 483 |
this.toggleSaveIndicator(true); |
| 484 |
evictee = $(el + ':eq('+after+')'); |
| 485 |
evictor = $(el + ':eq('+before+')'); |
| 486 |
|
| 487 |
|
| 488 |
evictee.replaceWith(evictor); |
| 489 |
if(iBefore > iAfter) |
| 490 |
evictor.after(evictee); |
| 491 |
else |
| 492 |
evictor.before(evictee); |
| 493 |
|
| 494 |
// reorder not only the position but also the name of everything (-buttonId-index ) since it's important when saving. |
| 495 |
if(el == '.social_block .social-option') |
| 496 |
{ |
| 497 |
var elements = $(el).each(function (index) { |
| 498 |
var id = $(this).data('id'); |
| 499 |
var html = $(this).html(); |
| 500 |
var pattern = new RegExp( '-' + id + '-\\d', 'gi'); |
| 501 |
html = html.replace(pattern,'-' + id + '-' + index); |
| 502 |
$(this).html(html); |
| 503 |
}); |
| 504 |
} |
| 505 |
|
| 506 |
|
| 507 |
} |
| 508 |
|
| 509 |
/* Confirmation window to delete the collection */ |
| 510 |
maxCollection.prototype.confirmRemoveCollection = function(e) |
| 511 |
{ |
| 512 |
|
| 513 |
var collection_id = $(e.target).parents('.collection').data('id'); |
| 514 |
var nonce = $(e.target).parents('.collection').data('blocknonce'); |
| 515 |
var collection_type = $(e.target).parents('.collection').data('type'); |
| 516 |
|
| 517 |
var title = $('.remove_action_title').text(); |
| 518 |
var text = "<p>" + $('.remove_action_text').text() + "</p>"; |
| 519 |
|
| 520 |
var modal = window.maxFoundry.maxmodal; |
| 521 |
modal.newModal('collection_remove'); |
| 522 |
modal.setTitle(title); |
| 523 |
modal.setContent(text); |
| 524 |
|
| 525 |
modal.addControl('yes', {collection_id: collection_id, nonce: nonce, collection_type: collection_type}, |
| 526 |
$.proxy(this.removeCollection, this) ); |
| 527 |
modal.addControl('no', '', $.proxy(modal.close, modal) ); |
| 528 |
modal.setControls(); |
| 529 |
modal.show(); |
| 530 |
|
| 531 |
} |
| 532 |
|
| 533 |
maxCollection.prototype.removeCollection = function (e) |
| 534 |
{ |
| 535 |
|
| 536 |
var collection_id = e.data.collection_id; |
| 537 |
|
| 538 |
// ajax something |
| 539 |
var nonce = e.data.nonce; |
| 540 |
|
| 541 |
var collection_type = e.data.collection_type; |
| 542 |
|
| 543 |
var ajax_data = { |
| 544 |
block_name : 'collection', // invoke on the main class |
| 545 |
block_action : 'delete', |
| 546 |
action : 'mbpro_collection_block', |
| 547 |
nonce: nonce, |
| 548 |
collection_id: collection_id, |
| 549 |
collection_type: collection_type, |
| 550 |
block_data : {}, |
| 551 |
} |
| 552 |
|
| 553 |
var url = mb_ajax.ajaxurl; |
| 554 |
|
| 555 |
$.ajax({ |
| 556 |
type: "POST", |
| 557 |
url: url, |
| 558 |
data: ajax_data, |
| 559 |
|
| 560 |
}).done( |
| 561 |
function (result) |
| 562 |
{ |
| 563 |
var json = $.parseJSON(result); |
| 564 |
var modal = window.maxFoundry.maxmodal; |
| 565 |
|
| 566 |
var title = json.data.title; |
| 567 |
var body = json.data.body; |
| 568 |
var collection_id = json.data.collection_id; |
| 569 |
|
| 570 |
modal.newModal('collection_removed'); |
| 571 |
modal.setTitle(title); |
| 572 |
modal.setContent(body); |
| 573 |
modal.addControl('ok','', $.proxy(modal.close, modal) ); |
| 574 |
modal.setControls(); |
| 575 |
modal.show(); |
| 576 |
|
| 577 |
$('.collection-' + collection_id).hide(); |
| 578 |
|
| 579 |
} |
| 580 |
); |
| 581 |
} // removeCollection |
| 582 |
|
| 583 |
|
| 584 |
maxCollection.prototype.togglePickerPopup = function (e) |
| 585 |
{ |
| 586 |
var maxmodal = window.maxFoundry.maxmodal; |
| 587 |
|
| 588 |
var picker = $('#picker-modal').html(); |
| 589 |
maxmodal.newModal('picker-modal'); |
| 590 |
|
| 591 |
maxmodal.setTitle(maxcol_wp.picker_title); |
| 592 |
maxmodal.setContent(picker); |
| 593 |
|
| 594 |
maxmodal.show(); |
| 595 |
modal = maxmodal.get(); |
| 596 |
|
| 597 |
// load the events on demand |
| 598 |
$(modal).off('click change keyup'); |
| 599 |
$(modal).on('click', '.picker-packages a', $.proxy(this.getModalButtons, this)); |
| 600 |
$(modal).on('click', '.picker-main .screen .item', $.proxy(this.toggleInSelection, this)); |
| 601 |
$(modal).on('click', '.modal_close', $.proxy(maxmodal.close, maxmodal) ); |
| 602 |
$(modal).on('click', '.clear-selection', $.proxy(this.modalClearSelection, this)); |
| 603 |
$(modal).on('click', 'button[name="add-buttons"]', $.proxy(this.modalAddButtons,this)); |
| 604 |
$(modal).on('click', '.button-remove', $.proxy(this.modalDeleteButton, this) ); |
| 605 |
|
| 606 |
$(modal).on('click', '.pagination-links a', $.proxy(this.modalLoadPage, this)); |
| 607 |
$(modal).on('change keyup', '.pagination-links input', $.proxy(this.modalLoadPage, this)); |
| 608 |
|
| 609 |
if ($(modal).find('.picker-main .current-screen').length == 0 ) // not loaded, load first. |
| 610 |
{ |
| 611 |
$(modal).find('.picker-packages ul li a:first').trigger('click'); |
| 612 |
} |
| 613 |
|
| 614 |
} // initPickerPopup |
| 615 |
|
| 616 |
maxCollection.prototype.getModalButtons = function (e) |
| 617 |
{ |
| 618 |
e.preventDefault(); |
| 619 |
|
| 620 |
var modal = window.maxFoundry.maxmodal.get(); |
| 621 |
var target = $(e.target); |
| 622 |
var pack = $(e.target).data('pack'); |
| 623 |
var loaded = $(e.target).data('pack-loaded'); |
| 624 |
|
| 625 |
if (typeof loaded !== 'undefined' && loaded) |
| 626 |
{ |
| 627 |
$(modal).find('.picker-main .screen').hide().removeClass('current-screen'); |
| 628 |
$(modal).find('.picker-main .screen-' + pack).show().addClass('current-screen'); |
| 629 |
this.modalEqualHeight(); |
| 630 |
|
| 631 |
// select the package in view |
| 632 |
$(modal).find('.picker-packages ul li a').removeClass('pack-active'); |
| 633 |
$(e.target).addClass('pack-active'); |
| 634 |
|
| 635 |
return; // loaded, already fine. |
| 636 |
} |
| 637 |
|
| 638 |
var collection_id = $('input[name="collection_id"]').val(); |
| 639 |
var collection_type = $('input[name="collection_type"]').val(); |
| 640 |
var nonce = $('input[name="block_nonce"]').val(); |
| 641 |
|
| 642 |
var ajax_data = { |
| 643 |
block_name : 'collection', // invoke on the main class |
| 644 |
block_action : 'ajax_getButtons', |
| 645 |
action : 'mbpro_collection_block', |
| 646 |
nonce: nonce, |
| 647 |
collection_id: collection_id, |
| 648 |
collection_type: collection_type, |
| 649 |
block_data : { 'pack' : pack }, |
| 650 |
} |
| 651 |
|
| 652 |
var url = mb_ajax.ajaxurl; |
| 653 |
var self = this; |
| 654 |
|
| 655 |
$.ajax({ |
| 656 |
type: "POST", |
| 657 |
url: url, |
| 658 |
data: ajax_data, |
| 659 |
|
| 660 |
}).done( |
| 661 |
function (result) |
| 662 |
{ |
| 663 |
self.modalLoadButtons(result, pack, target); |
| 664 |
|
| 665 |
} |
| 666 |
); |
| 667 |
|
| 668 |
} // getModalButtons |
| 669 |
|
| 670 |
/* Add the AJAX requested buttons to the modal screen */ |
| 671 |
maxCollection.prototype.modalLoadButtons = function (result,pack,target) |
| 672 |
{ |
| 673 |
var self = this; |
| 674 |
var modal = window.maxFoundry.maxmodal.get(); |
| 675 |
|
| 676 |
$(modal).find('.picker-main .screen').hide().removeClass('current-screen'); |
| 677 |
|
| 678 |
var json = $.parseJSON(result); |
| 679 |
|
| 680 |
if ( $(modal).find('.picker-main .screen-' + pack).length == 0 ) |
| 681 |
{ |
| 682 |
var el = $('<div class="screen screen-' + pack + '">'); |
| 683 |
$(modal).find('.picker-main').append(el); |
| 684 |
} |
| 685 |
else |
| 686 |
{ |
| 687 |
var el = $(modal).find(' .picker-main .screen-' + pack); |
| 688 |
} |
| 689 |
|
| 690 |
el.html(json.body); |
| 691 |
|
| 692 |
$(modal).find('.picker-main .screen-' + pack).show().addClass('current-screen'); |
| 693 |
|
| 694 |
setTimeout( $.proxy(function() { |
| 695 |
|
| 696 |
$(modal).find('.picker-main .current-screen .item').each(function() |
| 697 |
{ |
| 698 |
self.modalScaleButton(this); |
| 699 |
|
| 700 |
}); |
| 701 |
}, this), 400); |
| 702 |
|
| 703 |
this.modalEqualHeight(); |
| 704 |
$(target).data('pack-loaded', true); |
| 705 |
|
| 706 |
// select the package in view |
| 707 |
$(modal).find('.picker-packages ul li a').removeClass('pack-active'); |
| 708 |
$(target).addClass('pack-active'); |
| 709 |
|
| 710 |
$(document).trigger('mb-modalLoadButtons'); |
| 711 |
|
| 712 |
} |
| 713 |
|
| 714 |
maxCollection.prototype.modalLoadPage = function (e) |
| 715 |
{ |
| 716 |
e.preventDefault(); |
| 717 |
|
| 718 |
var page = $(e.target).data("page"); |
| 719 |
if (typeof page == 'undefined') |
| 720 |
{ |
| 721 |
// check if input number is event |
| 722 |
if (e.target.type == 'number') |
| 723 |
var page = $(e.target).val(); |
| 724 |
else |
| 725 |
return; // no page load if page link is disabled ( current / or n/a ) |
| 726 |
} |
| 727 |
var collection_id = $('input[name="collection_id"]').val(); |
| 728 |
var collection_type = $('input[name="collection_type"]').val(); |
| 729 |
var nonce = $('input[name="block_nonce"]').val(); |
| 730 |
|
| 731 |
var pack = $('.picker-packages a.pack-active').data('pack'); |
| 732 |
var target = $('.picker-packages a.pack-active'); |
| 733 |
|
| 734 |
var ajax_data = { |
| 735 |
block_name : 'collection', // invoke on the main class |
| 736 |
block_action : 'ajax_getButtons', |
| 737 |
action : 'mbpro_collection_block', |
| 738 |
nonce: nonce, |
| 739 |
collection_id: collection_id, |
| 740 |
collection_type: collection_type, |
| 741 |
block_data : { 'pack' : pack, 'paged' : page }, |
| 742 |
} |
| 743 |
|
| 744 |
var url = mb_ajax.ajaxurl; |
| 745 |
var self = this; |
| 746 |
|
| 747 |
$.ajax({ |
| 748 |
type: "POST", |
| 749 |
url: url, |
| 750 |
data: ajax_data, |
| 751 |
|
| 752 |
}).done( |
| 753 |
function (result) |
| 754 |
{ |
| 755 |
|
| 756 |
self.modalLoadButtons(result, pack, target); |
| 757 |
} |
| 758 |
); |
| 759 |
|
| 760 |
} |
| 761 |
|
| 762 |
maxCollection.prototype.toggleInSelection = function (e) |
| 763 |
{ |
| 764 |
var target = $(e.target); |
| 765 |
var modal = window.maxFoundry.maxmodal.get(); |
| 766 |
|
| 767 |
if (! target.hasClass('item')) // find the whole thing. |
| 768 |
{ |
| 769 |
var target = $(e.target).parents('.item'); |
| 770 |
} |
| 771 |
|
| 772 |
var id = $(target).data('id'); |
| 773 |
var exists = $(modal).find('.picker-inselection .items').children('[data-id="' + id + '"]'); |
| 774 |
if (exists.length > 0) |
| 775 |
{ |
| 776 |
$(target).find('.button-selected').remove(); |
| 777 |
$(modal).find('.picker-inselection .items').children('[data-id="' + id + '"]').remove(); |
| 778 |
this.modalUpdateCount(); |
| 779 |
return; |
| 780 |
} |
| 781 |
|
| 782 |
var clone = $(target).clone(); |
| 783 |
$(clone).find('.dashicons').remove(); |
| 784 |
$(clone).css('height', '100%'); |
| 785 |
$(clone).css('width', '40px'); // projected width from css |
| 786 |
$(clone).find('a').css('verticalAlign', 'middle'); |
| 787 |
|
| 788 |
if ( $(target).children('.button-selected').length == 0) |
| 789 |
$(target).append('<div class="button-selected"><span class="dashicons dashicons-yes">'); |
| 790 |
|
| 791 |
clone.append('<div class="button-remove"><span class="dashicons dashicons-no">'); |
| 792 |
|
| 793 |
$(modal).find('.picker-inselection .items').append(clone); |
| 794 |
|
| 795 |
this.modalScaleButton(clone); |
| 796 |
this.modalUpdateCount(); |
| 797 |
|
| 798 |
} // toggleInSelection |
| 799 |
|
| 800 |
maxCollection.prototype.modalEqualHeight = function (e) |
| 801 |
{ |
| 802 |
|
| 803 |
var maxHeight = 0; |
| 804 |
$(modal).find('.picker-main .current-screen .item').each(function() |
| 805 |
{ |
| 806 |
if ( $(this).height() > maxHeight) |
| 807 |
maxHeight = $(this).height(); |
| 808 |
} |
| 809 |
); |
| 810 |
|
| 811 |
|
| 812 |
|
| 813 |
if(maxHeight > 0) // 0 is possible when picker is closed before buttons are done loading. |
| 814 |
$(modal).find('.picker-main .current-screen .item').height(maxHeight); |
| 815 |
} |
| 816 |
|
| 817 |
maxCollection.prototype.modalScaleButton = function(item) |
| 818 |
{ |
| 819 |
var maxwidth = $(item).width(); |
| 820 |
|
| 821 |
// switch over width like this, not clone due to performance ( about 30 times ) . |
| 822 |
$(item).css('width', '100%'); |
| 823 |
var button = $(item).find('a'); |
| 824 |
var width = $(button).width(); |
| 825 |
var height = $(button).height(); |
| 826 |
$(item).css('width', maxwidth); |
| 827 |
|
| 828 |
if (maxwidth >= width) |
| 829 |
{ |
| 830 |
return; // we don't want to enlarge. |
| 831 |
} |
| 832 |
|
| 833 |
// find the scale to resize it. |
| 834 |
var scale = (maxwidth/width); |
| 835 |
scale = scale.toFixed(2); |
| 836 |
|
| 837 |
var $button = $(item).find('a'); |
| 838 |
|
| 839 |
var csstext = 'width: calc(' + width + 'px * ' + scale + ')!important; height: calc(' + height + 'px * ' + scale + ') !important;'; |
| 840 |
$button.css('cssText', csstext); |
| 841 |
|
| 842 |
$button.children('.mb-text').each(function() |
| 843 |
{ |
| 844 |
var text = $(this).css('fontSize'); |
| 845 |
|
| 846 |
var textitem = this; |
| 847 |
var cssitems = [ "font-size", "padding-left","padding-right","padding-top","padding-bottom" ]; |
| 848 |
var item_csstext = ''; |
| 849 |
|
| 850 |
for( i = 0; i < cssitems.length; i++) |
| 851 |
{ |
| 852 |
|
| 853 |
if ( parseInt ($(this).css(cssitems[i]) ) > 0) |
| 854 |
{ |
| 855 |
var p = $(this).css(cssitems[i]); |
| 856 |
|
| 857 |
item_csstext += cssitems[i] + ': calc(' + p + ' * ' + scale + ') !important; '; |
| 858 |
} |
| 859 |
|
| 860 |
} |
| 861 |
$(this).css('cssText', item_csstext); |
| 862 |
}); |
| 863 |
|
| 864 |
$icon = $button.children('.mb-icon'); |
| 865 |
var iwidth = $icon.width(); |
| 866 |
var iheight = $icon.height(); |
| 867 |
|
| 868 |
var cssText = 'width: calc(' + iwidth + 'px * ' + scale + ') !important; height: calc(' + iheight + 'px * ' + scale + ') !important;'; |
| 869 |
$icon.css('cssText', cssText); |
| 870 |
|
| 871 |
var $icon_img = $icon.children('img'); |
| 872 |
|
| 873 |
if ($icon_img.length > 0) |
| 874 |
{ |
| 875 |
var iwidth = $icon_img.width(); |
| 876 |
var iheight = $icon_img.height(); |
| 877 |
var cssText = 'width: calc(' + iwidth + 'px * ' + scale + ') !important; height: calc(' + iheight + 'px * ' + scale + ') !important;'; |
| 878 |
$icon_img.css('cssText', cssText); |
| 879 |
} |
| 880 |
|
| 881 |
} |
| 882 |
// Remove all the scaling. |
| 883 |
maxCollection.prototype.unScaleButton = function(item) |
| 884 |
{ |
| 885 |
item.find('a, .mb-text, .mb-icon, img').css('cssText',''); |
| 886 |
item.css('cssText',''); |
| 887 |
|
| 888 |
} |
| 889 |
|
| 890 |
maxCollection.prototype.modalClearSelection = function (e) |
| 891 |
{ |
| 892 |
var modal = window.maxFoundry.maxmodal.get(); |
| 893 |
$(modal).find('.picker-inselection .items').html(''); |
| 894 |
$(modal).find('.screen .item .button-selected').remove(); |
| 895 |
this.modalUpdateCount(); |
| 896 |
} |
| 897 |
|
| 898 |
maxCollection.prototype.modalAddButtons = function (e) |
| 899 |
{ |
| 900 |
e.preventDefault; |
| 901 |
var self = this; |
| 902 |
var maxmodal = window.maxFoundry.maxmodal; |
| 903 |
var modal = window.maxFoundry.maxmodal.get(); |
| 904 |
|
| 905 |
$(modal).find('.picker-inselection .items .item').each(function () |
| 906 |
{ |
| 907 |
|
| 908 |
var button = $(this).clone().wrap('<div>').parent().html(); |
| 909 |
var $button = $(button); // load the dom |
| 910 |
|
| 911 |
self.unScaleButton($button); |
| 912 |
self.addButtontoCollection( $button ); |
| 913 |
}); |
| 914 |
|
| 915 |
// close modal |
| 916 |
// this.togglePickerPopup(); |
| 917 |
maxmodal.close(); |
| 918 |
this.modalClearSelection(); // reset selection |
| 919 |
|
| 920 |
} |
| 921 |
|
| 922 |
maxCollection.prototype.modalUpdateCount = function (e) |
| 923 |
{ |
| 924 |
var modal = window.maxFoundry.maxmodal.get(); |
| 925 |
|
| 926 |
// update count |
| 927 |
var count = $(modal).find('.picker-inselection .items .item').length; |
| 928 |
$(modal).find('.picker-inselection .info .count').text(count); |
| 929 |
|
| 930 |
if (count == 0) |
| 931 |
$(modal).find('.picker-inselection .info').hide(); |
| 932 |
else |
| 933 |
$(modal).find('.picker-inselection .info').show(); |
| 934 |
} |
| 935 |
|
| 936 |
maxCollection.prototype.modalDeleteButton = function (e) { |
| 937 |
var item = $(e.target).parents('.item'); |
| 938 |
var id = item.data('id'); |
| 939 |
$('.picker-main').find('[data-id="' + id + '"]').children('.button-selected').remove(); |
| 940 |
item.remove(); |
| 941 |
this.modalUpdateCount(); |
| 942 |
} |
| 943 |
|
| 944 |
maxCollection.prototype.toggleSaveIndicator = function(toggle) |
| 945 |
{ |
| 946 |
if (toggle) |
| 947 |
{ |
| 948 |
this.form_updated = true; |
| 949 |
$('.save-indicator').css('display', 'block').addClass('dashicons-warning').removeClass('dashicons-yes'); |
| 950 |
} |
| 951 |
else |
| 952 |
$('.save-indicator').removeClass('dashicons-warning').addClass('dashicons-yes'); |
| 953 |
} |
| 954 |
|
| 955 |
|
| 956 |
|
| 957 |
}); // jquery |
| 958 |
|
