@kizmann/pico-js 1.0.10 → 1.0.12

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@kizmann/pico-js",
-    "version": "1.0.10",
+    "version": "1.0.12",
     "license": "MIT",
     "type": "module",
     "private": false,

package/src/utility/dom.js

@@ -133,11 +133,13 @@ export class Dom
         return this.get(0) && this.get(0).is(':visible');
     }
 
-    inviewHeight()
+    inviewHeight(boundry = window)
     {
+        let parent = Dom.find(boundry);
+
         let viewport = {
-            width: Dom.find(window).width(),
-            height: Dom.find(window).height(),
+            width: parent.width(),
+            height: parent.height(),
         };
 
         let element = {
@@ -148,10 +150,12 @@ export class Dom
         let scroll = this.scroll(),
             offset = this.offset();
 
-        let bottom = offset.top + element.height;
+        let [top, bottom] = [
+            scroll.top + parent.offset('top'), offset.top + element.height
+        ];
 
-        return Math.max(0, Math.min(bottom, viewport.height + scroll.top) -
-            Math.max(offset.top, scroll.top))
+        return Math.max(0, Math.min(bottom, viewport.height + top) -
+            Math.max(offset.top, top))
     }
 
     inviewX(ratio = 0)
@@ -202,33 +206,61 @@ export class Dom
         return top <= scroll.top && scroll.top <= bottom;
     }
 
-    static inviewMaxY(selector, callback = null, context = null)
+    static inviewMaxY(options, callback = null)
     {
-        let [items, attr] = [
-            [], selector.replace(/^\[([^="]+)]$/, '$1')
-        ];
+        let defaults = {
+            el: '[data-inview]', parent: document.body, multiple: false, safezone: null,
+        };
+
+        if ( Any.isString(options) ) {
+            options = { el: options };
+        }
+
+        let boundry = Dom.find(options.parent)
+            .closestScrollable(window);
+
+        options = Obj.assign({}, defaults, options);
+
+        let safeback = (item) => {
+            return Math.min(Dom.find(item.el).height() * 0.5, Dom.find(boundry).height() * 0.2);
+        };
 
-        let parent = Dom.find(selector);
+        let safezone = options.safezone;
 
-        if ( ! Any.isNull(context) ) {
-            parent = Dom.find(context).find(selector);
+        if ( Any.isNull(safezone) ) {
+            safezone = safeback;
         }
 
+        if ( ! Any.isFunction(safezone) ) {
+            safezone = () => options.safezone;
+        }
+
+        let [items, attr] = [
+            [], options.el.replace(/^\[([^="]+)]$/, '$1')
+        ];
+
+        let parent = Dom.find(options.parent).find(options.el);
+
         parent.each((el) => {
-            items.push({ el, height: Dom.find(el).inviewHeight() });
+            items.push({
+                el, attr: Dom.find(el).attr(attr), height: Dom.find(el).inviewHeight(boundry)
+            });
         });
 
-        let heights = Arr.extract(items, 'height');
+        let results = Arr.filter(items, (item) => {
+            return Math.max(0, item.height - safezone(item)) !== 0;
+        });
 
-        let el = Arr.find(items, (item) => {
-            return item.height === Math.max(...heights);
+        results = Arr.sort(results, (a, b) => {
+            return a.height >= b.height ? -1 : 1;
         });
 
-        if ( ! Any.isEmpty(el) && Any.isFunction(callback) ) {
-            callback.call({}, el.el, el.el.getAttribute(attr));
-        }
+        Arr.each(results, (item, index) => {
+            Any.isFunction(callback) && callback.call({}, item, index);
+        });
 
-        return el.el;
+        return options.multiple ? Arr.extract(results, 'el') :
+            Obj.get(results, '0.el');
     }
 
     is(selector)
@@ -332,7 +364,6 @@ export class Dom
             return this.find(selector).get(0) !== null;
         }
 
-
         if ( selector instanceof Element === false ) {
             return false;
         }
@@ -414,6 +445,10 @@ export class Dom
             return Dom.find(null);
         }
 
+        if ( el instanceof Window ) {
+            el = document;
+        }
+
         let nodes = el.querySelectorAll(selector);
 
         nodes = Array.prototype.slice.call(nodes);