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