/******/ ( ( ) => { // webpackBootstrap
/******/ "use strict" ;
/******/ var _ _webpack _modules _ _ = ( {
/***/ "./src/example.js" :
/ * ! * * * * * * * * * * * * * * * * * * * * * * * * ! * \
! * * * . / src / example . js * * * !
\ * * * * * * * * * * * * * * * * * * * * * * * * /
/***/ ( ( _ _unused _webpack _module , _ _webpack _exports _ _ , _ _webpack _require _ _ ) => {
_ _webpack _require _ _ . r ( _ _webpack _exports _ _ ) ;
/* harmony import */ var _masonry _js _ _WEBPACK _IMPORTED _MODULE _0 _ _ = _ _webpack _require _ _ ( /*! ./masonry.js */ "./src/masonry.js" ) ;
document . addEventListener ( "DOMContentLoaded" , function ( event ) {
var masonry = new _masonry _js _ _WEBPACK _IMPORTED _MODULE _0 _ _ [ "default" ] ( ) ;
} ) ;
/***/ } ) ,
/***/ "./src/masonry.js" :
/ * ! * * * * * * * * * * * * * * * * * * * * * * * * ! * \
! * * * . / src / masonry . js * * * !
\ * * * * * * * * * * * * * * * * * * * * * * * * /
/***/ ( ( _ _unused _webpack _module , _ _webpack _exports _ _ , _ _webpack _require _ _ ) => {
_ _webpack _require _ _ . r ( _ _webpack _exports _ _ ) ;
/* harmony export */ _ _webpack _require _ _ . d ( _ _webpack _exports _ _ , {
/* harmony export */ "default" : ( ) => ( _ _WEBPACK _DEFAULT _EXPORT _ _ )
/* harmony export */ } ) ;
/* harmony import */ var throttle _debounce _ _WEBPACK _IMPORTED _MODULE _0 _ _ = _ _webpack _require _ _ ( /*! throttle-debounce */ "./node_modules/throttle-debounce/esm/index.js" ) ;
function _typeof ( obj ) { "@babel/helpers - typeof" ; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol . iterator ? function ( obj ) { return typeof obj ; } : function ( obj ) { return obj && "function" == typeof Symbol && obj . constructor === Symbol && obj !== Symbol . prototype ? "symbol" : typeof obj ; } , _typeof ( 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 , _toPropertyKey ( descriptor . key ) , descriptor ) ; } }
function _createClass ( Constructor , protoProps , staticProps ) { if ( protoProps ) _defineProperties ( Constructor . prototype , protoProps ) ; if ( staticProps ) _defineProperties ( Constructor , staticProps ) ; Object . defineProperty ( Constructor , "prototype" , { writable : false } ) ; return Constructor ; }
function _toPropertyKey ( arg ) { var key = _toPrimitive ( arg , "string" ) ; return _typeof ( key ) === "symbol" ? key : String ( key ) ; }
function _toPrimitive ( input , hint ) { if ( _typeof ( input ) !== "object" || input === null ) return input ; var prim = input [ Symbol . toPrimitive ] ; if ( prim !== undefined ) { var res = prim . call ( input , hint || "default" ) ; if ( _typeof ( res ) !== "object" ) return res ; throw new TypeError ( "@@toPrimitive must return a primitive value." ) ; } return ( hint === "string" ? String : Number ) ( input ) ; }
/ * *
* Tiny Masonry
*
* @ author Björn Hase
* @ license http : //opensource.org/licenses/MIT The MIT License
* @ link https : //gitea.node001.net/tiny-components/masonry
*
* /
var Masonry = /*#__PURE__*/ function ( ) {
/ * *
*
*
* /
function Masonry ( ) {
var _this = this ;
_classCallCheck ( this , Masonry ) ;
// getting elements
this . elements = document . querySelectorAll ( '.tiny-masonry__item-inner' ) ;
this . container = document . querySelector ( '.tiny-masonry' ) ;
// getting gap for calculate from grid
this . gap = parseInt ( getComputedStyle ( this . container , 'gap' ) . getPropertyValue ( 'grid-gap' ) . split ( ' ' ) [ 0 ] ) ;
this . calculate ( ) ;
window . addEventListener ( 'resize' , ( 0 , throttle _debounce _ _WEBPACK _IMPORTED _MODULE _0 _ _ . throttle ) ( 300 , function ( ) {
_this . calculate ( ) ;
} ) , false ) ;
window . addEventListener ( 'scroll' , ( 0 , throttle _debounce _ _WEBPACK _IMPORTED _MODULE _0 _ _ . throttle ) ( 300 , function ( ) {
_this . calculate ( true ) ;
} ) , false ) ;
}
/ * *
*
*
* /
_createClass ( Masonry , [ {
key : "calculate" ,
value : function calculate ( ) {
var onlyVisible = arguments . length > 0 && arguments [ 0 ] !== undefined ? arguments [ 0 ] : false ;
// getting number of columns
if ( ! onlyVisible ) {
this . columns = Math . ceil ( this . container . offsetWidth / this . elements [ 0 ] . parentElement . offsetWidth ) - 1 ;
if ( this . columns === 0 ) {
this . columns = 1 ;
}
}
for ( var i = 0 ; i < this . elements . length ; i ++ ) {
var marginTop = 0 ;
// getting row
var row = Math . round ( i / this . columns ) + 1 ;
// reset margin-top for the first columns
if ( i < this . columns ) {
this . elements [ i ] . parentElement . dataset . offsetMarginTop = 0 ;
}
// check for parent element and getting marginTop
if ( this . elements [ i - this . columns ] && ! onlyVisible ) {
if ( this . elements [ i - this . columns ] . parentElement . dataset . offsetMarginTop ) {
marginTop += parseInt ( this . elements [ i - this . columns ] . parentElement . dataset . offsetMarginTop ) ;
}
marginTop += this . elements [ i - this . columns ] . offsetHeight ;
} else {
marginTop = this . elements [ i ] . parentElement . dataset . offsetMarginTop ;
}
if ( ! onlyVisible ) {
this . elements [ i ] . parentElement . dataset . offsetMarginTop = marginTop ;
}
if ( window . pageYOffset <= marginTop + this . elements [ i ] . offsetHeight + this . gap * row && window . pageYOffset + window . innerHeight + this . gap * row >= marginTop ) {
this . elements [ i ] . parentElement . style . marginTop = marginTop + 'px' ;
this . elements [ i ] . parentElement . style . visibility = 'visible' ;
} else {
this . elements [ i ] . parentElement . style . visibility = 'hidden' ;
}
}
}
} ] ) ;
return Masonry ;
} ( ) ;
/* harmony default export */ const _ _WEBPACK _DEFAULT _EXPORT _ _ = ( Masonry ) ;
/***/ } ) ,
/***/ "./src/example.scss" :
/ * ! * * * * * * * * * * * * * * * * * * * * * * * * * * ! * \
! * * * . / src / example . scss * * * !
\ * * * * * * * * * * * * * * * * * * * * * * * * * * /
/***/ ( ( _ _unused _webpack _module , _ _webpack _exports _ _ , _ _webpack _require _ _ ) => {
_ _webpack _require _ _ . r ( _ _webpack _exports _ _ ) ;
// extracted by mini-css-extract-plugin
/***/ } ) ,
/***/ "./node_modules/throttle-debounce/esm/index.js" :
/ * ! * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * ! * \
! * * * . / node _modules / throttle - debounce / esm / index . js * * * !
\ * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * /
/***/ ( ( _ _unused _webpack _ _ _webpack _module _ _ , _ _webpack _exports _ _ , _ _webpack _require _ _ ) => {
_ _webpack _require _ _ . r ( _ _webpack _exports _ _ ) ;
/* harmony export */ _ _webpack _require _ _ . d ( _ _webpack _exports _ _ , {
/* harmony export */ "debounce" : ( ) => ( /* binding */ debounce ) ,
/* harmony export */ "throttle" : ( ) => ( /* binding */ throttle )
/* harmony export */ } ) ;
/* eslint-disable no-undefined,no-param-reassign,no-shadow */
/ * *
* Throttle execution of a function . Especially useful for rate limiting
* execution of handlers on events like resize and scroll .
*
* @ param { number } delay - A zero - or - greater delay in milliseconds . For event callbacks , values around 100 or 250 ( or even higher )
* are most useful .
* @ param { Function } callback - A function to be executed after delay milliseconds . The ` this ` context and all arguments are passed through ,
* as - is , to ` callback ` when the throttled - function is executed .
* @ param { object } [ options ] - An object to configure options .
* @ param { boolean } [ options . noTrailing ] - Optional , defaults to false . If noTrailing is true , callback will only execute every ` delay ` milliseconds
* while the throttled - function is being called . If noTrailing is false or unspecified , callback will be executed
* one final time after the last throttled - function call . ( After the throttled - function has not been called for
* ` delay ` milliseconds , the internal counter is reset ) .
* @ param { boolean } [ options . noLeading ] - Optional , defaults to false . If noLeading is false , the first throttled - function call will execute callback
* immediately . If noLeading is true , the first the callback execution will be skipped . It should be noted that
* callback will never executed if both noLeading = true and noTrailing = true .
* @ param { boolean } [ options . debounceMode ] - If ` debounceMode ` is true ( at begin ) , schedule ` clear ` to execute after ` delay ` ms . If ` debounceMode ` is
* false ( at end ) , schedule ` callback ` to execute after ` delay ` ms .
*
* @ returns { Function } A new , throttled , function .
* /
function throttle ( delay , callback , options ) {
var _ref = options || { } ,
_ref$noTrailing = _ref . noTrailing ,
noTrailing = _ref$noTrailing === void 0 ? false : _ref$noTrailing ,
_ref$noLeading = _ref . noLeading ,
noLeading = _ref$noLeading === void 0 ? false : _ref$noLeading ,
_ref$debounceMode = _ref . debounceMode ,
debounceMode = _ref$debounceMode === void 0 ? undefined : _ref$debounceMode ;
/ *
* After wrapper has stopped being called , this timeout ensures that
* ` callback ` is executed at the proper times in ` throttle ` and ` end `
* debounce modes .
* /
var timeoutID ;
var cancelled = false ; // Keep track of the last time `callback` was executed.
var lastExec = 0 ; // Function to clear existing timeout
function clearExistingTimeout ( ) {
if ( timeoutID ) {
clearTimeout ( timeoutID ) ;
}
} // Function to cancel next exec
function cancel ( options ) {
var _ref2 = options || { } ,
_ref2$upcomingOnly = _ref2 . upcomingOnly ,
upcomingOnly = _ref2$upcomingOnly === void 0 ? false : _ref2$upcomingOnly ;
clearExistingTimeout ( ) ;
cancelled = ! upcomingOnly ;
}
/ *
* The ` wrapper ` function encapsulates all of the throttling / debouncing
* functionality and when executed will limit the rate at which ` callback `
* is executed .
* /
function wrapper ( ) {
for ( var _len = arguments . length , arguments _ = new Array ( _len ) , _key = 0 ; _key < _len ; _key ++ ) {
arguments _ [ _key ] = arguments [ _key ] ;
}
var self = this ;
var elapsed = Date . now ( ) - lastExec ;
if ( cancelled ) {
return ;
} // Execute `callback` and update the `lastExec` timestamp.
function exec ( ) {
lastExec = Date . now ( ) ;
callback . apply ( self , arguments _ ) ;
}
/ *
* If ` debounceMode ` is true ( at begin ) this is used to clear the flag
* to allow future ` callback ` executions .
* /
function clear ( ) {
timeoutID = undefined ;
}
if ( ! noLeading && debounceMode && ! timeoutID ) {
/ *
* Since ` wrapper ` is being called for the first time and
* ` debounceMode ` is true ( at begin ) , execute ` callback `
* and noLeading != true .
* /
exec ( ) ;
}
clearExistingTimeout ( ) ;
if ( debounceMode === undefined && elapsed > delay ) {
if ( noLeading ) {
/ *
* In throttle mode with noLeading , if ` delay ` time has
* been exceeded , update ` lastExec ` and schedule ` callback `
* to execute after ` delay ` ms .
* /
lastExec = Date . now ( ) ;
if ( ! noTrailing ) {
timeoutID = setTimeout ( debounceMode ? clear : exec , delay ) ;
}
} else {
/ *
* In throttle mode without noLeading , if ` delay ` time has been exceeded , execute
* ` callback ` .
* /
exec ( ) ;
}
} else if ( noTrailing !== true ) {
/ *
* In trailing throttle mode , since ` delay ` time has not been
* exceeded , schedule ` callback ` to execute ` delay ` ms after most
* recent execution .
*
* If ` debounceMode ` is true ( at begin ) , schedule ` clear ` to execute
* after ` delay ` ms .
*
* If ` debounceMode ` is false ( at end ) , schedule ` callback ` to
* execute after ` delay ` ms .
* /
timeoutID = setTimeout ( debounceMode ? clear : exec , debounceMode === undefined ? delay - elapsed : delay ) ;
}
}
wrapper . cancel = cancel ; // Return the wrapper function.
return wrapper ;
}
/* eslint-disable no-undefined */
/ * *
* Debounce execution of a function . Debouncing , unlike throttling ,
* guarantees that a function is only executed a single time , either at the
* very beginning of a series of calls , or at the very end .
*
* @ param { number } delay - A zero - or - greater delay in milliseconds . For event callbacks , values around 100 or 250 ( or even higher ) are most useful .
* @ param { Function } callback - A function to be executed after delay milliseconds . The ` this ` context and all arguments are passed through , as - is ,
* to ` callback ` when the debounced - function is executed .
* @ param { object } [ options ] - An object to configure options .
* @ param { boolean } [ options . atBegin ] - Optional , defaults to false . If atBegin is false or unspecified , callback will only be executed ` delay ` milliseconds
* after the last debounced - function call . If atBegin is true , callback will be executed only at the first debounced - function call .
* ( After the throttled - function has not been called for ` delay ` milliseconds , the internal counter is reset ) .
*
* @ returns { Function } A new , debounced function .
* /
function debounce ( delay , callback , options ) {
var _ref = options || { } ,
_ref$atBegin = _ref . atBegin ,
atBegin = _ref$atBegin === void 0 ? false : _ref$atBegin ;
return throttle ( delay , callback , {
debounceMode : atBegin !== false
} ) ;
}
//# sourceMappingURL=index.js.map
/***/ } )
/******/ } ) ;
/************************************************************************/
/******/ // The module cache
/******/ var _ _webpack _module _cache _ _ = { } ;
/******/
/******/ // The require function
/******/ function _ _webpack _require _ _ ( moduleId ) {
/******/ // Check if module is in cache
/******/ var cachedModule = _ _webpack _module _cache _ _ [ moduleId ] ;
/******/ if ( cachedModule !== undefined ) {
/******/ return cachedModule . exports ;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = _ _webpack _module _cache _ _ [ moduleId ] = {
/******/ // no module.id needed
/******/ // no module.loaded needed
/******/ exports : { }
/******/ } ;
/******/
/******/ // Execute the module function
/******/ _ _webpack _modules _ _ [ moduleId ] ( module , module . exports , _ _webpack _require _ _ ) ;
/******/
/******/ // Return the exports of the module
/******/ return module . exports ;
/******/ }
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ _ _webpack _require _ _ . m = _ _webpack _modules _ _ ;
/******/
/************************************************************************/
/******/ /* webpack/runtime/chunk loaded */
/******/ ( ( ) => {
/******/ var deferred = [ ] ;
/******/ _ _webpack _require _ _ . O = ( result , chunkIds , fn , priority ) => {
/******/ if ( chunkIds ) {
/******/ priority = priority || 0 ;
/******/ for ( var i = deferred . length ; i > 0 && deferred [ i - 1 ] [ 2 ] > priority ; i -- ) deferred [ i ] = deferred [ i - 1 ] ;
/******/ deferred [ i ] = [ chunkIds , fn , priority ] ;
/******/ return ;
/******/ }
/******/ var notFulfilled = Infinity ;
/******/ for ( var i = 0 ; i < deferred . length ; i ++ ) {
/******/ var [ chunkIds , fn , priority ] = deferred [ i ] ;
/******/ var fulfilled = true ;
/******/ for ( var j = 0 ; j < chunkIds . length ; j ++ ) {
/******/ if ( ( priority & 1 === 0 || notFulfilled >= priority ) && Object . keys ( _ _webpack _require _ _ . O ) . every ( ( key ) => ( _ _webpack _require _ _ . O [ key ] ( chunkIds [ j ] ) ) ) ) {
/******/ chunkIds . splice ( j -- , 1 ) ;
/******/ } else {
/******/ fulfilled = false ;
/******/ if ( priority < notFulfilled ) notFulfilled = priority ;
/******/ }
/******/ }
/******/ if ( fulfilled ) {
/******/ deferred . splice ( i -- , 1 )
/******/ var r = fn ( ) ;
/******/ if ( r !== undefined ) result = r ;
/******/ }
/******/ }
/******/ return result ;
/******/ } ;
/******/ } ) ( ) ;
/******/
/******/ /* webpack/runtime/define property getters */
/******/ ( ( ) => {
/******/ // define getter functions for harmony exports
/******/ _ _webpack _require _ _ . d = ( exports , definition ) => {
/******/ for ( var key in definition ) {
/******/ if ( _ _webpack _require _ _ . o ( definition , key ) && ! _ _webpack _require _ _ . o ( exports , key ) ) {
/******/ Object . defineProperty ( exports , key , { enumerable : true , get : definition [ key ] } ) ;
/******/ }
/******/ }
/******/ } ;
/******/ } ) ( ) ;
/******/
/******/ /* webpack/runtime/hasOwnProperty shorthand */
/******/ ( ( ) => {
/******/ _ _webpack _require _ _ . o = ( obj , prop ) => ( Object . prototype . hasOwnProperty . call ( obj , prop ) )
/******/ } ) ( ) ;
/******/
/******/ /* webpack/runtime/make namespace object */
/******/ ( ( ) => {
/******/ // define __esModule on exports
/******/ _ _webpack _require _ _ . r = ( exports ) => {
/******/ if ( typeof Symbol !== 'undefined' && Symbol . toStringTag ) {
/******/ Object . defineProperty ( exports , Symbol . toStringTag , { value : 'Module' } ) ;
/******/ }
/******/ Object . defineProperty ( exports , '__esModule' , { value : true } ) ;
/******/ } ;
/******/ } ) ( ) ;
/******/
/******/ /* webpack/runtime/jsonp chunk loading */
/******/ ( ( ) => {
/******/ // no baseURI
/******/
/******/ // object to store loaded and loading chunks
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // [resolve, reject, Promise] = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ "/example" : 0 ,
/******/ "example" : 0
/******/ } ;
/******/
/******/ // no chunk on demand loading
/******/
/******/ // no prefetching
/******/
/******/ // no preloaded
/******/
/******/ // no HMR
/******/
/******/ // no HMR manifest
/******/
/******/ _ _webpack _require _ _ . O . j = ( chunkId ) => ( installedChunks [ chunkId ] === 0 ) ;
/******/
/******/ // install a JSONP callback for chunk loading
/******/ var webpackJsonpCallback = ( parentChunkLoadingFunction , data ) => {
/******/ var [ chunkIds , moreModules , runtime ] = data ;
/******/ // add "moreModules" to the modules object,
/******/ // then flag all "chunkIds" as loaded and fire callback
/******/ var moduleId , chunkId , i = 0 ;
/******/ if ( chunkIds . some ( ( id ) => ( installedChunks [ id ] !== 0 ) ) ) {
/******/ for ( moduleId in moreModules ) {
/******/ if ( _ _webpack _require _ _ . o ( moreModules , moduleId ) ) {
/******/ _ _webpack _require _ _ . m [ moduleId ] = moreModules [ moduleId ] ;
/******/ }
/******/ }
/******/ if ( runtime ) var result = runtime ( _ _webpack _require _ _ ) ;
/******/ }
/******/ if ( parentChunkLoadingFunction ) parentChunkLoadingFunction ( data ) ;
/******/ for ( ; i < chunkIds . length ; i ++ ) {
/******/ chunkId = chunkIds [ i ] ;
/******/ if ( _ _webpack _require _ _ . o ( installedChunks , chunkId ) && installedChunks [ chunkId ] ) {
/******/ installedChunks [ chunkId ] [ 0 ] ( ) ;
/******/ }
/******/ installedChunks [ chunkId ] = 0 ;
/******/ }
/******/ return _ _webpack _require _ _ . O ( result ) ;
/******/ }
/******/
/******/ var chunkLoadingGlobal = self [ "webpackChunk_tiny_components_masonry" ] = self [ "webpackChunk_tiny_components_masonry" ] || [ ] ;
/******/ chunkLoadingGlobal . forEach ( webpackJsonpCallback . bind ( null , 0 ) ) ;
/******/ chunkLoadingGlobal . push = webpackJsonpCallback . bind ( null , chunkLoadingGlobal . push . bind ( chunkLoadingGlobal ) ) ;
/******/ } ) ( ) ;
/******/
/************************************************************************/
/******/
/******/ // startup
/******/ // Load entry module and return exports
/******/ // This entry module depends on other loaded chunks and execution need to be delayed
/******/ _ _webpack _require _ _ . O ( undefined , [ "example" ] , ( ) => ( _ _webpack _require _ _ ( "./src/example.js" ) ) )
/******/ var _ _webpack _exports _ _ = _ _webpack _require _ _ . O ( undefined , [ "example" ] , ( ) => ( _ _webpack _require _ _ ( "./src/example.scss" ) ) )
/******/ _ _webpack _exports _ _ = _ _webpack _require _ _ . O ( _ _webpack _exports _ _ ) ;
/******/
/******/ } ) ( )
;
