PageRenderTime 125ms CodeModel.GetById 33ms RepoModel.GetById 13ms app.codeStats 0ms

/wp-content/plugins/fusion-core/admin/page-builder/assets/js/palette.js

https://gitlab.com/webkod3r/tripolis
JavaScript | 116 lines | 77 code | 13 blank | 26 comment | 16 complexity | 477f174b3b2cb0f8bf81a38ab53e78d0 MD5 | raw file
  1. /*
  2. * This is the Palette placeholder which contains all its categories
  3. */
  4. ( function($) {
  5. var Palette = {};
  6. window.Palette = Palette;
  7. // emulateHTTP = true is a workaround to prevent backbone from using HTTP PUT and HTTP DELETE requests, only POST is used
  8. Backbone.emulateHTTP = true;
  9. Backbone.emulateJSON = true;
  10. var oldBackboneSync = Backbone.sync;
  11. // Override Backbone.Sync
  12. Backbone.sync = function( method, model, options ) {
  13. var call_model = null;
  14. //if delete or update requests, do not continue
  15. if( method == 'delete' || method == 'update' ) { return; }
  16. //if read method then modify method name and setup model
  17. if( method == 'read' ) {
  18. method = 'fusion_pallete_elements';
  19. call_model = options.model;
  20. }
  21. //last request, data is populated. load custom tabs content now
  22. if (options.category != "Palette" && window.loadCustom == null && window.preBuiltTemplateID == null) {
  23. DdHelper.loadCustomTabs();
  24. }
  25. //setup content for AJAX request
  26. instance = jQuery('#fusion-page-builder').attr('instance');
  27. instance = ( window.preBuiltTemplateID != null ? window.preBuiltTemplateID : instance );
  28. options.action = method;
  29. options.aysnc = false;
  30. options.data = { action : method, model : call_model, category : options.category ,instance : instance };
  31. //send request
  32. return oldBackboneSync.apply(this, ['create', model, options]);
  33. }
  34. // Palette Element model, it's a placeholder for Element Cateogires, each category have set of elements, it's presented by the subelement elements
  35. Palette.Element = Backbone.Model.extend({
  36. initialize : function(){
  37. this.elements = new Category.Elements(this.get('elements'));
  38. }
  39. });
  40. // Palette Elements collection, it will have all categories elements, it act as an array for all cateogies elements
  41. Palette.Elements = Backbone.Collection.extend({
  42. model: Palette.Element,
  43. url : ajaxurl,
  44. });
  45. // Main view object for the palette
  46. Palette.Display = Backbone.View.extend({
  47. initialize: function() {
  48. this.elements = new Palette.Elements();
  49. this.bind( 'error', this.errorHandler );
  50. },
  51. render: function() {
  52. var tabsPlaceholder = this.$el;
  53. var tabsTitle = $("<ul></ul>");
  54. // iterate over each category and append the category to the ul element.
  55. this.elements.each(function( category ){tabsTitle.append(this.displayCategory(category));}, this);
  56. // append the categories output to the main tab placeholder
  57. tabsPlaceholder.append(tabsTitle);
  58. // iterate over each category and diplay it's elements
  59. this.elements.each(function( category ){this.displayElement(category, tabsPlaceholder);}, this);
  60. // initialize jquery tabs
  61. tabsPlaceholder.tabs();
  62. // initialize jquery tooltip
  63. // error check
  64. if( this.elements.length == 0 ) {
  65. this.errorHandler();
  66. }
  67. return this;
  68. },
  69. displayCategory: function(category) {
  70. var displayCategoryTab = new Category.DisplayTab({model:category});
  71. return displayCategoryTab.render().$el.html();
  72. },
  73. displayElement: function(category, parent) {
  74. //create tab content view object using the current category
  75. var tabContent = new Category.DisplayTabContent({model:category});
  76. var elementValues = $().add(tabContent.render().$el.html());
  77. // get the current category elements
  78. var elements = category.get('elements');
  79. for(var i=0; i < elements.length; i++)
  80. {
  81. // create view object for each element object
  82. var elementView = new Category.DisplayElement({model:new Category.ElementEntry(elements[i])});
  83. // add the view object to the elementValues object
  84. elementValues.append(elementView.render().$el);
  85. }
  86. // append the elementValues to the parent DOM object
  87. parent.append(elementValues);
  88. return tabContent;
  89. },
  90. //Create new element using it's palette id
  91. createElement: function(uiElementId){
  92. var elementObject = app.getElementById(uiElementId);
  93. elementObject = new Editor.ElementEntry(elementObject);
  94. var generatedElementId = Math.guid();
  95. elementObject.set("id", generatedElementId);
  96. return elementObject;
  97. },
  98. // error Handler
  99. errorHandler: function() {
  100. jQuery( '.fusion-builder-settings-error' ).show();
  101. }
  102. });
  103. })(jQuery);