Update
This commit is contained in:
@@ -1,225 +0,0 @@
|
||||
/**
|
||||
* Chart Pies wrapper.
|
||||
*
|
||||
* @author Htmlstream
|
||||
* @version 1.0
|
||||
* @requires appear.js (v1.0.3), circles.js (v0.0.6)
|
||||
*
|
||||
*/
|
||||
;
|
||||
(function ($) {
|
||||
'use strict';
|
||||
|
||||
$.HSCore.components.HSChartPie = {
|
||||
|
||||
/**
|
||||
*
|
||||
*
|
||||
* @var Object _baseConfig
|
||||
*/
|
||||
_baseConfig: {
|
||||
bounds: -100,
|
||||
debounce: 10,
|
||||
rtl: false,
|
||||
wrpClass: 'circles-wrp',
|
||||
textClass: 'circles-text',
|
||||
valueStrokeClass: 'circles-valueStroke',
|
||||
maxValueStrokeClass: 'circles-maxValueStroke',
|
||||
styleWrapper: true,
|
||||
styleText: true
|
||||
},
|
||||
|
||||
/**
|
||||
*
|
||||
*
|
||||
* @var jQuery pageCollection
|
||||
*/
|
||||
pageCollection: $(),
|
||||
|
||||
/**
|
||||
*
|
||||
*
|
||||
* @var
|
||||
*/
|
||||
appearCollectionIds: [],
|
||||
|
||||
/**
|
||||
* Initialization of ChartPie wrapper.
|
||||
*
|
||||
* @param String selector (optional)
|
||||
* @param Object config (optional)
|
||||
*
|
||||
* @return jQuery pageCollection - collection of initialized items.
|
||||
*/
|
||||
init: function (selector, config) {
|
||||
|
||||
this.collection = selector && $(selector).length ? $(selector) : $();
|
||||
if (!$(selector).length) return;
|
||||
|
||||
this.config = config && $.isPlainObject(config) ?
|
||||
$.extend({}, this._baseConfig, config) : this._baseConfig;
|
||||
|
||||
this.config.itemSelector = selector;
|
||||
|
||||
this.initCircles();
|
||||
|
||||
return this.pageCollection;
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* Initialization of each Circle of the page.
|
||||
*
|
||||
* @return undefined
|
||||
*/
|
||||
initCircles: function () {
|
||||
|
||||
var lastItem = this.pageCollection.last(),
|
||||
lastId = 0,
|
||||
self = this;
|
||||
|
||||
|
||||
if (lastItem.length) {
|
||||
lastId = +lastItem.attr('id').substring(lastItem.attr('id').lastIndexOf('-') + 1);
|
||||
}
|
||||
|
||||
this.collection.each(function (i, el) {
|
||||
|
||||
var $this = $(el),
|
||||
id = 'hs-pie-' + (lastId + (i + 1)),
|
||||
value = 0;
|
||||
|
||||
$this.attr('id', id);
|
||||
|
||||
if (!$this.data('circles-scroll-animate')) {
|
||||
value = $this.data('circles-value') || 0;
|
||||
} else {
|
||||
$this.data('reminded-value', $this.data('circles-value') || 0);
|
||||
self.appearCollectionIds.push('#' + id);
|
||||
}
|
||||
|
||||
var circle = Circles.create({
|
||||
id: id,
|
||||
radius: $this.data('circles-radius') || 80,
|
||||
value: value,
|
||||
maxValue: $this.data('circles-max-value') || 100,
|
||||
width: $this.data('circles-stroke-width') || 10,
|
||||
text: function (value) {
|
||||
if ($this.data('circles-type') == 'iconic') {
|
||||
return $this.data('circles-icon');
|
||||
} else {
|
||||
return value + ($this.data('circles-additional-text') || '');
|
||||
}
|
||||
},
|
||||
colors: [$this.data('circles-bg-color') || '#72c02c', $this.data('circles-fg-color') || '#eeeeee'],
|
||||
duration: $this.data('circles-duration') || 1000,
|
||||
wrpClass: self.config['wrpClass'],
|
||||
textClass: self.config['textClass'],
|
||||
valueStrokeClass: self.config['valueStrokeClass'],
|
||||
maxValueStrokeClass: self.config['maxValueStrokeClass'],
|
||||
styleWrapper: self.config['styleWrapper'],
|
||||
styleText: self.config['styleText']
|
||||
});
|
||||
|
||||
$this.data('circle', circle);
|
||||
|
||||
$this.find('.' + self.config['textClass']).css({
|
||||
'font-size': $this.data('circles-font-size'),
|
||||
'font-weight': $this.data('circles-font-weight'),
|
||||
'color': $this.data('circles-color')
|
||||
});
|
||||
|
||||
|
||||
if (self.config['rtl']) {
|
||||
$this.find('svg').css('transform', 'matrix(-1, 0, 0, 1, 0, 0)');
|
||||
}
|
||||
|
||||
self.pageCollection = self.pageCollection.add($this);
|
||||
|
||||
});
|
||||
|
||||
if (self.appearCollectionIds.length) self._initAppear();
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* Updates value of the chart pie when an item has appeared in the visible region.
|
||||
*
|
||||
* @return undefined
|
||||
*/
|
||||
_initAppear: function () {
|
||||
|
||||
var self = this;
|
||||
|
||||
appear({
|
||||
bounds: self.config['bounds'],
|
||||
debounce: self.config['debounce'],
|
||||
elements: function () {
|
||||
return document.querySelectorAll(self.appearCollectionIds.join(','));
|
||||
},
|
||||
appear: function (element) {
|
||||
|
||||
element = $(element);
|
||||
|
||||
element.data('circle').update(element.data('reminded-value'));
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* Returns item by index or entire collection in case when index has not been passed.
|
||||
*
|
||||
* @param Number index
|
||||
*
|
||||
* @return jQuery
|
||||
*/
|
||||
get: function (index) {
|
||||
if (index && $.isNumeric(index)) return this.pageCollection.eq(index);
|
||||
|
||||
return this.pageCollection;
|
||||
},
|
||||
|
||||
/**
|
||||
* Returns item by id.
|
||||
*
|
||||
* @param String id
|
||||
*
|
||||
* @return circle
|
||||
*/
|
||||
getById: function (id) {
|
||||
if (id && this.pageCollection.filter('#' + id).length) return this.pageCollection.filter('#' + id);
|
||||
|
||||
return null;
|
||||
},
|
||||
|
||||
/**
|
||||
* Returns object of circle class (for the access to circle API) by index.
|
||||
*
|
||||
* @param Number index
|
||||
*
|
||||
* @return circle
|
||||
*/
|
||||
getCircleAPI: function (index) {
|
||||
if (index && $.isNumeric(index) && this.pageCollection.eq(index).length) return this.pageCollection.eq(index).data('circle');
|
||||
|
||||
return null;
|
||||
},
|
||||
|
||||
/**
|
||||
* Returns object of circle class (for the access to circle API) by id.
|
||||
*
|
||||
* @param String id
|
||||
*
|
||||
* @return circle
|
||||
*/
|
||||
getCircleAPIById: function (id) {
|
||||
if (id && this.pageCollection.filter('#' + id).length) return this.pageCollection.filter('#' + id).data('circle');
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
})(jQuery);
|
||||
@@ -1,353 +0,0 @@
|
||||
/**
|
||||
* Progress Bar wrapper.
|
||||
*
|
||||
* @author Htmlstream
|
||||
* @version 1.0
|
||||
* @requires appear.js (v1.0.3)
|
||||
*
|
||||
*/
|
||||
;(function($){
|
||||
'use strict';
|
||||
|
||||
$.HSCore.components.HSProgressBar = {
|
||||
|
||||
/**
|
||||
*
|
||||
*
|
||||
* @var Object _baseConfig
|
||||
*/
|
||||
_baseConfig : {
|
||||
bounds: -100,
|
||||
debounce: 10,
|
||||
time: 1000,
|
||||
fps: 60,
|
||||
rtl: false,
|
||||
direction: 'horizontal',
|
||||
useProgressElement: false,
|
||||
indicatorSelector: 'progress-bar-indicator',
|
||||
moveElementSelector: false,
|
||||
moveElementTo: 'currentPosition',
|
||||
onChange: function(value){},
|
||||
beforeUpdate: function(){},
|
||||
afterUpdate: function(){},
|
||||
onMoveElementChange: function(value){},
|
||||
beforeMoveElementUpdate: function(){},
|
||||
afterMoveElementUpdate: function(){}
|
||||
},
|
||||
|
||||
/**
|
||||
*
|
||||
*
|
||||
* @var jQuery _pageCollection
|
||||
*/
|
||||
_pageCollection : $(),
|
||||
|
||||
/**
|
||||
* Initialization of Progress Bar wrapper.
|
||||
*
|
||||
* @param String selector (optional)
|
||||
* @param Object config (optional)
|
||||
*
|
||||
* @return jQuery currentCollection - collection of initialized items.
|
||||
*/
|
||||
init: function(selector, config){
|
||||
|
||||
if(!(selector && $(selector).length)) return;
|
||||
|
||||
this.extendHorizontalProgressBar();
|
||||
this.extendVerticalProgressBar();
|
||||
|
||||
return this._initProgressBar(selector, config && $.isPlainObject(config) ? $.extend(true, {}, this._baseConfig, config) : this._baseConfig);
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
*
|
||||
* Initialization of each Progress Bar of the page.
|
||||
*
|
||||
* @return undefined
|
||||
*/
|
||||
_initProgressBar: function(selector, config) {
|
||||
|
||||
var self = this,
|
||||
currentCollection = $();
|
||||
|
||||
appear({
|
||||
|
||||
bounds: config['bounds'],
|
||||
debounce: config['debounce'],
|
||||
|
||||
init: function() {
|
||||
|
||||
$(selector).each(function(i, el) {
|
||||
|
||||
var $this = $(el);
|
||||
|
||||
if(config['direction'] === 'horizontal') {
|
||||
|
||||
$this.data('ProgressBar', new self.HorizontalProgressBar($this, config));
|
||||
|
||||
}
|
||||
else {
|
||||
|
||||
$this.data('ProgressBar', new self.VerticalProgressBar($this, config));
|
||||
|
||||
}
|
||||
|
||||
currentCollection = currentCollection.add($this);
|
||||
self._pageCollection = self._pageCollection.add($this);
|
||||
|
||||
});
|
||||
|
||||
},
|
||||
|
||||
elements: function() {
|
||||
|
||||
return document.querySelectorAll(selector);
|
||||
|
||||
},
|
||||
|
||||
appear: function(el) {
|
||||
|
||||
// console.log( $(el).data('ProgressBar'), $(el).data('value') );
|
||||
|
||||
$(el).data('ProgressBar').update($(el).data('value'));
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
return currentCollection;
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* Constructor Function of Horizontal Progress Bar
|
||||
*
|
||||
* @param jQuery element
|
||||
* @param Object config
|
||||
*
|
||||
*/
|
||||
HorizontalProgressBar: function(element, config) {
|
||||
|
||||
this.element = element;
|
||||
this.indicator = this.element.find( config.indicatorSelector );
|
||||
|
||||
this.config = config;
|
||||
this.moveElement = config['moveElementSelector'] ? element.parent().find(config['moveElementSelector']) : $();
|
||||
|
||||
if(this.moveElement.length) {
|
||||
|
||||
if(config['rtl']) {
|
||||
this.moveElement.css({
|
||||
'left': 'auto',
|
||||
'right': 0,
|
||||
'margin-right': this.moveElement.outerWidth() / -2
|
||||
});
|
||||
}
|
||||
else {
|
||||
this.moveElement.css({
|
||||
'left': 0,
|
||||
'margin-left': this.moveElement.outerWidth() / -2
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
if(this.config.useProgressElement) {
|
||||
this.element.data( 'value', this.element.attr( 'value' ) );
|
||||
this.element.attr('value', 0);
|
||||
}
|
||||
else {
|
||||
this.element.data(
|
||||
'value',
|
||||
this.indicator.length ? Math.round( this.indicator.outerWidth() / this.element.outerWidth() * 100 ) : 0
|
||||
);
|
||||
this.indicator.css('width', '0%');
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* Constructor Function of Vertical Progress Bar
|
||||
*
|
||||
* @param jQuery element
|
||||
* @param Object config
|
||||
*
|
||||
*/
|
||||
VerticalProgressBar: function(element, config) {
|
||||
|
||||
this.element = element;
|
||||
this.config = config;
|
||||
this.indicator = element.find(config['indicatorSelector']);
|
||||
|
||||
if(!this.indicator.length) return;
|
||||
|
||||
element.data('value', parseInt(this.indicator.css('height'), 10) / this.indicator.parent().outerHeight() * 100);
|
||||
this.indicator.css('height', 0);
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* Extends HorizontalProgressBar.
|
||||
*
|
||||
* @return undefined
|
||||
*/
|
||||
extendHorizontalProgressBar: function() {
|
||||
|
||||
/**
|
||||
* Sets new value of the Progress Bar.
|
||||
*
|
||||
* @param Number value
|
||||
*
|
||||
* @return undefined
|
||||
*/
|
||||
this.HorizontalProgressBar.prototype.update = function(value) {
|
||||
|
||||
var self = this;
|
||||
|
||||
if( this.config.useProgressElement ) {
|
||||
|
||||
var fps = (this.config['time'] / this.config['fps']),
|
||||
iterationValue = parseInt(value / fps, 10),
|
||||
counter = 0,
|
||||
self = this;
|
||||
|
||||
if(iterationValue == 0) iterationValue = 1;
|
||||
|
||||
this.config.beforeUpdate.call(this.element);
|
||||
if(this.moveElement.length) this.config.beforeMoveElementUpdate.call(this.moveElement);
|
||||
|
||||
if(self.config.moveElementSelector && self.config['moveElementTo'] == 'end') {
|
||||
|
||||
var mCounter = 0,
|
||||
mIterationValue = parseInt(100 / fps, 10);
|
||||
|
||||
if(mIterationValue == 0) mIterationValue = 1;
|
||||
|
||||
var mCounterId = setInterval(function() {
|
||||
|
||||
self.moveSubElement(mCounter+=mIterationValue);
|
||||
if(self.moveElement.length) self.config.onMoveElementChange.call(self.moveElement, mCounter+=mIterationValue);
|
||||
|
||||
if(mCounter > 100) {
|
||||
clearInterval(mCounterId);
|
||||
self.moveSubElement(100);
|
||||
if(self.moveElement.length) self.config.afterMoveElementUpdate.call(self.moveElement);
|
||||
}
|
||||
|
||||
}, fps);
|
||||
|
||||
}
|
||||
|
||||
this.element.data('intervalId', setInterval(function(){
|
||||
|
||||
var currentValue = counter += iterationValue;
|
||||
|
||||
self.element.attr('value', currentValue);
|
||||
self.config.onChange.call(self.element, currentValue);
|
||||
|
||||
if(self.config.moveElementSelector && self.config['moveElementTo'] == 'currentPosition') self.moveSubElement(currentValue);
|
||||
|
||||
if(counter > value) {
|
||||
|
||||
self.element.attr('value', value);
|
||||
if(self.config.moveElementSelector && self.config['moveElementTo'] == 'currentPosition') self.moveSubElement(value);
|
||||
clearInterval(self.element.data('intervalId'));
|
||||
self.config.afterUpdate.call(self.element);
|
||||
|
||||
}
|
||||
|
||||
}, fps));
|
||||
}
|
||||
else {
|
||||
if( this.indicator.length ) {
|
||||
this.indicator.stop().animate({
|
||||
'width': value + '%'
|
||||
}, {
|
||||
duration: self.config.time,
|
||||
complete: function() {
|
||||
self.config.afterUpdate.call(self.element);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
*
|
||||
*
|
||||
* @param
|
||||
*
|
||||
* @return
|
||||
*/
|
||||
this.HorizontalProgressBar.prototype.moveSubElement = function(value, duration) {
|
||||
|
||||
if(!this.moveElement.length) return;
|
||||
|
||||
var self = this;
|
||||
|
||||
this.moveElement.css(this.config['rtl'] ? 'right' : 'left', value + '%');
|
||||
|
||||
};
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* Extends VerticalProgressBars.
|
||||
*
|
||||
*
|
||||
* @return undefined
|
||||
*/
|
||||
extendVerticalProgressBar: function() {
|
||||
|
||||
/**
|
||||
* Sets new value of the Progress Bar.
|
||||
*
|
||||
* @param Number value
|
||||
*
|
||||
* @return undefined
|
||||
*/
|
||||
this.VerticalProgressBar.prototype.update = function(value) {
|
||||
|
||||
this.indicator.stop().animate({
|
||||
height: value + '%'
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
|
||||
/**
|
||||
* Returns full collection of all initialized progress bars.
|
||||
*
|
||||
*
|
||||
* @return jQuery _pageCollection
|
||||
*/
|
||||
get: function() {
|
||||
|
||||
return this._pageCollection;
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* Returns API of the progress bar by index in collection.
|
||||
*
|
||||
* @param Number index
|
||||
*
|
||||
* @return HorizontalProgressBar | VerticalProgressBar
|
||||
*/
|
||||
getAPI: function(index) {
|
||||
|
||||
if(this._pageCollection.eq(index).length) return this._pageCollection.eq(index).data('ProgressBar');
|
||||
|
||||
return null;
|
||||
|
||||
}
|
||||
|
||||
|
||||
};
|
||||
|
||||
})(jQuery);
|
||||
@@ -1,20 +0,0 @@
|
||||
;(function() {
|
||||
"use strict";
|
||||
|
||||
BX.addCustomEvent("BX.Landing.Block:init", function(event) {
|
||||
var selector = event.makeRelativeSelector(".js-hr-progress-bar");
|
||||
if($(selector).length > 0)
|
||||
{
|
||||
$.HSCore.components.HSProgressBar.init('.js-hr-progress-bar', {
|
||||
direction: 'horizontal',
|
||||
indicatorSelector: '.js-hr-progress-bar-indicator'
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
BX.addCustomEvent("BX.Landing.Block:Node:update", function(event) {
|
||||
// dbg: test update attributes
|
||||
});
|
||||
|
||||
})();
|
||||
@@ -438,6 +438,7 @@
|
||||
'g-bg-primary--hover',
|
||||
'g-rounded-50x',
|
||||
'g-opacity-0_8--hover',
|
||||
'g-color-black--hover',
|
||||
//set old classes, not use now in slider
|
||||
'g-bg-gray-light-v3',
|
||||
];
|
||||
@@ -480,6 +481,10 @@
|
||||
{
|
||||
addClasses = ['g-color-gray-light-v1', 'g-color-primary--hover'];
|
||||
}
|
||||
if (BX.Dom.attr(sliderNode.parentNode, 'data-slider-arrows') === 8)
|
||||
{
|
||||
addClasses = ['g-color-gray-light-v1', 'g-color-black--hover', 'g-bg-white', 'g-bg-white--hover', 'g-rounded-50x'];
|
||||
}
|
||||
|
||||
addClasses.forEach(function(addedClass) {
|
||||
newArrowClassesArr.push(addedClass);
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -1,22 +0,0 @@
|
||||
;(function() {
|
||||
"use strict";
|
||||
|
||||
BX.addCustomEvent("BX.Landing.Block:init", function(event) {
|
||||
var selector = event.makeRelativeSelector(".js-pie");
|
||||
if($(selector).length > 0)
|
||||
{
|
||||
$.HSCore.components.HSChartPie.init('.js-pie');
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
BX.addCustomEvent("BX.Landing.Block:Node:update", function(event) {
|
||||
// var selector = event.makeRelativeSelector(".cbp");
|
||||
//
|
||||
// if($(selector).length > 0)
|
||||
// {
|
||||
// $.HSCore.components.HSCubeportfolio.init('.cbp');
|
||||
// }
|
||||
});
|
||||
|
||||
})();
|
||||
@@ -1,23 +0,0 @@
|
||||
;(function() {
|
||||
"use strict";
|
||||
|
||||
BX.addCustomEvent("BX.Landing.Block:init", function(event) {
|
||||
var selector = event.makeRelativeSelector(".cbp");
|
||||
|
||||
if($(selector).length > 0)
|
||||
{
|
||||
$.HSCore.components.HSCubeportfolio.init('.cbp');
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
BX.addCustomEvent("BX.Landing.Block:Node:update", function(event) {
|
||||
var selector = event.makeRelativeSelector(".cbp");
|
||||
|
||||
if($(selector).length > 0)
|
||||
{
|
||||
$.HSCore.components.HSCubeportfolio.init('.cbp');
|
||||
}
|
||||
});
|
||||
|
||||
})();
|
||||
@@ -105,7 +105,7 @@
|
||||
if (formParams.length === 1)
|
||||
{
|
||||
// can't ajax load params in public
|
||||
if (BX.Landing.getMode() === 'view')
|
||||
if (BX.Landing.getMode() !== 'edit')
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -1,131 +0,0 @@
|
||||
;(function ()
|
||||
{
|
||||
"use strict";
|
||||
|
||||
BX.namespace("BX.Landing");
|
||||
|
||||
var onCustomEvent = BX.Landing.Utils.onCustomEvent;
|
||||
|
||||
BX.Landing.BlockHeaderSidebar = function ()
|
||||
{
|
||||
/**
|
||||
* @type {BX.Landing.BlockHeaderEntry[]}
|
||||
*/
|
||||
this.entries = [];
|
||||
|
||||
this.observer = new IntersectionObserver(
|
||||
BX.Landing.BlockHeaderSidebar.onIntersection,
|
||||
this.getObserverOptions()
|
||||
);
|
||||
};
|
||||
|
||||
/**
|
||||
* @param {IntersectionObserverEntry[]} entries
|
||||
*/
|
||||
BX.Landing.BlockHeaderSidebar.onIntersection = function(entries)
|
||||
{
|
||||
entries.forEach(function(entry)
|
||||
{
|
||||
// var headerHeight = null
|
||||
// // find headers for offset
|
||||
// document.querySelectorAll('.u-header.js-header-on-top').forEach(function(header){
|
||||
// headerHeight = Math.max(headerHeight, header.offsetHeight);
|
||||
// });
|
||||
//
|
||||
// if(headerHeight)
|
||||
// {
|
||||
// entry.target.style.top = headerHeight + 'px';
|
||||
// }
|
||||
});
|
||||
}
|
||||
|
||||
BX.Landing.BlockHeaderSidebar.prototype = {
|
||||
getObserverOptions: function ()
|
||||
{
|
||||
return {threshold: [0, 1]};
|
||||
},
|
||||
|
||||
|
||||
/**
|
||||
* Create entity by node and add in collection
|
||||
* @param {HTMLElement} node
|
||||
*/
|
||||
add: function (node)
|
||||
{
|
||||
this.node = node;
|
||||
this.wrapper = BX.findParent(this.node, {className: 'block-wrapper'});
|
||||
|
||||
this.wrapper.style.position = 'sticky';
|
||||
this.wrapper.style.top = '-1px';
|
||||
this.wrapper.style.transitionProperty = 'top';
|
||||
this.wrapper.style.transitionDuration = '.2s';
|
||||
|
||||
this.observer.observe(this.wrapper);
|
||||
|
||||
onCustomEvent("BX.Landing.BlockAssets.Header:onSetOnTop", function (event)
|
||||
{
|
||||
console.log("event set", event.data.height);
|
||||
this.wrapper.style.top = event.data.height + 'px';
|
||||
}.bind(this));
|
||||
|
||||
onCustomEvent("BX.Landing.BlockAssets.Header:onUnsetOnTop", function (event)
|
||||
{
|
||||
console.log("event UNSET", event.data.height);
|
||||
this.wrapper.style.top = event.data.height + 'px';
|
||||
}.bind(this));
|
||||
|
||||
onCustomEvent("BX.Landing.BlockAssets.Header:onSetInFlow", function (event)
|
||||
{
|
||||
console.log("event onSetInFlow", event.data.height);
|
||||
this.wrapper.style.top = '0px';
|
||||
}.bind(this));
|
||||
},
|
||||
|
||||
/**
|
||||
* Get entry by node
|
||||
* @param {HTMLElement} node
|
||||
* @returns {BX.Landing.BlockHeaderEntry}
|
||||
*/
|
||||
getEntryByIntersectionTarget: function (node)
|
||||
{
|
||||
var result = null;
|
||||
this.entries.forEach(function (entry)
|
||||
{
|
||||
if (node === entry.getNodeForObserve())
|
||||
{
|
||||
result = entry;
|
||||
return true;
|
||||
}
|
||||
});
|
||||
|
||||
return result;
|
||||
},
|
||||
|
||||
hidePrevEntriess: function ()
|
||||
{
|
||||
// todo: how show hidden entries when then in viewport?
|
||||
}
|
||||
};
|
||||
|
||||
BX.Landing.BlockHeaderSidebar.getInstance = function ()
|
||||
{
|
||||
return (
|
||||
BX.Landing.BlockHeaderSidebar.instance ||
|
||||
(BX.Landing.BlockHeaderSidebar.instance = new BX.Landing.BlockHeaderSidebar())
|
||||
);
|
||||
};
|
||||
|
||||
var headersSidebar = BX.Landing.BlockHeaderSidebar.getInstance();
|
||||
|
||||
onCustomEvent("BX.Landing.Block:init", function (event)
|
||||
{
|
||||
var headerSelector = event.makeRelativeSelector('.landing-block-node-navbar');
|
||||
// in edit mode menu must be like a usual block
|
||||
if (BX.Landing.getMode() === "view" && event.block.querySelectorAll(headerSelector).length > 0)
|
||||
{
|
||||
headersSidebar.add(event.block.querySelector('.landing-block-node-navbar'));
|
||||
}
|
||||
// todo: scroll-nav (scrollspy)
|
||||
// todo: scroll to top (with animate)
|
||||
});
|
||||
})();
|
||||
@@ -1,307 +0,0 @@
|
||||
;(function ()
|
||||
{
|
||||
"use strict";
|
||||
|
||||
BX.addCustomEvent(window, "BX.Landing.Block:init", function (event)
|
||||
{
|
||||
initHeaderHandler(event);
|
||||
initScrollNavHandler(event);
|
||||
initNavbarNavHandler(event);
|
||||
initModalAlertHandler(event);
|
||||
initMenuMultilevelHandler(event);
|
||||
});
|
||||
|
||||
// on Cards:update will be called multi Node:update event. Debounce to preserve this
|
||||
BX.addCustomEvent("BX.Landing.Block:Node:update", BX.debounce(initNavbarNavHandler, 200));
|
||||
|
||||
BX.addCustomEvent("BX.Landing.Block:Cards:update", function (event)
|
||||
{
|
||||
initNavbarNavHandler(event);
|
||||
});
|
||||
|
||||
BX.addCustomEvent("BX.Landing.Block:Card:add", function (event)
|
||||
{
|
||||
initNavbarNavHandler(event);
|
||||
});
|
||||
|
||||
BX.addCustomEvent("BX.Landing.Block:Card:remove", function (event)
|
||||
{
|
||||
initNavbarNavHandler(event);
|
||||
});
|
||||
|
||||
|
||||
function initHeaderHandler(event)
|
||||
{
|
||||
var headerSelector = event.makeRelativeSelector('.u-header');
|
||||
if (event.block.querySelectorAll(headerSelector).length > 0)
|
||||
{
|
||||
// in edit mode menu must be like a usual block
|
||||
if (BX.Landing.getMode() === "view")
|
||||
{
|
||||
$.HSCore.components.HSHeader.init($(headerSelector));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function initScrollNavHandler(event)
|
||||
{
|
||||
var scrollNavSelector = event.makeRelativeSelector('.js-scroll-nav');
|
||||
if (event.block.querySelectorAll(scrollNavSelector).length > 0)
|
||||
{
|
||||
$.HSCore.components.HSScrollNav.init($(scrollNavSelector), {
|
||||
duration: 400,
|
||||
easing: 'easeOutExpo'
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function initNavbarNavHandler(event)
|
||||
{
|
||||
var navbarNavSelector = event.makeRelativeSelector('.navbar-nav');
|
||||
if (event.block.querySelectorAll(navbarNavSelector).length > 0)
|
||||
{
|
||||
removeAllActive(navbarNavSelector);
|
||||
markActive(navbarNavSelector);
|
||||
}
|
||||
}
|
||||
|
||||
function initModalAlertHandler(event)
|
||||
{
|
||||
var navbarModal = event.block.querySelector(event.makeRelativeSelector('.navbar.u-navbar-modal'));
|
||||
if (navbarModal && BX.Landing.getMode() == "edit")
|
||||
{
|
||||
BX.adjust(navbarModal,
|
||||
{
|
||||
children: [
|
||||
BX.create("div", {
|
||||
props: {className: "u-navbar-modal-alert"},
|
||||
html: BX.message('LANDING_NAVBAR_MODAL_ALERT'),
|
||||
})
|
||||
]
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
function initMenuMultilevelHandler(event)
|
||||
{
|
||||
if (BX.Landing.getMode() !== "edit")
|
||||
{
|
||||
var menuMultilevel = event.block.querySelector('.g-menu-multilevel');
|
||||
if (menuMultilevel)
|
||||
{
|
||||
addMultilevelToggler(menuMultilevel);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Find and check active link(s) in navbar
|
||||
* @param selector
|
||||
*/
|
||||
function markActive(selector)
|
||||
{
|
||||
if (BX.Landing.getMode() == "edit")
|
||||
{
|
||||
if (!markActiveByLid(selector))
|
||||
{
|
||||
// just mark first
|
||||
addActive(document.querySelector(selector).querySelector('.nav-item'));
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
markActiveByLocation(selector)
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* For editor - find by lid
|
||||
* @param selector
|
||||
* @returns {boolean}
|
||||
*/
|
||||
function markActiveByLid(selector)
|
||||
{
|
||||
var marked = false;
|
||||
var lid = landingParams['LANDING_ID'];
|
||||
if (lid === undefined || lid === null)
|
||||
{
|
||||
return false;
|
||||
}
|
||||
|
||||
var nav = document.querySelector(selector);
|
||||
var links = [].slice.call(nav.getElementsByTagName('a'));
|
||||
if (!!links && links.length)
|
||||
{
|
||||
var pageLinkMatcher = new RegExp("#landing([0-9]+)");
|
||||
links.forEach(function (link)
|
||||
{
|
||||
var matches = link.href.match(pageLinkMatcher);
|
||||
if (matches !== null && matches[1] == lid)
|
||||
{
|
||||
addActive(BX.findParent(link, {className: "nav-item"}));
|
||||
marked = true;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return marked;
|
||||
}
|
||||
|
||||
/**
|
||||
* For public - find by document.location
|
||||
* @param selector
|
||||
* @returns {boolean}
|
||||
*/
|
||||
function markActiveByLocation(selector)
|
||||
{
|
||||
var marked = false;
|
||||
var pageUrl = document.location;
|
||||
var nav = document.querySelector(selector);
|
||||
var links = [].slice.call(nav.getElementsByTagName('a'));
|
||||
|
||||
if (!!links && links.length)
|
||||
{
|
||||
links.forEach(function (link)
|
||||
{
|
||||
// if href has hash - it link to block and they was be processed by scroll nav
|
||||
if (
|
||||
link.hasAttribute("href") &&
|
||||
link.getAttribute("href") !== "" &&
|
||||
link.pathname === pageUrl.pathname &&
|
||||
link.hostname === pageUrl.hostname &&
|
||||
link.hash === ''
|
||||
)
|
||||
{
|
||||
var navItem = BX.findParent(link, {className: "nav-item"});
|
||||
addActive(navItem);
|
||||
|
||||
marked = true;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return marked;
|
||||
}
|
||||
|
||||
/**
|
||||
* @param node Node - LI node
|
||||
*/
|
||||
function addActive(node)
|
||||
{
|
||||
node.classList.add('active');
|
||||
BX.adjust(node,
|
||||
{
|
||||
children: [
|
||||
BX.create("span", {
|
||||
props: {className: "sr-only"},
|
||||
text: '(current)'
|
||||
})
|
||||
]
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove all .active and sr-only
|
||||
* @param selector
|
||||
*/
|
||||
function removeAllActive(selector)
|
||||
{
|
||||
var nav = document.querySelector(selector);
|
||||
var navItems = [].slice.call(nav.querySelectorAll('.nav-item'));
|
||||
if (!!navItems && navItems.length)
|
||||
{
|
||||
navItems.forEach(function (navItem)
|
||||
{
|
||||
removeActive(navItem)
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove once .active
|
||||
* @param node Node - LI node
|
||||
*/
|
||||
function removeActive(node)
|
||||
{
|
||||
node.classList.remove('active');
|
||||
BX.remove(node.querySelector('span.sr-only'));
|
||||
}
|
||||
|
||||
function addMultilevelToggler(menuMultilevel)
|
||||
{
|
||||
var subMenus = [].slice.call(menuMultilevel.querySelectorAll('.g-menu-sublevel'));
|
||||
subMenus.forEach(function (subMenu)
|
||||
{
|
||||
var parentNavLink = BX.findPreviousSibling(subMenu, {class: 'nav-link'});
|
||||
if (!parentNavLink)
|
||||
{
|
||||
return;
|
||||
}
|
||||
hideLevel(parentNavLink);
|
||||
// open all branch for .active
|
||||
if (subMenu.querySelector('.nav-item.active'))
|
||||
{
|
||||
showLevel(parentNavLink);
|
||||
}
|
||||
|
||||
BX.addClass(parentNavLink, 'g-menu-sublevel-toggler--parent');
|
||||
BX.adjust(parentNavLink,
|
||||
{
|
||||
children: [
|
||||
BX.create("span", {
|
||||
props: {className: "g-menu-sublevel-toggler"},
|
||||
html: '<span class="is-hide-text">'
|
||||
+ BX.message('LANDING_NAVBAR_TOGGLER_SHOW')
|
||||
+ '</span><span class="is-show-text">'
|
||||
+ BX.message('LANDING_NAVBAR_TOGGLER_HIDE')
|
||||
+ '</span>',
|
||||
events: {
|
||||
click: function (event)
|
||||
{
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
|
||||
toggleLevel(BX.findParent(event.target, {class: 'nav-link'}));
|
||||
}
|
||||
}
|
||||
})
|
||||
]
|
||||
}
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
function toggleLevel(parentNavLink)
|
||||
{
|
||||
if (BX.hasClass(parentNavLink, 'g-menu-sublevel-toggler--parent-hide'))
|
||||
{
|
||||
showLevel(parentNavLink);
|
||||
}
|
||||
else
|
||||
{
|
||||
hideLevel(parentNavLink);
|
||||
}
|
||||
}
|
||||
|
||||
function hideLevel(parentNavLink)
|
||||
{
|
||||
BX.addClass(parentNavLink, 'g-menu-sublevel-toggler--parent-hide');
|
||||
var subMenu = BX.findNextSibling(parentNavLink, {class: 'g-menu-sublevel'});
|
||||
if (subMenu)
|
||||
{
|
||||
BX.addClass(subMenu, 'g-menu-sublevel--hide');
|
||||
}
|
||||
}
|
||||
|
||||
function showLevel(parentNavLink)
|
||||
{
|
||||
BX.removeClass(parentNavLink, 'g-menu-sublevel-toggler--parent-hide');
|
||||
var subMenu = BX.findNextSibling(parentNavLink, {class: 'g-menu-sublevel'});
|
||||
if (subMenu)
|
||||
{
|
||||
BX.removeClass(subMenu, 'g-menu-sublevel--hide');
|
||||
}
|
||||
}
|
||||
})();
|
||||
@@ -1,57 +0,0 @@
|
||||
;(function ()
|
||||
{
|
||||
"use strict";
|
||||
|
||||
var observerOptions = {
|
||||
// rootMargin: document.documentElement.clientHeight + 'px'
|
||||
};
|
||||
var observer = new IntersectionObserver(onIntersection, observerOptions);
|
||||
var loadedMap = new WeakMap();
|
||||
|
||||
var slice = BX.Landing.Utils.slice;
|
||||
var onCustomEvent = BX.Landing.Utils.onCustomEvent;
|
||||
|
||||
var bgHideStyleString = "[style*='background-image:']{background-image: none !important;}";
|
||||
|
||||
onCustomEvent("BX.Landing.Block:init", function (event)
|
||||
{
|
||||
observer.observe(event.block);
|
||||
});
|
||||
|
||||
|
||||
/**
|
||||
* @param {IntersectionObserverEntry[]} entries
|
||||
*/
|
||||
function onIntersection(entries)
|
||||
{
|
||||
entries.forEach(function (entry)
|
||||
{
|
||||
if (entry.isIntersecting && !loadedMap.has(entry.target))
|
||||
{
|
||||
loadedMap.set(entry.target, true);
|
||||
|
||||
// load <img>
|
||||
var observableImgs = slice(entry.target.querySelectorAll('[data-lazy-src]'));
|
||||
observableImgs.forEach(function(img) {
|
||||
var src = BX.data(img, 'lazy-src');
|
||||
BX.adjust(img, {
|
||||
attrs: {
|
||||
'src': src,
|
||||
'data-lazy-src': ""
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
//load bg
|
||||
var firstChild = entry.target.firstElementChild;
|
||||
if(
|
||||
firstChild.tagName == 'STYLE' &&
|
||||
firstChild.innerText.indexOf(bgHideStyleString) !== 0
|
||||
)
|
||||
{
|
||||
BX.remove(firstChild);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
})();
|
||||
@@ -1 +0,0 @@
|
||||
{"version":3,"file":"table.map.js","names":["document","querySelector","BX","addCustomEvent","event","block","querySelectorAll","forEach","element","setAttribute"],"sources":["table.js"],"mappings":"CAAA,WACC,aAEA,GAAIA,SAASC,cAAc,wBAA0B,KACrD,CACCC,GAAGC,eAAe,yBAA0BC,IAC3CA,EAAMC,MAAMC,iBAAiB,qBAAqBC,SAASC,IAC1DA,EAAQC,aAAa,QAAS,GAAG,GAChC,GAEJ,CACA,EAXD"}
|
||||
@@ -1,2 +0,0 @@
|
||||
(function(){"use strict";if(document.querySelector(".landing-edit-mode")===null){BX.addCustomEvent("BX.Landing.Block:init",(t=>{t.block.querySelectorAll(".landing-table-td").forEach((t=>{t.setAttribute("title","")}))}))}})();
|
||||
//# sourceMappingURL=table.map.js
|
||||
@@ -1,68 +0,0 @@
|
||||
;(function ()
|
||||
{
|
||||
"use strict";
|
||||
|
||||
BX.namespace("BX.Landing.VideoBGHelper");
|
||||
var videoBG = BX.Landing.VideoBGHelper;
|
||||
|
||||
BX.Landing.VideoBGHelper.config = {
|
||||
videoIframeClass: "js-videobg",
|
||||
videoLinkClass: "js-videobg-link",
|
||||
videoContainerClass: "js-videobg-container",
|
||||
dataLink: "video-url"
|
||||
};
|
||||
|
||||
BX.Landing.VideoBGHelper.init = function (node, type, params)
|
||||
{
|
||||
if (node.querySelectorAll('.js-videobg-link').length > 0)
|
||||
{
|
||||
// todo: foreach link node for multiple videos in one blocks
|
||||
var linkNode = node.querySelector('.' + videoBG.config.videoLinkClass);
|
||||
var href = BX.data(linkNode, videoBG.config.dataLink),
|
||||
container = linkNode.querySelector('.' + videoBG.config.videoContainerClass);
|
||||
|
||||
// todo: not work in PUBLIC
|
||||
var ServiceFactory = new BX.Landing.MediaService.Factory();
|
||||
var mediaService = ServiceFactory.create(href, params);
|
||||
|
||||
// incorrect link
|
||||
if (!mediaService)
|
||||
{
|
||||
BX.adjust(container, {'html': 'incorrect link'});
|
||||
return;
|
||||
}
|
||||
|
||||
var iframe = mediaService.getEmbedElement();
|
||||
BX.adjust(iframe, {
|
||||
'props': {'className': 'embed-responsive-item' + ' ' + videoBG.config.videoIframeClass},
|
||||
'attrs': {
|
||||
webkitallowfullscreen: true,
|
||||
mozallowfullscreen: true,
|
||||
allowfullscreen: true
|
||||
}
|
||||
});
|
||||
BX.adjust(container, {'children': [iframe]});
|
||||
|
||||
// unique ID for player container
|
||||
if (iframe.id === "")
|
||||
{
|
||||
// todo: rand_id for multiple videos in one blocks
|
||||
BX.adjust(iframe, {attrs: {'id': type + '_player_' + node.id}});
|
||||
}
|
||||
|
||||
// save players objects
|
||||
if (!window["videobg_" + type])
|
||||
{
|
||||
window["videobg_" + type] = {};
|
||||
}
|
||||
// add current iblock to list
|
||||
if (!window["videobg_" + type]["containers"])
|
||||
{
|
||||
window["videobg_" + type]["containers"] = {};
|
||||
}
|
||||
window["videobg_" + type]["containers"][type + '_player_' + node.id] = {
|
||||
id: type + '_player_' + node.id
|
||||
};
|
||||
}
|
||||
};
|
||||
})();
|
||||
Reference in New Issue
Block a user