Skip to content

Commit

Permalink
Release 1.2.1
Browse files Browse the repository at this point in the history
  • Loading branch information
vursen committed May 2, 2020
1 parent 54da52d commit 9a5f22c
Show file tree
Hide file tree
Showing 3 changed files with 120 additions and 104 deletions.
218 changes: 117 additions & 101 deletions dist/float-sidebar.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
/*!
* float-sidebar - Lightweight (2kb gzipped), zero-dependency vanilla javascript library for making float sidebars
* @version v1.2.0
* @version v1.2.1
* @link https://github.com/vursen/FloatSidebar.js
* @author Sergey Vinogradov
* @license The MIT License (MIT)
Expand Down Expand Up @@ -53,19 +53,34 @@ return /******/ (function(modules) { // webpackBootstrap
/******/ // define getter function for harmony exports
/******/ __webpack_require__.d = function(exports, name, getter) {
/******/ if(!__webpack_require__.o(exports, name)) {
/******/ Object.defineProperty(exports, name, {
/******/ configurable: false,
/******/ enumerable: true,
/******/ get: getter
/******/ });
/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
/******/ }
/******/ };
/******/
/******/ // define __esModule on exports
/******/ __webpack_require__.r = function(exports) {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/
/******/ // create a fake namespace object
/******/ // mode & 1: value is a module id, require it
/******/ // mode & 2: merge all properties of value into the ns
/******/ // mode & 4: return value when already ns object
/******/ // mode & 8|1: behave like require
/******/ __webpack_require__.t = function(value, mode) {
/******/ if(mode & 1) value = __webpack_require__(value);
/******/ if(mode & 8) return value;
/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
/******/ var ns = Object.create(null);
/******/ __webpack_require__.r(ns);
/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
/******/ return ns;
/******/ };
/******/
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = function(module) {
/******/ var getter = module && module.__esModule ?
Expand All @@ -91,151 +106,154 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ (function(module, __webpack_exports__, __webpack_require__) {

"use strict";
// ESM COMPAT FLAG
__webpack_require__.r(__webpack_exports__);

// CONCATENATED MODULE: ./src/constants/fsmStates.js
var STATE_START = 'START';
var STATE_TOP_FIXED = 'TOP_FIXED';
var STATE_UNFIXED = 'UNFIXED';
var STATE_BOTTOM_FIXED = 'BOTTOM_FIXED';
var STATE_FINISH = 'FINISH';
// CONCATENATED MODULE: ./src/constants/fsmTransitions.js
var fsmTransitions_STATE_START$STATE_TO;
// CONCATENATED MODULE: ./src/fsm-states.js
/* harmony default export */ var fsm_states = ({
START: 'START',
TOP_FIXED: 'TOP_FIXED',
UNFIXED: 'UNFIXED',
BOTTOM_FIXED: 'BOTTOM_FIXED',
FINISH: 'FINISH'
});
// CONCATENATED MODULE: ./src/fsm-actions.js
var _states$START$states$;

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; }



/* harmony default export */ var fsm_actions = (_states$START$states$ = {}, _defineProperty(_states$START$states$, fsm_states.START, function (_d, _ref) {
var $sideInner = _ref.$sideInner;

$sideInner.style.position = 'absolute';
$sideInner.style.top = '0';
$sideInner.style.bottom = 'auto';
}), _defineProperty(_states$START$states$, fsm_states.TOP_FIXED, function (d, _ref2) {
var $sideInner = _ref2.$sideInner;

$sideInner.style.position = 'fixed';
$sideInner.style.top = d.topSpacing + 'px';
$sideInner.style.bottom = 'auto';
}), _defineProperty(_states$START$states$, fsm_states.UNFIXED, function (d, _ref3) {
var $sideInner = _ref3.$sideInner;

$sideInner.style.position = 'absolute';
$sideInner.style.top = d.sideInnerTop - d.startPoint + 'px';
$sideInner.style.bottom = 'auto';
}), _defineProperty(_states$START$states$, fsm_states.BOTTOM_FIXED, function (d, _ref4) {
var $sideInner = _ref4.$sideInner;

$sideInner.style.position = 'fixed';
$sideInner.style.top = 'auto';
$sideInner.style.bottom = d.bottomSpacing + 'px';
}), _defineProperty(_states$START$states$, fsm_states.FINISH, function (_d, _ref5) {
var $sideInner = _ref5.$sideInner;

$sideInner.style.position = 'absolute';
$sideInner.style.top = 'auto';
$sideInner.style.bottom = '0';
}), _states$START$states$);
// CONCATENATED MODULE: ./src/fsm-transitions.js
var fsm_transitions_states$START$states$;

function fsmTransitions_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 fsm_transitions_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; }



/* harmony default export */ var fsmTransitions = (fsmTransitions_STATE_START$STATE_TO = {}, fsmTransitions_defineProperty(fsmTransitions_STATE_START$STATE_TO, STATE_START, [{
to: STATE_FINISH,
/* harmony default export */ var fsm_transitions = (fsm_transitions_states$START$states$ = {}, fsm_transitions_defineProperty(fsm_transitions_states$START$states$, fsm_states.START, [{
to: fsm_states.FINISH,
when: function when(d) {
return [d.isSideInnerFitsPath === true, d.viewportTop + d.sideInnerHeight >= d.finishPoint];
}
}, {
to: STATE_BOTTOM_FIXED,
to: fsm_states.BOTTOM_FIXED,
when: function when(d) {
return [d.isSideInnerFitsPath === true, d.isSideInnerFitsViewport === false, d.viewportBottom >= d.sideInnerBottom + d.bottomSpacing];
}
}, {
to: STATE_TOP_FIXED,
to: fsm_states.TOP_FIXED,
when: function when(d) {
return [d.isSideInnerFitsPath === true, d.isSideInnerFitsViewport === true, d.viewportTop >= d.startPoint - d.topSpacing];
}
}]), fsmTransitions_defineProperty(fsmTransitions_STATE_START$STATE_TO, STATE_TOP_FIXED, [{
to: STATE_START,
}]), fsm_transitions_defineProperty(fsm_transitions_states$START$states$, fsm_states.TOP_FIXED, [{
to: fsm_states.START,
when: function when(d) {
return [d.isSideInnerFitsPath === false];
}
}, {
to: STATE_START,
to: fsm_states.START,
when: function when(d) {
return [d.viewportTop <= d.startPoint - d.topSpacing];
}
}, {
to: STATE_FINISH,
to: fsm_states.FINISH,
when: function when(d) {
return [d.sideInnerBottom >= d.finishPoint];
}
}, {
to: STATE_UNFIXED,
to: fsm_states.UNFIXED,
when: function when(d) {
return [d.scrollDirection === 'down', d.isSideInnerFitsViewport === false];
}
}]), fsmTransitions_defineProperty(fsmTransitions_STATE_START$STATE_TO, STATE_UNFIXED, [{
to: STATE_START,
}]), fsm_transitions_defineProperty(fsm_transitions_states$START$states$, fsm_states.UNFIXED, [{
to: fsm_states.START,
when: function when(d) {
return [d.isSideInnerFitsPath === false];
}
}, {
to: STATE_TOP_FIXED,
to: fsm_states.TOP_FIXED,
when: function when(d) {
return [d.viewportTop <= d.sideInnerTop - d.topSpacing];
}
}, {
to: STATE_TOP_FIXED,
to: fsm_states.TOP_FIXED,
when: function when(d) {
return [d.isSideInnerFitsViewport === true, d.viewportBottom >= d.sideInnerBottom + d.bottomSpacing];
}
}, {
to: STATE_BOTTOM_FIXED,
to: fsm_states.BOTTOM_FIXED,
when: function when(d) {
return [d.isSideInnerFitsViewport === false, d.viewportBottom >= d.sideInnerBottom + d.bottomSpacing];
}
}]), fsmTransitions_defineProperty(fsmTransitions_STATE_START$STATE_TO, STATE_BOTTOM_FIXED, [{
to: STATE_START,
}]), fsm_transitions_defineProperty(fsm_transitions_states$START$states$, fsm_states.BOTTOM_FIXED, [{
to: fsm_states.START,
when: function when(d) {
return [d.isSideInnerFitsPath === false];
}
}, {
to: STATE_UNFIXED,
to: fsm_states.UNFIXED,
when: function when(d) {
return [d.scrollDirection === 'up'];
}
}, {
to: STATE_TOP_FIXED,
to: fsm_states.TOP_FIXED,
when: function when(d) {
return [d.isSideInnerFitsViewport === true];
}
}, {
to: STATE_FINISH,
to: fsm_states.FINISH,
when: function when(d) {
return [d.sideInnerBottom >= d.finishPoint];
}
}]), fsmTransitions_defineProperty(fsmTransitions_STATE_START$STATE_TO, STATE_FINISH, [{
to: STATE_START,
}]), fsm_transitions_defineProperty(fsm_transitions_states$START$states$, fsm_states.FINISH, [{
to: fsm_states.START,
when: function when(d) {
return [d.isSideInnerFitsPath === false];
}
}, {
to: STATE_BOTTOM_FIXED,
to: fsm_states.BOTTOM_FIXED,
when: function when(d) {
return [d.sideInnerBottom + d.bottomSpacing <= d.finishPoint, d.viewportBottom <= d.finishPoint];
}
}, {
to: STATE_TOP_FIXED,
to: fsm_states.TOP_FIXED,
when: function when(d) {
return [d.viewportTop <= d.sideInnerTop - d.topSpacing];
}
}]), fsmTransitions_STATE_START$STATE_TO);
// CONCATENATED MODULE: ./src/constants/fsmActions.js
var fsmActions_STATE_START$STATE_TO;

function fsmActions_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; }



/* harmony default export */ var fsmActions = (fsmActions_STATE_START$STATE_TO = {}, fsmActions_defineProperty(fsmActions_STATE_START$STATE_TO, STATE_START, function (d, _ref) {
var $sideInner = _ref.$sideInner;

$sideInner.style.position = 'absolute';
$sideInner.style.top = '0';
$sideInner.style.bottom = 'auto';
}), fsmActions_defineProperty(fsmActions_STATE_START$STATE_TO, STATE_TOP_FIXED, function (d, _ref2) {
var $sideInner = _ref2.$sideInner;

$sideInner.style.position = 'fixed';
$sideInner.style.top = d.topSpacing + 'px';
$sideInner.style.bottom = 'auto';
}), fsmActions_defineProperty(fsmActions_STATE_START$STATE_TO, STATE_UNFIXED, function (d, _ref3) {
var $sideInner = _ref3.$sideInner;

$sideInner.style.position = 'absolute';
$sideInner.style.top = d.sideInnerTop - d.startPoint + 'px';
$sideInner.style.bottom = 'auto';
}), fsmActions_defineProperty(fsmActions_STATE_START$STATE_TO, STATE_BOTTOM_FIXED, function (d, _ref4) {
var $sideInner = _ref4.$sideInner;

$sideInner.style.position = 'fixed';
$sideInner.style.top = 'auto';
$sideInner.style.bottom = d.bottomSpacing + 'px';
}), fsmActions_defineProperty(fsmActions_STATE_START$STATE_TO, STATE_FINISH, function (d, _ref5) {
var $sideInner = _ref5.$sideInner;

$sideInner.style.position = 'absolute';
$sideInner.style.top = 'auto';
$sideInner.style.bottom = '0';
}), fsmActions_STATE_START$STATE_TO);
// CONCATENATED MODULE: ./src/utils/createFSM.js
}]), fsm_transitions_states$START$states$);
// CONCATENATED MODULE: ./src/fsm.js
function createFSM(_ref) {
var actions = _ref.actions,
transitions = _ref.transitions,
Expand Down Expand Up @@ -269,9 +287,9 @@ function createFSM(_ref) {
return { findTransitionFor: findTransitionFor, performTransition: performTransition };
}

/* harmony default export */ var utils_createFSM = (createFSM);
// CONCATENATED MODULE: ./src/utils/rAFThrottle.js
function rAFThrottle(callback) {
/* harmony default export */ var src_fsm = (createFSM);
// CONCATENATED MODULE: ./src/throttle.js
function requestAnimationFrameThrottle(callback) {
var requestId = void 0;

return function () {
Expand All @@ -283,20 +301,18 @@ function rAFThrottle(callback) {
}
};
}

/* harmony default export */ var utils_rAFThrottle = (rAFThrottle);
// CONCATENATED MODULE: ./src/utils/createDimensionObserver.js
// CONCATENATED MODULE: ./src/dimension-observer.js


var createDimensionObserver_computeViewportDimensions = function computeViewportDimensions($viewport) {
var computeViewportDimensions = function computeViewportDimensions($viewport) {
var height = $viewport.clientHeight || $viewport.innerHeight;
var top = $viewport.scrollTop || $viewport.pageYOffset;
var bottom = top + height;

return { top: top, bottom: bottom, height: height };
};

var createDimensionObserver_computeElementDimensions = function computeElementDimensions($element, viewportTop) {
var computeElementDimensions = function computeElementDimensions($element, viewportTop) {
var rect = $element.getBoundingClientRect();

return {
Expand All @@ -306,7 +322,7 @@ var createDimensionObserver_computeElementDimensions = function computeElementDi
};
};

function createDimensionObserver_createDimensionObserver(onChange, _ref) {
function createDimensionObserver(callback, _ref) {
var $viewport = _ref.$viewport,
$relative = _ref.$relative,
$sideInner = _ref.$sideInner,
Expand All @@ -321,10 +337,10 @@ function createDimensionObserver_createDimensionObserver(onChange, _ref) {
};

var computeDimensions = function computeDimensions() {
var dim$viewport = createDimensionObserver_computeViewportDimensions($viewport);
var dim$sideInner = createDimensionObserver_computeElementDimensions($sideInner, dim$viewport.top);
var dim$sideOuter = createDimensionObserver_computeElementDimensions($sideOuter, dim$viewport.top);
var dim$relative = createDimensionObserver_computeElementDimensions($relative, dim$viewport.top);
var dim$viewport = computeViewportDimensions($viewport);
var dim$sideInner = computeElementDimensions($sideInner, dim$viewport.top);
var dim$sideOuter = computeElementDimensions($sideOuter, dim$viewport.top);
var dim$relative = computeElementDimensions($relative, dim$viewport.top);

var scrollDirection = computeScrollDirection(dim$viewport.top);

Expand Down Expand Up @@ -358,10 +374,10 @@ function createDimensionObserver_createDimensionObserver(onChange, _ref) {
};
};

var tick = utils_rAFThrottle(function () {
var tick = requestAnimationFrameThrottle(function () {
var dimensions = computeDimensions();

onChange(prevDimensions, dimensions);
callback(prevDimensions, dimensions);

prevDimensions = dimensions;
});
Expand All @@ -381,7 +397,7 @@ function createDimensionObserver_createDimensionObserver(onChange, _ref) {
return { start: start, stop: stop, tick: tick };
}

/* harmony default export */ var utils_createDimensionObserver = (createDimensionObserver_createDimensionObserver);
/* harmony default export */ var dimension_observer = (createDimensionObserver);
// CONCATENATED MODULE: ./src/index.js


Expand All @@ -390,7 +406,7 @@ function createDimensionObserver_createDimensionObserver(onChange, _ref) {



function src_FloatSidebar(options) {
function FloatSidebar(options) {
var $viewport = options.viewport || window;
var $sideOuter = options.sidebar;
var $sideInner = options.sidebarInner || $sideOuter.firstElementChild;
Expand All @@ -399,13 +415,13 @@ function src_FloatSidebar(options) {
var topSpacing = options.topSpacing || 0;
var bottomSpacing = options.bottomSpacing || 0;

var fsm = utils_createFSM({
actions: fsmActions,
transitions: fsmTransitions,
initialState: STATE_START
var fsm = src_fsm({
actions: fsm_actions,
transitions: fsm_transitions,
initialState: fsm_states.START
});

var dimensionObserver = utils_createDimensionObserver(function (prevDimensions, dimensions) {
var dimensionObserver = dimension_observer(function (prevDimensions, dimensions) {
var transition = fsm.findTransitionFor(dimensions);

if (transition) {
Expand Down Expand Up @@ -456,7 +472,7 @@ function src_FloatSidebar(options) {
return { forceUpdate: forceUpdate, destroy: destroy };
}

/* harmony default export */ var src = __webpack_exports__["default"] = (src_FloatSidebar);
/* harmony default export */ var src = __webpack_exports__["default"] = (FloatSidebar);

/***/ })
/******/ ])["default"];
Expand Down
Loading

0 comments on commit 9a5f22c

Please sign in to comment.