Page Builder by SiteOrigin - Version 2.4

Version Description

  • April 1 2016 =
  • Created new Live Editor.
  • Changes to Page Builder admin HTML structure for Live Editor.
  • New layout for prebuilt dialog.
  • Now possible to append, prepend and replace layouts in prebuilt dialog.
  • Fixed contextual menu in Layout Builder widget.
  • Added row/widget actions to contextual menu.
  • Clarified functionality of "Switch to Editor" button by renaming to "Revert to Editor".
  • refreshPanelsData function is called more consistently.
  • Various background performance enhancements.
  • Full JS code refactoring.
  • Fixed cell bottom margins with reverse collapse order.
  • Improved window scroll locking for dialogs.
  • Added in_widget_form action when rendering widget forms
  • Custom home page now saves revisions.
Download this release

Release Info

Developer gpriday
Plugin Icon 128x128 Page Builder by SiteOrigin
Version 2.4
Comparing to
See all releases

Code changes from version 2.3.2 to 2.4

Files changed (25) hide show
  1. css/admin.css +299 -265
  2. css/images/prebuilt-default.png +0 -0
  3. css/live-editor-front.css +10 -0
  4. inc/admin-actions.php +94 -122
  5. inc/default-styles.php +12 -3
  6. inc/live-editor.php +28 -8
  7. js/live-editor/jquery.scrollTo.js +210 -0
  8. js/live-editor/jquery.scrollTo.min.js +1 -0
  9. js/live-editor/live-editor-front.js +41 -0
  10. js/live-editor/live-editor-front.min.js +1 -0
  11. js/siteorigin-panels-23.js +0 -5306
  12. js/siteorigin-panels-23.min.js +0 -3
  13. js/siteorigin-panels-24.js +5832 -0
  14. js/siteorigin-panels-24.min.js +3 -0
  15. js/styling-23.js +0 -65
  16. js/styling-24.js +64 -0
  17. js/{styling-23.min.js → styling-24.min.js} +0 -0
  18. readme.txt +18 -1
  19. settings/settings.php +7 -0
  20. siteorigin-panels.php +46 -14
  21. tpl/admin-home-page.php +8 -6
  22. tpl/js-templates.php +112 -107
  23. tpl/metabox-panels.php +7 -6
  24. widgets/basic.php +13 -2
  25. widgets/migration.php +2 -2
css/admin.css CHANGED
@@ -9,7 +9,8 @@
9
  #so-panels-panels.attached-to-editor {
10
  margin-top: 20px;
11
  }
12
- #so-panels-panels.attached-to-editor .hndle {
 
13
  display: none !important;
14
  }
15
  #so-panels-panels.attached-to-editor .inside {
@@ -25,11 +26,6 @@
25
  /* These are generic iconic buttons used in the page builder interface */
26
  /* Page Builder icons */
27
  }
28
- .siteorigin-panels-builder .so-builder-container {
29
- /* Top padding for the toolbar */
30
- padding-top: 38px;
31
- position: relative;
32
- }
33
  .siteorigin-panels-builder .so-tool-button {
34
  padding: 6px 7px;
35
  font-size: 11px;
@@ -40,6 +36,7 @@
40
  display: block;
41
  visibility: visible;
42
  position: relative;
 
43
  border: 1px solid #C0C0C0;
44
  background: #F0F0F0;
45
  background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #F0F0F0), color-stop(1, #F9F9F9));
@@ -76,10 +73,10 @@
76
  border-bottom: 1px solid #D0D0D0;
77
  background: #F5F5F5;
78
  line-height: 1em;
79
- position: absolute;
80
  z-index: 101;
81
  white-space: nowrap;
82
  overflow-x: hidden;
 
83
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
84
  top: 0;
85
  left: 0;
@@ -114,6 +111,7 @@
114
  position: absolute;
115
  top: 5px;
116
  right: 10px;
 
117
  display: none;
118
  text-decoration: none;
119
  color: #666666;
@@ -130,20 +128,6 @@
130
  border: 1px solid #999999;
131
  color: #444444;
132
  }
133
- @media screen and (max-width: 600px) {
134
- .siteorigin-panels-builder .so-builder-toolbar {
135
- padding: 10px;
136
- }
137
- .siteorigin-panels-builder .so-builder-toolbar > .so-tool-button {
138
- padding-right: 2px;
139
- }
140
- .siteorigin-panels-builder .so-builder-toolbar > .so-tool-button .so-panels-icon {
141
- font-size: 20px;
142
- }
143
- .siteorigin-panels-builder .so-builder-toolbar > .so-tool-button span.so-button-text {
144
- display: none;
145
- }
146
- }
147
  .siteorigin-panels-builder .so-rows-container {
148
  padding: 20px 15px 0 15px;
149
  }
@@ -173,59 +157,13 @@
173
  .siteorigin-panels-builder .so-rows-container .so-row-toolbar .so-tool-button.so-row-move {
174
  cursor: move;
175
  }
176
- .siteorigin-panels-builder .so-rows-container .so-row-toolbar .so-dropdown-wrapper {
177
- position: relative;
178
- float: right;
179
- }
180
  .siteorigin-panels-builder .so-rows-container .so-row-toolbar .so-dropdown-wrapper .so-dropdown-links-wrapper {
181
  display: none;
182
- z-index: 11;
183
- position: absolute;
184
  right: -10px;
185
- padding: 6px 0 0 0;
186
  top: 22px;
187
  width: 125px;
188
  }
189
- .siteorigin-panels-builder .so-rows-container .so-row-toolbar .so-dropdown-wrapper .so-dropdown-links-wrapper ul {
190
- margin: 0;
191
- border: 1px solid #C0C0C0;
192
- background: #F9F9F9;
193
- -webkit-border-radius: 2px;
194
- -moz-border-radius: 2px;
195
- border-radius: 2px;
196
- padding: 4px 0;
197
- -webkit-box-shadow: 0 2px 2px rgba(0,0,0,0.1);
198
- -moz-box-shadow: 0 2px 2px rgba(0,0,0,0.1);
199
- box-shadow: 0 2px 2px rgba(0,0,0,0.1);
200
- }
201
- .siteorigin-panels-builder .so-rows-container .so-row-toolbar .so-dropdown-wrapper .so-dropdown-links-wrapper ul li {
202
- margin: 0;
203
- }
204
- .siteorigin-panels-builder .so-rows-container .so-row-toolbar .so-dropdown-wrapper .so-dropdown-links-wrapper ul li:first-child {
205
- border-top-width: 1px;
206
- }
207
- .siteorigin-panels-builder .so-rows-container .so-row-toolbar .so-dropdown-wrapper .so-dropdown-links-wrapper ul li a {
208
- display: block;
209
- padding: 2px 8px;
210
- text-decoration: none;
211
- color: #666;
212
- font-size: 11px;
213
- outline: 0 !important;
214
- -webkit-box-shadow: none;
215
- -moz-box-shadow: none;
216
- box-shadow: none;
217
- /* Specific drop down hovers */
218
- }
219
- .siteorigin-panels-builder .so-rows-container .so-row-toolbar .so-dropdown-wrapper .so-dropdown-links-wrapper ul li a:hover {
220
- background: #F0F0F0;
221
- color: #444;
222
- }
223
- .siteorigin-panels-builder .so-rows-container .so-row-toolbar .so-dropdown-wrapper .so-dropdown-links-wrapper ul li a .dashicons {
224
- font-size: 16px;
225
- margin: 0;
226
- float: right;
227
- line-height: 16px;
228
- }
229
  .siteorigin-panels-builder .so-rows-container .so-row-toolbar .so-dropdown-wrapper .so-dropdown-links-wrapper ul li a.so-row-delete {
230
  color: #a00;
231
  }
@@ -233,16 +171,6 @@
233
  color: #FFF;
234
  background: #a00;
235
  }
236
- .siteorigin-panels-builder .so-rows-container .so-row-toolbar .so-dropdown-wrapper .so-dropdown-links-wrapper ul .so-pointer {
237
- width: 12px;
238
- height: 6px;
239
- position: absolute;
240
- z-index: 12;
241
- background: url("images/dropdown-pointer.png");
242
- background-size: 12px 6px;
243
- top: 1px;
244
- right: 18px;
245
- }
246
  .siteorigin-panels-builder .so-rows-container .so-row-toolbar .so-dropdown-wrapper:hover .so-dropdown-links-wrapper {
247
  display: block;
248
  }
@@ -255,7 +183,7 @@
255
  box-sizing: border-box;
256
  }
257
  .siteorigin-panels-builder .so-rows-container .so-row-container {
258
- margin-bottom: 20px;
259
  -webkit-user-select: none;
260
  -moz-user-select: none;
261
  -ms-user-select: none;
@@ -307,7 +235,7 @@
307
  .siteorigin-panels-builder .so-rows-container .so-row-container .so-cells .cell .cell-wrapper {
308
  background: #e4eff4;
309
  border: 1px solid #bcccd2;
310
- padding: 10px 10px 4px 10px;
311
  /* 6px bottom to remove bottom margin from panels */
312
  height: 100%;
313
  min-height: 70px;
@@ -345,11 +273,27 @@
345
  }
346
  .siteorigin-panels-builder .so-rows-container .so-row-container .so-cells .cell .widgets-container .so-widget:hover {
347
  border: 1px solid #93a7ad;
348
- background: #feffff;
349
  -webkit-box-shadow: 0 2px 2px rgba(0,0,0,0.075);
350
  -moz-box-shadow: 0 2px 2px rgba(0,0,0,0.075);
351
  box-shadow: 0 2px 2px rgba(0,0,0,0.075);
352
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
353
  .siteorigin-panels-builder .so-rows-container .so-row-container .so-cells .cell .widgets-container .so-widget .so-widget-wrapper {
354
  padding: 7px 9px;
355
  overflow: hidden;
@@ -417,10 +361,6 @@
417
  .siteorigin-panels-builder .so-rows-container .so-row-container .so-cells .cell .widgets-container .so-widget .form {
418
  display: none;
419
  }
420
- .siteorigin-panels-builder .so-rows-container .so-row-container .so-cells .cell .widgets-container .so-widget.widget-being-dragged {
421
- opacity: 0.9;
422
- pointer-events: none;
423
- }
424
  .siteorigin-panels-builder .so-rows-container .so-row-container .so-cells .cell .widgets-container .so-widget-sortable-highlight {
425
  border: 1px solid;
426
  -ms-box-sizing: border-box;
@@ -515,10 +455,30 @@
515
  color: #777;
516
  font-size: 0.8em;
517
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
518
  /* This is to display a draggable widget */
519
  .so-widget.ui-sortable-helper.widget-being-dragged {
520
  /* Need a high z-index for layout builder widget */
521
  z-index: 500002 !important;
 
 
522
  cursor: move;
523
  margin-bottom: 5px;
524
  background: #f9f9fb;
@@ -534,11 +494,27 @@
534
  }
535
  .so-widget.ui-sortable-helper.widget-being-dragged:hover {
536
  border: 1px solid #93a7ad;
537
- background: #feffff;
538
  -webkit-box-shadow: 0 2px 2px rgba(0,0,0,0.075);
539
  -moz-box-shadow: 0 2px 2px rgba(0,0,0,0.075);
540
  box-shadow: 0 2px 2px rgba(0,0,0,0.075);
541
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
542
  .so-widget.ui-sortable-helper.widget-being-dragged .so-widget-wrapper {
543
  padding: 7px 9px;
544
  overflow: hidden;
@@ -606,10 +582,6 @@
606
  .so-widget.ui-sortable-helper.widget-being-dragged .form {
607
  display: none;
608
  }
609
- .so-widget.ui-sortable-helper.widget-being-dragged.widget-being-dragged {
610
- opacity: 0.9;
611
- pointer-events: none;
612
- }
613
  /* Handles displaying a builder in the WordPress widget interface */
614
  .widgets-holder-wrap .widget-inside .siteorigin-panels-builder .so-builder-container {
615
  padding-top: 0;
@@ -634,7 +606,7 @@
634
  .so-panels-dialog .so-toolbar,
635
  .so-panels-dialog .so-left-sidebar,
636
  .so-panels-dialog .so-right-sidebar {
637
- z-index: 100000;
638
  position: fixed;
639
  -ms-box-sizing: border-box;
640
  -moz-box-sizing: border-box;
@@ -782,6 +754,7 @@
782
  height: 58px;
783
  background-color: #fafafa;
784
  border-top: 1px solid #D8D8D8;
 
785
  }
786
  .so-panels-dialog .so-toolbar .so-status {
787
  float: left;
@@ -805,6 +778,7 @@
805
  margin-top: -0.65em;
806
  }
807
  .so-panels-dialog .so-toolbar .so-buttons .action-buttons a {
 
808
  display: inline;
809
  padding: 0.2em 0.5em;
810
  line-height: 1em;
@@ -1192,62 +1166,6 @@
1192
  padding-left: 10px;
1193
  padding-right: 10px;
1194
  }
1195
- .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .layout {
1196
- -ms-box-sizing: border-box;
1197
- -moz-box-sizing: border-box;
1198
- -webkit-box-sizing: border-box;
1199
- box-sizing: border-box;
1200
- float: left;
1201
- width: 33.333%;
1202
- padding: 0 5px 10px 5px;
1203
- }
1204
- .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .layout .layout-inside {
1205
- padding: 10px 15px;
1206
- cursor: pointer;
1207
- border: 1px solid #cccccc;
1208
- background: #F8F8F8;
1209
- -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.075);
1210
- -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.075);
1211
- box-shadow: 0 1px 2px rgba(0,0,0,0.075);
1212
- }
1213
- .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .layout .layout-inside:hover {
1214
- border: 1px solid #BBBBBB;
1215
- background: #FFFFFF;
1216
- -webkit-box-shadow: 0 2px 2px rgba(0,0,0,0.075);
1217
- -moz-box-shadow: 0 2px 2px rgba(0,0,0,0.075);
1218
- box-shadow: 0 2px 2px rgba(0,0,0,0.075);
1219
- }
1220
- .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .layout .layout-inside h4 {
1221
- font-size: 15px;
1222
- margin: 0;
1223
- line-height: 1.2em;
1224
- height: 1.2em;
1225
- overflow: hidden;
1226
- }
1227
- .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .layout .layout-inside .description {
1228
- line-height: 1.2em;
1229
- height: 1.2em;
1230
- margin-top: 0.7em;
1231
- font-size: 12px;
1232
- color: #888;
1233
- overflow: hidden;
1234
- }
1235
- .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .layout .layout-inside .dashicons {
1236
- display: none;
1237
- float: left;
1238
- margin-top: 10px;
1239
- }
1240
- .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .layout.so-selected .layout-inside {
1241
- border: 1px solid #aaaaaa;
1242
- background: #F2F2F2;
1243
- }
1244
- .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .layout.so-selected .layout-inside h4,
1245
- .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .layout.so-selected .layout-inside .description {
1246
- margin-left: 35px;
1247
- }
1248
- .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .layout.so-selected .layout-inside .dashicons {
1249
- display: inline-block;
1250
- }
1251
  .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .so-error-message {
1252
  font-size: 14px;
1253
  border: 1px solid #cccccc;
@@ -1268,7 +1186,8 @@
1268
  display: block;
1269
  }
1270
  .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .import-upload-ui p.drag-drop-message {
1271
- font-size: 0.9em;
 
1272
  }
1273
  .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .import-upload-ui .drag-upload-area {
1274
  display: block;
@@ -1355,6 +1274,7 @@
1355
  background: #ffffff;
1356
  margin-bottom: 10px;
1357
  border: 1px solid #d0d0d0;
 
1358
  }
1359
  .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .so-directory-items .so-directory-item .so-screenshot.so-loading {
1360
  background-image: url("images/wpspin_light.gif");
@@ -1372,7 +1292,7 @@
1372
  width: 100%;
1373
  height: auto;
1374
  }
1375
- .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .so-directory-items .so-directory-item .so-screenshot a {
1376
  display: block;
1377
  min-height: 40px;
1378
  }
@@ -1382,30 +1302,29 @@
1382
  margin-bottom: 10px;
1383
  }
1384
  .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .so-directory-items .so-directory-item .so-bottom {
1385
- height: 49px;
1386
  position: relative;
1387
  margin: 10px -10px -15px -10px;
1388
  background: #fcfcfc;
1389
  border-top: 1px solid #d0d0d0;
1390
  }
1391
  .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .so-directory-items .so-directory-item .so-bottom .so-title {
1392
- position: absolute;
1393
- top: 1em;
1394
- left: 10px;
1395
- z-index: 1;
1396
  }
1397
  .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .so-directory-items .so-directory-item .so-bottom .so-buttons {
1398
  position: absolute;
1399
  z-index: 2;
1400
  top: 0;
 
1401
  right: 0;
 
1402
  visibility: hidden;
1403
  -ms-box-sizing: border-box;
1404
  -moz-box-sizing: border-box;
1405
  -webkit-box-sizing: border-box;
1406
  box-sizing: border-box;
1407
  padding: 11px 10px 10px 15px;
1408
- height: 49px;
1409
  border-left: 1px solid #d0d0d0;
1410
  background: #f6f6f6;
1411
  -webkit-box-shadow: -1px 0 1px rgba(0, 0, 0, 0.05);
@@ -1415,6 +1334,24 @@
1415
  .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .so-directory-items .so-directory-item:hover .so-buttons {
1416
  visibility: visible;
1417
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1418
  @media only screen and (min-width: 1680px) {
1419
  .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .so-directory-items .so-directory-item {
1420
  width: 20%;
@@ -1454,6 +1391,9 @@
1454
  .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .so-directory-pages .button-disabled {
1455
  pointer-events: none;
1456
  }
 
 
 
1457
  .so-panels-dialog .so-visual-styles {
1458
  margin: -15px;
1459
  /* All the field types */
@@ -1608,6 +1548,19 @@
1608
  padding-left: 0;
1609
  padding-right: 0;
1610
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
1611
  /* Display the dialog with a proper z-index in the customizer */
1612
  .wp-customizer .so-panels-dialog .so-overlay,
1613
  .wp-customizer .so-panels-dialog .so-content,
@@ -1620,144 +1573,150 @@
1620
  .so-panels-live-editor > div {
1621
  position: fixed;
1622
  z-index: 99999;
 
 
 
 
1623
  }
1624
  .so-panels-live-editor .live-editor-form {
1625
  display: none;
1626
  }
1627
- .so-panels-live-editor .so-overlay {
1628
- top: 0;
1629
- right: 0;
1630
- bottom: 0;
1631
- left: 0;
1632
- background: rgba(0, 0, 0, 0.75);
 
1633
  }
1634
- .so-panels-live-editor .so-sidebar {
1635
- top: 0;
1636
- left: 0;
1637
- bottom: 0;
1638
- width: 260px;
1639
- overflow-y: auto;
1640
- background: #F2F2F2;
1641
- border-right: 1px solid #D0D0D0;
1642
- -ms-box-sizing: border-box;
1643
- -moz-box-sizing: border-box;
1644
- -webkit-box-sizing: border-box;
1645
- box-sizing: border-box;
1646
  }
1647
- .so-panels-live-editor .so-sidebar .so-sidebar-tools {
 
 
1648
  background: #eee;
1649
- border-bottom: 1px solid #ddd;
 
 
 
1650
  }
1651
- .so-panels-live-editor .so-sidebar .so-sidebar-tools .live-editor-close {
1652
- -ms-box-sizing: border-box;
1653
- -moz-box-sizing: border-box;
1654
- -webkit-box-sizing: border-box;
1655
- box-sizing: border-box;
1656
- display: block;
1657
- width: 45px;
1658
- height: 45px;
1659
  background: #eee;
1660
- border-right: 1px solid #ddd;
1661
- color: #444;
1662
- cursor: pointer;
1663
- text-decoration: none;
1664
- position: relative;
1665
- text-align: center;
1666
- padding-top: 12px;
1667
  }
1668
- .so-panels-live-editor .so-sidebar .so-sidebar-tools .live-editor-close:hover {
1669
- background: #FFFFFF;
 
1670
  }
1671
- .so-panels-live-editor .so-sidebar .so-sidebar-tools .live-editor-close:before {
1672
- font: 400 22px/1 dashicons;
1673
- content: "\f341";
1674
- top: 7px;
1675
- left: 13px;
1676
  }
1677
- .so-panels-live-editor .so-sidebar .page-widgets .page-widgets-section .section-header {
 
 
 
1678
  cursor: pointer;
1679
- background: #ffffff;
1680
- padding: 15px 10px;
1681
- border: solid #ddd;
1682
- border-width: 1px 0;
1683
  }
1684
- .so-panels-live-editor .so-sidebar .page-widgets .page-widgets-section .section-header h4 {
1685
- margin: 0;
1686
- font-size: 16px;
1687
  }
1688
- .so-panels-live-editor .so-sidebar .page-widgets .page-widgets-section .section-widgets {
1689
- padding: 10px;
1690
  }
1691
- .so-panels-live-editor .so-sidebar .page-widgets .page-widgets-section:first-child .section-header {
1692
- border-top: 0;
1693
  }
1694
- .so-panels-live-editor .so-sidebar .page-widgets .so-widget {
1695
- border: 1px solid #cccccc;
1696
- cursor: pointer;
1697
- padding: 10px;
1698
- background: #F8F8F8;
1699
- -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.075), inset 0 1px 0 #FFFFFF;
1700
- -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.075), inset 0 1px 0 #FFFFFF;
1701
- box-shadow: 0 1px 2px rgba(0,0,0,0.075), inset 0 1px 0 #FFFFFF;
1702
- margin-bottom: 6px;
1703
  }
1704
- .so-panels-live-editor .so-sidebar .page-widgets .so-widget:hover,
1705
- .so-panels-live-editor .so-sidebar .page-widgets .so-widget.so-hovered {
1706
- -webkit-box-shadow: 0 2px 2px rgba(0,0,0,0.0125), inset 0 1px 0 #FFFFFF;
1707
- -moz-box-shadow: 0 2px 2px rgba(0,0,0,0.0125), inset 0 1px 0 #FFFFFF;
1708
- box-shadow: 0 2px 2px rgba(0,0,0,0.0125), inset 0 1px 0 #FFFFFF;
1709
- border: 1px solid #9bafb5;
1710
- background: #f4f9fd;
1711
  }
1712
- .so-panels-live-editor .so-sidebar .page-widgets .so-widget.so-current {
1713
- border-color: #0074a2;
1714
- background: #2ea2cc;
1715
- cursor: auto;
1716
- -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.15), inset 0 1px 0 rgba(255,255,255,0.2);
1717
- -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.15), inset 0 1px 0 rgba(255,255,255,0.2);
1718
- box-shadow: 0 1px 2px rgba(0,0,0,0.15), inset 0 1px 0 rgba(255,255,255,0.2);
1719
  }
1720
- .so-panels-live-editor .so-sidebar .page-widgets .so-widget.so-current h4 {
1721
- color: #FFFFFF;
 
1722
  }
1723
- .so-panels-live-editor .so-sidebar .page-widgets .so-widget.so-current small {
1724
- color: #eeeeee;
 
 
 
 
 
 
1725
  }
1726
- .so-panels-live-editor .so-sidebar .page-widgets .so-widget.so-current:hover {
1727
- border-color: #0074a2;
1728
- background: #2ea2cc;
 
 
 
 
 
 
 
 
1729
  }
1730
- .so-panels-live-editor .so-sidebar .page-widgets .so-widget:last-child {
1731
- margin-bottom: 0;
 
 
 
1732
  }
1733
- .so-panels-live-editor .so-sidebar .page-widgets .so-widget h4 {
1734
- margin: 0 0 7px 0;
1735
- padding: 0;
1736
- height: 1.2em;
1737
- color: #222222;
1738
- font-size: 14px;
1739
  }
1740
- .so-panels-live-editor .so-sidebar .page-widgets .so-widget .actions {
1741
  display: none;
1742
  }
1743
- .so-panels-live-editor .so-sidebar .page-widgets .so-widget small {
1744
- font-size: 11px;
1745
- line-height: 1.2em;
1746
- height: 1.2em;
1747
- display: block;
1748
- overflow: hidden;
1749
- color: #888888;
1750
  }
1751
- .so-panels-live-editor .so-preview {
1752
- top: 0;
1753
- right: 0;
1754
- bottom: 0;
1755
- left: 260px;
1756
- background: #F4F4F4;
1757
  }
1758
- .so-panels-live-editor .so-preview iframe {
1759
- width: 100%;
1760
- height: 100%;
 
 
1761
  }
1762
  .so-panels-loading {
1763
  background-image: url("images/wpspin_light.gif");
@@ -1923,8 +1882,9 @@
1923
  width: 180px;
1924
  top: 20px;
1925
  left: 20px;
1926
- z-index: 9991;
1927
  display: none;
 
1928
  }
1929
  .so-panels-contextual-menu,
1930
  .so-panels-contextual-menu * {
@@ -1977,8 +1937,82 @@
1977
  background: #F0F0F0;
1978
  color: #444;
1979
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1980
  .so-panels-contextual-menu .so-section .so-no-results {
1981
  padding: 0px 10px 5px 10px;
1982
  display: none;
1983
  font-style: italic;
1984
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
9
  #so-panels-panels.attached-to-editor {
10
  margin-top: 20px;
11
  }
12
+ #so-panels-panels.attached-to-editor .hndle,
13
+ #so-panels-panels.attached-to-editor .handlediv {
14
  display: none !important;
15
  }
16
  #so-panels-panels.attached-to-editor .inside {
26
  /* These are generic iconic buttons used in the page builder interface */
27
  /* Page Builder icons */
28
  }
 
 
 
 
 
29
  .siteorigin-panels-builder .so-tool-button {
30
  padding: 6px 7px;
31
  font-size: 11px;
36
  display: block;
37
  visibility: visible;
38
  position: relative;
39
+ cursor: pointer;
40
  border: 1px solid #C0C0C0;
41
  background: #F0F0F0;
42
  background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #F0F0F0), color-stop(1, #F9F9F9));
73
  border-bottom: 1px solid #D0D0D0;
74
  background: #F5F5F5;
75
  line-height: 1em;
 
76
  z-index: 101;
77
  white-space: nowrap;
78
  overflow-x: hidden;
79
+ position: relative;
80
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
81
  top: 0;
82
  left: 0;
111
  position: absolute;
112
  top: 5px;
113
  right: 10px;
114
+ cursor: pointer;
115
  display: none;
116
  text-decoration: none;
117
  color: #666666;
128
  border: 1px solid #999999;
129
  color: #444444;
130
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
131
  .siteorigin-panels-builder .so-rows-container {
132
  padding: 20px 15px 0 15px;
133
  }
157
  .siteorigin-panels-builder .so-rows-container .so-row-toolbar .so-tool-button.so-row-move {
158
  cursor: move;
159
  }
 
 
 
 
160
  .siteorigin-panels-builder .so-rows-container .so-row-toolbar .so-dropdown-wrapper .so-dropdown-links-wrapper {
161
  display: none;
162
+ z-index: 101;
 
163
  right: -10px;
 
164
  top: 22px;
165
  width: 125px;
166
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
167
  .siteorigin-panels-builder .so-rows-container .so-row-toolbar .so-dropdown-wrapper .so-dropdown-links-wrapper ul li a.so-row-delete {
168
  color: #a00;
169
  }
171
  color: #FFF;
172
  background: #a00;
173
  }
 
 
 
 
 
 
 
 
 
 
174
  .siteorigin-panels-builder .so-rows-container .so-row-toolbar .so-dropdown-wrapper:hover .so-dropdown-links-wrapper {
175
  display: block;
176
  }
183
  box-sizing: border-box;
184
  }
185
  .siteorigin-panels-builder .so-rows-container .so-row-container {
186
+ margin-bottom: 15px;
187
  -webkit-user-select: none;
188
  -moz-user-select: none;
189
  -ms-user-select: none;
235
  .siteorigin-panels-builder .so-rows-container .so-row-container .so-cells .cell .cell-wrapper {
236
  background: #e4eff4;
237
  border: 1px solid #bcccd2;
238
+ padding: 7px 7px 1px 7px;
239
  /* 6px bottom to remove bottom margin from panels */
240
  height: 100%;
241
  min-height: 70px;
273
  }
274
  .siteorigin-panels-builder .so-rows-container .so-row-container .so-cells .cell .widgets-container .so-widget:hover {
275
  border: 1px solid #93a7ad;
276
+ background: #fff;
277
  -webkit-box-shadow: 0 2px 2px rgba(0,0,0,0.075);
278
  -moz-box-shadow: 0 2px 2px rgba(0,0,0,0.075);
279
  box-shadow: 0 2px 2px rgba(0,0,0,0.075);
280
  }
281
+ .siteorigin-panels-builder .so-rows-container .so-row-container .so-cells .cell .widgets-container .so-widget.so-hovered {
282
+ background: #3a7096;
283
+ border: 1px solid #39618c;
284
+ -webkit-box-shadow: 0 2px 2px rgba(0,0,0,0.1);
285
+ -moz-box-shadow: 0 2px 2px rgba(0,0,0,0.1);
286
+ box-shadow: 0 2px 2px rgba(0,0,0,0.1);
287
+ }
288
+ .siteorigin-panels-builder .so-rows-container .so-row-container .so-cells .cell .widgets-container .so-widget.so-hovered h4,
289
+ .siteorigin-panels-builder .so-rows-container .so-row-container .so-cells .cell .widgets-container .so-widget.so-hovered span,
290
+ .siteorigin-panels-builder .so-rows-container .so-row-container .so-cells .cell .widgets-container .so-widget.so-hovered small {
291
+ color: #fff;
292
+ text-shadow: 0 1px 2px rgba(0, 0, 0, 0.85);
293
+ }
294
+ .siteorigin-panels-builder .so-rows-container .so-row-container .so-cells .cell .widgets-container .so-widget.so-hovered small {
295
+ color: #eee;
296
+ }
297
  .siteorigin-panels-builder .so-rows-container .so-row-container .so-cells .cell .widgets-container .so-widget .so-widget-wrapper {
298
  padding: 7px 9px;
299
  overflow: hidden;
361
  .siteorigin-panels-builder .so-rows-container .so-row-container .so-cells .cell .widgets-container .so-widget .form {
362
  display: none;
363
  }
 
 
 
 
364
  .siteorigin-panels-builder .so-rows-container .so-row-container .so-cells .cell .widgets-container .so-widget-sortable-highlight {
365
  border: 1px solid;
366
  -ms-box-sizing: border-box;
455
  color: #777;
456
  font-size: 0.8em;
457
  }
458
+ .siteorigin-panels-builder.so-display-narrow .so-builder-toolbar {
459
+ padding: 10px;
460
+ }
461
+ .siteorigin-panels-builder.so-display-narrow .so-builder-toolbar > .so-tool-button {
462
+ padding-right: 2px;
463
+ }
464
+ .siteorigin-panels-builder.so-display-narrow .so-builder-toolbar > .so-tool-button .so-panels-icon {
465
+ font-size: 14px;
466
+ }
467
+ .siteorigin-panels-builder.so-display-narrow .so-builder-toolbar > .so-tool-button span.so-button-text {
468
+ display: none;
469
+ }
470
+ .siteorigin-panels-builder.so-display-narrow .so-builder-toolbar .so-switch-to-standard {
471
+ display: none !important;
472
+ }
473
+ .siteorigin-panels-builder.so-display-narrow .widgets-container .so-widget .actions {
474
+ display: none !important;
475
+ }
476
  /* This is to display a draggable widget */
477
  .so-widget.ui-sortable-helper.widget-being-dragged {
478
  /* Need a high z-index for layout builder widget */
479
  z-index: 500002 !important;
480
+ opacity: 0.9;
481
+ pointer-events: none;
482
  cursor: move;
483
  margin-bottom: 5px;
484
  background: #f9f9fb;
494
  }
495
  .so-widget.ui-sortable-helper.widget-being-dragged:hover {
496
  border: 1px solid #93a7ad;
497
+ background: #fff;
498
  -webkit-box-shadow: 0 2px 2px rgba(0,0,0,0.075);
499
  -moz-box-shadow: 0 2px 2px rgba(0,0,0,0.075);
500
  box-shadow: 0 2px 2px rgba(0,0,0,0.075);
501
  }
502
+ .so-widget.ui-sortable-helper.widget-being-dragged.so-hovered {
503
+ background: #3a7096;
504
+ border: 1px solid #39618c;
505
+ -webkit-box-shadow: 0 2px 2px rgba(0,0,0,0.1);
506
+ -moz-box-shadow: 0 2px 2px rgba(0,0,0,0.1);
507
+ box-shadow: 0 2px 2px rgba(0,0,0,0.1);
508
+ }
509
+ .so-widget.ui-sortable-helper.widget-being-dragged.so-hovered h4,
510
+ .so-widget.ui-sortable-helper.widget-being-dragged.so-hovered span,
511
+ .so-widget.ui-sortable-helper.widget-being-dragged.so-hovered small {
512
+ color: #fff;
513
+ text-shadow: 0 1px 2px rgba(0, 0, 0, 0.85);
514
+ }
515
+ .so-widget.ui-sortable-helper.widget-being-dragged.so-hovered small {
516
+ color: #eee;
517
+ }
518
  .so-widget.ui-sortable-helper.widget-being-dragged .so-widget-wrapper {
519
  padding: 7px 9px;
520
  overflow: hidden;
582
  .so-widget.ui-sortable-helper.widget-being-dragged .form {
583
  display: none;
584
  }
 
 
 
 
585
  /* Handles displaying a builder in the WordPress widget interface */
586
  .widgets-holder-wrap .widget-inside .siteorigin-panels-builder .so-builder-container {
587
  padding-top: 0;
606
  .so-panels-dialog .so-toolbar,
607
  .so-panels-dialog .so-left-sidebar,
608
  .so-panels-dialog .so-right-sidebar {
609
+ z-index: 100001;
610
  position: fixed;
611
  -ms-box-sizing: border-box;
612
  -moz-box-sizing: border-box;
754
  height: 58px;
755
  background-color: #fafafa;
756
  border-top: 1px solid #D8D8D8;
757
+ z-index: 100002;
758
  }
759
  .so-panels-dialog .so-toolbar .so-status {
760
  float: left;
778
  margin-top: -0.65em;
779
  }
780
  .so-panels-dialog .so-toolbar .so-buttons .action-buttons a {
781
+ cursor: pointer;
782
  display: inline;
783
  padding: 0.2em 0.5em;
784
  line-height: 1em;
1166
  padding-left: 10px;
1167
  padding-right: 10px;
1168
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1169
  .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .so-error-message {
1170
  font-size: 14px;
1171
  border: 1px solid #cccccc;
1186
  display: block;
1187
  }
1188
  .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .import-upload-ui p.drag-drop-message {
1189
+ font-size: 1em;
1190
+ margin-bottom: 0;
1191
  }
1192
  .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .import-upload-ui .drag-upload-area {
1193
  display: block;
1274
  background: #ffffff;
1275
  margin-bottom: 10px;
1276
  border: 1px solid #d0d0d0;
1277
+ cursor: pointer;
1278
  }
1279
  .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .so-directory-items .so-directory-item .so-screenshot.so-loading {
1280
  background-image: url("images/wpspin_light.gif");
1292
  width: 100%;
1293
  height: auto;
1294
  }
1295
+ .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .so-directory-items .so-directory-item .so-screenshot .so-screenshot-wrapper {
1296
  display: block;
1297
  min-height: 40px;
1298
  }
1302
  margin-bottom: 10px;
1303
  }
1304
  .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .so-directory-items .so-directory-item .so-bottom {
 
1305
  position: relative;
1306
  margin: 10px -10px -15px -10px;
1307
  background: #fcfcfc;
1308
  border-top: 1px solid #d0d0d0;
1309
  }
1310
  .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .so-directory-items .so-directory-item .so-bottom .so-title {
1311
+ margin: 0;
1312
+ padding: 16px 10px;
1313
+ cursor: pointer;
 
1314
  }
1315
  .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .so-directory-items .so-directory-item .so-bottom .so-buttons {
1316
  position: absolute;
1317
  z-index: 2;
1318
  top: 0;
1319
+ bottom: 0;
1320
  right: 0;
1321
+ height: 100%;
1322
  visibility: hidden;
1323
  -ms-box-sizing: border-box;
1324
  -moz-box-sizing: border-box;
1325
  -webkit-box-sizing: border-box;
1326
  box-sizing: border-box;
1327
  padding: 11px 10px 10px 15px;
 
1328
  border-left: 1px solid #d0d0d0;
1329
  background: #f6f6f6;
1330
  -webkit-box-shadow: -1px 0 1px rgba(0, 0, 0, 0.05);
1334
  .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .so-directory-items .so-directory-item:hover .so-buttons {
1335
  visibility: visible;
1336
  }
1337
+ .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .so-directory-items .so-directory-item.selected {
1338
+ background-color: #e5f4fa;
1339
+ }
1340
+ .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .so-directory-items .so-directory-item.selected .so-directory-item-wrapper {
1341
+ background: #deeef4;
1342
+ border-color: #9abcc7;
1343
+ }
1344
+ .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .so-directory-items .so-directory-item.selected .so-bottom {
1345
+ background: #f8fdff;
1346
+ border-color: #bcccd2;
1347
+ }
1348
+ .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .so-directory-items .so-directory-item.selected .so-bottom .so-title {
1349
+ color: #3e484c;
1350
+ }
1351
+ .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .so-directory-items .so-directory-item.selected .so-bottom .so-buttons {
1352
+ background: #eaf2f6;
1353
+ border-color: #bcccd2;
1354
+ }
1355
  @media only screen and (min-width: 1680px) {
1356
  .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .so-directory-items .so-directory-item {
1357
  width: 20%;
1391
  .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-content .so-directory-pages .button-disabled {
1392
  pointer-events: none;
1393
  }
1394
+ .so-panels-dialog.so-panels-dialog-prebuilt-layouts .so-toolbar .so-buttons select.so-layout-position {
1395
+ vertical-align: baseline;
1396
+ }
1397
  .so-panels-dialog .so-visual-styles {
1398
  margin: -15px;
1399
  /* All the field types */
1548
  padding-left: 0;
1549
  padding-right: 0;
1550
  }
1551
+ .so-panels-dialog .so-dropdown-wrapper input[type="button"].button-primary {
1552
+ width: 125px;
1553
+ height: 28px;
1554
+ }
1555
+ .so-panels-dialog .so-dropdown-wrapper .so-dropdown-links-wrapper {
1556
+ display: block;
1557
+ z-index: 11;
1558
+ bottom: 28px;
1559
+ width: 125px;
1560
+ }
1561
+ .so-panels-dialog .so-dropdown-wrapper .so-dropdown-links-wrapper.hidden {
1562
+ display: none;
1563
+ }
1564
  /* Display the dialog with a proper z-index in the customizer */
1565
  .wp-customizer .so-panels-dialog .so-overlay,
1566
  .wp-customizer .so-panels-dialog .so-content,
1573
  .so-panels-live-editor > div {
1574
  position: fixed;
1575
  z-index: 99999;
1576
+ -ms-box-sizing: border-box;
1577
+ -moz-box-sizing: border-box;
1578
+ -webkit-box-sizing: border-box;
1579
+ box-sizing: border-box;
1580
  }
1581
  .so-panels-live-editor .live-editor-form {
1582
  display: none;
1583
  }
1584
+ .so-panels-live-editor .live-editor-collapse {
1585
+ position: fixed;
1586
+ top: 18px;
1587
+ left: 10px;
1588
+ line-height: 1em;
1589
+ cursor: pointer;
1590
+ z-index: 100000;
1591
  }
1592
+ .so-panels-live-editor .live-editor-collapse .collapse-icon {
1593
+ float: left;
1594
+ margin: -4px 6px 0 0;
1595
+ border-radius: 50%;
1596
+ width: 20px;
1597
+ height: 20px;
1598
+ overflow: hidden;
1599
+ -webkit-transition: all 0.25s ease;
1600
+ -moz-transition: all 0.25s ease;
1601
+ -o-transition: all 0.25s ease;
1602
+ transition: all 0.25s ease;
 
1603
  }
1604
+ .so-panels-live-editor .live-editor-collapse .collapse-icon:before {
1605
+ display: block;
1606
+ content: "\f148";
1607
  background: #eee;
1608
+ font: normal 20px/1 dashicons;
1609
+ speak: none;
1610
+ padding: 0;
1611
+ -webkit-font-smoothing: antialiased;
1612
  }
1613
+ .so-panels-live-editor .live-editor-collapse:hover {
1614
+ color: #0073aa;
1615
+ }
1616
+ .so-panels-live-editor .live-editor-collapse:hover .collapse-icon {
1617
+ box-shadow: 0 0 3px rgba(30, 140, 190, 0.8);
1618
+ }
1619
+ .so-panels-live-editor .so-sidebar-tools {
 
1620
  background: #eee;
1621
+ border-bottom: 1px solid #ddd;
1622
+ border-right: 1px solid #D0D0D0;
1623
+ top: 0;
1624
+ left: 0;
1625
+ height: 46px;
1626
+ width: 360px;
 
1627
  }
1628
+ .so-panels-live-editor .so-sidebar-tools .live-editor-close {
1629
+ margin: 9px 10px 0 15px;
1630
+ float: right;
1631
  }
1632
+ .so-panels-live-editor .so-sidebar-tools .live-editor-mode {
1633
+ float: right;
1634
+ margin: 9px 4px 0 0;
 
 
1635
  }
1636
+ .so-panels-live-editor .so-sidebar-tools .live-editor-mode .dashicons {
1637
+ font-size: 30px;
1638
+ width: 30px;
1639
+ height: 30px;
1640
  cursor: pointer;
1641
+ color: #999;
 
 
 
1642
  }
1643
+ .so-panels-live-editor .so-sidebar-tools .live-editor-mode .dashicons:hover {
1644
+ color: #666;
 
1645
  }
1646
+ .so-panels-live-editor .so-sidebar-tools .live-editor-mode.so-active .dashicons {
1647
+ color: #0073aa;
1648
  }
1649
+ .so-panels-live-editor .so-sidebar-tools .live-editor-mode.so-active .dashicons:hover {
1650
+ color: #0073aa;
1651
  }
1652
+ .so-panels-live-editor .so-sidebar {
1653
+ top: 46px;
1654
+ left: 0;
1655
+ bottom: 0;
1656
+ width: 360px;
1657
+ overflow-y: auto;
1658
+ background: #F2F2F2;
1659
+ border-right: 1px solid #D0D0D0;
 
1660
  }
1661
+ .so-panels-live-editor .so-preview {
1662
+ top: 0;
1663
+ right: 0;
1664
+ bottom: 0;
1665
+ left: 360px;
1666
+ background-color: #F4F4F4;
 
1667
  }
1668
+ .so-panels-live-editor .so-preview form {
1669
+ display: none;
 
 
 
 
 
1670
  }
1671
+ .so-panels-live-editor .so-preview iframe {
1672
+ width: 100%;
1673
+ height: 100%;
1674
  }
1675
+ .so-panels-live-editor .so-preview-overlay {
1676
+ display: none;
1677
+ opacity: 0.975;
1678
+ top: 0;
1679
+ right: 0;
1680
+ bottom: 0;
1681
+ left: 360px;
1682
+ background-color: #F4F4F4;
1683
  }
1684
+ .so-panels-live-editor .so-preview-overlay .so-loading-container {
1685
+ opacity: 0.6;
1686
+ position: absolute;
1687
+ top: 50%;
1688
+ width: 200px;
1689
+ padding: 2px;
1690
+ border-radius: 5px;
1691
+ left: 50%;
1692
+ margin-left: -104px;
1693
+ margin-top: -9px;
1694
+ border: 2px solid #aaa;
1695
  }
1696
+ .so-panels-live-editor .so-preview-overlay .so-loading-container .so-loading-bar {
1697
+ width: 50%;
1698
+ border-radius: 3px;
1699
+ height: 10px;
1700
+ background: #aaa;
1701
  }
1702
+ .so-panels-live-editor.so-collapsed .live-editor-collapse .collapse-icon {
1703
+ transform: rotate(180deg);
 
 
 
 
1704
  }
1705
+ .so-panels-live-editor.so-collapsed .so-sidebar-tools {
1706
  display: none;
1707
  }
1708
+ .so-panels-live-editor.so-collapsed .so-sidebar {
1709
+ display: none;
 
 
 
 
 
1710
  }
1711
+ .so-panels-live-editor.so-collapsed .so-preview,
1712
+ .so-panels-live-editor.so-collapsed .so-preview-overlay {
1713
+ left: 0;
 
 
 
1714
  }
1715
+ .so-panels-live-editor.live-editor-mobile-mode .so-preview iframe {
1716
+ max-width: 480px;
1717
+ }
1718
+ .so-panels-live-editor.live-editor-tablet-mode .so-preview iframe {
1719
+ max-width: 768px;
1720
  }
1721
  .so-panels-loading {
1722
  background-image: url("images/wpspin_light.gif");
1882
  width: 180px;
1883
  top: 20px;
1884
  left: 20px;
1885
+ z-index: 999999;
1886
  display: none;
1887
+ overflow-y: auto;
1888
  }
1889
  .so-panels-contextual-menu,
1890
  .so-panels-contextual-menu * {
1937
  background: #F0F0F0;
1938
  color: #444;
1939
  }
1940
+ .so-panels-contextual-menu .so-section ul li.so-confirm {
1941
+ color: #a00;
1942
+ }
1943
+ .so-panels-contextual-menu .so-section ul li.so-confirm:hover,
1944
+ .so-panels-contextual-menu .so-section ul li.so-confirm.so-active {
1945
+ background: #a00;
1946
+ color: #fff;
1947
+ }
1948
+ .so-panels-contextual-menu .so-section ul li .dashicons {
1949
+ width: 12px;
1950
+ height: 12px;
1951
+ font-size: 12px;
1952
+ margin: 0;
1953
+ float: right;
1954
+ line-height: 12px;
1955
+ }
1956
  .so-panels-contextual-menu .so-section .so-no-results {
1957
  padding: 0px 10px 5px 10px;
1958
  display: none;
1959
  font-style: italic;
1960
  }
1961
+ .so-dropdown-wrapper {
1962
+ position: relative;
1963
+ float: right;
1964
+ }
1965
+ .so-dropdown-wrapper .so-dropdown-links-wrapper {
1966
+ position: absolute;
1967
+ padding: 6px 0 0 0;
1968
+ }
1969
+ .so-dropdown-wrapper .so-dropdown-links-wrapper ul {
1970
+ margin: 0;
1971
+ border: 1px solid #C0C0C0;
1972
+ background: #F9F9F9;
1973
+ -webkit-border-radius: 2px;
1974
+ -moz-border-radius: 2px;
1975
+ border-radius: 2px;
1976
+ padding: 4px 0;
1977
+ -webkit-box-shadow: 0 2px 2px rgba(0,0,0,0.1);
1978
+ -moz-box-shadow: 0 2px 2px rgba(0,0,0,0.1);
1979
+ box-shadow: 0 2px 2px rgba(0,0,0,0.1);
1980
+ }
1981
+ .so-dropdown-wrapper .so-dropdown-links-wrapper ul li {
1982
+ margin: 0;
1983
+ }
1984
+ .so-dropdown-wrapper .so-dropdown-links-wrapper ul li:first-child {
1985
+ border-top-width: 1px;
1986
+ }
1987
+ .so-dropdown-wrapper .so-dropdown-links-wrapper ul li a {
1988
+ display: block;
1989
+ padding: 2px 8px;
1990
+ text-decoration: none;
1991
+ color: #666;
1992
+ font-size: 11px;
1993
+ cursor: pointer;
1994
+ outline: 0 !important;
1995
+ -webkit-box-shadow: none;
1996
+ -moz-box-shadow: none;
1997
+ box-shadow: none;
1998
+ }
1999
+ .so-dropdown-wrapper .so-dropdown-links-wrapper ul li a:hover {
2000
+ background: #F0F0F0;
2001
+ color: #444;
2002
+ }
2003
+ .so-dropdown-wrapper .so-dropdown-links-wrapper ul li a .dashicons {
2004
+ font-size: 16px;
2005
+ margin: 0;
2006
+ float: right;
2007
+ line-height: 16px;
2008
+ }
2009
+ .so-dropdown-wrapper .so-dropdown-links-wrapper ul .so-pointer {
2010
+ width: 12px;
2011
+ height: 6px;
2012
+ position: absolute;
2013
+ z-index: 12;
2014
+ background: url("images/dropdown-pointer.png");
2015
+ background-size: 12px 6px;
2016
+ top: 1px;
2017
+ right: 18px;
2018
+ }
css/images/prebuilt-default.png ADDED
Binary file
css/live-editor-front.css ADDED
@@ -0,0 +1,10 @@
 
 
 
 
 
 
 
 
 
 
1
+ .so-panel {
2
+ -webkit-transition-duration: 0.6s !important;
3
+ transition-duration: 0.6s !important;
4
+ }
5
+ .so-panel.so-panels-highlighted {
6
+ opacity: 1 !important;
7
+ }
8
+ .so-panel.so-panels-faded {
9
+ opacity: 0.275 !important;
10
+ }
inc/admin-actions.php CHANGED
@@ -46,102 +46,119 @@ function siteorigin_panels_ajax_widget_form(){
46
  }
47
  add_action('wp_ajax_so_panels_widget_form', 'siteorigin_panels_ajax_widget_form');
48
 
49
- /**
50
- * Admin action for loading a list of prebuilt layouts based on the given type
51
- */
52
- function siteorigin_panels_ajax_prebuilt_layouts(){
53
- if( empty($_REQUEST['type']) ) wp_die();
54
  if( empty( $_REQUEST['_panelsnonce'] ) || !wp_verify_nonce($_REQUEST['_panelsnonce'], 'panels_action') ) wp_die();
55
 
56
  // Get any layouts that the current user could edit.
57
  header('content-type: application/json');
58
 
59
- $return = array();
 
 
60
 
61
- if( $_REQUEST['type'] == 'prebuilt' ) {
62
- // Display the prebuilt layouts that come with the theme.
 
 
 
 
 
 
63
  $layouts = apply_filters( 'siteorigin_panels_prebuilt_layouts', array() );
64
 
65
  foreach($layouts as $id => $vals) {
66
- $return[$id] = array(
67
- 'name' => $vals['name'],
68
- 'description' => isset($vals['description']) ? $vals['description'] : __('No description', 'siteorigin-panels')
69
- );
70
- }
71
 
72
- if( !empty($return) ) {
73
- echo json_encode( $return );
74
- }
75
- else {
76
- $message = '';
77
- $message .= __("Your theme doesn't have any prebuilt layouts.", 'siteorigin-panels') . ' ';
78
- $message .= __("You can still clone existing pages though.", 'siteorigin-panels') . ' ';
79
- echo json_encode( array(
80
- 'error_message' => $message,
81
- ) );
82
  }
83
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
84
 
 
 
85
  }
86
- elseif( strpos( $_REQUEST['type'], 'clone_' ) === 0 ) {
87
  // Check that the user can view the given page types
88
- $post_type = str_replace('clone_', '', $_REQUEST['type'] );
89
- global $wpdb;
90
 
 
 
 
91
  $user_can_read_private = ( $post_type == 'post' && current_user_can( 'read_private_posts' ) || ( $post_type == 'page' && current_user_can( 'read_private_pages' ) ));
92
  $include_private = $user_can_read_private ? "OR posts.post_status = 'private' " : "";
 
93
  // Select only the posts with the given post type that also have panels_data
94
- $results = $wpdb->get_results( $wpdb->prepare("
95
- SELECT ID, post_title, meta.meta_value
96
  FROM {$wpdb->posts} AS posts
97
  JOIN {$wpdb->postmeta} AS meta ON posts.ID = meta.post_id
98
  WHERE
99
- posts.post_type = %s
100
  AND meta.meta_key = 'panels_data'
 
101
  AND ( posts.post_status = 'publish' OR posts.post_status = 'draft' " . $include_private . ")
102
- ORDER BY post_title
103
- LIMIT 200
104
- ", $post_type ) );
105
 
106
  foreach( $results as $result ) {
107
- $meta_value = unserialize( $result->meta_value );
108
- if( empty($meta_value['widgets']) ) continue;
109
-
110
- // Create the return array
111
- $return[$result->ID] = array(
112
- 'name' => $result->post_title,
113
- 'description' => __('Clone', 'siteorigin-panels')
114
  );
115
  }
116
 
117
- if( !empty($return) ) {
118
- echo json_encode( $return );
119
- }
120
- else {
121
- $type_object = get_post_type_object( $post_type );
122
- if( empty($type_object->labels->name) ) {
123
- $type_name = ucfirst( $post_type );
124
- }
125
- else {
126
- $type_name = $type_object->labels->name;
127
- }
128
-
129
- $message = '';
130
- // TRANSLATORS: Indicate if there are items to clone. %s will be pages, posts, etc.
131
- $message .= sprintf( __("There are no %s with Page Builder content to clone.", 'siteorigin-panels') , $type_name );
132
- echo json_encode( array(
133
- 'error_message' => $message,
134
- ) );
135
- }
136
 
137
  }
138
  else {
139
- // Send back an error
 
 
 
 
 
140
  }
141
 
 
 
142
  wp_die();
143
  }
144
- add_action('wp_ajax_so_panels_prebuilt_layouts', 'siteorigin_panels_ajax_prebuilt_layouts');
145
 
146
  /**
147
  * Ajax handler to get an individual prebuilt layout
@@ -164,10 +181,26 @@ function siteorigin_panels_ajax_get_prebuilt_layout(){
164
  if( isset($layout['name']) ) unset($layout['name']);
165
 
166
  $layout = apply_filters('siteorigin_panels_prebuilt_layout', $layout);
 
167
 
168
  echo json_encode( $layout );
169
  wp_die();
170
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
171
  elseif( current_user_can('edit_post', $_REQUEST['lid']) ) {
172
  $panels_data = get_post_meta( $_REQUEST['lid'], 'panels_data', true );
173
  $panels_data = apply_filters('siteorigin_panels_data', $panels_data);
@@ -175,7 +208,7 @@ function siteorigin_panels_ajax_get_prebuilt_layout(){
175
  wp_die();
176
  }
177
  }
178
- add_action('wp_ajax_so_panels_get_prebuilt_layout', 'siteorigin_panels_ajax_get_prebuilt_layout');
179
 
180
  /**
181
  * Ajax handler to import a layout
@@ -221,64 +254,3 @@ function siteorigin_panels_ajax_directory_enable(){
221
  wp_die();
222
  }
223
  add_action('wp_ajax_so_panels_directory_enable', 'siteorigin_panels_ajax_directory_enable');
224
-
225
- /**
226
- * Query the layout directory for a list of layouts
227
- */
228
- function siteorigin_panels_ajax_directory_query(){
229
- if( empty( $_REQUEST['_panelsnonce'] ) || !wp_verify_nonce($_REQUEST['_panelsnonce'], 'panels_action') ) wp_die();
230
-
231
- $query = array();
232
- if( !empty($_GET['search']) ) {
233
- $query['search'] = urlencode( $_GET['search'] );
234
- }
235
- if( !empty($_GET['page']) ) {
236
- $query['page'] = intval( $_GET['page'] );
237
- }
238
-
239
- // Lets start by contacting the remote server
240
- $url = add_query_arg( $query, SITEORIGIN_PANELS_LAYOUT_URL . '/wp-admin/admin-ajax.php?action=query_layouts');
241
- $response = wp_remote_get( $url );
242
-
243
- if( is_array($response) && $response['response']['code'] == 200 ) {
244
- $results = json_decode( $response['body'] );
245
- if ( empty( $results ) ) {
246
- $results = array();
247
- }
248
-
249
- // For now, we'll just create a pretend list of items
250
- header( 'content-type: application/json' );
251
- echo json_encode( $results );
252
- }
253
- else {
254
- // Display some sort of error message
255
- echo $response->get_error_message();
256
- }
257
- wp_die();
258
- }
259
- add_action('wp_ajax_so_panels_directory_query', 'siteorigin_panels_ajax_directory_query');
260
-
261
- /**
262
- * Query the layout directory for a specific item
263
- */
264
- function siteorigin_panels_ajax_directory_item_json(){
265
- if( empty( $_REQUEST['_panelsnonce'] ) || !wp_verify_nonce($_REQUEST['_panelsnonce'], 'panels_action') ) wp_die();
266
- if( empty( $_REQUEST['layout_slug'] ) ) wp_die();
267
-
268
- $response = wp_remote_get(
269
- SITEORIGIN_PANELS_LAYOUT_URL . '/layout/' . urlencode($_REQUEST['layout_slug']) . '/?action=download'
270
- );
271
-
272
- // var_dump($response['body']);
273
- if( $response['response']['code'] == 200 ) {
274
- // For now, we'll just pretend to load this
275
- header('content-type: application/json');
276
- echo $response['body'];
277
- wp_die();
278
- }
279
- else {
280
- // Display some sort of error message
281
- }
282
-
283
- }
284
- add_action('wp_ajax_so_panels_directory_item', 'siteorigin_panels_ajax_directory_item_json');
46
  }
47
  add_action('wp_ajax_so_panels_widget_form', 'siteorigin_panels_ajax_widget_form');
48
 
49
+
50
+ function siteorigin_panels_ajax_get_prebuilt_layouts(){
 
 
 
51
  if( empty( $_REQUEST['_panelsnonce'] ) || !wp_verify_nonce($_REQUEST['_panelsnonce'], 'panels_action') ) wp_die();
52
 
53
  // Get any layouts that the current user could edit.
54
  header('content-type: application/json');
55
 
56
+ $type = !empty( $_REQUEST['type'] ) ? $_REQUEST['type'] : 'directory';
57
+ $search = !empty($_REQUEST['search']) ? trim( strtolower( $_REQUEST['search'] ) ) : '';
58
+ $page = !empty( $_REQUEST['page'] ) ? intval( $_REQUEST['page'] ) : 1;
59
 
60
+ $return = array(
61
+ 'title' => '',
62
+ 'items' => array()
63
+ );
64
+ if( $type == 'prebuilt' ) {
65
+ $return['title'] = __( 'Theme Defined Layouts', 'siteorigin-panels' );
66
+
67
+ // This is for theme bundled prebuilt directories
68
  $layouts = apply_filters( 'siteorigin_panels_prebuilt_layouts', array() );
69
 
70
  foreach($layouts as $id => $vals) {
71
+ if( !empty($search) && strpos( strtolower($vals['name']), $search ) === false ) {
72
+ continue;
73
+ }
 
 
74
 
75
+ $return['items'][] = array(
76
+ 'title' => $vals['name'],
77
+ 'id' => $id,
78
+ 'type' => 'prebuilt',
79
+ 'description' => isset($vals['description']) ? $vals['description'] : '',
80
+ 'screenshot' => !empty($vals['screenshot']) ? $vals['screenshot'] : ''
81
+ );
 
 
 
82
  }
83
 
84
+ $return['max_num_pages'] = 1;
85
+ }
86
+ elseif( $type == 'directory' ) {
87
+ $return['title'] = __( 'Layouts Directory', 'siteorigin-panels' );
88
+
89
+ // This is a query of the prebuilt layout directory
90
+ $query = array();
91
+ if( !empty($search) ) $query['search'] = $search;
92
+ $query['page'] = $page;
93
+
94
+ $url = add_query_arg( $query, SITEORIGIN_PANELS_LAYOUT_URL . '/wp-admin/admin-ajax.php?action=query_layouts');
95
+ $response = wp_remote_get( $url );
96
+
97
+ if( is_array($response) && $response['response']['code'] == 200 ) {
98
+ $results = json_decode( $response['body'], true );
99
+ if ( !empty( $results ) && !empty($results['items']) ) {
100
+ foreach( $results['items'] as $item ) {
101
+ $item['id'] = $item['slug'];
102
+ $item['screenshot'] = 'http://s.wordpress.com/mshots/v1/' . urlencode( $item['preview'] ) . '?w=400';
103
+ $item['type'] = 'directory';
104
+ $return['items'][] = $item;
105
+ }
106
+ }
107
 
108
+ $return['max_num_pages'] = $results['max_num_pages'];
109
+ }
110
  }
111
+ elseif ( strpos( $type, 'clone_' ) !== false ) {
112
  // Check that the user can view the given page types
113
+ $post_type = str_replace('clone_', '', $type );
 
114
 
115
+ $return['title'] = sprintf( __( 'Clone %s', 'siteorigin-panels' ), esc_html( ucfirst( $post_type ) ) );
116
+
117
+ global $wpdb;
118
  $user_can_read_private = ( $post_type == 'post' && current_user_can( 'read_private_posts' ) || ( $post_type == 'page' && current_user_can( 'read_private_pages' ) ));
119
  $include_private = $user_can_read_private ? "OR posts.post_status = 'private' " : "";
120
+
121
  // Select only the posts with the given post type that also have panels_data
122
+ $results = $wpdb->get_results( "
123
+ SELECT SQL_CALC_FOUND_ROWS DISTINCT ID, post_title, meta.meta_value
124
  FROM {$wpdb->posts} AS posts
125
  JOIN {$wpdb->postmeta} AS meta ON posts.ID = meta.post_id
126
  WHERE
127
+ posts.post_type = '" . esc_sql( $post_type ) . "'
128
  AND meta.meta_key = 'panels_data'
129
+ " . ( !empty($search) ? 'AND posts.post_title LIKE "%' . esc_sql( $search ) . '%"' : '' ) . "
130
  AND ( posts.post_status = 'publish' OR posts.post_status = 'draft' " . $include_private . ")
131
+ ORDER BY post_date DESC
132
+ LIMIT 16 OFFSET " . intval( ( $page - 1 ) * 16 ) );
133
+ $total_posts = $wpdb->get_var( "SELECT FOUND_ROWS();" );
134
 
135
  foreach( $results as $result ) {
136
+ $thumbnail = get_the_post_thumbnail_url( $result->ID, array( 400,300 ) );
137
+ $return['items'][] = array(
138
+ 'id' => $result->ID,
139
+ 'title' => $result->post_title,
140
+ 'type' => $type,
141
+ 'screenshot' => !empty($thumbnail) ? $thumbnail : ''
 
142
  );
143
  }
144
 
145
+ $return['max_num_pages'] = ceil( $total_posts / 16 );
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
146
 
147
  }
148
  else {
149
+ // An invalid type. Display an error message.
150
+ }
151
+
152
+ // Add the search part to the title
153
+ if( !empty($search) ) {
154
+ $return['title'] .= __(' - Results For:', 'siteorigin-panels') . ' <em>' . esc_html( $search ) . '</em>';
155
  }
156
 
157
+ echo json_encode( $return );
158
+
159
  wp_die();
160
  }
161
+ add_action('wp_ajax_so_panels_layouts_query', 'siteorigin_panels_ajax_get_prebuilt_layouts');
162
 
163
  /**
164
  * Ajax handler to get an individual prebuilt layout
181
  if( isset($layout['name']) ) unset($layout['name']);
182
 
183
  $layout = apply_filters('siteorigin_panels_prebuilt_layout', $layout);
184
+ $layout = apply_filters('siteorigin_panels_data', $layout);
185
 
186
  echo json_encode( $layout );
187
  wp_die();
188
  }
189
+ if( $_REQUEST['type'] == 'directory' ) {
190
+ $response = wp_remote_get(
191
+ SITEORIGIN_PANELS_LAYOUT_URL . '/layout/' . urlencode($_REQUEST['lid']) . '/?action=download'
192
+ );
193
+
194
+ // var_dump($response['body']);
195
+ if( $response['response']['code'] == 200 ) {
196
+ // For now, we'll just pretend to load this
197
+ echo $response['body'];
198
+ wp_die();
199
+ }
200
+ else {
201
+ // Display some sort of error message
202
+ }
203
+ }
204
  elseif( current_user_can('edit_post', $_REQUEST['lid']) ) {
205
  $panels_data = get_post_meta( $_REQUEST['lid'], 'panels_data', true );
206
  $panels_data = apply_filters('siteorigin_panels_data', $panels_data);
208
  wp_die();
209
  }
210
  }
211
+ add_action('wp_ajax_so_panels_get_layout', 'siteorigin_panels_ajax_get_prebuilt_layout');
212
 
213
  /**
214
  * Ajax handler to import a layout
254
  wp_die();
255
  }
256
  add_action('wp_ajax_so_panels_directory_enable', 'siteorigin_panels_ajax_directory_enable');
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
inc/default-styles.php CHANGED
@@ -68,7 +68,7 @@ class SiteOrigin_Panels_Default_Styling {
68
  'name' => __('CSS Styles', 'siteorigin-panels'),
69
  'type' => 'code',
70
  'group' => 'attributes',
71
- 'description' => __('CSS Styles, given as one per row.', 'siteorigin-panels'),
72
  'priority' => 10,
73
  );
74
 
@@ -180,7 +180,7 @@ class SiteOrigin_Panels_Default_Styling {
180
  'name' => __('CSS Styles', 'siteorigin-panels'),
181
  'type' => 'code',
182
  'group' => 'attributes',
183
- 'description' => __('CSS Styles, given as one per row.', 'siteorigin-panels'),
184
  'priority' => 10,
185
  );
186
 
@@ -282,7 +282,12 @@ class SiteOrigin_Panels_Default_Styling {
282
  $attributes['style'] .= 'background-color:' . $args['background']. ';';
283
  }
284
 
285
- if( !empty($args['background_display']) && !empty( $args['background_image_attachment'] ) ) {
 
 
 
 
 
286
  $url = wp_get_attachment_image_src( $args['background_image_attachment'], 'full' );
287
 
288
  if( !empty($url) ) {
@@ -355,6 +360,10 @@ class SiteOrigin_Panels_Default_Styling {
355
  if( !empty($args['background_display']) && !empty( $args['background_image_attachment'] ) ) {
356
  $url = wp_get_attachment_image_src( $args['background_image_attachment'], 'full' );
357
 
 
 
 
 
358
  if( !empty($url) ) {
359
 
360
  if( $args['background_display'] == 'parallax' || $args['background_display'] == 'parallax-original' ) {
68
  'name' => __('CSS Styles', 'siteorigin-panels'),
69
  'type' => 'code',
70
  'group' => 'attributes',
71
+ 'description' => __('One style attribute per line.', 'siteorigin-panels'),
72
  'priority' => 10,
73
  );
74
 
180
  'name' => __('CSS Styles', 'siteorigin-panels'),
181
  'type' => 'code',
182
  'group' => 'attributes',
183
+ 'description' => __('One style attribute per line.', 'siteorigin-panels'),
184
  'priority' => 10,
185
  );
186
 
282
  $attributes['style'] .= 'background-color:' . $args['background']. ';';
283
  }
284
 
285
+ if( !empty( $args['background_display'] ) && !empty( $args['background_image_attachment'] ) ) {
286
+
287
+ if( $args['background_display'] == 'parallax' || $args['background_display'] == 'parallax-original' ) {
288
+ wp_enqueue_script('siteorigin-panels-front-styles');
289
+ }
290
+
291
  $url = wp_get_attachment_image_src( $args['background_image_attachment'], 'full' );
292
 
293
  if( !empty($url) ) {
360
  if( !empty($args['background_display']) && !empty( $args['background_image_attachment'] ) ) {
361
  $url = wp_get_attachment_image_src( $args['background_image_attachment'], 'full' );
362
 
363
+ if( $args['background_display'] == 'parallax' || $args['background_display'] == 'parallax-original' ) {
364
+ wp_enqueue_script('siteorigin-panels-front-styles');
365
+ }
366
+
367
  if( !empty($url) ) {
368
 
369
  if( $args['background_display'] == 'parallax' || $args['background_display'] == 'parallax-original' ) {
inc/live-editor.php CHANGED
@@ -10,8 +10,8 @@
10
  * @return array
11
  */
12
  function siteorigin_panels_live_editor($value, $post_id, $meta_key){
13
- if( $meta_key == 'panels_data' && !empty( $_GET['siteorigin_panels_live_editor'] ) && current_user_can( 'edit_post', $post_id ) && !empty( $_POST['siteorigin_panels_data'] ) ) {
14
- $data = json_decode( wp_unslash( $_POST['siteorigin_panels_data'] ), true );
15
  $value = array( $data );
16
  }
17
 
@@ -19,12 +19,32 @@ function siteorigin_panels_live_editor($value, $post_id, $meta_key){
19
  }
20
  add_action('get_post_metadata', 'siteorigin_panels_live_editor', 10, 3);
21
 
 
 
 
22
  /**
23
- * Hide the admin bar for the live editor
24
- *
25
- * @return bool
26
  */
27
- function siteorigin_panels_live_editor_admin_bar() {
28
- return empty( $_GET['siteorigin_panels_live_editor'] );
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
29
  }
30
- add_filter('show_admin_bar', 'siteorigin_panels_live_editor_admin_bar');
10
  * @return array
11
  */
12
  function siteorigin_panels_live_editor($value, $post_id, $meta_key){
13
+ if( $meta_key == 'panels_data' && current_user_can( 'edit_post', $post_id ) && !empty( $_POST['live_editor_panels_data'] ) ) {
14
+ $data = json_decode( wp_unslash( $_POST['live_editor_panels_data'] ), true );
15
  $value = array( $data );
16
  }
17
 
19
  }
20
  add_action('get_post_metadata', 'siteorigin_panels_live_editor', 10, 3);
21
 
22
+ // Don't display the admin bar when in live editor mode
23
+ add_filter('show_admin_bar', '__return_false');
24
+
25
  /**
26
+ * Load the frontend scripts for the live editor
 
 
27
  */
28
+ function siteorigin_panels_live_editor_frontend_scripts(){
29
+ wp_enqueue_script(
30
+ 'live-editor-front',
31
+ plugin_dir_url(SITEORIGIN_PANELS_BASE_FILE) . '/js/live-editor/live-editor-front' . SITEORIGIN_PANELS_JS_SUFFIX . '.js',
32
+ array( 'jquery' ),
33
+ SITEORIGIN_PANELS_VERSION
34
+ );
35
+
36
+ wp_enqueue_script(
37
+ 'live-editor-scrollto',
38
+ plugin_dir_url(SITEORIGIN_PANELS_BASE_FILE) . '/js/live-editor/jquery.scrollTo' . SITEORIGIN_PANELS_JS_SUFFIX . '.js',
39
+ array( 'jquery' ),
40
+ SITEORIGIN_PANELS_VERSION
41
+ );
42
+
43
+ wp_enqueue_style(
44
+ 'live-editor-front',
45
+ plugin_dir_url(SITEORIGIN_PANELS_BASE_FILE) . '/css/live-editor-front.css',
46
+ array(),
47
+ SITEORIGIN_PANELS_VERSION
48
+ );
49
  }
50
+ add_action( 'wp_enqueue_scripts', 'siteorigin_panels_live_editor_frontend_scripts' );
js/live-editor/jquery.scrollTo.js ADDED
@@ -0,0 +1,210 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ /*!
2
+ * jQuery.scrollTo
3
+ * Copyright (c) 2007-2015 Ariel Flesler - aflesler ○ gmail • com | http://flesler.blogspot.com
4
+ * Licensed under MIT
5
+ * http://flesler.blogspot.com/2007/10/jqueryscrollto.html
6
+ * @projectDescription Lightweight, cross-browser and highly customizable animated scrolling with jQuery
7
+ * @author Ariel Flesler
8
+ * @version 2.1.2
9
+ */
10
+ ;(function(factory) {
11
+ 'use strict';
12
+ if (typeof define === 'function' && define.amd) {
13
+ // AMD
14
+ define(['jquery'], factory);
15
+ } else if (typeof module !== 'undefined' && module.exports) {
16
+ // CommonJS
17
+ module.exports = factory(require('jquery'));
18
+ } else {
19
+ // Global
20
+ factory(jQuery);
21
+ }
22
+ })(function($) {
23
+ 'use strict';
24
+
25
+ var $scrollTo = $.scrollTo = function(target, duration, settings) {
26
+ return $(window).scrollTo(target, duration, settings);
27
+ };
28
+
29
+ $scrollTo.defaults = {
30
+ axis:'xy',
31
+ duration: 0,
32
+ limit:true
33
+ };
34
+
35
+ function isWin(elem) {
36
+ return !elem.nodeName ||
37
+ $.inArray(elem.nodeName.toLowerCase(), ['iframe','#document','html','body']) !== -1;
38
+ }
39
+
40
+ $.fn.scrollTo = function(target, duration, settings) {
41
+ if (typeof duration === 'object') {
42
+ settings = duration;
43
+ duration = 0;
44
+ }
45
+ if (typeof settings === 'function') {
46
+ settings = { onAfter:settings };
47
+ }
48
+ if (target === 'max') {
49
+ target = 9e9;
50
+ }
51
+
52
+ settings = $.extend({}, $scrollTo.defaults, settings);
53
+ // Speed is still recognized for backwards compatibility
54
+ duration = duration || settings.duration;
55
+ // Make sure the settings are given right
56
+ var queue = settings.queue && settings.axis.length > 1;
57
+ if (queue) {
58
+ // Let's keep the overall duration
59
+ duration /= 2;
60
+ }
61
+ settings.offset = both(settings.offset);
62
+ settings.over = both(settings.over);
63
+
64
+ return this.each(function() {
65
+ // Null target yields nothing, just like jQuery does
66
+ if (target === null) return;
67
+
68
+ var win = isWin(this),
69
+ elem = win ? this.contentWindow || window : this,
70
+ $elem = $(elem),
71
+ targ = target,
72
+ attr = {},
73
+ toff;
74
+
75
+ switch (typeof targ) {
76
+ // A number will pass the regex
77
+ case 'number':
78
+ case 'string':
79
+ if (/^([+-]=?)?\d+(\.\d+)?(px|%)?$/.test(targ)) {
80
+ targ = both(targ);
81
+ // We are done
82
+ break;
83
+ }
84
+ // Relative/Absolute selector
85
+ targ = win ? $(targ) : $(targ, elem);
86
+ /* falls through */
87
+ case 'object':
88
+ if (targ.length === 0) return;
89
+ // DOMElement / jQuery
90
+ if (targ.is || targ.style) {
91
+ // Get the real position of the target
92
+ toff = (targ = $(targ)).offset();
93
+ }
94
+ }
95
+
96
+ var offset = $.isFunction(settings.offset) && settings.offset(elem, targ) || settings.offset;
97
+
98
+ $.each(settings.axis.split(''), function(i, axis) {
99
+ var Pos = axis === 'x' ? 'Left' : 'Top',
100
+ pos = Pos.toLowerCase(),
101
+ key = 'scroll' + Pos,
102
+ prev = $elem[key](),
103
+ max = $scrollTo.max(elem, axis);
104
+
105
+ if (toff) {// jQuery / DOMElement
106
+ attr[key] = toff[pos] + (win ? 0 : prev - $elem.offset()[pos]);
107
+
108
+ // If it's a dom element, reduce the margin
109
+ if (settings.margin) {
110
+ attr[key] -= parseInt(targ.css('margin'+Pos), 10) || 0;
111
+ attr[key] -= parseInt(targ.css('border'+Pos+'Width'), 10) || 0;
112
+ }
113
+
114
+ attr[key] += offset[pos] || 0;
115
+
116
+ if (settings.over[pos]) {
117
+ // Scroll to a fraction of its width/height
118
+ attr[key] += targ[axis === 'x'?'width':'height']() * settings.over[pos];
119
+ }
120
+ } else {
121
+ var val = targ[pos];
122
+ // Handle percentage values
123
+ attr[key] = val.slice && val.slice(-1) === '%' ?
124
+ parseFloat(val) / 100 * max
125
+ : val;
126
+ }
127
+
128
+ // Number or 'number'
129
+ if (settings.limit && /^\d+$/.test(attr[key])) {
130
+ // Check the limits
131
+ attr[key] = attr[key] <= 0 ? 0 : Math.min(attr[key], max);
132
+ }
133
+
134
+ // Don't waste time animating, if there's no need.
135
+ if (!i && settings.axis.length > 1) {
136
+ if (prev === attr[key]) {
137
+ // No animation needed
138
+ attr = {};
139
+ } else if (queue) {
140
+ // Intermediate animation
141
+ animate(settings.onAfterFirst);
142
+ // Don't animate this axis again in the next iteration.
143
+ attr = {};
144
+ }
145
+ }
146
+ });
147
+
148
+ animate(settings.onAfter);
149
+
150
+ function animate(callback) {
151
+ var opts = $.extend({}, settings, {
152
+ // The queue setting conflicts with animate()
153
+ // Force it to always be true
154
+ queue: true,
155
+ duration: duration,
156
+ complete: callback && function() {
157
+ callback.call(elem, targ, settings);
158
+ }
159
+ });
160
+ $elem.animate(attr, opts);
161
+ }
162
+ });
163
+ };
164
+
165
+ // Max scrolling position, works on quirks mode
166
+ // It only fails (not too badly) on IE, quirks mode.
167
+ $scrollTo.max = function(elem, axis) {
168
+ var Dim = axis === 'x' ? 'Width' : 'Height',
169
+ scroll = 'scroll'+Dim;
170
+
171
+ if (!isWin(elem))
172
+ return elem[scroll] - $(elem)[Dim.toLowerCase()]();
173
+
174
+ var size = 'client' + Dim,
175
+ doc = elem.ownerDocument || elem.document,
176
+ html = doc.documentElement,
177
+ body = doc.body;
178
+
179
+ return Math.max(html[scroll], body[scroll]) - Math.min(html[size], body[size]);
180
+ };
181
+
182
+ function both(val) {
183
+ return $.isFunction(val) || $.isPlainObject(val) ? val : { top:val, left:val };
184
+ }
185
+
186
+ // Add special hooks so that window scroll properties can be animated
187
+ $.Tween.propHooks.scrollLeft =
188
+ $.Tween.propHooks.scrollTop = {
189
+ get: function(t) {
190
+ return $(t.elem)[t.prop]();
191
+ },
192
+ set: function(t) {
193
+ var curr = this.get(t);
194
+ // If interrupt is true and user scrolled, stop animating
195
+ if (t.options.interrupt && t._last && t._last !== curr) {
196
+ return $(t.elem).stop();
197
+ }
198
+ var next = Math.round(t.now);
199
+ // Don't waste CPU
200
+ // Browsers don't render floating point scroll
201
+ if (curr !== next) {
202
+ $(t.elem)[t.prop](next);
203
+ t._last = this.get(t);
204
+ }
205
+ }
206
+ };
207
+
208
+ // AMD requirement
209
+ return $scrollTo;
210
+ });
js/live-editor/jquery.scrollTo.min.js ADDED
@@ -0,0 +1 @@
 
1
+ !function(e){"use strict";"function"==typeof define&&define.amd?define(["jquery"],e):"undefined"!=typeof module&&module.exports?module.exports=e(require("jquery")):e(jQuery)}(function(e){"use strict";function t(t){return!t.nodeName||-1!==e.inArray(t.nodeName.toLowerCase(),["iframe","#document","html","body"])}function o(t){return e.isFunction(t)||e.isPlainObject(t)?t:{top:t,left:t}}var n=e.scrollTo=function(t,o,n){return e(window).scrollTo(t,o,n)};return n.defaults={axis:"xy",duration:0,limit:!0},e.fn.scrollTo=function(r,i,s){"object"==typeof i&&(s=i,i=0),"function"==typeof s&&(s={onAfter:s}),"max"===r&&(r=9e9),s=e.extend({},n.defaults,s),i=i||s.duration;var a=s.queue&&s.axis.length>1;return a&&(i/=2),s.offset=o(s.offset),s.over=o(s.over),this.each(function(){function f(t){var o=e.extend({},s,{queue:!0,duration:i,complete:t&&function(){t.call(l,m,s)}});d.animate(p,o)}if(null!==r){var u,c=t(this),l=c?this.contentWindow||window:this,d=e(l),m=r,p={};switch(typeof m){case"number":case"string":if(/^([+-]=?)?\d+(\.\d+)?(px|%)?$/.test(m)){m=o(m);break}m=c?e(m):e(m,l);case"object":if(0===m.length)return;(m.is||m.style)&&(u=(m=e(m)).offset())}var h=e.isFunction(s.offset)&&s.offset(l,m)||s.offset;e.each(s.axis.split(""),function(e,t){var o="x"===t?"Left":"Top",r=o.toLowerCase(),i="scroll"+o,x=d[i](),v=n.max(l,t);if(u)p[i]=u[r]+(c?0:x-d.offset()[r]),s.margin&&(p[i]-=parseInt(m.css("margin"+o),10)||0,p[i]-=parseInt(m.css("border"+o+"Width"),10)||0),p[i]+=h[r]||0,s.over[r]&&(p[i]+=m["x"===t?"width":"height"]()*s.over[r]);else{var w=m[r];p[i]=w.slice&&"%"===w.slice(-1)?parseFloat(w)/100*v:w}s.limit&&/^\d+$/.test(p[i])&&(p[i]=p[i]<=0?0:Math.min(p[i],v)),!e&&s.axis.length>1&&(x===p[i]?p={}:a&&(f(s.onAfterFirst),p={}))}),f(s.onAfter)}})},n.max=function(o,n){var r="x"===n?"Width":"Height",i="scroll"+r;if(!t(o))return o[i]-e(o)[r.toLowerCase()]();var s="client"+r,a=o.ownerDocument||o.document,f=a.documentElement,u=a.body;return Math.max(f[i],u[i])-Math.min(f[s],u[s])},e.Tween.propHooks.scrollLeft=e.Tween.propHooks.scrollTop={get:function(t){return e(t.elem)[t.prop]()},set:function(t){var o=this.get(t);if(t.options.interrupt&&t._last&&t._last!==o)return e(t.elem).stop();var n=Math.round(t.now);o!==n&&(e(t.elem)[t.prop](n),t._last=this.get(t))}},n});
js/live-editor/live-editor-front.js ADDED
@@ -0,0 +1,41 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ var iframe = window.frameElement;
2
+
3
+ if ( iframe ) {
4
+ iframe.contentDocument = document;
5
+ var windowParent = window.parent;
6
+
7
+ if( typeof windowParent !== 'undefined' && typeof windowParent.jQuery !== 'undefined' ) {
8
+ windowParent.jQuery( iframe ).trigger( "iframeloading" );
9
+ jQuery( function () {
10
+ windowParent.jQuery( iframe ).trigger( "iframeready" );
11
+ } );
12
+ }
13
+ }
14
+
15
+ /**
16
+ * Scroll this window over a specific element. Called by the main live editor.
17
+ * @param el
18
+ */
19
+ function liveEditorScrollTo( el ){
20
+ var $ = jQuery,
21
+ $el = $( el ),
22
+ rect = $el[0].getBoundingClientRect();
23
+
24
+ if( rect.top <= 0 || rect.bottom >= $(window).height() ) {
25
+ var newScrollTop = 0;
26
+
27
+ if( rect.top < 0 || $el.height() >= $( window ).height() * 0.8 ) {
28
+ // Scroll up to the element
29
+ newScrollTop = $( window ).scrollTop() + rect.top - 150;
30
+ } else if( rect.bottom > $(window).height() ) {
31
+ // Scroll down to the element
32
+ newScrollTop = $( window ).scrollTop() + ( rect.bottom - $(window).height() ) + 150;
33
+ }
34
+
35
+ $( window )
36
+ .clearQueue()
37
+ .animate({
38
+ scrollTop: newScrollTop
39
+ }, 450 );
40
+ }
41
+ };
js/live-editor/live-editor-front.min.js ADDED
@@ -0,0 +1 @@
 
1
+ function liveEditorScrollTo(e){var o=jQuery,i=o(e),n=i[0].getBoundingClientRect();if(n.top<=0||n.bottom>=o(window).height()){var t=0;n.top<0||i.height()>=.8*o(window).height()?t=o(window).scrollTop()+n.top-150:n.bottom>o(window).height()&&(t=o(window).scrollTop()+(n.bottom-o(window).height())+150),o(window).clearQueue().animate({scrollTop:t},450)}}var iframe=window.frameElement;if(iframe){iframe.contentDocument=document;var windowParent=window.parent;"undefined"!=typeof windowParent&&"undefined"!=typeof windowParent.jQuery&&(windowParent.jQuery(iframe).trigger("iframeloading"),jQuery(function(){windowParent.jQuery(iframe).trigger("iframeready")}))}
js/siteorigin-panels-23.js DELETED
@@ -1,5306 +0,0 @@
1
- (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
2
- var panels = window.panels;
3
-
4
- module.exports = Backbone.Collection.extend( {
5
- model: panels.model.cell,
6
-
7
- initialize: function(){
8
- },
9
-
10
- /**
11
- * Get the total weight for the cells in this collection.
12
- * @returns {number}
13
- */
14
- totalWeight: function(){
15
- var totalWeight = 0;
16
- this.each(function(cell){
17
- totalWeight += cell.get('weight');
18
- });
19
-
20
- return totalWeight;
21
- }
22
- } );
23
-
24
- },{}],2:[function(require,module,exports){
25
- var panels = window.panels;
26
-
27
- module.exports = Backbone.Collection.extend( {
28
- model: panels.model.historyEntry,
29
-
30
- /**
31
- * The builder model
32
- */
33
- builder: null,
34
-
35
- /**
36
- * The maximum number of items in the history
37
- */
38
- maxSize: 12,
39
-
40
- initialize: function(){
41
- this.on( 'add', this.onAddEntry, this );
42
- },
43
-
44
- /**
45
- * Add an entry to the collection.
46
- *
47
- * @param text The text that defines the action taken to get to this
48
- * @param data
49
- */
50
- addEntry: function(text, data) {
51
-
52
- if(typeof data === 'undefined' || data === null) {
53
- data = this.builder.getPanelsData();
54
- }
55
-
56
- var entry = new panels.model.historyEntry( {
57
- text: text,
58
- data: JSON.stringify( data ),
59
- time: parseInt( new Date().getTime() / 1000 ),
60
- collection: this
61
- } );
62
-
63
- this.add( entry );
64
- },
65
-
66
- /**
67
- * Resize the collection so it's not bigger than this.maxSize
68
- */
69
- onAddEntry: function(entry){
70
-
71
- if(this.models.length > 1) {
72
- var lastEntry = this.at(this.models.length - 2);
73
-
74
- if(
75
- ( entry.get('text') === lastEntry.get('text') && entry.get('time') - lastEntry.get('time') < 15 ) ||
76
- ( entry.get('data') === lastEntry.get('data') )
77
- ) {
78
- // If both entries have the same text and are within 20 seconds of each other, or have the same data, then remove most recent
79
- this.remove( entry );
80
- lastEntry.set( 'count', lastEntry.get('count') + 1 );
81
- }
82
- }
83
-
84
- // Make sure that there are not to many entries in this collection
85
- while( this.models.length > this.maxSize ) {
86
- this.shift();
87
- }
88
- }
89
- } );
90
- },{}],3:[function(require,module,exports){
91
- var panels = window.panels;
92
-
93
- module.exports = Backbone.Collection.extend( {
94
- model: panels.model.row,
95
-
96
- /**
97
- * Destroy all the rows in this collection
98
- */
99
- empty: function(){
100
- var model;
101
- do {
102
- model = this.collection.first();
103
- if( !model ) { break; }
104
-
105
- model.destroy();
106
- } while( true );
107
- }
108
- } );
109
- },{}],4:[function(require,module,exports){
110
- var panels = window.panels;
111
-
112
- module.exports = Backbone.Collection.extend( {
113
- model : panels.model.widget,
114
-
115
- initialize: function(){
116
- }
117
-
118
- } );
119
- },{}],5:[function(require,module,exports){
120
- var panels = window.panels, $ = jQuery;
121
-
122
- module.exports = panels.view.dialog.extend( {
123
- dialogClass : 'so-panels-dialog-add-builder',
124
-
125
- render: function(){
126
- // Render the dialog and attach it to the builder interface
127
- this.renderDialog( this.parseDialogContent( $('#siteorigin-panels-dialog-builder').html(), {} ) );
128
- this.$('.so-content .siteorigin-panels-builder').append( this.builder.$el );
129
- },
130
-
131
- initializeDialog: function(){
132
- var thisView = this;
133
- this.once('open_dialog_complete', function(){
134
- thisView.builder.initSortable();
135
- });
136
-
137