Q2W3 Fixed Widget - Version 6.0.5

Version Description

  • Fix: Prevent overlapping of fixed widgets with non-fixed widgets when scrolling up
Download this release

Release Info

Developer webzunft
Plugin Icon 128x128 Q2W3 Fixed Widget
Version 6.0.5
Comparing to
See all releases

Code changes from version 6.0.4 to 6.0.5

Files changed (4) hide show
  1. js/frontend.js +88 -126
  2. js/frontend.min.js +1 -15
  3. q2w3-fixed-widget.php +2 -2
  4. readme.txt +5 -1
js/frontend.js CHANGED
@@ -1,28 +1,11 @@
1
  'use strict';
2
 
3
- /*! *****************************************************************************
4
- Copyright (c) Microsoft Corporation.
5
-
6
- Permission to use, copy, modify, and/or distribute this software for any
7
- purpose with or without fee is hereby granted.
8
-
9
- THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
10
- REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
11
- AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
12
- INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
13
- LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
14
- OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
15
- PERFORMANCE OF THIS SOFTWARE.
16
- ***************************************************************************** */
17
- /* global Reflect, Promise */
18
-
19
  var extendStatics = function(d, b) {
20
  extendStatics = Object.setPrototypeOf ||
21
  ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
22
  function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
23
  return extendStatics(d, b);
24
  };
25
-
26
  function __extends(d, b) {
27
  if (typeof b !== "function" && b !== null)
28
  throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
@@ -30,7 +13,6 @@ function __extends(d, b) {
30
  function __() { this.constructor = d; }
31
  d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
32
  }
33
-
34
  var __assign = function() {
35
  __assign = Object.assign || function __assign(t) {
36
  for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -44,8 +26,7 @@ var __assign = function() {
44
 
45
  var StopWidgetClassName = 'FixedWidget__stop_widget';
46
  var FixedWidgetClassName = 'FixedWidget__fixed_widget';
47
- // TODO export offset values, calculations in separate class Offsets
48
- var Widget = /** @class */ (function () {
49
  function Widget(el) {
50
  this.el = el;
51
  this.top_offset = 0;
@@ -103,20 +84,10 @@ var Widget = /** @class */ (function () {
103
  }());
104
  var getWidgetContainer = function (el) {
105
  return el.parentElement && (el.parentElement.childElementCount === 1 ||
106
- /**
107
- * Group can contain multiple children, but this is one Widget,
108
- */
109
  el.parentElement.classList.toString().includes('wp-block-group') ||
110
  el.parentElement.classList.toString().includes('wp-block-column') ||
111
  el.parentElement.classList.contains('widget')) ? getWidgetContainer(el.parentElement) : el;
112
  };
113
- /**
114
- * Calc total offset of all fixed/sticked sibislings
115
- * @param next
116
- * @param el
117
- * @param offset
118
- * @returns
119
- */
120
  var get_sibilings_offset = function (next, need_to_calc_el_offset, el, offset) {
121
  if (offset === void 0) { offset = 0; }
122
  if (!el) {
@@ -129,12 +100,6 @@ var get_sibilings_offset = function (next, need_to_calc_el_offset, el, offset) {
129
  return get_sibilings_offset(next, need_to_calc_el_offset, next(el), offset + el.getBoundingClientRect().height + parseInt(marginTop || '0') + parseInt(marginBottom || '0'));
130
  };
131
 
132
- /**
133
- *
134
- * @param arr1
135
- * @param arr2
136
- * @returns [uniq elements from arr2, dublicates]
137
- */
138
  var findIntersections = function (arr1, arr2) {
139
  return [
140
  arr2.filter(function (e) { return !arr1.includes(e); }),
@@ -148,14 +113,8 @@ var splitSelectors = function (s) {
148
  .map(function (s) { return s.trim(); })
149
  .filter(function (s) { return s !== ''; });
150
  };
151
- /**
152
- * For compatabilty with Fixed Widget 5.3.0 (had a ids without #)
153
- * Clone and add selectors with #-prefix
154
- * @see https://github.com/webgilde/fixed-widget/issues/75
155
- */
156
  var compatabilty_FW_v5 = function (selectors) {
157
  if (selectors === void 0) { selectors = []; }
158
- /** If `selectors` includes extended selectors, not id names only, then it's v 6.0.0 */
159
  if (selectors.some(function (s) { return !/^[a-z]/i.test(s); })) {
160
  return selectors;
161
  }
@@ -169,12 +128,6 @@ var queryElements = function (selectors) {
169
  .reduce(function (all, elements) { return all.concat(elements); }, [])
170
  .filter(function (e) { return e instanceof HTMLElement; });
171
  };
172
- /**
173
- * Search property from el to document.body
174
- * @param el
175
- * @param predicate Returns true, if desired property exists
176
- * @returns {HTMLElement|null}
177
- */
178
  function findWithProperty(el, predicate) {
179
  if (!el || el === document.body) {
180
  return null;
@@ -185,57 +138,44 @@ function findWithProperty(el, predicate) {
185
  return findWithProperty(el.parentElement, predicate);
186
  }
187
 
188
- /**
189
- * @param getter returns new value
190
- * @param {number} [lifetime=3000] time to track reactivity, 0 for endless,
191
- * @param {number} [interval=300] update interval
192
- * @returns {IReactive}
193
- */
194
- var reactive = function (getter, lifetime, interval) {
195
- if (lifetime === void 0) { lifetime = 3000; }
196
  if (interval === void 0) { interval = 300; }
197
  var subs = [];
198
  var v = getter();
199
- var intervalID = run();
200
- function run() {
201
- lifetime !== 0 && setTimeout(off, lifetime);
202
- return setInterval(function () {
203
- if (subs.length === 0) {
204
- return;
205
- }
206
- var new_v = getter();
207
- if (v === new_v) {
208
- return;
209
- }
210
- v = new_v;
211
- for (var _i = 0, subs_1 = subs; _i < subs_1.length; _i++) {
212
- var update = subs_1[_i];
213
- update(new_v);
214
- }
215
- }, interval);
216
- }
217
- function off() {
218
- clearInterval(intervalID);
219
  }
220
  return {
221
  get val() {
222
  return v;
223
  },
224
  on_change: function (update) {
 
225
  subs.push(update);
226
  }
227
  };
228
  };
229
 
230
- var PositionWidget = /** @class */ (function (_super) {
231
  __extends(PositionWidget, _super);
232
  function PositionWidget() {
233
  var _this = _super !== null && _super.apply(this, arguments) || this;
234
  _this.bottom_offset = 0;
235
  _this.top_margin = 0;
236
- _this.borderBox = 0; /** cleintHeight+ top & bottom margins */
237
  _this.block_height = reactive(function () { return 0; });
238
- /** Top offset of StopWidget */
239
  _this.max_top_offset = 0;
240
  _this.bottom_margin = 0;
241
  _this.user_margins = {};
@@ -245,6 +185,10 @@ var PositionWidget = /** @class */ (function (_super) {
245
  && el.previousElementSibling
246
  || null;
247
  };
 
 
 
 
248
  return _this;
249
  }
250
  PositionWidget.prototype.mount = function (user_margins) {
@@ -258,6 +202,7 @@ var PositionWidget = /** @class */ (function (_super) {
258
  this.bottom_margin = parseInt(marginBottom);
259
  this.top_margin = parseInt(marginTop);
260
  this.bottom_offset = this.get_total_bottom_offset(user_margins);
 
261
  this.block_height = reactive(function () {
262
  if (!_this.el) {
263
  return 0;
@@ -267,6 +212,18 @@ var PositionWidget = /** @class */ (function (_super) {
267
  this.block_height.on_change(function (block_height) {
268
  _this.borderBox = block_height + _this.top_margin + _this.bottom_margin;
269
  });
 
 
 
 
 
 
 
 
 
 
 
 
270
  };
271
  PositionWidget.prototype.setMaxOffset = function (max_top_offset) {
272
  this.max_top_offset = max_top_offset;
@@ -278,26 +235,17 @@ var PositionWidget = /** @class */ (function (_super) {
278
  return _super.from.call(this, root, FixedWidgetClassName);
279
  };
280
  PositionWidget.prototype.on_scroll = function (_scroll_top) { };
281
- PositionWidget.prototype.get_total_bottom_offset = function (margins) {
282
- var next = function (el) { return el && !el.classList.contains(StopWidgetClassName) ? el.nextElementSibling : null; };
283
- return get_sibilings_offset(next, this.need_to_calc_el_offset, next(this.el), margins.margin_bottom);
284
- };
285
  return PositionWidget;
286
  }(Widget));
287
 
288
- var FixedWidget = /** @class */ (function (_super) {
289
  __extends(FixedWidget, _super);
290
  function FixedWidget(el) {
291
  var _this = _super.call(this, el) || this;
292
  _this.is_pinned = false;
293
  _this.relative_top = 0;
294
- /** margins + offsets */
295
  _this.paddings = 0;
296
  _this.init_style = { position: 'static', marginTop: '', marginBottom: '', width: '', height: '' };
297
- _this.get_root_offset = function () {
298
- var element = _this.is_pinned ? _this.clone_el : _this.el;
299
- return Math.round(scrollY + (element ? element.getBoundingClientRect().top : 0));
300
- };
301
  _this.need_to_calc_el_offset = function (el) {
302
  return el.classList.contains(FixedWidgetClassName);
303
  };
@@ -325,9 +273,15 @@ var FixedWidget = /** @class */ (function (_super) {
325
  _this.init_style.height = "".concat(block_height, "px");
326
  });
327
  };
 
 
 
 
 
328
  FixedWidget.prototype.setMaxOffset = function (max_top_offset) {
329
- /** StopWidget can limit top offset if it is placed only after widget */
330
- if (max_top_offset < this.root_offset || this.max_top_offset === max_top_offset) {
 
331
  return;
332
  }
333
  this.max_top_offset = max_top_offset;
@@ -369,7 +323,7 @@ var FixedWidget = /** @class */ (function (_super) {
369
  if (!this.el) {
370
  return;
371
  }
372
- this.root_offset = this.get_root_offset();
373
  var need_to_fix = scroll_top > this.root_offset - this.top_offset;
374
  var limited_by_stop_element = this.max_top_offset !== 0 && scroll_top > this.relative_top;
375
  var top = limited_by_stop_element ? this.relative_top - scroll_top + this.top_offset : this.top_offset;
@@ -405,11 +359,17 @@ var FixedWidget = /** @class */ (function (_super) {
405
  return FixedWidget;
406
  }(PositionWidget));
407
 
408
- var StickyWidget = /** @class */ (function (_super) {
409
  __extends(StickyWidget, _super);
410
  function StickyWidget(el) {
411
  var _this = _super.call(this, el) || this;
412
  _this.margins = 0;
 
 
 
 
 
 
413
  _this.need_to_calc_el_offset = function (el) {
414
  return el.classList.contains(FixedWidgetClassName);
415
  };
@@ -420,22 +380,24 @@ var StickyWidget = /** @class */ (function (_super) {
420
  return _this;
421
  }
422
  StickyWidget.prototype.mount = function (margins) {
 
423
  _super.prototype.mount.call(this, margins);
424
  if (!this.el || !this.el.parentElement) {
425
  return;
426
  }
427
- this.margins = this.el.parentElement.clientHeight - this.borderBox;
 
 
 
428
  this.el.style.position = 'sticky';
429
  this.el.style.position = '-webkit-sticky';
430
  this.el.style.transition = 'transform 0s';
431
  this.el.style.boxSizing = 'border-box';
432
- this.el.style.top = "".concat(this.top_offset, "px");
433
  };
434
  StickyWidget.prototype.setMaxOffset = function (max_top_offset) {
435
  if (!this.el || !this.el.parentElement) {
436
  return;
437
  }
438
- /** StopWidget can limit top offset if it is placed only after widget*/
439
  if (max_top_offset < this.el.offsetTop) {
440
  return;
441
  }
@@ -448,6 +410,7 @@ var StickyWidget = /** @class */ (function (_super) {
448
  var bottom_margin = this.max_top_offset ?
449
  Math.min(this.max_top_offset - this.el.offsetTop - this.borderBox, this.margins - this.el.offsetTop)
450
  : this.margins - this.el.offsetTop;
 
451
  if (bottom_margin >= this.bottom_offset) {
452
  this.el.style.transform = "translateY(0px)";
453
  return;
@@ -464,7 +427,7 @@ var StickyWidget = /** @class */ (function (_super) {
464
  return StickyWidget;
465
  }(PositionWidget));
466
 
467
- var StopWidget = /** @class */ (function (_super) {
468
  __extends(StopWidget, _super);
469
  function StopWidget(el) {
470
  var _this = _super.call(this, el) || this;
@@ -496,15 +459,15 @@ var StopWidget = /** @class */ (function (_super) {
496
  return StopWidget;
497
  }(Widget));
498
 
499
- var Sidebar = /** @class */ (function () {
500
  function Sidebar(el, margins, use_sticky_position) {
501
  var _this = this;
502
- if (use_sticky_position === void 0) { use_sticky_position = true; }
503
  this.el = el;
504
  this.margins = margins;
505
  this.widgets = [];
506
  this.stop_widgets = [];
507
- this.isSticky = true;
508
  this.setWidgetsMaxOffset = function (max_offset) {
509
  for (var _i = 0, _a = _this.widgets; _i < _a.length; _i++) {
510
  var widget = _a[_i];
@@ -512,8 +475,13 @@ var Sidebar = /** @class */ (function () {
512
  }
513
  };
514
  var isDeprecatedFloatMarkup = !!findWithProperty(this.el, function (style) { return style.float !== 'none'; });
515
- isDeprecatedFloatMarkup && console.log('Fixed Widget: fallback to position sticky');
516
- this.isSticky = !isDeprecatedFloatMarkup && use_sticky_position;
 
 
 
 
 
517
  var WidgetContructor = this.isSticky ? StickyWidget : FixedWidget;
518
  this.stop_widgets = StopWidget.from(this.el);
519
  this.widgets = WidgetContructor.from(this.el);
@@ -531,17 +499,20 @@ var Sidebar = /** @class */ (function () {
531
  this.stop_widgets.forEach(function (widget) { widget.mount(); });
532
  this.widgets.forEach(function (widget) { widget.mount(_this.margins); });
533
  };
534
- Sidebar.prototype.setMaxOffset = function (common_stop_widgets) {
535
- var _this = this;
536
- var stop_widgets = this.stop_widgets.length != 0 ? this.stop_widgets : common_stop_widgets;
 
537
  if (stop_widgets.length === 0) {
538
  return;
539
  }
540
  var max_top_offset = reactive(function () {
541
- var min_offset = _this.isSticky ? stop_widgets[0].top_offset : stop_widgets[0].root_offset;
 
 
542
  for (var _i = 0, stop_widgets_1 = stop_widgets; _i < stop_widgets_1.length; _i++) {
543
  var widget = stop_widgets_1[_i];
544
- var offset = _this.isSticky ? widget.top_offset : widget.root_offset;
545
  if (min_offset > offset) {
546
  min_offset = offset;
547
  }
@@ -564,7 +535,7 @@ var Sidebar = /** @class */ (function () {
564
  return Sidebar;
565
  }());
566
 
567
- var Sidebars = /** @class */ (function () {
568
  function Sidebars(elements, options) {
569
  var _this = this;
570
  this.data = [];
@@ -574,10 +545,9 @@ var Sidebars = /** @class */ (function () {
574
  sidebar.render();
575
  }
576
  };
577
- var use_sticky_position = typeof options.use_sticky_position === 'undefined' || options.use_sticky_position;
578
  this.data = Array.from(new Set(elements.map(function (widget) { return widget.parentElement; })))
579
  .filter(function (sidebar_el) { return sidebar_el !== null; })
580
- .map(function (sidebar_el) { return new Sidebar(sidebar_el, options, use_sticky_position); });
581
  }
582
  Sidebars.prototype.mount = function () {
583
  this.data.forEach(function (sidebar) { sidebar.mount(); });
@@ -593,24 +563,20 @@ var Sidebars = /** @class */ (function () {
593
  Sidebars.prototype.getGeneralStopElements = function () {
594
  return this.data.filter(function (sidebar) {
595
  return sidebar.isSticky ?
596
- sidebar.widgets.length === 0 : /** for sticky widgets only alone stopElements are general */
597
  true;
598
- } /** all stop elements are general for fixed widgets */)
599
  .map(function (sidebar) { return sidebar.stop_widgets; })
600
  .reduce(function (all, widgets) { return all.concat(widgets); }, []);
601
  };
602
  Sidebars.new = function (options) {
603
- var fixedWidgetsContainers = Array.from(new Set(// use Set to remove duplicates
604
- Widget
605
- .queryAllWidgetsContainers(FixedWidgetClassName) // widgets by classNames from editor's plugin
606
- .concat(queryElements(compatabilty_FW_v5(options.widgets))) // widgets from option's custom selectors
607
- ));
608
  var stopWidgetsSelectors = compatabilty_FW_v5(splitSelectors(options.stop_elements_selectors || options.stop_id));
609
- var stopWidgetsContainers = Array.from(new Set(// use Set to remove duplicates
610
- Widget
611
- .queryAllWidgetsContainers(StopWidgetClassName) // widgets by classNames from editor's plugin;
612
- .concat(queryElements(stopWidgetsSelectors)) // widgets from option's custom selectors
613
- ));
614
  var _a = findIntersections(fixedWidgetsContainers, stopWidgetsContainers), stopWidgetsUniqContainers = _a[0], duplicates = _a[1];
615
  duplicates.forEach(function (w) {
616
  console.error("The Widget is detected as fixed block and stop block!\n".concat(w.innerHTML));
@@ -639,7 +605,6 @@ document.readyState === "complete" && onDocumentLoaded();
639
  onDocumentLoaded();
640
  function onDocumentLoaded() {
641
  var admin_panel = document.querySelector('#wpadminbar');
642
- // @ts-ignore
643
  var user_options = window['q2w3_sidebar_options'] || [{}];
644
  var options = user_options.map(function (option) {
645
  option.margin_top = (option.margin_top || 0) + (admin_panel && admin_panel.clientHeight || 0);
@@ -653,6 +618,3 @@ function onDocumentLoaded() {
653
  }
654
  initPlugin(options);
655
  }
656
- /**
657
- * @version 0.0.1
658
- */
1
  'use strict';
2
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
3
  var extendStatics = function(d, b) {
4
  extendStatics = Object.setPrototypeOf ||
5
  ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
6
  function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
7
  return extendStatics(d, b);
8
  };
 
9
  function __extends(d, b) {
10
  if (typeof b !== "function" && b !== null)
11
  throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
13
  function __() { this.constructor = d; }
14
  d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
15
  }
 
16
  var __assign = function() {
17
  __assign = Object.assign || function __assign(t) {
18
  for (var s, i = 1, n = arguments.length; i < n; i++) {
26
 
27
  var StopWidgetClassName = 'FixedWidget__stop_widget';
28
  var FixedWidgetClassName = 'FixedWidget__fixed_widget';
29
+ var Widget = (function () {
 
30
  function Widget(el) {
31
  this.el = el;
32
  this.top_offset = 0;
84
  }());
85
  var getWidgetContainer = function (el) {
86
  return el.parentElement && (el.parentElement.childElementCount === 1 ||
 
 
 
87
  el.parentElement.classList.toString().includes('wp-block-group') ||
88
  el.parentElement.classList.toString().includes('wp-block-column') ||
89
  el.parentElement.classList.contains('widget')) ? getWidgetContainer(el.parentElement) : el;
90
  };
 
 
 
 
 
 
 
91
  var get_sibilings_offset = function (next, need_to_calc_el_offset, el, offset) {
92
  if (offset === void 0) { offset = 0; }
93
  if (!el) {
100
  return get_sibilings_offset(next, need_to_calc_el_offset, next(el), offset + el.getBoundingClientRect().height + parseInt(marginTop || '0') + parseInt(marginBottom || '0'));
101
  };
102
 
 
 
 
 
 
 
103
  var findIntersections = function (arr1, arr2) {
104
  return [
105
  arr2.filter(function (e) { return !arr1.includes(e); }),
113
  .map(function (s) { return s.trim(); })
114
  .filter(function (s) { return s !== ''; });
115
  };
 
 
 
 
 
116
  var compatabilty_FW_v5 = function (selectors) {
117
  if (selectors === void 0) { selectors = []; }
 
118
  if (selectors.some(function (s) { return !/^[a-z]/i.test(s); })) {
119
  return selectors;
120
  }
128
  .reduce(function (all, elements) { return all.concat(elements); }, [])
129
  .filter(function (e) { return e instanceof HTMLElement; });
130
  };
 
 
 
 
 
 
131
  function findWithProperty(el, predicate) {
132
  if (!el || el === document.body) {
133
  return null;
138
  return findWithProperty(el.parentElement, predicate);
139
  }
140
 
141
+ var reactive = function (getter, interval) {
 
 
 
 
 
 
 
142
  if (interval === void 0) { interval = 300; }
143
  var subs = [];
144
  var v = getter();
145
+ setInterval(check, interval);
146
+ function check() {
147
+ if (subs.length === 0) {
148
+ return;
149
+ }
150
+ var new_v = getter();
151
+ if (v === new_v) {
152
+ return;
153
+ }
154
+ v = new_v;
155
+ for (var _i = 0, subs_1 = subs; _i < subs_1.length; _i++) {
156
+ var update = subs_1[_i];
157
+ update(new_v);
158
+ }
 
 
 
 
 
 
159
  }
160
  return {
161
  get val() {
162
  return v;
163
  },
164
  on_change: function (update) {
165
+ update(v);
166
  subs.push(update);
167
  }
168
  };
169
  };
170
 
171
+ var PositionWidget = (function (_super) {
172
  __extends(PositionWidget, _super);
173
  function PositionWidget() {
174
  var _this = _super !== null && _super.apply(this, arguments) || this;
175
  _this.bottom_offset = 0;
176
  _this.top_margin = 0;
177
+ _this.borderBox = 0;
178
  _this.block_height = reactive(function () { return 0; });
 
179
  _this.max_top_offset = 0;
180
  _this.bottom_margin = 0;
181
  _this.user_margins = {};
185
  && el.previousElementSibling
186
  || null;
187
  };
188
+ _this.get_total_bottom_offset = function (margins) {
189
+ var next = function (el) { return el && !el.classList.contains(StopWidgetClassName) ? el.nextElementSibling : null; };
190
+ return get_sibilings_offset(next, _this.need_to_calc_el_offset, next(_this.el), margins.margin_bottom);
191
+ };
192
  return _this;
193
  }
194
  PositionWidget.prototype.mount = function (user_margins) {
202
  this.bottom_margin = parseInt(marginBottom);
203
  this.top_margin = parseInt(marginTop);
204
  this.bottom_offset = this.get_total_bottom_offset(user_margins);
205
+ this.max_top_offset = document.body.clientHeight;
206
  this.block_height = reactive(function () {
207
  if (!_this.el) {
208
  return 0;
212
  this.block_height.on_change(function (block_height) {
213
  _this.borderBox = block_height + _this.top_margin + _this.bottom_margin;
214
  });
215
+ reactive(this.get_total_bottom_offset.bind(this, user_margins))
216
+ .on_change(function (bottom_offset) {
217
+ _this.bottom_offset = bottom_offset;
218
+ });
219
+ reactive(this.get_total_top_offset.bind(this, user_margins))
220
+ .on_change(function (top_offset) {
221
+ _this.top_offset = top_offset;
222
+ if (!_this.el) {
223
+ return;
224
+ }
225
+ _this.el.style.top = "".concat(top_offset, "px");
226
+ });
227
  };
228
  PositionWidget.prototype.setMaxOffset = function (max_top_offset) {
229
  this.max_top_offset = max_top_offset;
235
  return _super.from.call(this, root, FixedWidgetClassName);
236
  };
237
  PositionWidget.prototype.on_scroll = function (_scroll_top) { };
 
 
 
 
238
  return PositionWidget;
239
  }(Widget));
240
 
241
+ var FixedWidget = (function (_super) {
242
  __extends(FixedWidget, _super);
243
  function FixedWidget(el) {
244
  var _this = _super.call(this, el) || this;
245
  _this.is_pinned = false;
246
  _this.relative_top = 0;
 
247
  _this.paddings = 0;
248
  _this.init_style = { position: 'static', marginTop: '', marginBottom: '', width: '', height: '' };
 
 
 
 
249
  _this.need_to_calc_el_offset = function (el) {
250
  return el.classList.contains(FixedWidgetClassName);
251
  };
273
  _this.init_style.height = "".concat(block_height, "px");
274
  });
275
  };
276
+ FixedWidget.prototype.update_root_offset = function () {
277
+ var element = this.is_pinned ? this.clone_el : this.el;
278
+ var new_root_offset = Math.round(scrollY + (element ? element.getBoundingClientRect().top : 0));
279
+ this.root_offset = Math.max(this.root_offset, new_root_offset);
280
+ };
281
  FixedWidget.prototype.setMaxOffset = function (max_top_offset) {
282
+ if (max_top_offset === 0 ||
283
+ max_top_offset < this.root_offset ||
284
+ this.max_top_offset === max_top_offset) {
285
  return;
286
  }
287
  this.max_top_offset = max_top_offset;
323
  if (!this.el) {
324
  return;
325
  }
326
+ this.update_root_offset();
327
  var need_to_fix = scroll_top > this.root_offset - this.top_offset;
328
  var limited_by_stop_element = this.max_top_offset !== 0 && scroll_top > this.relative_top;
329
  var top = limited_by_stop_element ? this.relative_top - scroll_top + this.top_offset : this.top_offset;
359
  return FixedWidget;
360
  }(PositionWidget));
361
 
362
+ var StickyWidget = (function (_super) {
363
  __extends(StickyWidget, _super);
364
  function StickyWidget(el) {
365
  var _this = _super.call(this, el) || this;
366
  _this.margins = 0;
367
+ _this.get_margins = function () {
368
+ return (_this.el && _this.el.parentElement && _this.el.parentElement.clientHeight || 0)
369
+ - _this.bottom_margin
370
+ - _this.top_margin
371
+ - _this.block_height.val;
372
+ };
373
  _this.need_to_calc_el_offset = function (el) {
374
  return el.classList.contains(FixedWidgetClassName);
375
  };
380
  return _this;
381
  }
382
  StickyWidget.prototype.mount = function (margins) {
383
+ var _this = this;
384
  _super.prototype.mount.call(this, margins);
385
  if (!this.el || !this.el.parentElement) {
386
  return;
387
  }
388
+ reactive(this.get_margins)
389
+ .on_change(function (margins) {
390
+ _this.margins = margins;
391
+ });
392
  this.el.style.position = 'sticky';
393
  this.el.style.position = '-webkit-sticky';
394
  this.el.style.transition = 'transform 0s';
395
  this.el.style.boxSizing = 'border-box';
 
396
  };
397
  StickyWidget.prototype.setMaxOffset = function (max_top_offset) {
398
  if (!this.el || !this.el.parentElement) {
399
  return;
400
  }
 
401
  if (max_top_offset < this.el.offsetTop) {
402
  return;
403
  }
410
  var bottom_margin = this.max_top_offset ?
411
  Math.min(this.max_top_offset - this.el.offsetTop - this.borderBox, this.margins - this.el.offsetTop)
412
  : this.margins - this.el.offsetTop;
413
+ this.el.style.top = "".concat(this.top_offset, "px");
414
  if (bottom_margin >= this.bottom_offset) {
415
  this.el.style.transform = "translateY(0px)";
416
  return;
427
  return StickyWidget;
428
  }(PositionWidget));
429
 
430
+ var StopWidget = (function (_super) {
431
  __extends(StopWidget, _super);
432
  function StopWidget(el) {
433
  var _this = _super.call(this, el) || this;
459
  return StopWidget;
460
  }(Widget));
461
 
462
+ var Sidebar = (function () {
463
  function Sidebar(el, margins, use_sticky_position) {
464
  var _this = this;
465
+ if (use_sticky_position === void 0) { use_sticky_position = false; }
466
  this.el = el;
467
  this.margins = margins;
468
  this.widgets = [];
469
  this.stop_widgets = [];
470
+ this.isSticky = false;
471
  this.setWidgetsMaxOffset = function (max_offset) {
472
  for (var _i = 0, _a = _this.widgets; _i < _a.length; _i++) {
473
  var widget = _a[_i];
475
  }
476
  };
477
  var isDeprecatedFloatMarkup = !!findWithProperty(this.el, function (style) { return style.float !== 'none'; });
478
+ var isOverflowHiddenMarkup = !!findWithProperty(this.el, function (style) { return style.overflow === 'hidden'; });
479
+ var isFallbackToSticky = (isDeprecatedFloatMarkup || isOverflowHiddenMarkup) && use_sticky_position;
480
+ isFallbackToSticky && console.log('Fixed Widget: fallback to position sticky');
481
+ this.isSticky =
482
+ !isDeprecatedFloatMarkup &&
483
+ !isOverflowHiddenMarkup &&
484
+ use_sticky_position;
485
  var WidgetContructor = this.isSticky ? StickyWidget : FixedWidget;
486
  this.stop_widgets = StopWidget.from(this.el);
487
  this.widgets = WidgetContructor.from(this.el);
499
  this.stop_widgets.forEach(function (widget) { widget.mount(); });
500
  this.widgets.forEach(function (widget) { widget.mount(_this.margins); });
501
  };
502
+ Sidebar.prototype.setMaxOffset = function (general_stop_widgets) {
503
+ var is_local_stop_widgets = this.stop_widgets.length != 0;
504
+ var use_top_offset = this.isSticky && is_local_stop_widgets;
505
+ var stop_widgets = is_local_stop_widgets ? this.stop_widgets : general_stop_widgets;
506
  if (stop_widgets.length === 0) {
507
  return;
508
  }
509
  var max_top_offset = reactive(function () {
510
+ var min_offset = use_top_offset ?
511
+ stop_widgets[0].top_offset :
512
+ stop_widgets[0].root_offset;
513
  for (var _i = 0, stop_widgets_1 = stop_widgets; _i < stop_widgets_1.length; _i++) {
514
  var widget = stop_widgets_1[_i];
515
+ var offset = use_top_offset ? widget.top_offset : widget.root_offset;
516
  if (min_offset > offset) {
517
  min_offset = offset;
518
  }
535
  return Sidebar;
536
  }());
537
 
538
+ var Sidebars = (function () {
539
  function Sidebars(elements, options) {
540
  var _this = this;
541
  this.data = [];
545
  sidebar.render();
546
  }
547
  };
 
548
  this.data = Array.from(new Set(elements.map(function (widget) { return widget.parentElement; })))
549
  .filter(function (sidebar_el) { return sidebar_el !== null; })
550
+ .map(function (sidebar_el) { return new Sidebar(sidebar_el, options, options.use_sticky_position); });
551
  }
552
  Sidebars.prototype.mount = function () {
553
  this.data.forEach(function (sidebar) { sidebar.mount(); });
563
  Sidebars.prototype.getGeneralStopElements = function () {
564
  return this.data.filter(function (sidebar) {
565
  return sidebar.isSticky ?
566
+ sidebar.widgets.length === 0 :
567
  true;
568
+ })
569
  .map(function (sidebar) { return sidebar.stop_widgets; })
570
  .reduce(function (all, widgets) { return all.concat(widgets); }, []);
571
  };
572
  Sidebars.new = function (options) {
573
+ var fixedWidgetsContainers = Array.from(new Set(Widget
574
+ .queryAllWidgetsContainers(FixedWidgetClassName)
575
+ .concat(queryElements(compatabilty_FW_v5(options.widgets)))));
 
 
576
  var stopWidgetsSelectors = compatabilty_FW_v5(splitSelectors(options.stop_elements_selectors || options.stop_id));
577
+ var stopWidgetsContainers = Array.from(new Set(Widget
578
+ .queryAllWidgetsContainers(StopWidgetClassName)
579
+ .concat(queryElements(stopWidgetsSelectors))));
 
 
580
  var _a = findIntersections(fixedWidgetsContainers, stopWidgetsContainers), stopWidgetsUniqContainers = _a[0], duplicates = _a[1];
581
  duplicates.forEach(function (w) {
582
  console.error("The Widget is detected as fixed block and stop block!\n".concat(w.innerHTML));
605
  onDocumentLoaded();
606
  function onDocumentLoaded() {
607
  var admin_panel = document.querySelector('#wpadminbar');
 
608
  var user_options = window['q2w3_sidebar_options'] || [{}];
609
  var options = user_options.map(function (option) {
610
  option.margin_top = (option.margin_top || 0) + (admin_panel && admin_panel.clientHeight || 0);
618
  }
619
  initPlugin(options);
620
  }
 
 
 
js/frontend.min.js CHANGED
@@ -1,15 +1 @@
1
- "use strict";
2
- /*! *****************************************************************************
3
- Copyright (c) Microsoft Corporation.
4
-
5
- Permission to use, copy, modify, and/or distribute this software for any
6
- purpose with or without fee is hereby granted.
7
-
8
- THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
9
- REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
10
- AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
11
- INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
12
- LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
13
- OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
14
- PERFORMANCE OF THIS SOFTWARE.
15
- ***************************************************************************** */var extendStatics=function(d,b){return extendStatics=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(d,b){d.__proto__=b}||function(d,b){for(var p in b)Object.prototype.hasOwnProperty.call(b,p)&&(d[p]=b[p])},extendStatics(d,b)};function __extends(d,b){if("function"!=typeof b&&null!==b)throw new TypeError("Class extends value "+String(b)+" is not a constructor or null");function __(){this.constructor=d}extendStatics(d,b),d.prototype=null===b?Object.create(b):(__.prototype=b.prototype,new __)}var __assign=function(){return __assign=Object.assign||function(t){for(var s,i=1,n=arguments.length;i<n;i++)for(var p in s=arguments[i])Object.prototype.hasOwnProperty.call(s,p)&&(t[p]=s[p]);return t},__assign.apply(this,arguments)},StopWidgetClassName="FixedWidget__stop_widget",FixedWidgetClassName="FixedWidget__fixed_widget",Widget=function(){function Widget(el){this.el=el,this.top_offset=0,this.root_offset=0,this.need_to_calc_el_offset=function(_){return!1},this.prevSibling=function(el){return el&&el.previousElementSibling}}return Widget.prototype.render=function(){},Widget.prototype.mount=function(user_margins){void 0===user_margins&&(user_margins={}),this.el&&this.el.parentElement&&(this.top_offset=this.get_total_top_offset(user_margins),this.root_offset=scrollY+this.el.getBoundingClientRect().y)},Widget.prototype.getElement=function(){return this.el},Widget.prototype.toString=function(){var _a;return"".concat(null===(_a=this.el)||void 0===_a?void 0:_a.innerHTML)},Widget.prototype.get_total_top_offset=function(margins){return get_sibilings_offset(this.prevSibling,this.need_to_calc_el_offset,this.prevSibling(this.el),margins.margin_top)},Widget.queryAllWidgetsContainers=function(className){return[].concat(Array.from(document.querySelectorAll(".".concat(className))),Array.from(document.querySelectorAll("[data-fixed_widget=".concat(className)))).map((function(el){el.classList.remove(className),el.removeAttribute("data-fixed_widget");var container=getWidgetContainer(el);return container.classList.remove(FixedWidgetClassName),container.classList.remove(StopWidgetClassName),container}))},Widget.from=function(root,className){var _this=this,elements=[];try{elements=Array.from(root.querySelectorAll(":scope > .".concat(className)))}catch(_e){elements=Array.from(root.children).filter((function(e){return e.classList.contains(className)}))}return elements.filter((function(el){return null!==el})).map((function(e){return new _this(e)}))},Widget}(),getWidgetContainer=function(el){return el.parentElement&&(1===el.parentElement.childElementCount||el.parentElement.classList.toString().includes("wp-block-group")||el.parentElement.classList.toString().includes("wp-block-column")||el.parentElement.classList.contains("widget"))?getWidgetContainer(el.parentElement):el},get_sibilings_offset=function(next,need_to_calc_el_offset,el,offset){if(void 0===offset&&(offset=0),!el)return offset;if(!need_to_calc_el_offset(el))return get_sibilings_offset(next,need_to_calc_el_offset,next(el),offset);var _a=getComputedStyle(el),marginTop=_a.marginTop,marginBottom=_a.marginBottom;return get_sibilings_offset(next,need_to_calc_el_offset,next(el),offset+el.getBoundingClientRect().height+parseInt(marginTop||"0")+parseInt(marginBottom||"0"))},compatabilty_FW_v5=function(selectors){return void 0===selectors&&(selectors=[]),selectors.some((function(s){return!/^[a-z]/i.test(s)}))?selectors:selectors.concat(selectors.map((function(s){return"#".concat(s)})))},queryElements=function(selectors){return void 0===selectors&&(selectors=[]),Array.from(selectors.map((function(selector){return Array.from(document.querySelectorAll(selector))}))).reduce((function(all,elements){return all.concat(elements)}),[]).filter((function(e){return e instanceof HTMLElement}))};function findWithProperty(el,predicate){return el&&el!==document.body?predicate(getComputedStyle(el))?el:findWithProperty(el.parentElement,predicate):null}var sidebars,reactive=function(getter,lifetime,interval){void 0===lifetime&&(lifetime=3e3),void 0===interval&&(interval=300);var subs=[],v=getter(),intervalID=(0!==lifetime&&setTimeout(off,lifetime),setInterval((function(){if(0!==subs.length){var new_v=getter();if(v!==new_v){v=new_v;for(var _i=0,subs_1=subs;_i<subs_1.length;_i++)(0,subs_1[_i])(new_v)}}}),interval));function off(){clearInterval(intervalID)}return{get val(){return v},on_change:function(update){subs.push(update)}}},PositionWidget=function(_super){function PositionWidget(){var _this=null!==_super&&_super.apply(this,arguments)||this;return _this.bottom_offset=0,_this.top_margin=0,_this.borderBox=0,_this.block_height=reactive((function(){return 0})),_this.max_top_offset=0,_this.bottom_margin=0,_this.user_margins={},_this.prevSibling=function(el){return el&&!el.classList.contains(StopWidgetClassName)&&el.previousElementSibling||null},_this}return __extends(PositionWidget,_super),PositionWidget.prototype.mount=function(user_margins){var _this=this;if(_super.prototype.mount.call(this,user_margins),this.el&&this.el.parentElement){this.user_margins=user_margins;var _a=getComputedStyle(this.el),marginTop=_a.marginTop,marginBottom=_a.marginBottom;this.bottom_margin=parseInt(marginBottom),this.top_margin=parseInt(marginTop),this.bottom_offset=this.get_total_bottom_offset(user_margins),this.block_height=reactive((function(){return _this.el?Math.round(Math.max(_this.el.clientHeight,_this.el.scrollHeight,_this.el.getBoundingClientRect().height)):0})),this.block_height.on_change((function(block_height){_this.borderBox=block_height+_this.top_margin+_this.bottom_margin}))}},PositionWidget.prototype.setMaxOffset=function(max_top_offset){this.max_top_offset=max_top_offset},PositionWidget.prototype.render=function(){this.on_scroll(scrollY)},PositionWidget.from=function(root){return _super.from.call(this,root,FixedWidgetClassName)},PositionWidget.prototype.on_scroll=function(_scroll_top){},PositionWidget.prototype.get_total_bottom_offset=function(margins){var next=function(el){return el&&!el.classList.contains(StopWidgetClassName)?el.nextElementSibling:null};return get_sibilings_offset(next,this.need_to_calc_el_offset,next(this.el),margins.margin_bottom)},PositionWidget}(Widget),FixedWidget=function(_super){function FixedWidget(el){var _this=_super.call(this,el)||this;return _this.is_pinned=!1,_this.relative_top=0,_this.paddings=0,_this.init_style={position:"static",marginTop:"",marginBottom:"",width:"",height:""},_this.get_root_offset=function(){var element=_this.is_pinned?_this.clone_el:_this.el;return Math.round(scrollY+(element?element.getBoundingClientRect().top:0))},_this.need_to_calc_el_offset=function(el){return el.classList.contains(FixedWidgetClassName)},_this.el&&_this.el.parentElement?(_this.el.classList.add(FixedWidgetClassName),_this):_this}return __extends(FixedWidget,_super),FixedWidget.prototype.mount=function(margins){var _this=this;_super.prototype.mount.call(this,margins),this.el&&(this.paddings=this.top_offset+this.top_margin+this.bottom_margin+this.bottom_offset,this.store_style(getComputedStyle(this.el)),this.clone(),this.block_height.on_change((function(block_height){_this.relative_top=_this.max_top_offset-block_height-_this.paddings,_this.init_style.height="".concat(block_height,"px")})))},FixedWidget.prototype.setMaxOffset=function(max_top_offset){max_top_offset<this.root_offset||this.max_top_offset===max_top_offset||(this.max_top_offset=max_top_offset,this.relative_top=this.max_top_offset-this.block_height.val-this.paddings)},FixedWidget.prototype.clone=function(){var _this=this;if(this.el&&this.el.parentElement){for(var prop in this.clone_el=this.el.cloneNode(!1),this.clone_el.getAttributeNames().forEach((function(attr){_this.clone_el.removeAttribute(attr)})),this.init_style)this.clone_el.style[prop]=this.init_style[prop];this.clone_el.style.display="none",this.el.parentElement.insertBefore(this.clone_el,this.el)}},FixedWidget.prototype.store_style=function(style){this.init_style.position=style.position,this.init_style.marginTop=style.marginTop,this.init_style.marginBottom=style.marginBottom,this.init_style.width=style.width,this.init_style.height=style.height},FixedWidget.prototype.restore_style=function(style){this.is_pinned&&(this.is_pinned=!1,style.position=this.init_style.position,this.clone_el&&(this.clone_el.style.display="none"))},FixedWidget.prototype.on_scroll=function(scroll_top){if(this.el){this.root_offset=this.get_root_offset();var need_to_fix=scroll_top>this.root_offset-this.top_offset,top=0!==this.max_top_offset&&scroll_top>this.relative_top?this.relative_top-scroll_top+this.top_offset:this.top_offset;need_to_fix?this.fix(top):this.restore_style(this.el.style)}},FixedWidget.prototype.fix=function(top){this.el&&(this.el.style.top="".concat(top,"px"),this.is_pinned||(this.is_pinned=!0,this.el.style.position="fixed",this.el.style.transition="transform 0.5s",this.el.style.width=this.init_style.width,this.el.style.height=this.init_style.height,this.clone_el&&(this.clone_el.style.display="block")))},FixedWidget.new=function(selector){return new FixedWidget(document.querySelector(selector))},FixedWidget.is=function(selector){var el=document.querySelector(selector);return!!el&&el.classList.contains(FixedWidgetClassName)},FixedWidget}(PositionWidget),StickyWidget=function(_super){function StickyWidget(el){var _this=_super.call(this,el)||this;return _this.margins=0,_this.need_to_calc_el_offset=function(el){return el.classList.contains(FixedWidgetClassName)},_this.el&&_this.el.parentElement?(_this.el.classList.add(FixedWidgetClassName),_this):_this}return __extends(StickyWidget,_super),StickyWidget.prototype.mount=function(margins){_super.prototype.mount.call(this,margins),this.el&&this.el.parentElement&&(this.margins=this.el.parentElement.clientHeight-this.borderBox,this.el.style.position="sticky",this.el.style.position="-webkit-sticky",this.el.style.transition="transform 0s",this.el.style.boxSizing="border-box",this.el.style.top="".concat(this.top_offset,"px"))},StickyWidget.prototype.setMaxOffset=function(max_top_offset){this.el&&this.el.parentElement&&(max_top_offset<this.el.offsetTop||(this.max_top_offset=max_top_offset))},StickyWidget.prototype.on_scroll=function(){if(this.el&&this.el.parentElement){var bottom_margin=this.max_top_offset?Math.min(this.max_top_offset-this.el.offsetTop-this.borderBox,this.margins-this.el.offsetTop):this.margins-this.el.offsetTop;bottom_margin>=this.bottom_offset?this.el.style.transform="translateY(0px)":this.el.style.transform="translateY(".concat(bottom_margin-this.bottom_offset,"px)")}},StickyWidget.new=function(selector){return new StickyWidget(document.querySelector(selector))},StickyWidget.is=function(selector){var el=document.querySelector(selector);return!!el&&el.classList.contains(FixedWidgetClassName)},StickyWidget}(PositionWidget),StopWidget=function(_super){function StopWidget(el){var _this=_super.call(this,el)||this;return _this.need_to_calc_el_offset=function(){return!0},_this.el&&_this.el.parentElement?(_this.el.classList.add(StopWidgetClassName),_this):_this}return __extends(StopWidget,_super),StopWidget.prototype.mount=function(user_margins){var _this=this;_super.prototype.mount.call(this,user_margins),reactive((function(){return Math.round(scrollY+(_this.el?_this.el.getBoundingClientRect().top:0))})).on_change((function(root_offset){_this.root_offset=root_offset}))},StopWidget.new=function(selector){return new StopWidget(document.querySelector(selector))},StopWidget.is=function(selector){var el=document.querySelector(selector);return!!el&&el.classList.contains(StopWidgetClassName)},StopWidget.from=function(root){return _super.from.call(this,root,StopWidgetClassName)},StopWidget}(Widget),Sidebar=function(){function Sidebar(el,margins,use_sticky_position){var _this=this;void 0===use_sticky_position&&(use_sticky_position=!0),this.el=el,this.margins=margins,this.widgets=[],this.stop_widgets=[],this.isSticky=!0,this.setWidgetsMaxOffset=function(max_offset){for(var _i=0,_a=_this.widgets;_i<_a.length;_i++){_a[_i].setMaxOffset(max_offset)}};var isDeprecatedFloatMarkup=!!findWithProperty(this.el,(function(style){return"none"!==style.float}));isDeprecatedFloatMarkup&&console.log("Fixed Widget: fallback to position sticky"),this.isSticky=!isDeprecatedFloatMarkup&&use_sticky_position;var WidgetContructor=this.isSticky?StickyWidget:FixedWidget;this.stop_widgets=StopWidget.from(this.el),this.widgets=WidgetContructor.from(this.el),this.isSticky&&(this.el.style.position="relative",0===this.stop_widgets.length&&(this.el.style.minHeight="100%"))}return Sidebar.prototype.mount=function(){var _this=this;this.stop_widgets.forEach((function(widget){widget.mount()})),this.widgets.forEach((function(widget){widget.mount(_this.margins)}))},Sidebar.prototype.setMaxOffset=function(common_stop_widgets){var _this=this,stop_widgets=0!=this.stop_widgets.length?this.stop_widgets:common_stop_widgets;if(0!==stop_widgets.length){var max_top_offset=reactive((function(){for(var min_offset=_this.isSticky?stop_widgets[0].top_offset:stop_widgets[0].root_offset,_i=0,stop_widgets_1=stop_widgets;_i<stop_widgets_1.length;_i++){var widget=stop_widgets_1[_i],offset=_this.isSticky?widget.top_offset:widget.root_offset;min_offset>offset&&(min_offset=offset)}return Math.round(min_offset)}));max_top_offset.on_change(this.setWidgetsMaxOffset),this.setWidgetsMaxOffset(max_top_offset.val)}},Sidebar.prototype.render=function(){for(var _i=0,_a=this.stop_widgets;_i<_a.length;_i++){_a[_i].render()}for(var _b=0,_c=this.widgets;_b<_c.length;_b++){_c[_b].render()}},Sidebar}(),Sidebars=function(){function Sidebars(elements,options){var _this=this;this.data=[],this.render=function(){for(var _i=0,_a=_this.data;_i<_a.length;_i++){_a[_i].render()}};var use_sticky_position=void 0===options.use_sticky_position||options.use_sticky_position;this.data=Array.from(new Set(elements.map((function(widget){return widget.parentElement})))).filter((function(sidebar_el){return null!==sidebar_el})).map((function(sidebar_el){return new Sidebar(sidebar_el,options,use_sticky_position)}))}return Sidebars.prototype.mount=function(){this.data.forEach((function(sidebar){sidebar.mount()})),this.setMaxOffset()},Sidebars.prototype.setMaxOffset=function(){for(var general_stop_widgets=this.getGeneralStopElements(),_i=0,_a=this.data;_i<_a.length;_i++){_a[_i].setMaxOffset(general_stop_widgets)}},Sidebars.prototype.getGeneralStopElements=function(){return this.data.filter((function(sidebar){return!sidebar.isSticky||0===sidebar.widgets.length})).map((function(sidebar){return sidebar.stop_widgets})).reduce((function(all,widgets){return all.concat(widgets)}),[])},Sidebars.new=function(options){var s,arr1,arr2,fixedWidgetsContainers=Array.from(new Set(Widget.queryAllWidgetsContainers(FixedWidgetClassName).concat(queryElements(compatabilty_FW_v5(options.widgets))))),stopWidgetsSelectors=compatabilty_FW_v5((void 0===(s=options.stop_elements_selectors||options.stop_id)&&(s=""),s.replace(/[\r\n]|[\r]/gi,"\n").split("\n").map((function(s){return s.trim()})).filter((function(s){return""!==s})))),stopWidgetsContainers=Array.from(new Set(Widget.queryAllWidgetsContainers(StopWidgetClassName).concat(queryElements(stopWidgetsSelectors)))),_a=(arr1=fixedWidgetsContainers,[(arr2=stopWidgetsContainers).filter((function(e){return!arr1.includes(e)})),arr1.filter((function(e){return arr2.includes(e)}))]),stopWidgetsUniqContainers=_a[0];return _a[1].forEach((function(w){console.error("The Widget is detected as fixed block and stop block!\n".concat(w.innerHTML))})),fixedWidgetsContainers.forEach((function(c){c.classList.add(FixedWidgetClassName)})),stopWidgetsUniqContainers.forEach((function(c){c.classList.add(StopWidgetClassName)})),new Sidebars(fixedWidgetsContainers.concat(stopWidgetsUniqContainers),options)},Sidebars}();function onDocumentLoaded(){var admin_panel=document.querySelector("#wpadminbar"),options=(window.q2w3_sidebar_options||[{}]).map((function(option){return option.margin_top=(option.margin_top||0)+(admin_panel&&admin_panel.clientHeight||0),option}));options.some((function(option){return window.innerWidth<option.screen_max_width||window.innerHeight<option.screen_max_height}))||function(options){void 0===options&&(options=[]),sidebars?sidebars.render():(sidebars=Sidebars.new(options.reduce((function(prev,cur){return __assign(__assign(__assign({},prev),cur),{widgets:prev.widgets.concat(cur.widgets||[])})}),{widgets:[]})),document.addEventListener("scroll",sidebars.render),sidebars.mount())}(options)}window.addEventListener("load",onDocumentLoaded),"complete"===document.readyState&&onDocumentLoaded(),onDocumentLoaded();
1
+ "use strict";var extendStatics=function(d,b){return extendStatics=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(d,b){d.__proto__=b}||function(d,b){for(var p in b)Object.prototype.hasOwnProperty.call(b,p)&&(d[p]=b[p])},extendStatics(d,b)};function __extends(d,b){if("function"!=typeof b&&null!==b)throw new TypeError("Class extends value "+String(b)+" is not a constructor or null");function __(){this.constructor=d}extendStatics(d,b),d.prototype=null===b?Object.create(b):(__.prototype=b.prototype,new __)}var __assign=function(){return __assign=Object.assign||function(t){for(var s,i=1,n=arguments.length;i<n;i++)for(var p in s=arguments[i])Object.prototype.hasOwnProperty.call(s,p)&&(t[p]=s[p]);return t},__assign.apply(this,arguments)},StopWidgetClassName="FixedWidget__stop_widget",FixedWidgetClassName="FixedWidget__fixed_widget",Widget=function(){function Widget(el){this.el=el,this.top_offset=0,this.root_offset=0,this.need_to_calc_el_offset=function(_){return!1},this.prevSibling=function(el){return el&&el.previousElementSibling}}return Widget.prototype.render=function(){},Widget.prototype.mount=function(user_margins){void 0===user_margins&&(user_margins={}),this.el&&this.el.parentElement&&(this.top_offset=this.get_total_top_offset(user_margins),this.root_offset=scrollY+this.el.getBoundingClientRect().y)},Widget.prototype.getElement=function(){return this.el},Widget.prototype.toString=function(){var _a;return"".concat(null===(_a=this.el)||void 0===_a?void 0:_a.innerHTML)},Widget.prototype.get_total_top_offset=function(margins){return get_sibilings_offset(this.prevSibling,this.need_to_calc_el_offset,this.prevSibling(this.el),margins.margin_top)},Widget.queryAllWidgetsContainers=function(className){return[].concat(Array.from(document.querySelectorAll(".".concat(className))),Array.from(document.querySelectorAll("[data-fixed_widget=".concat(className)))).map((function(el){el.classList.remove(className),el.removeAttribute("data-fixed_widget");var container=getWidgetContainer(el);return container.classList.remove(FixedWidgetClassName),container.classList.remove(StopWidgetClassName),container}))},Widget.from=function(root,className){var _this=this,elements=[];try{elements=Array.from(root.querySelectorAll(":scope > .".concat(className)))}catch(_e){elements=Array.from(root.children).filter((function(e){return e.classList.contains(className)}))}return elements.filter((function(el){return null!==el})).map((function(e){return new _this(e)}))},Widget}(),getWidgetContainer=function(el){return el.parentElement&&(1===el.parentElement.childElementCount||el.parentElement.classList.toString().includes("wp-block-group")||el.parentElement.classList.toString().includes("wp-block-column")||el.parentElement.classList.contains("widget"))?getWidgetContainer(el.parentElement):el},get_sibilings_offset=function(next,need_to_calc_el_offset,el,offset){if(void 0===offset&&(offset=0),!el)return offset;if(!need_to_calc_el_offset(el))return get_sibilings_offset(next,need_to_calc_el_offset,next(el),offset);var _a=getComputedStyle(el),marginTop=_a.marginTop,marginBottom=_a.marginBottom;return get_sibilings_offset(next,need_to_calc_el_offset,next(el),offset+el.getBoundingClientRect().height+parseInt(marginTop||"0")+parseInt(marginBottom||"0"))},compatabilty_FW_v5=function(selectors){return void 0===selectors&&(selectors=[]),selectors.some((function(s){return!/^[a-z]/i.test(s)}))?selectors:selectors.concat(selectors.map((function(s){return"#".concat(s)})))},queryElements=function(selectors){return void 0===selectors&&(selectors=[]),Array.from(selectors.map((function(selector){return Array.from(document.querySelectorAll(selector))}))).reduce((function(all,elements){return all.concat(elements)}),[]).filter((function(e){return e instanceof HTMLElement}))};function findWithProperty(el,predicate){return el&&el!==document.body?predicate(getComputedStyle(el))?el:findWithProperty(el.parentElement,predicate):null}var sidebars,reactive=function(getter,interval){void 0===interval&&(interval=300);var subs=[],v=getter();return setInterval((function(){if(0===subs.length)return;var new_v=getter();if(v===new_v)return;v=new_v;for(var _i=0,subs_1=subs;_i<subs_1.length;_i++){(0,subs_1[_i])(new_v)}}),interval),{get val(){return v},on_change:function(update){update(v),subs.push(update)}}},PositionWidget=function(_super){function PositionWidget(){var _this=null!==_super&&_super.apply(this,arguments)||this;return _this.bottom_offset=0,_this.top_margin=0,_this.borderBox=0,_this.block_height=reactive((function(){return 0})),_this.max_top_offset=0,_this.bottom_margin=0,_this.user_margins={},_this.prevSibling=function(el){return el&&!el.classList.contains(StopWidgetClassName)&&el.previousElementSibling||null},_this.get_total_bottom_offset=function(margins){var next=function(el){return el&&!el.classList.contains(StopWidgetClassName)?el.nextElementSibling:null};return get_sibilings_offset(next,_this.need_to_calc_el_offset,next(_this.el),margins.margin_bottom)},_this}return __extends(PositionWidget,_super),PositionWidget.prototype.mount=function(user_margins){var _this=this;if(_super.prototype.mount.call(this,user_margins),this.el&&this.el.parentElement){this.user_margins=user_margins;var _a=getComputedStyle(this.el),marginTop=_a.marginTop,marginBottom=_a.marginBottom;this.bottom_margin=parseInt(marginBottom),this.top_margin=parseInt(marginTop),this.bottom_offset=this.get_total_bottom_offset(user_margins),this.max_top_offset=document.body.clientHeight,this.block_height=reactive((function(){return _this.el?Math.round(Math.max(_this.el.clientHeight,_this.el.scrollHeight,_this.el.getBoundingClientRect().height)):0})),this.block_height.on_change((function(block_height){_this.borderBox=block_height+_this.top_margin+_this.bottom_margin})),reactive(this.get_total_bottom_offset.bind(this,user_margins)).on_change((function(bottom_offset){_this.bottom_offset=bottom_offset})),reactive(this.get_total_top_offset.bind(this,user_margins)).on_change((function(top_offset){_this.top_offset=top_offset,_this.el&&(_this.el.style.top="".concat(top_offset,"px"))}))}},PositionWidget.prototype.setMaxOffset=function(max_top_offset){this.max_top_offset=max_top_offset},PositionWidget.prototype.render=function(){this.on_scroll(scrollY)},PositionWidget.from=function(root){return _super.from.call(this,root,FixedWidgetClassName)},PositionWidget.prototype.on_scroll=function(_scroll_top){},PositionWidget}(Widget),FixedWidget=function(_super){function FixedWidget(el){var _this=_super.call(this,el)||this;return _this.is_pinned=!1,_this.relative_top=0,_this.paddings=0,_this.init_style={position:"static",marginTop:"",marginBottom:"",width:"",height:""},_this.need_to_calc_el_offset=function(el){return el.classList.contains(FixedWidgetClassName)},_this.el&&_this.el.parentElement?(_this.el.classList.add(FixedWidgetClassName),_this):_this}return __extends(FixedWidget,_super),FixedWidget.prototype.mount=function(margins){var _this=this;_super.prototype.mount.call(this,margins),this.el&&(this.paddings=this.top_offset+this.top_margin+this.bottom_margin+this.bottom_offset,this.store_style(getComputedStyle(this.el)),this.clone(),this.block_height.on_change((function(block_height){_this.relative_top=_this.max_top_offset-block_height-_this.paddings,_this.init_style.height="".concat(block_height,"px")})))},FixedWidget.prototype.update_root_offset=function(){var element=this.is_pinned?this.clone_el:this.el,new_root_offset=Math.round(scrollY+(element?element.getBoundingClientRect().top:0));this.root_offset=Math.max(this.root_offset,new_root_offset)},FixedWidget.prototype.setMaxOffset=function(max_top_offset){0===max_top_offset||max_top_offset<this.root_offset||this.max_top_offset===max_top_offset||(this.max_top_offset=max_top_offset,this.relative_top=this.max_top_offset-this.block_height.val-this.paddings)},FixedWidget.prototype.clone=function(){var _this=this;if(this.el&&this.el.parentElement){for(var prop in this.clone_el=this.el.cloneNode(!1),this.clone_el.getAttributeNames().forEach((function(attr){_this.clone_el.removeAttribute(attr)})),this.init_style)this.clone_el.style[prop]=this.init_style[prop];this.clone_el.style.display="none",this.el.parentElement.insertBefore(this.clone_el,this.el)}},FixedWidget.prototype.store_style=function(style){this.init_style.position=style.position,this.init_style.marginTop=style.marginTop,this.init_style.marginBottom=style.marginBottom,this.init_style.width=style.width,this.init_style.height=style.height},FixedWidget.prototype.restore_style=function(style){this.is_pinned&&(this.is_pinned=!1,style.position=this.init_style.position,this.clone_el&&(this.clone_el.style.display="none"))},FixedWidget.prototype.on_scroll=function(scroll_top){if(this.el){this.update_root_offset();var need_to_fix=scroll_top>this.root_offset-this.top_offset,top=0!==this.max_top_offset&&scroll_top>this.relative_top?this.relative_top-scroll_top+this.top_offset:this.top_offset;need_to_fix?this.fix(top):this.restore_style(this.el.style)}},FixedWidget.prototype.fix=function(top){this.el&&(this.el.style.top="".concat(top,"px"),this.is_pinned||(this.is_pinned=!0,this.el.style.position="fixed",this.el.style.transition="transform 0.5s",this.el.style.width=this.init_style.width,this.el.style.height=this.init_style.height,this.clone_el&&(this.clone_el.style.display="block")))},FixedWidget.new=function(selector){return new FixedWidget(document.querySelector(selector))},FixedWidget.is=function(selector){var el=document.querySelector(selector);return!!el&&el.classList.contains(FixedWidgetClassName)},FixedWidget}(PositionWidget),StickyWidget=function(_super){function StickyWidget(el){var _this=_super.call(this,el)||this;return _this.margins=0,_this.get_margins=function(){return(_this.el&&_this.el.parentElement&&_this.el.parentElement.clientHeight||0)-_this.bottom_margin-_this.top_margin-_this.block_height.val},_this.need_to_calc_el_offset=function(el){return el.classList.contains(FixedWidgetClassName)},_this.el&&_this.el.parentElement?(_this.el.classList.add(FixedWidgetClassName),_this):_this}return __extends(StickyWidget,_super),StickyWidget.prototype.mount=function(margins){var _this=this;_super.prototype.mount.call(this,margins),this.el&&this.el.parentElement&&(reactive(this.get_margins).on_change((function(margins){_this.margins=margins})),this.el.style.position="sticky",this.el.style.position="-webkit-sticky",this.el.style.transition="transform 0s",this.el.style.boxSizing="border-box")},StickyWidget.prototype.setMaxOffset=function(max_top_offset){this.el&&this.el.parentElement&&(max_top_offset<this.el.offsetTop||(this.max_top_offset=max_top_offset))},StickyWidget.prototype.on_scroll=function(){if(this.el&&this.el.parentElement){var bottom_margin=this.max_top_offset?Math.min(this.max_top_offset-this.el.offsetTop-this.borderBox,this.margins-this.el.offsetTop):this.margins-this.el.offsetTop;this.el.style.top="".concat(this.top_offset,"px"),bottom_margin>=this.bottom_offset?this.el.style.transform="translateY(0px)":this.el.style.transform="translateY(".concat(bottom_margin-this.bottom_offset,"px)")}},StickyWidget.new=function(selector){return new StickyWidget(document.querySelector(selector))},StickyWidget.is=function(selector){var el=document.querySelector(selector);return!!el&&el.classList.contains(FixedWidgetClassName)},StickyWidget}(PositionWidget),StopWidget=function(_super){function StopWidget(el){var _this=_super.call(this,el)||this;return _this.need_to_calc_el_offset=function(){return!0},_this.el&&_this.el.parentElement?(_this.el.classList.add(StopWidgetClassName),_this):_this}return __extends(StopWidget,_super),StopWidget.prototype.mount=function(user_margins){var _this=this;_super.prototype.mount.call(this,user_margins),reactive((function(){return Math.round(scrollY+(_this.el?_this.el.getBoundingClientRect().top:0))})).on_change((function(root_offset){_this.root_offset=root_offset}))},StopWidget.new=function(selector){return new StopWidget(document.querySelector(selector))},StopWidget.is=function(selector){var el=document.querySelector(selector);return!!el&&el.classList.contains(StopWidgetClassName)},StopWidget.from=function(root){return _super.from.call(this,root,StopWidgetClassName)},StopWidget}(Widget),Sidebar=function(){function Sidebar(el,margins,use_sticky_position){var _this=this;void 0===use_sticky_position&&(use_sticky_position=!1),this.el=el,this.margins=margins,this.widgets=[],this.stop_widgets=[],this.isSticky=!1,this.setWidgetsMaxOffset=function(max_offset){for(var _i=0,_a=_this.widgets;_i<_a.length;_i++){_a[_i].setMaxOffset(max_offset)}};var isDeprecatedFloatMarkup=!!findWithProperty(this.el,(function(style){return"none"!==style.float})),isOverflowHiddenMarkup=!!findWithProperty(this.el,(function(style){return"hidden"===style.overflow}));(isDeprecatedFloatMarkup||isOverflowHiddenMarkup)&&use_sticky_position&&console.log("Fixed Widget: fallback to position sticky"),this.isSticky=!isDeprecatedFloatMarkup&&!isOverflowHiddenMarkup&&use_sticky_position;var WidgetContructor=this.isSticky?StickyWidget:FixedWidget;this.stop_widgets=StopWidget.from(this.el),this.widgets=WidgetContructor.from(this.el),this.isSticky&&(this.el.style.position="relative",0===this.stop_widgets.length&&(this.el.style.minHeight="100%"))}return Sidebar.prototype.mount=function(){var _this=this;this.stop_widgets.forEach((function(widget){widget.mount()})),this.widgets.forEach((function(widget){widget.mount(_this.margins)}))},Sidebar.prototype.setMaxOffset=function(general_stop_widgets){var is_local_stop_widgets=0!=this.stop_widgets.length,use_top_offset=this.isSticky&&is_local_stop_widgets,stop_widgets=is_local_stop_widgets?this.stop_widgets:general_stop_widgets;if(0!==stop_widgets.length){var max_top_offset=reactive((function(){for(var min_offset=use_top_offset?stop_widgets[0].top_offset:stop_widgets[0].root_offset,_i=0,stop_widgets_1=stop_widgets;_i<stop_widgets_1.length;_i++){var widget=stop_widgets_1[_i],offset=use_top_offset?widget.top_offset:widget.root_offset;min_offset>offset&&(min_offset=offset)}return Math.round(min_offset)}));max_top_offset.on_change(this.setWidgetsMaxOffset),this.setWidgetsMaxOffset(max_top_offset.val)}},Sidebar.prototype.render=function(){for(var _i=0,_a=this.stop_widgets;_i<_a.length;_i++){_a[_i].render()}for(var _b=0,_c=this.widgets;_b<_c.length;_b++){_c[_b].render()}},Sidebar}(),Sidebars=function(){function Sidebars(elements,options){var _this=this;this.data=[],this.render=function(){for(var _i=0,_a=_this.data;_i<_a.length;_i++){_a[_i].render()}},this.data=Array.from(new Set(elements.map((function(widget){return widget.parentElement})))).filter((function(sidebar_el){return null!==sidebar_el})).map((function(sidebar_el){return new Sidebar(sidebar_el,options,options.use_sticky_position)}))}return Sidebars.prototype.mount=function(){this.data.forEach((function(sidebar){sidebar.mount()})),this.setMaxOffset()},Sidebars.prototype.setMaxOffset=function(){for(var general_stop_widgets=this.getGeneralStopElements(),_i=0,_a=this.data;_i<_a.length;_i++){_a[_i].setMaxOffset(general_stop_widgets)}},Sidebars.prototype.getGeneralStopElements=function(){return this.data.filter((function(sidebar){return!sidebar.isSticky||0===sidebar.widgets.length})).map((function(sidebar){return sidebar.stop_widgets})).reduce((function(all,widgets){return all.concat(widgets)}),[])},Sidebars.new=function(options){var s,arr1,arr2,fixedWidgetsContainers=Array.from(new Set(Widget.queryAllWidgetsContainers(FixedWidgetClassName).concat(queryElements(compatabilty_FW_v5(options.widgets))))),stopWidgetsSelectors=compatabilty_FW_v5((void 0===(s=options.stop_elements_selectors||options.stop_id)&&(s=""),s.replace(/[\r\n]|[\r]/gi,"\n").split("\n").map((function(s){return s.trim()})).filter((function(s){return""!==s})))),stopWidgetsContainers=Array.from(new Set(Widget.queryAllWidgetsContainers(StopWidgetClassName).concat(queryElements(stopWidgetsSelectors)))),_a=(arr1=fixedWidgetsContainers,[(arr2=stopWidgetsContainers).filter((function(e){return!arr1.includes(e)})),arr1.filter((function(e){return arr2.includes(e)}))]),stopWidgetsUniqContainers=_a[0];return _a[1].forEach((function(w){console.error("The Widget is detected as fixed block and stop block!\n".concat(w.innerHTML))})),fixedWidgetsContainers.forEach((function(c){c.classList.add(FixedWidgetClassName)})),stopWidgetsUniqContainers.forEach((function(c){c.classList.add(StopWidgetClassName)})),new Sidebars(fixedWidgetsContainers.concat(stopWidgetsUniqContainers),options)},Sidebars}();function onDocumentLoaded(){var admin_panel=document.querySelector("#wpadminbar"),options=(window.q2w3_sidebar_options||[{}]).map((function(option){return option.margin_top=(option.margin_top||0)+(admin_panel&&admin_panel.clientHeight||0),option}));options.some((function(option){return window.innerWidth<option.screen_max_width||window.innerHeight<option.screen_max_height}))||function(options){void 0===options&&(options=[]),sidebars?sidebars.render():(sidebars=Sidebars.new(options.reduce((function(prev,cur){return __assign(__assign(__assign({},prev),cur),{widgets:prev.widgets.concat(cur.widgets||[])})}),{widgets:[]})),document.addEventListener("scroll",sidebars.render),sidebars.mount())}(options)}window.addEventListener("load",onDocumentLoaded),"complete"===document.readyState&&onDocumentLoaded(),onDocumentLoaded();
 
 
 
 
 
 
 
 
 
 
 
 
 
 
q2w3-fixed-widget.php CHANGED
@@ -5,7 +5,7 @@ Plugin URI: https://wpadvancedads.com/fixed-widget-wordpress/
5
  Description: Use the fixed widget plugin to create sticky widgets that stay in the visible screen area when the page is scrolled up or down and boost your conversions.
6
  Text Domain: q2w3-fixed-widget
7
  Author: Thomas Maier, Max Bond
8
- Version: 6.0.4
9
  Author URI: https://wpadvancedads.com/fixed-widget-wordpress/
10
  */
11
 
@@ -23,7 +23,7 @@ class q2w3_fixed_widget {
23
 
24
  const ID = 'q2w3_fixed_widget';
25
 
26
- const VERSION = '6.0.4';
27
 
28
  protected static $sidebars_widgets;
29
 
5
  Description: Use the fixed widget plugin to create sticky widgets that stay in the visible screen area when the page is scrolled up or down and boost your conversions.
6
  Text Domain: q2w3-fixed-widget
7
  Author: Thomas Maier, Max Bond
8
+ Version: 6.0.5
9
  Author URI: https://wpadvancedads.com/fixed-widget-wordpress/
10
  */
11
 
23
 
24
  const ID = 'q2w3_fixed_widget';
25
 
26
+ const VERSION = '6.0.5';
27
 
28
  protected static $sidebars_widgets;
29
 
readme.txt CHANGED
@@ -3,7 +3,7 @@ Contributors: webzunft, max-bond, advancedads
3
  Tags: fixed widget, sticky widget, sidebar, ads, widget, fixed, sticky, floating, sticky block, adsense
4
  Requires at least: 5.0
5
  Tested up to: 5.9
6
- Stable tag: 6.0.4
7
 
8
  More attention and a higher ad performance with fixed sticky widgets.
9
 
@@ -91,6 +91,10 @@ Use the options `Minimum Screen Width` and `Minimum Screen Height` to disable st
91
 
92
  == Changelog ==
93
 
 
 
 
 
94
  = 6.0.4 =
95
 
96
  - Fix: Prevent fixed widgets overlapping non-fixed elements in certain themes
3
  Tags: fixed widget, sticky widget, sidebar, ads, widget, fixed, sticky, floating, sticky block, adsense
4
  Requires at least: 5.0
5
  Tested up to: 5.9
6
+ Stable tag: 6.0.5
7
 
8
  More attention and a higher ad performance with fixed sticky widgets.
9
 
91
 
92
  == Changelog ==
93
 
94
+ = 6.0.5 =
95
+
96
+ - Fix: Prevent overlapping of fixed widgets with non-fixed widgets when scrolling up
97
+
98
  = 6.0.4 =
99
 
100
  - Fix: Prevent fixed widgets overlapping non-fixed elements in certain themes