EDIT / kanjai · Commits

Commit c7aeb4f119bfde086eea294d572d3ef00e4781d0

Authored by Andrey Karpikov
1 parent a5f48c69

add class name to block and row

Inline Side-by-side
Showing 5 changed files with 1075 additions and 637 deletions
1   -jQuery(document).ready(function(){
2   -
  1 +jQuery(document).ready(function () {
3 2 var markdown_editor = undefined;
4 3 var ajaxFileUpload = undefined;
5 4
6   - $('.html-generator').on('click', '.col-operation .col-edit', function(){
  5 + $(".html-generator").on("click", ".col-operation .col-edit", function () {
7 6 var $this = $(this),
8   - $cell = $this.closest('.col'),
9   - $block = $cell.closest('.html-generator'),
10   - size = $cell.data('size'),
11   - offset = $cell.data('offset'),
12   - className = $cell.data('class');
13   -
14   - if(className == undefined){
15   - className = '';
  7 + $cell = $this.closest(".col"),
  8 + $block = $cell.closest(".html-generator"),
  9 + size = $cell.data("size"),
  10 + offset = $cell.data("offset"),
  11 + className = $cell.data("class");
  12 +
  13 + if (className == undefined) {
  14 + className = "";
16 15 }
17 16
18   - var $content = $('<div style="width:200px;">' +
19   - '<form>' +
20   - '<div class="form-group">' +
21   - '<label for="col-size">Cell Size</label>' +
22   - '<input type="text" value="'+ size +'" class="form-control col-size" placeholder="Cell Size 1..12">' +
23   - '</div>' +
24   - '<div class="form-group">' +
25   - '<label for="col-offset">Cell Offset</label>' +
26   - '<input type="text" value="'+ offset +'" class="form-control col-offset" placeholder="Cell Offset">' +
27   - '</div>' +
28   - '<div class="form-group">' +
29   - '<label for="col-css-class">CSS Class</label>' +
30   - '<input type="text" value="'+ className +'" class="form-control col-css-class" placeholder="CSS Class">' +
31   - '</div>' +
32   - '<a href="#" class="save">save</a>' +
33   - '</form>' +
34   - '</div>');
35   -
36   - $content.find('form .save').click(function(){
37   - var size_value = $(this).closest('form').find('.col-size').val(),
38   - offset_value = $(this).closest('form').find('.col-offset').val(),
39   - class_value = $(this).closest('form').find('.col-css-class').val();
40   -
41   -
42   - if(size_value != "") {
  17 + var $content = $(
  18 + '<div style="width:200px;">' +
  19 + "<form>" +
  20 + '<div class="form-group">' +
  21 + '<label for="col-size">Cell Size</label>' +
  22 + '<input type="text" value="' +
  23 + size +
  24 + '" class="form-control col-size" placeholder="Cell Size 1..12">' +
  25 + "</div>" +
  26 + '<div class="form-group">' +
  27 + '<label for="col-offset">Cell Offset</label>' +
  28 + '<input type="text" value="' +
  29 + offset +
  30 + '" class="form-control col-offset" placeholder="Cell Offset">' +
  31 + "</div>" +
  32 + '<div class="form-group">' +
  33 + '<label for="col-css-class">CSS Class</label>' +
  34 + '<input type="text" value="' +
  35 + className +
  36 + '" class="form-control col-css-class" placeholder="CSS Class">' +
  37 + "</div>" +
  38 + '<a href="#" class="save">save</a>' +
  39 + "</form>" +
  40 + "</div>"
  41 + );
  42 +
  43 + $content.find("form .save").click(function () {
  44 + var size_value = $(this).closest("form").find(".col-size").val(),
  45 + offset_value = $(this)
  46 + .closest("form")
  47 + .find(".col-offset")
  48 + .val(),
  49 + class_value = $(this)
  50 + .closest("form")
  51 + .find(".col-css-class")
  52 + .val();
  53 +
  54 + if (size_value != "") {
43 55 for (var i = 0; i <= 12; i++) {
44   - $cell.removeClass('col-md-' + i);
  56 + $cell.removeClass("col-md-" + i);
45 57 }
46   - $cell.addClass('col-md-' + size_value);
47   - $cell.data('size', size_value);
  58 + $cell.addClass("col-md-" + size_value);
  59 + $cell.data("size", size_value);
48 60 }
49   - if(offset_value != "") {
  61 + if (offset_value != "") {
50 62 for (var i = 0; i <= 12; i++) {
51   - $cell.removeClass('col-md-offset-' + i);
  63 + $cell.removeClass("col-md-offset-" + i);
52 64 }
53   - $cell.addClass('col-md-offset-' + offset_value);
54   - $cell.data('offset', offset_value);
  65 + $cell.addClass("col-md-offset-" + offset_value);
  66 + $cell.data("offset", offset_value);
55 67 }
56   - if(class_value != "") {
57   - $cell.data('class', class_value);
  68 + if (class_value != "") {
  69 + $cell.data("class", class_value);
58 70 }
59 71
60   - $this.popover('hide');
  72 + $this.popover("hide");
61 73
62   - $block.find('.save').trigger('click');
  74 + $block.find(".save").trigger("click");
63 75
64 76 return false;
65 77 });
66 78
67   - $this.popover({
68   - content: $content,
69   - html: true,
70   - trigger: 'manual'
71   - }).on('hidden.bs.popover', function () {
72   - $this.popover('dispose');
73   - }).popover('show');
  79 + $this
  80 + .popover({
  81 + content: $content,
  82 + html: true,
  83 + trigger: "manual",
  84 + })
  85 + .on("hidden.bs.popover", function () {
  86 + $this.popover("dispose");
  87 + })
  88 + .popover("show");
  89 +
  90 + return false;
  91 + });
74 92
  93 + $(".html-generator").on("click", ".row-operation .row-edit", function () {
  94 + var $this = $(this),
  95 + $row = $this.closest(".row"),
  96 + $block = $row.closest(".html-generator"),
  97 + className = $row.data("class");
  98 +
  99 + if (className == undefined) {
  100 + className = "";
  101 + }
  102 +
  103 + var $content = $(
  104 + '<div style="width:200px;">' +
  105 + "<form>" +
  106 + '<div class="form-group">' +
  107 + '<label for="col-css-class">CSS Class</label>' +
  108 + '<input type="text" value="' +
  109 + className +
  110 + '" class="form-control col-css-class" placeholder="CSS Class">' +
  111 + "</div>" +
  112 + '<a href="#" class="save">save</a>' +
  113 + "</form>" +
  114 + "</div>"
  115 + );
  116 +
  117 + $content.find("form .save").click(function () {
  118 + var class_value = $(this)
  119 + .closest("form")
  120 + .find(".col-css-class")
  121 + .val();
  122 +
  123 + if (class_value != "") {
  124 + $row.data("class", class_value);
  125 + }
  126 +
  127 + $this.popover("hide");
  128 +
  129 + $block.find(".save").trigger("click");
  130 +
  131 + return false;
  132 + });
  133 +
  134 + $this
  135 + .popover({
  136 + content: $content,
  137 + html: true,
  138 + trigger: "manual",
  139 + })
  140 + .on("hidden.bs.popover", function () {
  141 + $this.popover("dispose");
  142 + })
  143 + .popover("show");
75 144
76 145 return false;
77 146 });
78 147
79   - $('.html-generator').on('click', '.col-operation .col-remove', function(){
  148 + $(".html-generator").on("click", ".col-operation .col-remove", function () {
80 149 var $this = $(this),
81   - $block = $this.closest('.html-generator');
  150 + $block = $this.closest(".html-generator");
82 151
83   - bootbox.confirm('Are you sure?', function(result) {
  152 + bootbox.confirm("Are you sure?", function (result) {
84 153 if (result) {
85   - var $cell = $this.closest('.col'),
86   - $block = $cell.closest('.html-generator'),
87   - delete_cell_url = $block.data('delete_cell_url');
  154 + var $cell = $this.closest(".col"),
  155 + $block = $cell.closest(".html-generator"),
  156 + delete_cell_url = $block.data("delete_cell_url");
88 157
89 158 //$cell.data('id')
90 159
91 160 jQuery.ajax({
92   - type: 'POST',
  161 + type: "POST",
93 162 url: delete_cell_url,
94   - data: {structure_id: $cell.data('id')},
  163 + data: { structure_id: $cell.data("id") },
95 164 success: function (data) {
96 165 $cell.remove();
97   - $block.find('.save').trigger('click');
98   - }
  166 + $block.find(".save").trigger("click");
  167 + },
99 168 });
100   -
101   - };
  169 + }
102 170 });
103 171
104   -
105   -
106 172 return false;
107 173 });
108 174
109   -
110   - $('.html-generator').on('click', '.row-operation .row-remove', function(){
  175 + $(".html-generator").on("click", ".row-operation .row-remove", function () {
111 176 var $this = $(this),
112   - $block = $this.closest('.html-generator');
  177 + $block = $this.closest(".html-generator");
113 178
114   - bootbox.confirm('Are you sure?', function(result) {
  179 + bootbox.confirm("Are you sure?", function (result) {
115 180 if (result) {
116   - var $row = $this.closest('.row-fluid'),
117   - $block = $row.closest('.html-generator'),
118   - delete_cell_url = $block.data('delete_cell_url'),
  181 + var $row = $this.closest(".row-fluid"),
  182 + $block = $row.closest(".html-generator"),
  183 + delete_cell_url = $block.data("delete_cell_url"),
119 184 mas_cell_id = [];
120 185
121   - if($row.hasClass('row-element-row')){
122   - $row.find('.col').each(function(){
123   - mas_cell_id.push($(this).data('id'));
  186 + if ($row.hasClass("row-element-row")) {
  187 + $row.find(".col").each(function () {
  188 + mas_cell_id.push($(this).data("id"));
124 189 });
125 190
126 191 jQuery.ajax({
127   - type: 'POST',
  192 + type: "POST",
128 193 url: delete_cell_url,
129   - data: {structure_ids: mas_cell_id},
  194 + data: { structure_ids: mas_cell_id },
130 195 success: function (data) {
131 196 $row.remove();
132   - $block.find('.save').trigger('click');
133   - }
  197 + $block.find(".save").trigger("click");
  198 + },
134 199 });
135 200 }
136   - if($row.hasClass('row-element-block')){
137   -
  201 + if ($row.hasClass("row-element-block")) {
138 202 jQuery.ajax({
139   - type: 'POST',
  203 + type: "POST",
140 204 url: delete_cell_url,
141   - data: {structure_id: $row.data('id')},
  205 + data: { structure_id: $row.data("id") },
142 206 success: function (data) {
143 207 $row.remove();
144   - $block.find('.save').trigger('click');
145   - }
  208 + $block.find(".save").trigger("click");
  209 + },
146 210 });
147   - }
  211 + }
148 212 }
149 213 });
150 214
151   -
152   -
153 215 return false;
154 216 });
155 217
156   - initializeFieldForm = function($selector){
157   - if($selector.find('.page_html_content').length > 0) {
158   -
159   - $selector.find('.page_html_content').froalaEditor({
160   - theme: 'gray',
161   - height: 400,
162   - toolbarButtons: ['fontFamily', 'fontSize', '|', 'bold', 'italic', 'underline', 'strikeThrough', '|', 'subscript', 'superscript', '|' ,'color', 'paragraphStyle', 'paragraphFormat', 'align', '|', 'formatOL', 'formatUL', 'outdent', 'indent', '|', 'quote', 'insertHR', '|', 'cms-image', '|', 'insertTable', '|', 'undo', 'redo', 'clearFormatting', '|', 'html', 'fullscreen'],
163   - toolbarButtonsMD: ['fontFamily', 'fontSize', '|', 'bold', 'italic', 'underline', 'strikeThrough', '|', 'subscript', 'superscript', '|' ,'color', 'paragraphStyle', 'paragraphFormat', 'align', '|', 'formatOL', 'formatUL', 'outdent', 'indent', '|', 'quote', 'insertHR', '|', 'cms-image', '|', 'insertTable', '|', 'undo', 'redo', 'clearFormatting', '|', 'html', 'fullscreen'],
164   - toolbarButtonsSM: ['fontFamily', 'fontSize', '|', 'bold', 'italic', 'underline', 'strikeThrough', '|', 'subscript', 'superscript', '|' ,'color', 'paragraphStyle', 'paragraphFormat', 'align', '|', 'formatOL', 'formatUL', 'outdent', 'indent', '|', 'quote', 'insertHR', '|', 'cms-image', '|', 'insertTable', '|', 'undo', 'redo', 'clearFormatting', '|', 'html', 'fullscreen'],
165   - toolbarButtonsXS: ['fontFamily', 'fontSize', '|', 'bold', 'italic', 'underline', 'strikeThrough', '|', 'subscript', 'superscript', '|' ,'color', 'paragraphStyle', 'paragraphFormat', 'align', '|', 'formatOL', 'formatUL', 'outdent', 'indent', '|', 'quote', 'insertHR', '|', 'cms-image', '|', 'insertTable', '|', 'undo', 'redo', 'clearFormatting', '|', 'html', 'fullscreen'],
166   - imageEditButtons: ['imageAlign', 'imageCaption', 'imageRemove', '|', 'linkOpen', 'linkEdit', 'linkRemove', '-', 'imageDisplay', 'imageStyle', 'imageSize'],
167   - });
168   -
169   - }
170   -
171   - $('#work_area .wait-layer').css('display', 'none');
172   -
173   - $selector.find(".fileupload-field").each(function(){
174   - var $this = $(this),
175   - $previewBlock = $this.next(),
176   - options = {'showUpload':false};
177   -
178   - if($previewBlock) {
179   - options['initialPreview'] = $previewBlock.html();
180   - $previewBlock.remove();
  218 + initializeFieldForm = function ($selector) {
  219 + if ($selector.find(".page_html_content").length > 0) {
  220 + $selector.find(".page_html_content").froalaEditor({
  221 + theme: "gray",
  222 + height: 400,
  223 + toolbarButtons: [
  224 + "fontFamily",
  225 + "fontSize",
  226 + "|",
  227 + "bold",
  228 + "italic",
  229 + "underline",
  230 + "strikeThrough",
  231 + "|",
  232 + "subscript",
  233 + "superscript",
  234 + "|",
  235 + "color",
  236 + "paragraphStyle",
  237 + "paragraphFormat",
  238 + "align",
  239 + "|",
  240 + "formatOL",
  241 + "formatUL",
  242 + "outdent",
  243 + "indent",
  244 + "|",
  245 + "quote",
  246 + "insertHR",
  247 + "|",
  248 + "cms-image",
  249 + "|",
  250 + "insertTable",
  251 + "|",
  252 + "undo",
  253 + "redo",
  254 + "clearFormatting",
  255 + "|",
  256 + "html",
  257 + "fullscreen",
  258 + ],
  259 + toolbarButtonsMD: [
  260 + "fontFamily",
  261 + "fontSize",
  262 + "|",
  263 + "bold",
  264 + "italic",
  265 + "underline",
  266 + "strikeThrough",
  267 + "|",
  268 + "subscript",
  269 + "superscript",
  270 + "|",
  271 + "color",
  272 + "paragraphStyle",
  273 + "paragraphFormat",
  274 + "align",
  275 + "|",
  276 + "formatOL",
  277 + "formatUL",
  278 + "outdent",
  279 + "indent",
  280 + "|",
  281 + "quote",
  282 + "insertHR",
  283 + "|",
  284 + "cms-image",
  285 + "|",
  286 + "insertTable",
  287 + "|",
  288 + "undo",
  289 + "redo",
  290 + "clearFormatting",
  291 + "|",
  292 + "html",
  293 + "fullscreen",
  294 + ],
  295 + toolbarButtonsSM: [
  296 + "fontFamily",
  297 + "fontSize",
  298 + "|",
  299 + "bold",
  300 + "italic",
  301 + "underline",
  302 + "strikeThrough",
  303 + "|",
  304 + "subscript",
  305 + "superscript",
  306 + "|",
  307 + "color",
  308 + "paragraphStyle",
  309 + "paragraphFormat",
  310 + "align",
  311 + "|",
  312 + "formatOL",
  313 + "formatUL",
  314 + "outdent",
  315 + "indent",
  316 + "|",
  317 + "quote",
  318 + "insertHR",
  319 + "|",
  320 + "cms-image",
  321 + "|",
  322 + "insertTable",
  323 + "|",
  324 + "undo",
  325 + "redo",
  326 + "clearFormatting",
  327 + "|",
  328 + "html",
  329 + "fullscreen",
  330 + ],
  331 + toolbarButtonsXS: [
  332 + "fontFamily",
  333 + "fontSize",
  334 + "|",
  335 + "bold",
  336 + "italic",
  337 + "underline",
  338 + "strikeThrough",
  339 + "|",
  340 + "subscript",
  341 + "superscript",
  342 + "|",
  343 + "color",
  344 + "paragraphStyle",
  345 + "paragraphFormat",
  346 + "align",
  347 + "|",
  348 + "formatOL",
  349 + "formatUL",
  350 + "outdent",
  351 + "indent",
  352 + "|",
  353 + "quote",
  354 + "insertHR",
  355 + "|",
  356 + "cms-image",
  357 + "|",
  358 + "insertTable",
  359 + "|",
  360 + "undo",
  361 + "redo",
  362 + "clearFormatting",
  363 + "|",
  364 + "html",
  365 + "fullscreen",
  366 + ],
  367 + imageEditButtons: [
  368 + "imageAlign",
  369 + "imageCaption",
  370 + "imageRemove",
  371 + "|",
  372 + "linkOpen",
  373 + "linkEdit",
  374 + "linkRemove",
  375 + "-",
  376 + "imageDisplay",
  377 + "imageStyle",
  378 + "imageSize",
  379 + ],
  380 + });
181 381 }
182 382
  383 + $("#work_area .wait-layer").css("display", "none");
183 384
184   - $this.fileinput(options);
185   - });
186   -
187   - clearAjaxFileUpload($('#work_area .editor-content'));
188   - ajaxFileUpload = initAjaxFileUpload($('#work_area .editor-content'));
189   - };
190   - if($('.wrapper-edit-content-from-frontend').length > 0){
191   - initializeFieldForm($('.wrapper-edit-content-from-frontend'));
192   - };
  385 + $selector.find(".fileupload-field").each(function () {
  386 + var $this = $(this),
  387 + $previewBlock = $this.next(),
  388 + options = { showUpload: false };
193 389
194   - var getNextStructureIdGLobal = function($content_block){
195   - var max_id = 0;
196   - $content_block.find('.col, .row-element-block').each(function(){
197   - var id = $(this).data('id');
198   - if(id != undefined){
199   - id = parseInt(id);
200   - if(id > max_id){
201   - max_id = id;
202   - }
203   - }
  390 + if ($previewBlock) {
  391 + options["initialPreview"] = $previewBlock.html();
  392 + $previewBlock.remove();
  393 + }
204 394
205   - });
206   - max_id += 1;
207   - return max_id;
208   - }
  395 + $this.fileinput(options);
  396 + });
209 397
210   - var getOriginalElementState = function($obj){
211   - if($obj.hasClass('disabled')){
212   - return 'disabled';
213   - }else{
214   - return 'enabled';
215   - }
  398 + clearAjaxFileUpload($("#work_area .editor-content"));
  399 + ajaxFileUpload = initAjaxFileUpload($("#work_area .editor-content"));
  400 + };
  401 + if ($(".wrapper-edit-content-from-frontend").length > 0) {
  402 + initializeFieldForm($(".wrapper-edit-content-from-frontend"));
216 403 }
217 404
218   - $('.html-generator').on('click', '.col-operation .col-duplicate, .row-operation .col-duplicate', function(){
219   - var $this = $(this);
220   -
221   - $('body').trigger('click');
  405 + var getNextStructureIdGLobal = function ($content_block) {
  406 + var max_id = 0;
  407 + $content_block
  408 + .find(".col, .row-element-block, .row-element-row")
  409 + .each(function () {
  410 + var id = $(this).data("id");
  411 + if (id != undefined) {
  412 + id = parseInt(id);
  413 + if (id > max_id) {
  414 + max_id = id;
  415 + }
  416 + }
  417 + });
  418 + max_id += 1;
  419 + return max_id;
  420 + };
222 421
223   - if ($this.closest('.row-element-row').length > 0 && $this.closest('.col').length == 0){
224   - var ids = [];
225   - var $row = $this.closest('.row-element-row');
226   - var $block = $row.closest('.html-generator');
227   - var duplicate_url = $block.data('duplicate-url');
  422 + var getOriginalElementState = function ($obj) {
  423 + if ($obj.hasClass("disabled")) {
  424 + return "disabled";
  425 + } else {
  426 + return "enabled";
  427 + }
  428 + };
228 429
229   - $this.closest('.row-element-row').find('.col').each(function(){
230   - ids.push($(this).data('id'));
231   - })
  430 + $(".html-generator").on(
  431 + "click",
  432 + ".col-operation .col-duplicate, .row-operation .col-duplicate",
  433 + function () {
  434 + var $this = $(this);
  435 +
  436 + $("body").trigger("click");
  437 +
  438 + if (
  439 + $this.closest(".row-element-row").length > 0 &&
  440 + $this.closest(".col").length == 0
  441 + ) {
  442 + var ids = [];
  443 + var $row = $this.closest(".row-element-row");
  444 + var $block = $row.closest(".html-generator");
  445 + var duplicate_url = $block.data("duplicate-url");
  446 +
  447 + $this
  448 + .closest(".row-element-row")
  449 + .find(".col")
  450 + .each(function () {
  451 + ids.push($(this).data("id"));
  452 + });
232 453
233   - jQuery.ajax({
234   - type: 'POST',
235   - url: duplicate_url,
236   - data: {structure_ids: ids.join(',')},
237   - success: function (data) {
238   - if(data.status == 'ok'){
239   - var $newRow = $row.clone(false);
240   - $row.after($newRow);
241   - $newRow.data('status', getOriginalElementState($newRow));
242   -
243   - $newRow.find('.col').each(function(index){
244   - if(data.ids[index] == ''){
245   - var nextId = getNextStructureIdGLobal($block.find('.html-content'));
246   - $(this).data('id', nextId);
247   - $(this).attr('data-id', nextId);
248   - }else{
249   - $(this).data('id', data.ids[index]);
250   - $(this).attr('data-id', data.ids[index]);
251   - }
252   - $(this).data('status', getOriginalElementState($(this)));
253   - });
  454 + jQuery.ajax({
  455 + type: "POST",
  456 + url: duplicate_url,
  457 + data: { structure_ids: ids.join(",") },
  458 + success: function (data) {
  459 + if (data.status == "ok") {
  460 + var $newRow = $row.clone(false);
  461 + $row.after($newRow);
  462 + $newRow.data(
  463 + "status",
  464 + getOriginalElementState($newRow)
  465 + );
  466 +
  467 + $newRow.find(".col").each(function (index) {
  468 + if (data.ids[index] == "") {
  469 + var nextId = getNextStructureIdGLobal(
  470 + $block.find(".html-content")
  471 + );
  472 + $(this).data("id", nextId);
  473 + $(this).attr("data-id", nextId);
  474 + } else {
  475 + $(this).data("id", data.ids[index]);
  476 + $(this).attr("data-id", data.ids[index]);
  477 + }
  478 + $(this).data(
  479 + "status",
  480 + getOriginalElementState($(this))
  481 + );
  482 + });
254 483
255   - $block.find('.save').trigger('click');
256   - }
  484 + $block.find(".save").trigger("click");
  485 + }
  486 + },
  487 + });
  488 + } else {
  489 + if ($this.closest(".row-element-block").length > 0) {
  490 + var $cell = $this.closest(".row-element-block");
  491 + } else {
  492 + var $cell = $this.closest(".col");
257 493 }
258   - });
259   - }else{
260   - if($this.closest('.row-element-block').length > 0){
261   - var $cell = $this.closest('.row-element-block');
262   - }else{
263   - var $cell = $this.closest('.col')
264   - }
265   - var id = $cell.data('id');
266   - var $block = $cell.closest('.html-generator');
267   - var duplicate_url = $block.data('duplicate-url');
  494 + var id = $cell.data("id");
  495 + var $block = $cell.closest(".html-generator");
  496 + var duplicate_url = $block.data("duplicate-url");
268 497
  498 + jQuery.ajax({
  499 + type: "POST",
  500 + url: duplicate_url,
  501 + data: { structure_id: id },
  502 + success: function (data) {
  503 + if (data.status == "ok") {
  504 + var $newCell = $cell.clone(false);
  505 + if (data.id == "") {
  506 + var nextId = getNextStructureIdGLobal(
  507 + $block.find(".html-content")
  508 + );
  509 + $newCell.data("id", nextId);
  510 + $newCell.attr("data-id", nextId);
  511 + } else {
  512 + $newCell.data("id", data.id);
  513 + $newCell.attr("data-id", data.id);
  514 + }
  515 + $cell.after($newCell);
269 516
270   - jQuery.ajax({
271   - type: 'POST',
272   - url: duplicate_url,
273   - data: {structure_id: id},
274   - success: function (data) {
275   - if(data.status == 'ok'){
276   - var $newCell = $cell.clone(false);
277   - if(data.id == ''){
278   - var nextId = getNextStructureIdGLobal($block.find('.html-content'));
279   - $newCell.data('id', nextId);
280   - $newCell.attr('data-id', nextId);
281   - }else{
282   - $newCell.data('id', data.id);
283   - $newCell.attr('data-id', data.id);
  517 + $newCell.data(
  518 + "status",
  519 + getOriginalElementState($newCell)
  520 + );
  521 + $block.find(".save").trigger("click");
284 522 }
285   - $cell.after($newCell);
  523 + },
  524 + });
  525 + }
286 526
287   - $newCell.data('status', getOriginalElementState($newCell));
288   - $block.find('.save').trigger('click');
289   - }
290   - }
291   - });
  527 + return false;
292 528 }
  529 + );
  530 +
  531 + $(".html-generator").on(
  532 + "click",
  533 + ".col-operation .col-disable, .row-operation .col-disable",
  534 + function () {
  535 + var $this = $(this),
  536 + $block = $this.closest(".html-generator");
  537 +
  538 + if (
  539 + $this.closest(".row-element-block, .row-element-row").length > 0
  540 + ) {
  541 + var $cell = $this.closest(
  542 + ".row-element-block, .row-element-row"
  543 + );
  544 + } else {
  545 + var $cell = $this.closest(".col");
  546 + }
293 547
294   - return false;
295   - });
296   -
297   - $('.html-generator').on('click', '.col-operation .col-disable, .row-operation .col-disable', function(){
298   - var $this = $(this),
299   - $block = $this.closest('.html-generator');
  548 + if (
  549 + $cell.data("status") == undefined ||
  550 + $cell.data("status") == "enabled"
  551 + ) {
  552 + $cell.data("status", "disabled");
  553 + $cell.addClass("disabled");
  554 + $this.text("Enable");
  555 + } else {
  556 + $cell.data("status", "enabled");
  557 + $cell.removeClass("disabled");
  558 + $this.text("Disable");
  559 + }
  560 + $("body").trigger("click");
  561 + $block.find(".save").trigger("click");
300 562
301   - if($this.closest('.row-element-block, .row-element-row').length > 0){
302   - var $cell = $this.closest('.row-element-block, .row-element-row');
303   - }else{
304   - var $cell = $this.closest('.col')
  563 + return false;
305 564 }
  565 + );
306 566
307   - if($cell.data('status') == undefined || $cell.data('status') == 'enabled'){
308   - $cell.data('status', 'disabled');
309   - $cell.addClass('disabled');
310   - $this.text('Enable');
311   - }else{
312   - $cell.data('status', 'enabled');
313   - $cell.removeClass('disabled');
314   - $this.text('Disable');
315   - }
316   - $('body').trigger('click');
317   - $block.find('.save').trigger('click');
  567 + $(".html-generator").on(
  568 + "click",
  569 + ".col-operation .col-content, .row-operation .col-content",
  570 + function () {
  571 + var $this = $(this);
318 572
319   - return false;
320   - });
321   -
  573 + $("body").trigger("click");
322 574
323   - $('.html-generator').on('click', '.col-operation .col-content, .row-operation .col-content', function(){
324   - var $this = $(this);
  575 + if ($this.closest(".row-element-block").length > 0) {
  576 + var $cell = $this.closest(".row-element-block");
  577 + } else {
  578 + var $cell = $this.closest(".col");
  579 + }
  580 + var id = $cell.data("id");
  581 + var $block = $cell.closest(".html-generator");
  582 + var editor_url = $block.data("editor-url");
325 583
326   - $('body').trigger('click');
  584 + jQuery.ajax({
  585 + type: "POST",
  586 + url: editor_url,
  587 + data: { structure_id: id },
  588 + success: function (data) {
  589 + $("#work_area .wait-layer").css("display", "block");
  590 + $("#structure_area").slideUp("slow", function () {
  591 + $("#work_area .editor-content").html(data);
  592 +
  593 + initializeFieldForm($("#page_content_form"));
  594 + $("#work_area").slideDown("slow", function () {});
  595 +
  596 + $("#work_area .editor-content")
  597 + .find(".cancel-content")
  598 + .click(function () {
  599 + $("#work_area").slideUp("fast", function () {
  600 + $("#work_area .editor-content").html("");
  601 + $("#structure_area").slideDown(
  602 + "slow",
  603 + function () {}
  604 + );
  605 + });
  606 + return false;
  607 + });
  608 + });
  609 + },
  610 + });
327 611
328   - if($this.closest('.row-element-block').length > 0){
329   - var $cell = $this.closest('.row-element-block');
330   - }else{
331   - var $cell = $this.closest('.col')
  612 + return false;
332 613 }
333   - var id = $cell.data('id');
334   - var $block = $cell.closest('.html-generator');
335   - var editor_url = $block.data('editor-url');
  614 + );
336 615
  616 + $(document).on("change", ".content-type", function () {
  617 + var $this = $(this),
  618 + content_type = $this.val(),
  619 + show_content_url = $this.data("show_content_url");
337 620
338 621 jQuery.ajax({
339   - type: 'POST',
340   - url: editor_url,
341   - data: {structure_id: id},
  622 + type: "POST",
  623 + url: show_content_url,
  624 + data: { content_type: content_type },
342 625 success: function (data) {
343   - $('#work_area .wait-layer').css('display', 'block');
344   - $('#structure_area').slideUp('slow', function(){
345   - $('#work_area .editor-content').html(data);
346   -
347   - initializeFieldForm($('#page_content_form'));
348   - $('#work_area').slideDown('slow', function(){
  626 + $("#page_content_form").html(data);
  627 + initializeFieldForm($("#page_content_form"));
  628 + },
  629 + });
  630 + });
349 631
350   - });
351   -
352   - $('#work_area .editor-content').find('.cancel-content').click(function(){
353   - $('#work_area').slideUp('fast', function(){
354   - $('#work_area .editor-content').html('');
355   - $('#structure_area').slideDown('slow', function(){
356   - });
  632 + $(".html-generator, .wrapper-edit-content-from-frontend").on(
  633 + "ajax:success",
  634 + ".content-form",
  635 + function (evt, data, status, xhr) {
  636 + if (data.frontentd == undefined) {
  637 + $("#work_area").slideUp("slow", function () {
  638 + $("#work_area .editor-content").html("");
  639 +
  640 + $("#structure_area")
  641 + .find(".col")
  642 + .each(function () {
  643 + if ($(this).data("id") == data.structure_id) {
  644 + $(this).find(".col-html").html(data.html);
  645 + }
357 646 });
358   - return false;
359   - });
360 647
  648 + $("#structure_area")
  649 + .find(
  650 + ".col[data-id=" + data.structure_id + "] .col-html"
  651 + )
  652 + .html(data.html);
  653 + $("#structure_area")
  654 + .find(
  655 + ".row-element-block[data-id=" +
  656 + data.structure_id +
  657 + "] .col-html"
  658 + )
  659 + .html(data.html);
  660 + $("#structure_area").slideDown("slow");
361 661 });
  662 + } else {
  663 + $(
  664 + "[data-id=" + data.structure_id + "]",
  665 + window.parent.document
  666 + ).html(data.html);
  667 + $(
  668 + 'iframe[name="content-edit"]',
  669 + window.parent.document
  670 + ).remove();
362 671 }
363   - });
364   -
365   - return false;
366   - });
367   -
368   - $(document).on('change','.content-type', function(){
369   - var $this = $(this),
370   - content_type = $this.val(),
371   - show_content_url = $this.data('show_content_url')
372   -
373   -
374   - jQuery.ajax({
375   - type: 'POST',
376   - url: show_content_url,
377   - data: {content_type: content_type},
378   - success: function (data) {
379   - $('#page_content_form').html(data);
380   - initializeFieldForm($('#page_content_form'));
381 672 }
382   - });
383   - });
384   -
385   -
386   -
387   -
388   - $('.html-generator, .wrapper-edit-content-from-frontend').on('ajax:success', '.content-form', function(evt, data, status, xhr){
389   - if(data.frontentd == undefined){
390   - $('#work_area').slideUp('slow', function(){
391   - $('#work_area .editor-content').html('');
392   -
393   - $('#structure_area').find('.col').each(function(){
394   - if($(this).data('id') == data.structure_id){
395   - $(this).find('.col-html').html(data.html);
396   - }
397   - });
398   -
399   - $('#structure_area').find('.col[data-id='+ data.structure_id +'] .col-html').html(data.html);
400   - $('#structure_area').find('.row-element-block[data-id='+ data.structure_id +'] .col-html').html(data.html);
401   - $('#structure_area').slideDown('slow');
  673 + );
  674 +
  675 + $(".html-generator").on(
  676 + "click",
  677 + ".btn-cancel-edit-content",
  678 + function (data, status, xhr) {
  679 + $("#work_area").slideUp("slow", function () {
  680 + $("#work_area .editor-content").html("");
  681 + $("#structure_area").slideDown("slow");
402 682 });
403   - }else{
404   - $('[data-id='+ data.structure_id +']', window.parent.document).html(data.html);
405   - $('iframe[name="content-edit"]', window.parent.document).remove();
  683 + return false;
406 684 }
  685 + );
407 686
408   - });
409   -
410   - $('.html-generator').on('click', '.btn-cancel-edit-content', function(data, status, xhr){
411   - $('#work_area').slideUp('slow', function(){
412   - $('#work_area .editor-content').html('');
413   - $('#structure_area').slideDown('slow');
414   - });
415   - return false;
416   - });
417   -
418   -
419   -
420   - $('.html-generator').on('ajax:before', '.content-form', function(){
421   - if($('#epiceditor').length > 0 && markdown_editor != undefined) {
  687 + $(".html-generator").on("ajax:before", ".content-form", function () {
  688 + if ($("#epiceditor").length > 0 && markdown_editor != undefined) {
422 689 markdown_editor.preview();
423   - var preview_contents = $(markdown_editor.getElement('previewer')).contents(),
424   - body = preview_contents.find('body #epiceditor-preview').html();
425   -
426   - $(this).find('.markdown_html').val(body);
  690 + var preview_contents = $(
  691 + markdown_editor.getElement("previewer")
  692 + ).contents(),
  693 + body = preview_contents.find("body #epiceditor-preview").html();
427 694
  695 + $(this).find(".markdown_html").val(body);
428 696 }
429   -
430   - });
431   -
432   - $('.html-generator').on('click', '.add-repeat-row', function(data, status, xhr){
433   - var $this = $(this),
434   - url = $this.attr('href');
435   -
436   -
437   - jQuery.ajax({
438   - type: 'POST',
439   - url: url,
440   - success: function (data) {
441   - var $data = $(data);
442   -
443   - $data.find('.page_html_content').froalaEditor({
444   - theme: 'gray',
445   - height: 400,
446   - toolbarButtons: ['fontFamily', 'fontSize', '|', 'bold', 'italic', 'underline', 'strikeThrough', '|', 'subscript', 'superscript', '|' ,'color', 'paragraphStyle', 'paragraphFormat', 'align', '|', 'formatOL', 'formatUL', 'outdent', 'indent', '|', 'quote', 'insertHR', '|', 'cms-image', '|', 'insertTable', '|', 'undo', 'redo', 'clearFormatting', '|', 'html', 'fullscreen'],
447   - toolbarButtonsMD: ['fontFamily', 'fontSize', '|', 'bold', 'italic', 'underline', 'strikeThrough', '|', 'subscript', 'superscript', '|' ,'color', 'paragraphStyle', 'paragraphFormat', 'align', '|', 'formatOL', 'formatUL', 'outdent', 'indent', '|', 'quote', 'insertHR', '|', 'cms-image', '|', 'insertTable', '|', 'undo', 'redo', 'clearFormatting', '|', 'html', 'fullscreen'],
448   - toolbarButtonsSM: ['fontFamily', 'fontSize', '|', 'bold', 'italic', 'underline', 'strikeThrough', '|', 'subscript', 'superscript', '|' ,'color', 'paragraphStyle', 'paragraphFormat', 'align', '|', 'formatOL', 'formatUL', 'outdent', 'indent', '|', 'quote', 'insertHR', '|', 'cms-image', '|', 'insertTable', '|', 'undo', 'redo', 'clearFormatting', '|', 'html', 'fullscreen'],
449   - toolbarButtonsXS: ['fontFamily', 'fontSize', '|', 'bold', 'italic', 'underline', 'strikeThrough', '|', 'subscript', 'superscript', '|' ,'color', 'paragraphStyle', 'paragraphFormat', 'align', '|', 'formatOL', 'formatUL', 'outdent', 'indent', '|', 'quote', 'insertHR', '|', 'cms-image', '|', 'insertTable', '|', 'undo', 'redo', 'clearFormatting', '|', 'html', 'fullscreen'],
450   - imageEditButtons: ['imageAlign', 'imageCaption', 'imageRemove', '|', 'linkOpen', 'linkEdit', 'linkRemove', '-', 'imageDisplay', 'imageStyle', 'imageSize'],
451   - });
452   -
453   - $('#accordion').append($data);
454   -
455   - $data.find("input:file").each(function () {
456   - ajaxFileUpload.initFileInput($(this));
457   - });
458   - }
459   - });
460   -
461   -
462   - return false;
463 697 });
464 698
465   - $('.html-generator').on('click', '.delete-repeat-row', function(data, status, xhr){
466   - var $this = $(this),
467   - url = $this.attr('href');
468   -
  699 + $(".html-generator").on(
  700 + "click",
  701 + ".add-repeat-row",
  702 + function (data, status, xhr) {
  703 + var $this = $(this),
  704 + url = $this.attr("href");
469 705
470   - jQuery.ajax({
471   - type: 'POST',
472   - url: url,
473   - success: function (data) {
474   - if(data.status == 'ok'){
475   - $this.closest('.panel').remove();
476   - }
477   - }
478   - });
  706 + jQuery.ajax({
  707 + type: "POST",
  708 + url: url,
  709 + success: function (data) {
  710 + var $data = $(data);
  711 +
  712 + $data.find(".page_html_content").froalaEditor({
  713 + theme: "gray",
  714 + height: 400,
  715 + toolbarButtons: [
  716 + "fontFamily",
  717 + "fontSize",
  718 + "|",
  719 + "bold",
  720 + "italic",
  721 + "underline",
  722 + "strikeThrough",
  723 + "|",
  724 + "subscript",
  725 + "superscript",
  726 + "|",
  727 + "color",
  728 + "paragraphStyle",
  729 + "paragraphFormat",
  730 + "align",
  731 + "|",
  732 + "formatOL",
  733 + "formatUL",
  734 + "outdent",
  735 + "indent",
  736 + "|",
  737 + "quote",
  738 + "insertHR",
  739 + "|",
  740 + "cms-image",
  741 + "|",
  742 + "insertTable",
  743 + "|",
  744 + "undo",
  745 + "redo",
  746 + "clearFormatting",
  747 + "|",
  748 + "html",
  749 + "fullscreen",
  750 + ],
  751 + toolbarButtonsMD: [
  752 + "fontFamily",
  753 + "fontSize",
  754 + "|",
  755 + "bold",
  756 + "italic",
  757 + "underline",
  758 + "strikeThrough",
  759 + "|",
  760 + "subscript",
  761 + "superscript",
  762 + "|",
  763 + "color",
  764 + "paragraphStyle",
  765 + "paragraphFormat",
  766 + "align",
  767 + "|",
  768 + "formatOL",
  769 + "formatUL",
  770 + "outdent",
  771 + "indent",
  772 + "|",
  773 + "quote",
  774 + "insertHR",
  775 + "|",
  776 + "cms-image",
  777 + "|",
  778 + "insertTable",
  779 + "|",
  780 + "undo",
  781 + "redo",
  782 + "clearFormatting",
  783 + "|",
  784 + "html",
  785 + "fullscreen",
  786 + ],
  787 + toolbarButtonsSM: [
  788 + "fontFamily",
  789 + "fontSize",
  790 + "|",
  791 + "bold",
  792 + "italic",
  793 + "underline",
  794 + "strikeThrough",
  795 + "|",
  796 + "subscript",
  797 + "superscript",
  798 + "|",
  799 + "color",
  800 + "paragraphStyle",
  801 + "paragraphFormat",
  802 + "align",
  803 + "|",
  804 + "formatOL",
  805 + "formatUL",
  806 + "outdent",
  807 + "indent",
  808 + "|",
  809 + "quote",
  810 + "insertHR",
  811 + "|",
  812 + "cms-image",
  813 + "|",
  814 + "insertTable",
  815 + "|",
  816 + "undo",
  817 + "redo",
  818 + "clearFormatting",
  819 + "|",
  820 + "html",
  821 + "fullscreen",
  822 + ],
  823 + toolbarButtonsXS: [
  824 + "fontFamily",
  825 + "fontSize",
  826 + "|",
  827 + "bold",
  828 + "italic",
  829 + "underline",
  830 + "strikeThrough",
  831 + "|",
  832 + "subscript",
  833 + "superscript",
  834 + "|",
  835 + "color",
  836 + "paragraphStyle",
  837 + "paragraphFormat",
  838 + "align",
  839 + "|",
  840 + "formatOL",
  841 + "formatUL",
  842 + "outdent",
  843 + "indent",
  844 + "|",
  845 + "quote",
  846 + "insertHR",
  847 + "|",
  848 + "cms-image",
  849 + "|",
  850 + "insertTable",
  851 + "|",
  852 + "undo",
  853 + "redo",
  854 + "clearFormatting",
  855 + "|",
  856 + "html",
  857 + "fullscreen",
  858 + ],
  859 + imageEditButtons: [
  860 + "imageAlign",
  861 + "imageCaption",
  862 + "imageRemove",
  863 + "|",
  864 + "linkOpen",
  865 + "linkEdit",
  866 + "linkRemove",
  867 + "-",
  868 + "imageDisplay",
  869 + "imageStyle",
  870 + "imageSize",
  871 + ],
  872 + });
479 873
  874 + $("#accordion").append($data);
480 875
481   - return false;
482   - });
  876 + $data.find("input:file").each(function () {
  877 + ajaxFileUpload.initFileInput($(this));
  878 + });
  879 + },
  880 + });
483 881
484   - $('.html-generator').on('click', '.sort-repeat-row', function(data, status, xhr){
485   - var $this = $(this),
486   - url = $this.attr('href'),
487   - $wrapper = $this.closest('.panel-group'),
488   - $currentItem = $this.closest('.panel'),
489   - $prevItem = $currentItem.prev(),
490   - $nextItem = $currentItem.next();
491   -
492   - if($this.hasClass('sort-up') && $prevItem){
493   - $currentItem.insertBefore($prevItem);
  882 + return false;
494 883 }
495   - if($this.hasClass('sort-down') && $nextItem){
496   - $currentItem.insertAfter($nextItem);
497   - }
  884 + );
498 885
  886 + $(".html-generator").on(
  887 + "click",
  888 + ".delete-repeat-row",
  889 + function (data, status, xhr) {
  890 + var $this = $(this),
  891 + url = $this.attr("href");
499 892
500   - var data = [],
501   - position = 1;
502   -
503   - $wrapper.find( " > .panel" ).each(function(){
504   - data.push({position: position, index: $(this).data('id')});
505   - position += 1;
506   - });
507   - jQuery.ajax({
508   - type: 'POST',
509   - url: $wrapper.data('update-url'),
510   - data: {data: data},
511   - success: function (data) {
  893 + jQuery.ajax({
  894 + type: "POST",
  895 + url: url,
  896 + success: function (data) {
  897 + if (data.status == "ok") {
  898 + $this.closest(".panel").remove();
  899 + }
  900 + },
  901 + });
512 902
513   - if($this.hasClass('sort-up') && $prevItem){
514   - var prevItemId = $prevItem.data('id'),
515   - currentItemId = $currentItem.data('id');
516   - $currentItem.data('id', prevItemId);
517   - $prevItem.data('id', currentItemId);
518   - }
519   - if($this.hasClass('sort-down') && $nextItem){
520   - var nextItemId = $nextItem.data('id'),
521   - currentItemId = $currentItem.data('id');
  903 + return false;
  904 + }
  905 + );
  906 +
  907 + $(".html-generator").on(
  908 + "click",
  909 + ".sort-repeat-row",
  910 + function (data, status, xhr) {
  911 + var $this = $(this),
  912 + url = $this.attr("href"),
  913 + $wrapper = $this.closest(".panel-group"),
  914 + $currentItem = $this.closest(".panel"),
  915 + $prevItem = $currentItem.prev(),
  916 + $nextItem = $currentItem.next();
  917 +
  918 + if ($this.hasClass("sort-up") && $prevItem) {
  919 + $currentItem.insertBefore($prevItem);
  920 + }
  921 + if ($this.hasClass("sort-down") && $nextItem) {
  922 + $currentItem.insertAfter($nextItem);
  923 + }
522 924
523   - $currentItem.data('id', nextItemId);
524   - $nextItem.data('id', currentItemId);
525   - }
  925 + var data = [],
  926 + position = 1;
526 927
527   - }
528   - });
  928 + $wrapper.find(" > .panel").each(function () {
  929 + data.push({ position: position, index: $(this).data("id") });
  930 + position += 1;
  931 + });
  932 + jQuery.ajax({
  933 + type: "POST",
  934 + url: $wrapper.data("update-url"),
  935 + data: { data: data },
  936 + success: function (data) {
  937 + if ($this.hasClass("sort-up") && $prevItem) {
  938 + var prevItemId = $prevItem.data("id"),
  939 + currentItemId = $currentItem.data("id");
  940 + $currentItem.data("id", prevItemId);
  941 + $prevItem.data("id", currentItemId);
  942 + }
  943 + if ($this.hasClass("sort-down") && $nextItem) {
  944 + var nextItemId = $nextItem.data("id"),
  945 + currentItemId = $currentItem.data("id");
529 946
  947 + $currentItem.data("id", nextItemId);
  948 + $nextItem.data("id", currentItemId);
  949 + }
  950 + },
  951 + });
530 952
531   - return false;
532   - });
533   -
534   - var showCellAction = function(statusClass){
535   - var content = '<div class="col-operation">'+
536   - '<div class="dropdown">' +
537   - '<a class="dropdown-toggle dropdown-toggle-nocaret" type="button" data-toggle="dropdown" aria-expanded="false">' +
538   - '<span class="dropdown-text"><span class="icon icon-options-vertical"></span></span>' +
539   - '</a>' +
540   - '<ul class="dropdown-menu">' +
541   - '<li class="dropdown-item"><a class="col-disable" href="javascript;void(0);">'+ statusClass +'</a></li>' +
542   - '<li class="dropdown-item"><a class="col-content" href="javascript;void(0);">Edit</a></li>' +
543   - '<li class="dropdown-item"><a class="col-duplicate" href="javascript;void(0);">Duplicate</a></li>' +
544   - '<li class="dropdown-item"><a class="col-edit popover-link" href="javascript;void(0);">Settings</a></li>' +
545   - '<li class="dropdown-item"><a class="col-remove" href="javascript;void(0);">Delete</a></li>' +
546   - '</ul>'+
547   - '</div>' +
548   - '</div>';
  953 + return false;
  954 + }
  955 + );
  956 +
  957 + var showCellAction = function (statusClass) {
  958 + var content =
  959 + '<div class="col-operation">' +
  960 + '<div class="dropdown">' +
  961 + '<a class="dropdown-toggle dropdown-toggle-nocaret" type="button" data-toggle="dropdown" aria-expanded="false">' +
  962 + '<span class="dropdown-text"><span class="icon icon-options-vertical"></span></span>' +
  963 + "</a>" +
  964 + '<ul class="dropdown-menu">' +
  965 + '<li class="dropdown-item"><a class="col-disable" href="javascript;void(0);">' +
  966 + statusClass +
  967 + "</a></li>" +
  968 + '<li class="dropdown-item"><a class="col-content" href="javascript;void(0);">Edit</a></li>' +
  969 + '<li class="dropdown-item"><a class="col-duplicate" href="javascript;void(0);">Duplicate</a></li>' +
  970 + '<li class="dropdown-item"><a class="col-edit popover-link" href="javascript;void(0);">Settings</a></li>' +
  971 + '<li class="dropdown-item"><a class="col-remove" href="javascript;void(0);">Delete</a></li>' +
  972 + "</ul>" +
  973 + "</div>" +
  974 + "</div>";
549 975
550 976 return content;
551 977 };
552 978
553   - var showRowAction = function(statusClass, isBlockElement){
554   - var content = '<div class="row-operation">'+
555   - '<div class="dropdown">' +
556   - '<a class=" dropdown-toggle dropdown-toggle-nocaret" type="button" data-toggle="dropdown" aria-expanded="false">' +
557   - '<span class="dropdown-text"><span class="icon icon-options-vertical"></span></span>' +
558   - '</a>' +
559   - '<ul class="dropdown-menu">' +
560   - '<li class="dropdown-item"><a class="col-disable" href="javascript;void(0);">'+ statusClass +'</a></li>'
561   -
562   - if (isBlockElement){
563   - content += '<li class="dropdown-item"><a class="col-content" href="javascript;void(0);">Edit</a></li>';
564   - }
565   -
566   - content += '<li class="dropdown-item"><a class="col-duplicate" href="javascript;void(0);">Duplicate</a></li>';
567   -
568   - content += '<li class="dropdown-item"><a class="row-remove" href="javascript;void(0);">Delete</a></li>';
  979 + var showRowAction = function (statusClass, isBlockElement) {
  980 + var content =
  981 + '<div class="row-operation">' +
  982 + '<div class="dropdown">' +
  983 + '<a class=" dropdown-toggle dropdown-toggle-nocaret" type="button" data-toggle="dropdown" aria-expanded="false">' +
  984 + '<span class="dropdown-text"><span class="icon icon-options-vertical"></span></span>' +
  985 + "</a>" +
  986 + '<ul class="dropdown-menu">' +
  987 + '<li class="dropdown-item"><a class="col-disable" href="javascript;void(0);">' +
  988 + statusClass +
  989 + "</a></li>";
  990 +
  991 + if (isBlockElement) {
  992 + content +=
  993 + '<li class="dropdown-item"><a class="col-content" href="javascript;void(0);">Edit</a></li>';
  994 + }
569 995
570   - content += '</ul>'+
571   - '</div>' +
572   - '</div>';
  996 + content +=
  997 + '<li class="dropdown-item"><a class="col-duplicate" href="javascript;void(0);">Duplicate</a></li>';
  998 + content +=
  999 + '<li class="dropdown-item"><a class="row-edit popover-link" href="javascript;void(0);">Settings</a></li>';
  1000 + content +=
  1001 + '<li class="dropdown-item"><a class="row-remove" href="javascript;void(0);">Delete</a></li>';
573 1002
574   - return content;
575   - }
  1003 + content += "</ul>" + "</div>" + "</div>";
576 1004
  1005 + return content;
  1006 + };
577 1007
578   - $('.html-generator').each(function(){
  1008 + $(".html-generator").each(function () {
579 1009 var $block = $(this),
580   - $element_block = $block.find('.html-elements'),
581   - $content_block = $block.find('.html-content')
582   -
583   -
584   - var getNextStructureId = function(){
585   - var max_id = 0;
586   - $content_block.find('.col, .row-element-block').each(function(){
587   - var id = $(this).data('id');
588   - if(id != undefined){
589   - id = parseInt(id);
590   - if(id > max_id){
591   - max_id = id;
592   - }
593   - }
594   -
595   - });
596   - max_id += 1;
597   - return max_id;
598   - }
599   -
600   -
601   - function initialize($block){
  1010 + $element_block = $block.find(".html-elements"),
  1011 + $content_block = $block.find(".html-content");
  1012 +
  1013 + var getNextStructureId = function () {
  1014 + var max_id = 0;
  1015 + $content_block.find(".col, .row-element-block").each(function () {
  1016 + var id = $(this).data("id");
  1017 + if (id != undefined) {
  1018 + id = parseInt(id);
  1019 + if (id > max_id) {
  1020 + max_id = id;
  1021 + }
  1022 + }
  1023 + });
  1024 + max_id += 1;
  1025 + return max_id;
  1026 + };
602 1027
603   - $block.find('.col').each(function(){
  1028 + function initialize($block) {
  1029 + $block.find(".col").each(function () {
604 1030 var $this = $(this),
605 1031 html = $this.html(),
606   - statusClass = '';
  1032 + statusClass = "";
607 1033
608   - if($this.data('status') == 'enabled'){
609   - statusClass = 'Disable';
610   - }else{
611   - statusClass = 'Enable';
612   - $this.addClass('disabled');
  1034 + if ($this.data("status") == "enabled") {
  1035 + statusClass = "Disable";
  1036 + } else {
  1037 + statusClass = "Enable";
  1038 + $this.addClass("disabled");
613 1039 }
614 1040
615   - var innerContent = '<div class="col-inner">' +
616   - '<div class="col-html">'+ html +'</div>' +
617   - '<div class="col-operation">' + showCellAction(statusClass) + '</div>' +
618   - '</div>';
  1041 + var innerContent =
  1042 + '<div class="col-inner">' +
  1043 + '<div class="col-html">' +
  1044 + html +
  1045 + "</div>" +
  1046 + '<div class="col-operation">' +
  1047 + showCellAction(statusClass) +
  1048 + "</div>" +
  1049 + "</div>";
619 1050
620 1051 $(this).html(innerContent);
621 1052 });
622 1053
623   -
624   - $block.find('.row-fluid').each(function(){
  1054 + $block.find(".row-fluid").each(function () {
625 1055 var $cell = $(this),
626   - statusClass = '';
  1056 + statusClass = "";
627 1057
628   - if($cell.data('status') == 'enabled'){
629   - statusClass = 'Disable';
630   - }else{
631   - statusClass = 'Enable';
632   - $cell.addClass('disabled');
  1058 + if ($cell.data("status") == "enabled") {
  1059 + statusClass = "Disable";
  1060 + } else {
  1061 + statusClass = "Enable";
  1062 + $cell.addClass("disabled");
633 1063 }
634 1064
635   - var innerContent = '<div class="row-inner">' + showRowAction(statusClass, $(this).hasClass('row-element-block')) + '</div>';
  1065 + var innerContent =
  1066 + '<div class="row-inner">' +
  1067 + showRowAction(
  1068 + statusClass,
  1069 + $(this).hasClass("row-element-block")
  1070 + ) +
  1071 + "</div>";
636 1072 $(this).prepend(innerContent);
637 1073
638   - if($(this).hasClass('row-element-row')) {
639   - dropRow($(this));
  1074 + if ($(this).hasClass("row-element-row")) {
  1075 + dropRow($(this));
640 1076 }
641 1077
642 1078 $(this).sortable({
643 1079 items: ".col",
644   - stop: function(event, ui){
645   - $block.find('.save').trigger('click');
646   - }
  1080 + stop: function (event, ui) {
  1081 + $block.find(".save").trigger("click");
  1082 + },
647 1083 });
648   -
649 1084 });
650 1085
651   -
652 1086 $content_block.sortable({
653 1087 items: ".row-fluid",
654   - stop: function(event, ui){
655   - $block.find('.save').trigger('click');
656   - }
  1088 + stop: function (event, ui) {
  1089 + $block.find(".save").trigger("click");
  1090 + },
657 1091 });
658 1092 }
659 1093
660   -
661 1094 initialize($block);
662 1095
663   - function rowHelper(event, ui){
664   - var $this = $(this);
665   - if($this.hasClass('element-row')){
666   - return '<div class="drag-row row-fluid row"></div>'
667   - }
668   - if($this.hasClass('element-col')){
669   - return '<div class="drag-col col-md-1"></div>'
670   - }
671   - if($this.hasClass('element-block')){
672   - return '<div class="drag-row row-fluid row-block"></div>'
  1096 + function rowHelper(event, ui) {
  1097 + var $this = $(this);
  1098 + if ($this.hasClass("element-row")) {
  1099 + return '<div class="drag-row row-fluid row"></div>';
  1100 + }
  1101 + if ($this.hasClass("element-col")) {
  1102 + return '<div class="drag-col col-md-1"></div>';
  1103 + }
  1104 + if ($this.hasClass("element-block")) {
  1105 + return '<div class="drag-row row-fluid row-block"></div>';
673 1106 }
674   -
675   -
676 1107 }
677 1108
678   - $element_block.find('.item').draggable({
679   - containment: $content_block,
680   - helper: rowHelper
  1109 + $element_block.find(".item").draggable({
  1110 + containment: $content_block,
  1111 + helper: rowHelper,
681 1112 });
682 1113
683   -
684 1114 //drag cell to row
685   - function dropRow($obj){
  1115 + function dropRow($obj) {
686 1116 $obj.droppable({
687   - drop: function(event, ui){
688   - if(ui.draggable.hasClass('element-col')) {
689   - var currentPosition = ui.offset.left - $obj.offset().left;
  1117 + drop: function (event, ui) {
  1118 + if (ui.draggable.hasClass("element-col")) {
  1119 + var currentPosition =
  1120 + ui.offset.left - $obj.offset().left;
690 1121 $prevElement = undefined;
691   - $obj.find('.col').each(function(){
  1122 + $obj.find(".col").each(function () {
692 1123 var $item = $(this);
693   - if($item.position().left < currentPosition){
  1124 + if ($item.position().left < currentPosition) {
694 1125 $prevElement = $item;
695 1126 }
696 1127 });
... ... @@ -698,13 +1129,16 @@ jQuery(document).ready(function(){
698 1129 //get id for this is new element
699 1130 var max_id = getNextStructureId();
700 1131
701   - var $newContent = $('<div class="col-md-1 col" data-size="1" data-offset="0" >' +
702   - '<div class="col-inner">' +
703   - '<div class="col-html"></div>' + showCellAction('Disable') +
704   - '</div>' +
705   - '</div>');
  1132 + var $newContent = $(
  1133 + '<div class="col-md-1 col" data-size="1" data-offset="0" >' +
  1134 + '<div class="col-inner">' +
  1135 + '<div class="col-html"></div>' +
  1136 + showCellAction("Disable") +
  1137 + "</div>" +
  1138 + "</div>"
  1139 + );
706 1140
707   - $newContent.data('id', max_id);
  1141 + $newContent.data("id", max_id);
708 1142
709 1143 if ($prevElement == undefined) {
710 1144 $obj.append($newContent);
... ... @@ -713,49 +1147,64 @@ jQuery(document).ready(function(){
713 1147 }
714 1148
715 1149 $obj.sortable({
716   - items: ".col"
  1150 + items: ".col",
717 1151 });
718   - $block.find('.save').trigger('click');
  1152 + $block.find(".save").trigger("click");
719 1153 }
720   -
721   - }
  1154 + },
722 1155 });
723 1156 }
724 1157
725 1158 $content_block.droppable({
726   - activate:function(event, ui){
727   -
728   - },
729   - drop: function(event, ui){
  1159 + activate: function (event, ui) {},
  1160 + drop: function (event, ui) {
730 1161 var currentPosition = ui.offset.top - $(this).offset().top;
731   - $prevElement = undefined;
732   -
733   - if(!ui.draggable.hasClass('ui-sortable') && (ui.draggable.hasClass('element-row') || ui.draggable.hasClass('row-fluid') || ui.draggable.hasClass('element-block') ) ) {
734   - $content_block.find('.row-fluid').each(function(){
  1162 + $prevElement = undefined;
  1163 +
  1164 + if (
  1165 + !ui.draggable.hasClass("ui-sortable") &&
  1166 + (ui.draggable.hasClass("element-row") ||
  1167 + ui.draggable.hasClass("row-fluid") ||
  1168 + ui.draggable.hasClass("element-block"))
  1169 + ) {
  1170 + $content_block.find(".row-fluid").each(function () {
735 1171 var $item = $(this);
736   - if($item != ui.draggable) {
  1172 + if ($item != ui.draggable) {
737 1173 if ($item.position().top < currentPosition) {
738 1174 $prevElement = $item;
739 1175 }
740 1176 }
741 1177 });
742 1178
743   - if(ui.draggable.hasClass('element-row') || ui.draggable.hasClass('element-block') ) {
744   - if(ui.draggable.hasClass('element-row')){
745   - var $newContent = $('<div class="row-fluid row-element-row">' +
746   - '<div class="row-inner">' + showRowAction('Disable', false) +
747   - '</div><div class="col-html"></div>' +
748   - '</div>');
  1179 + if (
  1180 + ui.draggable.hasClass("element-row") ||
  1181 + ui.draggable.hasClass("element-block")
  1182 + ) {
  1183 + if (ui.draggable.hasClass("element-row")) {
  1184 + var $newContent = $(
  1185 + '<div class="row-fluid row row-element-row">' +
  1186 + '<div class="row-inner">' +
  1187 + showRowAction("Disable", false) +
  1188 + '</div><div class="col-html"></div>' +
  1189 + "</div>"
  1190 + );
  1191 +
  1192 + var max_id = getNextStructureId();
  1193 + $newContent.data("id", max_id);
  1194 + $newContent.attr("data-id", max_id);
749 1195 }
750 1196
751   - if(ui.draggable.hasClass('element-block')){
752   - var $newContent = $('<div class="row-fluid row-element-block">' +
753   - '<div class="row-inner">' + showRowAction('Disable', true) +
754   - '</div><div class="col-html"></div>' +
755   - '</div>');
  1197 + if (ui.draggable.hasClass("element-block")) {
  1198 + var $newContent = $(
  1199 + '<div class="row-fluid row-element-block">' +
  1200 + '<div class="row-inner">' +
  1201 + showRowAction("Disable", true) +
  1202 + '</div><div class="col-html"></div>' +
  1203 + "</div>"
  1204 + );
756 1205 var max_id = getNextStructureId();
757   - $newContent.data('id', max_id);
758   - $newContent.attr('data-id', max_id);
  1206 + $newContent.data("id", max_id);
  1207 + $newContent.attr("data-id", max_id);
759 1208 }
760 1209
761 1210 if ($prevElement == undefined) {
... ... @@ -763,93 +1212,100 @@ jQuery(document).ready(function(){
763 1212 } else {
764 1213 $prevElement.after($newContent);
765 1214 }
766   - if(ui.draggable.hasClass('element-row')) {
  1215 + if (ui.draggable.hasClass("element-row")) {
767 1216 dropRow($newContent);
768 1217 }
769 1218 //dragRow($newContent);
770 1219 $content_block.sortable({
771 1220 items: ".row-fluid",
772   - stop: function(event, ui){
773   - $block.find('.save').trigger('click');
774   - }
  1221 + stop: function (event, ui) {
  1222 + $block.find(".save").trigger("click");
  1223 + },
775 1224 });
776 1225 }
777   - $block.find('.save').trigger('click');
  1226 + $block.find(".save").trigger("click");
778 1227 }
779   -
780   - }
  1228 + },
781 1229 });
782 1230
783   - $block.find('.save').click(function(){
784   -
  1231 + $block.find(".save").click(function () {
785 1232 var res = [],
786   - url = $block.data('save_url');
787   -
788   - $content_block.find('.row-fluid').each(function(){
789   - var $row = $(this),
790   - cells = [],
791   - row_attributes = {};
  1233 + url = $block.data("save_url");
  1234 +
  1235 + $content_block.find(".row-fluid").each(function () {
  1236 + var $row = $(this),
  1237 + cells = [],
  1238 + row_attributes = {};
  1239 +
  1240 + if ($row.css("visibility") == "visible") {
  1241 + if ($row.hasClass("row-element-block")) {
  1242 + row_attributes["type"] = "block";
  1243 + } else {
  1244 + row_attributes["type"] = "row";
  1245 + }
792 1246
793   - if($row.css('visibility') == 'visible'){
  1247 + row_attributes["id"] = $row.data("id");
794 1248
795   - if($row.hasClass('row-element-block')){
796   - row_attributes['type'] = 'block';
797   - row_attributes['id'] = $row.data('id');
798   - }else{
799   - row_attributes['type'] = 'row';
  1249 + if (
  1250 + $row.data("status") == undefined ||
  1251 + $row.data("status") == "enabled"
  1252 + ) {
  1253 + row_attributes["status"] = "enabled";
  1254 + } else {
  1255 + row_attributes["status"] = "disabled";
800 1256 }
801   - if($row.data('status') == undefined || $row.data('status') == 'enabled'){
802   - row_attributes['status'] = 'enabled';
803   - }else{
804   - row_attributes['status'] = 'disabled';
805   - }
806 1257
  1258 + var className = $row.data("class");
  1259 + if (className != undefined) {
  1260 + row_attributes["className"] = className;
  1261 + }
807 1262
808   - $row.find('.col').each(function(){
809   - var $cell = $(this),
810   - size = $cell.data('size'),
811   - offset = $cell.data('offset'),
812   - id = $cell.data('id'),
813   - className = $cell.data('class');
  1263 + $row.find(".col").each(function () {
  1264 + var $cell = $(this),
  1265 + size = $cell.data("size"),
  1266 + offset = $cell.data("offset"),
  1267 + id = $cell.data("id"),
  1268 + className = $cell.data("class");
814 1269
815 1270 var attributes = {
816 1271 size: size,
817 1272 offset: offset,
818   - id: id
  1273 + id: id,
819 1274 };
820 1275
821   - if($cell.data('status') == undefined || $cell.data('status') == 'enabled'){
822   - attributes['status'] = 'enabled';
823   - }else{
824   - attributes['status'] = 'disabled';
  1276 + if (
  1277 + $cell.data("status") == undefined ||
  1278 + $cell.data("status") == "enabled"
  1279 + ) {
  1280 + attributes["status"] = "enabled";
  1281 + } else {
  1282 + attributes["status"] = "disabled";
825 1283 }
826 1284
827   - if(className != undefined){
828   - attributes['className'] = className;
  1285 + if (className != undefined) {
  1286 + attributes["className"] = className;
829 1287 }
830 1288
831 1289 cells.push(attributes);
832   - });
  1290 + });
833 1291
834   - res.push({attributes: row_attributes, cells: cells});
  1292 + res.push({ attributes: row_attributes, cells: cells });
835 1293 }
836 1294 });
837 1295
838 1296 jQuery.ajax({
839   - type: 'GET',
  1297 + type: "GET",
840 1298 url: url,
841   - data: {content: JSON.stringify(res) },
  1299 + data: { content: JSON.stringify(res) },
842 1300 success: function () {
843   - $.notify('Success save', {
844   - status: 'info',
845   - pos:"top-right"
846   - });
847   - }
  1301 + $.notify("Success save", {
  1302 + status: "info",
  1303 + pos: "top-right",
  1304 + });
  1305 + },
848 1306 });
849 1307
850 1308 return false;
851 1309 });
852   -
853 1310 });
854   -
855   -});
\ No newline at end of file
  1311 +});
... ...
... ... @@ -21,6 +21,12 @@ module Kanjai
21 21 row_html = '<div class="col-html">' + (page_content.nil? ? '' : page_content.get_content) + '</div>'
22 22 end
23 23
  24 + if client_view == false and row['attributes']['type'] == 'row'
  25 + html_attributes['data-id'] = row['attributes']['id']
  26 + end
  27 +
  28 + html_attributes['data-class'] = row['attributes']['className'];
  29 +
24 30 html += ActionController::Base.helpers.content_tag(:div, '', html_attributes) do
25 31 ActionController::Base.helpers.concat(row_html.html_safe)
26 32 row["cells"].each do |cell|
... ... @@ -70,7 +76,7 @@ module Kanjai
70 76 "data-id=#{row['attributes']['id']}",
71 77 "data-page_data_id=#{page_data.id}"
72 78 ]
73   - html += ApplicationController.render(file: 'kanjai/pages/templates/block', assigns: {content: cells.html_safe, data_attributes: data_attributes.join(' ')}, layout: false).html_safe
  79 + html += ApplicationController.render(file: 'kanjai/pages/templates/block', assigns: {content: cells.html_safe, data_attributes: data_attributes.join(' '), row: row}, layout: false).html_safe
74 80
75 81 #html += ActionController::Base.helpers.content_tag(:div, '', html_attributes) do
76 82 # ActionController::Base.helpers.concat((page_content.nil? ? '' : page_content.get_content_frontend).html_safe)
... ... @@ -80,31 +86,7 @@ module Kanjai
80 86 end
81 87
82 88 else
83   -=begin
84   - class_name = 'row-fluid clearfix'
85   - html_attributes = {}
86   - html_attributes[:class] = class_name
87   -
88   - html += ActionController::Base.helpers.content_tag(:div, '', html_attributes) do
89   - cells = ''
90   - row["cells"].each do |cell|
91   - page_content = page_data.page_contents.where(:structure_id => cell['id']).first
92   - html = page_content.nil? ? '' : page_content.get_content_frontend
93   - cell_class_name = cell['className']
94   -
95   - data_attributes = [
96   - "data-size='#{cell['size']}'",
97   - "data-offset='#{cell['offset']}'",
98   - "data-id='#{cell['id']}'",
99   - "data-page_data_id='#{page_data.id}'",
100   - "data-class='#{cell['className']}'",
101   - ]
102   -
103   - cells += ApplicationController.render assigns: {content: html.html_safe, cell: cell, class_name: cell_class_name, data_attributes: data_attributes.join(' ')}, inline: template
104   - ActionController::Base.helpers.concat(ActionController::Base.helpers.content_tag(:div, html.html_safe, :class => "col-md-#{cell['size']} col #{cell_class_name}", 'data-size' => cell['size'], 'data-offset' => cell['offset'], 'data-id' => cell['id'], 'data-page_data_id' => page_data.id , 'data-class' => cell['className']))
105   - end
106   - end
107   -=end
  89 +
108 90 if row['attributes']['status'].to_s == 'enabled' || row['attributes']['status'].to_s.empty?
109 91 cells = ''
110 92 row["cells"].each do |cell|
... ... @@ -125,7 +107,7 @@ module Kanjai
125 107 end
126 108 end
127 109
128   - html += ApplicationController.render(file: 'kanjai/pages/templates/row', assigns: {content: cells.html_safe}, layout: false).html_safe
  110 + html += ApplicationController.render(file: 'kanjai/pages/templates/row', assigns: {content: cells.html_safe, row: row}, layout: false).html_safe
129 111 end
130 112
131 113 end
... ...
1   -<div class="content-wrapper" <%= @data_attributes %>>
  1 +<div class="content-wrapper <%= (@row['attributes'] || {})['className'] %>" <%= @data_attributes %>>
2 2 <%= @content %>
3 3 </div>
\ No newline at end of file
... ...
1   -<div class="content-wrapper row-fluid clearfix">
  1 +<div class="content-wrapper row-fluid clearfix <%= (@row['attributes'] || {})['className'] %>">
2 2 <%= @content %>
3 3 </div>
\ No newline at end of file
... ...
1 1 module Kanjai
2   - VERSION = "0.0.245"
  2 + VERSION = "0.0.246"
3 3 end
... ...