-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
added our custom scrollspy for Campapp
(cherry picked from commit 8316e00)
- Loading branch information
Showing
9 changed files
with
2,874 additions
and
91 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,4 @@ | ||
{ | ||
"plugins": ["@babel/plugin-proposal-object-rest-spread"], | ||
"presets": ["@babel/preset-env"] | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1 +1,2 @@ | ||
.idea | ||
node_modules/ |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,16 @@ | ||
# girfart-bootstrap-scrollspy | ||
Toto repo vzniklo na základě potřeby poupravit originální bootstrap scrollspy. | ||
|
||
Momentálně jsou zde dvě větve `master` a `original-bootstrap-scrollspy`. | ||
|
||
`Original-bootstrap-scrollspy` obsahuje původní zdrojové soubory pluginu scrollspy. Do budoucna slouží pro jednoduché upgradování scrollspy. Bootstrap vydá novou verzi, člověk díky téhle větvi se může podívat, co se změnilo v pluginu scrollspy. | ||
|
||
`Master` slouží pro vlastní vývoj custom scrollspy. Scrollspy jsme potřebovali upravit tak, aby nezávisel na globálním kontextu a byl funkční například i v Tinymce editoru. | ||
|
||
## Vývoj | ||
|
||
Před vývojem je potřeba spustit příkaz `yarn install`. Poté upravit kód v `src` složce. Potom spustit příkaz `yarn build`. Tím se vytvoří vybuilděný script, který je uveden jako `main` v `package.json`. | ||
|
||
## Použití v projektu | ||
|
||
V `package.json` v projektu přidáme tento balíček přes `yarn add <adresa repozitáře>`. V případě změny masteru tohoto balíčku, je pak potřeba v projektu, ve kterém je tento balíček využíván, spustit příkaz `yarn upgrade <jmeno baličku>`. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,358 @@ | ||
"use strict"; | ||
|
||
Object.defineProperty(exports, "__esModule", { | ||
value: true | ||
}); | ||
exports.default = void 0; | ||
|
||
var _jquery = _interopRequireDefault(require("jquery")); | ||
|
||
var _util = _interopRequireDefault(require("./util")); | ||
|
||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } | ||
|
||
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } | ||
|
||
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; } | ||
|
||
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
|
||
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } | ||
|
||
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } | ||
|
||
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; } | ||
|
||
/** | ||
* -------------------------------------------------------------------------- | ||
* Bootstrap (v4.1.3): scrollspy.js | ||
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) | ||
* -------------------------------------------------------------------------- | ||
*/ | ||
var ScrollSpy = function ($) { | ||
/** | ||
* ------------------------------------------------------------------------ | ||
* Constants | ||
* ------------------------------------------------------------------------ | ||
*/ | ||
var NAME = 'scrollspy'; | ||
var VERSION = '4.1.3'; | ||
var DATA_KEY = 'bs.scrollspy'; | ||
var EVENT_KEY = ".".concat(DATA_KEY); | ||
var DATA_API_KEY = '.data-api'; | ||
var JQUERY_NO_CONFLICT = $.fn[NAME]; | ||
var Default = { | ||
offset: 10, | ||
method: 'auto', | ||
target: '' | ||
}; | ||
var DefaultType = { | ||
offset: 'number', | ||
method: 'string', | ||
target: '(string|element)' | ||
}; | ||
var Event = { | ||
ACTIVATE: "activate".concat(EVENT_KEY), | ||
SCROLL: "scroll".concat(EVENT_KEY), | ||
LOAD_DATA_API: "load".concat(EVENT_KEY).concat(DATA_API_KEY) | ||
}; | ||
var ClassName = { | ||
DROPDOWN_ITEM: 'dropdown-item', | ||
DROPDOWN_MENU: 'dropdown-menu', | ||
ACTIVE: 'active' | ||
}; | ||
var Selector = { | ||
DATA_SPY: '[data-spy="scroll"]', | ||
ACTIVE: '.active', | ||
NAV_LIST_GROUP: '.nav, .list-group', | ||
NAV_LINKS: '.nav-link', | ||
NAV_ITEMS: '.nav-item', | ||
LIST_ITEMS: '.list-group-item', | ||
DROPDOWN: '.dropdown', | ||
DROPDOWN_ITEMS: '.dropdown-item', | ||
DROPDOWN_TOGGLE: '.dropdown-toggle' | ||
}; | ||
var OffsetMethod = { | ||
OFFSET: 'offset', | ||
POSITION: 'position' | ||
/** | ||
* ------------------------------------------------------------------------ | ||
* Class Definition | ||
* ------------------------------------------------------------------------ | ||
*/ | ||
|
||
}; | ||
|
||
var ScrollSpy = | ||
/*#__PURE__*/ | ||
function () { | ||
function ScrollSpy(element, config) { | ||
var _this = this; | ||
|
||
_classCallCheck(this, ScrollSpy); | ||
|
||
this._element = element; | ||
this._scrollableAreaOwnerDocument = element.ownerDocument; | ||
this._scrollElement = element.tagName === 'BODY' ? this._scrollableAreaOwnerDocument.defaultView : element; // @todo: this does not work as expected when tag name is not body, should be fixed | ||
|
||
this._config = this._getConfig(config); | ||
this._selector = "".concat(this._config.target, " ").concat(Selector.NAV_LINKS, ",") + "".concat(this._config.target, " ").concat(Selector.LIST_ITEMS, ",") + "".concat(this._config.target, " ").concat(Selector.DROPDOWN_ITEMS); | ||
this._offsets = []; | ||
this._targets = []; | ||
this._activeTarget = null; | ||
this._targetOwnerDocument = document; // This would not work when target is inside of iframe, but we are OK with that as that is not our case. | ||
|
||
this._scrollHeight = 0; | ||
$(this._scrollElement).on(Event.SCROLL, function (event) { | ||
return _this._process(event); | ||
}); | ||
this.refresh(); | ||
|
||
this._process(); | ||
} // Getters | ||
|
||
|
||
_createClass(ScrollSpy, [{ | ||
key: "refresh", | ||
// Public | ||
value: function refresh() { | ||
var _this2 = this; | ||
|
||
var autoMethod = this._scrollElement === this._scrollElement.window ? OffsetMethod.OFFSET : OffsetMethod.POSITION; | ||
var offsetMethod = this._config.method === 'auto' ? autoMethod : this._config.method; | ||
var offsetBase = offsetMethod === OffsetMethod.POSITION ? this._getScrollTop() : 0; | ||
this._offsets = []; | ||
this._targets = []; | ||
this._scrollHeight = this._getScrollHeight(); | ||
var targets = [].slice.call(this._targetOwnerDocument.querySelectorAll(this._selector)); | ||
targets.map(function (element) { | ||
var target; | ||
|
||
var targetSelector = _util.default.getSelectorFromElement(element, _this2._scrollableAreaOwnerDocument); | ||
|
||
if (targetSelector) { | ||
target = _this2._scrollableAreaOwnerDocument.querySelector(targetSelector); | ||
} | ||
|
||
if (target) { | ||
var targetBCR = target.getBoundingClientRect(); | ||
|
||
if (targetBCR.width || targetBCR.height) { | ||
// TODO (fat): remove sketch reliance on jQuery position/offset | ||
return [$(target)[offsetMethod]().top + offsetBase, targetSelector]; | ||
} | ||
} | ||
|
||
return null; | ||
}).filter(function (item) { | ||
return item; | ||
}).sort(function (a, b) { | ||
return a[0] - b[0]; | ||
}).forEach(function (item) { | ||
_this2._offsets.push(item[0]); | ||
|
||
_this2._targets.push(item[1]); | ||
}); | ||
} | ||
}, { | ||
key: "dispose", | ||
value: function dispose() { | ||
$.removeData(this._element, DATA_KEY); | ||
$(this._scrollElement).off(EVENT_KEY); | ||
this._element = null; | ||
this._scrollElement = null; | ||
this._config = null; | ||
this._selector = null; | ||
this._offsets = null; | ||
this._targets = null; | ||
this._activeTarget = null; | ||
this._scrollHeight = null; | ||
} // Private | ||
|
||
}, { | ||
key: "_getConfig", | ||
value: function _getConfig(config) { | ||
config = _objectSpread({}, Default, _typeof(config) === 'object' && config ? config : {}); | ||
|
||
if (typeof config.target !== 'string') { | ||
var id = $(config.target).attr('id'); | ||
|
||
if (!id) { | ||
id = _util.default.getUID(NAME); | ||
$(config.target).attr('id', id); | ||
} | ||
|
||
config.target = "#".concat(id); | ||
} | ||
|
||
_util.default.typeCheckConfig(NAME, config, DefaultType); | ||
|
||
return config; | ||
} | ||
}, { | ||
key: "_getScrollTop", | ||
value: function _getScrollTop() { | ||
return this._scrollElement === this._targetOwnerDocument.defaultView ? this._scrollElement.pageYOffset : this._scrollElement.scrollTop !== undefined ? this._scrollElement.scrollTop : this._scrollElement.document.documentElement.scrollTop; | ||
} | ||
}, { | ||
key: "_getScrollHeight", | ||
value: function _getScrollHeight() { | ||
return this._scrollElement.scrollHeight || Math.max(this._scrollableAreaOwnerDocument.body.scrollHeight, this._scrollableAreaOwnerDocument.documentElement.scrollHeight); | ||
} | ||
}, { | ||
key: "_getOffsetHeight", | ||
value: function _getOffsetHeight() { | ||
return this._scrollElement === this._targetOwnerDocument.defaultView ? this._scrollableAreaOwnerDocument.defaultView.innerHeight : typeof this._scrollElement.getBoundingClientRect === 'function' ? this._scrollElement.getBoundingClientRect().height : this._scrollElement.document.documentElement.clientHeight; | ||
} | ||
}, { | ||
key: "_process", | ||
value: function _process() { | ||
var scrollTop = this._getScrollTop() + this._config.offset; | ||
|
||
var scrollHeight = this._getScrollHeight(); | ||
|
||
var maxScroll = this._config.offset + scrollHeight - this._getOffsetHeight(); | ||
|
||
if (this._scrollHeight !== scrollHeight) { | ||
this.refresh(); | ||
} | ||
|
||
if (scrollTop >= maxScroll) { | ||
var target = this._targets[this._targets.length - 1]; | ||
|
||
if (this._activeTarget !== target) { | ||
this._activate(target); | ||
} | ||
|
||
return; | ||
} | ||
|
||
if (this._activeTarget && scrollTop < this._offsets[0] && this._offsets[0] > 0) { | ||
this._activeTarget = null; | ||
|
||
this._clear(); | ||
|
||
return; | ||
} | ||
|
||
var offsetLength = this._offsets.length; | ||
|
||
for (var i = offsetLength; i--;) { | ||
var isActiveTarget = this._activeTarget !== this._targets[i] && scrollTop >= this._offsets[i] && (typeof this._offsets[i + 1] === 'undefined' || scrollTop < this._offsets[i + 1]); | ||
|
||
if (isActiveTarget) { | ||
this._activate(this._targets[i]); | ||
} | ||
} | ||
} | ||
}, { | ||
key: "_activate", | ||
value: function _activate(target) { | ||
this._activeTarget = target; | ||
|
||
this._clear(); | ||
|
||
var queries = this._selector.split(','); // eslint-disable-next-line arrow-body-style | ||
|
||
|
||
queries = queries.map(function (selector) { | ||
return "".concat(selector, "[data-target=\"").concat(target, "\"],") + "".concat(selector, "[href=\"").concat(target, "\"]"); | ||
}); | ||
var $link = $([].slice.call(this._targetOwnerDocument.querySelectorAll(queries.join(',')))); | ||
|
||
if ($link.hasClass(ClassName.DROPDOWN_ITEM)) { | ||
$link.closest(Selector.DROPDOWN).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE); | ||
$link.addClass(ClassName.ACTIVE); | ||
} else { | ||
// Set triggered link as active | ||
$link.addClass(ClassName.ACTIVE); // Set triggered links parents as active | ||
// With both <ul> and <nav> markup a parent is the previous sibling of any nav ancestor | ||
|
||
$link.parents(Selector.NAV_LIST_GROUP).prev("".concat(Selector.NAV_LINKS, ", ").concat(Selector.LIST_ITEMS)).addClass(ClassName.ACTIVE); // Handle special case when .nav-link is inside .nav-item | ||
|
||
$link.parents(Selector.NAV_LIST_GROUP).prev(Selector.NAV_ITEMS).children(Selector.NAV_LINKS).addClass(ClassName.ACTIVE); | ||
} | ||
|
||
$(this._scrollElement).trigger(Event.ACTIVATE, { | ||
relatedTarget: target | ||
}); | ||
} | ||
}, { | ||
key: "_clear", | ||
value: function _clear() { | ||
var nodes = [].slice.call(this._targetOwnerDocument.querySelectorAll(this._selector)); | ||
$(nodes).filter(Selector.ACTIVE).removeClass(ClassName.ACTIVE); | ||
} // Static | ||
|
||
}], [{ | ||
key: "_jQueryInterface", | ||
value: function _jQueryInterface(config) { | ||
return this.each(function () { | ||
var data = $(this).data(DATA_KEY); | ||
|
||
var _config = _typeof(config) === 'object' && config; | ||
|
||
if (!data) { | ||
data = new ScrollSpy(this, _config); | ||
$(this).data(DATA_KEY, data); | ||
} | ||
|
||
if (typeof config === 'string') { | ||
if (typeof data[config] === 'undefined') { | ||
throw new TypeError("No method named \"".concat(config, "\"")); | ||
} | ||
|
||
data[config](); | ||
} | ||
}); | ||
} | ||
}, { | ||
key: "VERSION", | ||
get: function get() { | ||
return VERSION; | ||
} | ||
}, { | ||
key: "Default", | ||
get: function get() { | ||
return Default; | ||
} | ||
}]); | ||
|
||
return ScrollSpy; | ||
}(); | ||
/** | ||
* ------------------------------------------------------------------------ | ||
* Data Api implementation | ||
* ------------------------------------------------------------------------ | ||
*/ | ||
|
||
|
||
$(window).on(Event.LOAD_DATA_API, function () { | ||
var scrollSpys = [].slice.call(document.querySelectorAll(Selector.DATA_SPY)); | ||
var scrollSpysLength = scrollSpys.length; | ||
|
||
for (var i = scrollSpysLength; i--;) { | ||
var $spy = $(scrollSpys[i]); | ||
|
||
ScrollSpy._jQueryInterface.call($spy, $spy.data()); | ||
} | ||
}); | ||
/** | ||
* ------------------------------------------------------------------------ | ||
* jQuery | ||
* ------------------------------------------------------------------------ | ||
*/ | ||
|
||
$.fn[NAME] = ScrollSpy._jQueryInterface; | ||
$.fn[NAME].Constructor = ScrollSpy; | ||
|
||
$.fn[NAME].noConflict = function () { | ||
$.fn[NAME] = JQUERY_NO_CONFLICT; | ||
return ScrollSpy._jQueryInterface; | ||
}; | ||
|
||
return ScrollSpy; | ||
}(_jquery.default); | ||
|
||
var _default = ScrollSpy; | ||
exports.default = _default; |
Oops, something went wrong.