@tarojs/taro-h5 3.3.18 → 3.3.19

package/dist/api/wxml/selectorQuery.js

@@ -0,0 +1,140 @@
+import { findDOM } from '../utils';
+import { NodesRef } from './nodesRef';
+function filter(fields, dom, selector) {
+    if (!dom)
+        return null;
+    const { id, dataset, rect, size, scrollOffset, properties = [], computedStyle = [] } = fields;
+    const { left, right, top, bottom, width, height } = dom.getBoundingClientRect();
+    const isViewport = selector === 'html';
+    const res = {};
+    if (id)
+        res.id = dom.id;
+    if (dataset)
+        res.dataset = Object.assign({}, dom.dataset);
+    if (rect) {
+        if (!isViewport) {
+            res.left = left;
+            res.right = right;
+            res.top = top;
+            res.bottom = bottom;
+        }
+        else {
+            res.left = 0;
+            res.right = 0;
+            res.top = 0;
+            res.bottom = 0;
+        }
+    }
+    if (size) {
+        if (!isViewport) {
+            res.width = width;
+            res.height = height;
+        }
+        else {
+            res.width = dom.clientWidth;
+            res.height = dom.clientHeight;
+        }
+    }
+    if (scrollOffset) {
+        res.scrollLeft = dom.scrollLeft;
+        res.scrollTop = dom.scrollTop;
+    }
+    if (properties.length) {
+        properties.forEach(prop => {
+            const attr = dom.getAttribute(prop);
+            if (attr)
+                res[prop] = attr;
+        });
+    }
+    if (computedStyle.length) {
+        const styles = window.getComputedStyle(dom);
+        computedStyle.forEach(key => {
+            const value = styles.getPropertyValue(key) || styles[key];
+            if (value)
+                res[key] = value;
+        });
+    }
+    return res;
+}
+function queryBat(queue, cb) {
+    const result = [];
+    queue.forEach(item => {
+        var _a;
+        const { selector, single, fields, component } = item;
+        const container = (component !== null ?
+            (findDOM(component) || document) :
+            document);
+        let selectSelf = false;
+        if (container !== document) {
+            const $nodeList = (_a = container.parentNode) === null || _a === void 0 ? void 0 : _a.querySelectorAll(selector);
+            if ($nodeList) {
+                for (let i = 0, len = $nodeList.length; i < len; ++i) {
+                    if (container === $nodeList[i]) {
+                        selectSelf = true;
+                        break;
+                    }
+                }
+            }
+        }
+        if (single) {
+            const el = selectSelf === true ? container : container.querySelector(selector);
+            result.push(filter(fields, el, selector));
+        }
+        else {
+            const $children = container.querySelectorAll(selector);
+            const children = [];
+            selectSelf === true && children.push(container);
+            for (let i = 0, len = $children.length; i < len; ++i) {
+                children.push($children[i]);
+            }
+            result.push(children.map(dom => filter(fields, dom)));
+        }
+    });
+    cb(result);
+}
+export class SelectorQuery {
+    constructor() {
+        this._defaultWebviewId = null;
+        this._webviewId = null;
+        this._queue = [];
+        this._queueCb = [];
+        this._component;
+    }
+    in(component) {
+        this._component = component;
+        return this;
+    }
+    select(selector) {
+        if (typeof selector === 'string')
+            selector = selector.replace('>>>', '>');
+        return new NodesRef(selector, this, true);
+    }
+    selectAll(selector) {
+        if (typeof selector === 'string')
+            selector = selector.replace('>>>', '>');
+        return new NodesRef(selector, this, false);
+    }
+    selectViewport() {
+        return new NodesRef('html', this, true);
+    }
+    exec(cb) {
+        queryBat(this._queue, res => {
+            const _queueCb = this._queueCb;
+            res.forEach((item, index) => {
+                const cb = _queueCb[index];
+                typeof cb === 'function' && cb.call(this, item);
+            });
+            typeof cb === 'function' && cb.call(this, res);
+        });
+        return this;
+    }
+    _push(selector, component, single, fields, callback = null) {
+        this._queue.push({
+            component,
+            selector,
+            single,
+            fields
+        });
+        this._queueCb.push(callback);
+    }
+}