const alloyFingerUtils = {

    subscribeToAlloyFingerEvts: function subscribeToAlloyFingerEvts() {
        // subscribe to AlloyFinger events, for gesture detection

        const header = 'alloyFingerUtils.subscribeToAlloyFingerEvts: ';
        log(header + 'enter');

        const cardHdrObjects = $('div.card-hdr');
        // get an array of jQuery objects for the card header divs

        const hdrElems = cardHdrObjects.get();
        // get the DOM elements for these objects

        log(header + 'hdrElems.length=' + hdrElems.length);

        hdrElems.forEach(
            function (pElement) {
                var theAF = new AlloyFinger(pElement,
                    {
                        doubleTap: async function doubleTap(evt) {
                            await alloyFingerUtils._handleDoubleTapAsync(evt);
                        }
                    });
            });

        //const txtObjects = $('p.card-text');
        //// get an array of jQuery objects for the lens card text

        //const txtElems = txtObjects.get();
        //// get the DOM elements for these objects

        //const sectionObjects = $('div.section-content');
        //// get an array of jQuery objects for the section content text

        //const sectionElems = sectionObjects.get();
        //// get the DOM elements for these objects

        //const cardElems = txtElems.concat(sectionElems);
        //// append the two arrays

        //cardElems.forEach(
        //    function (pElement) {
        //        var theAF = new AlloyFinger(pElement,
        //            {
        //                multipointStart: async function multipointStart(evt) {
        //                    await alloyFingerUtils._handleMultipointStartAsync(evt);
        //                }
        //            });
        //    });

        log(header + 'leave');
    },

    _getLensIdFromEvent: function _getLensIdFromEvent(evt) {
        //log('_getLensIdFromEvent: enter');

        const hitElem = evt.target;
        // get the target DOM element

        const elemId = hitElem.id;
        // get the DOM element id
        // example
        //  cardTextP1
        //  lensNameS1

        const lensId = lensUIUtils.getLensIdFromElemId(elemId);
        // extract the lens id from the DOM element id

        //log('_getLensIdFromEvent: lensId=' + lensId);
        //log('_getLensIdFromEvent: leave');

        return lensId;
    },

    _toggleLessMoreByEvent(evt) {
        // called when the user double-taps a card header
        // toggle the expanded/collapsed state of the card

        const header = '_toggleLessMoreByEvent: ';
        log(header + 'enter');

        const lensId = alloyFingerUtils._getLensIdFromEvent(evt);

        log(header + 'lensId=' + lensId);

        lensUIUtils.toggleLessMore(lensId, false);
        // toggle the expand/collapse state of the lens card
        // false => do NOT scroll the top of the lens card into view after collapsing

        log(header + 'leave');
    },

    _handleDoubleTapAsync: async function _handleDoubleTapAsync(evt) {
        log('_handleDoubleTapAsync: enter');

        alloyFingerUtils._toggleLessMoreByEvent(evt);

        log('_handleDoubleTapAsync: atc stopImmediatePropagation');

        evt.stopImmediatePropagation();
        // stop the double tap event from propagating
        // if it does, on some devices, it will zoom the browser which we don't want to happen

        log('_handleDoubleTapAsync: bf stopImmediatePropagation');
        log('_handleDoubleTapAsync: leave');
    },

    _handleAlloyFingerSwipe: function _handleAlloyFingerSwipe(evt) {
        const header = '_handleAlloyFingerSwipe: ';
        log(header + 'enter');

        const direction = evt.direction;
        // get the direction of the swipe, for example Left, Right

        log(header + 'direction=' + direction);

        switch (direction) {
            case "Left":

                alloyFingerUtils._handleSwipeLeft(evt);

                break;

            case "Right":

                alloyFingerUtils._handleSwipeRight(evt);

                break;
        }

        log(header + 'leave');
    },

    _handleSwipeRight: function _handleSwipeRight(evt) {
        const header = 'alloyFingerUtils._handleSwipeRight: ';
        log(header + 'enter');

        //log(header + 'setting the bookmark icon to filled');

        //var hitElem = evt.target;
        //// get the target DOM element

        //var lensId = hitElem.id;
        //// get the id of the lens whose image was hit
        //// we set the DOM element ids of the lens images to the ids of the lenses

        //log(header + 'lensId=' + lensId);

        //const imgId = 'imgEB' + lensId;
        //// get the id of the img element for the bookmark for the lens

        //const imgElem = $('#' + imgId);
        //// get the img element of the bookmark for the hit lens

        //if (viewWide) {
        //    // if we are in multi column view

        //    imgElem.attr('src', urlUtils.getUrl('/images/bookmarkfilled-sm.png'));
        //    // set the image source to the small filled bookmark
        //}
        //else {
        //    // if we are in single column view

        //    imgElem.attr('src', urlUtils.getUrl('/images/bookmarkfilled.png'));
        //    // set the image source to the large filled bookmark
        //}

        //log(header + 'adding the lense id to the stored list');

        //bookmarkStorageUtils.addToRestIds(restId);
        //// add the lens id to the list of bookmarked lens ids

        log(header + 'leave');
    },

    _handleSwipeLeft: function _handleSwipeLeft(evt) {
        const header = '_handleSwipeLeft: ';
        log(header + 'enter');
        //log(header + 'setting the bookmark icon to empty');

        //var hitElem = evt.target;
        //// get the target DOM element

        //var lensId = hitElem.id;
        //// get the id of the lens whose image was hit
        //// we set the DOM element ids of the lens images to the ids of the lenses

        //log(header + 'lensId=' + lensId);

        //const imgId = 'imgEB' + lensId;
        //// get the id of the img element for the bookmark for the lens

        //const imgElem = $('#' + imgId);
        //// get the img element of the bookmark for the hit lens

        //if (viewWide) {
        //    // if we are in multi column view

        //    imgElem.attr('src', urlUtils.getUrl('/images/bookmarkempty-sm.png'));
        //    // set the image source to the small empty bookmark
        //}
        //else {
        //    // if we are in single column view

        //    imgElem.attr('src', urlUtils.getUrl('/images/bookmarkempty.png'));
        //    // set the image source to the large empty bookmark
        //}

        //log(header + 'removing the lens id from the stored list');

        //bookmarkStorageUtils.removeFromRestIds(restId);
        //// remove the lens id from the list of bookmarked lens ids

        //const findingBk = searchStateUtils.getFindBookmarked();
        //// are we finding bookmarked rests?

        //log(header + 'findingBk=' + findingBk);

        //if (findingBk) {
        //    // if we are currently finding bookmarked lenses

        //    log(header + 'we are currently finding bookmarked lenses, so we will update the UI');

        //    var parentDivName = 'rest' + restId;
        //    // get the name of the parent div for the lens

        //    $('#' + parentDivName).hide();
        //    // hide the div for the lens

        //    const visCount = showHideRestUtils.restDivsVisibleCount();
        //    // get the number of lens divs which are not hidden

        //    log(header + 'visCount=' + visCount);

        //    if ((visCount < 1) && findingBk) {
        //        // if there are no lenses visible and we are finding bookmarked lenses

        //        log(header + 'there are no lenses visible and we are finding bookmarked lenses, we we will switch to finding by location and reload the page');

        //        searchStateUtils.setFindBookmarked(false);
        //        // swith from finding bookmarked to finding by location

        //        reloadPage();
        //        // reload the page

        //        log(header + 'leave');
        //        return;
        //    }

        //    descrUtils.updateDescriptionAsync(visCount);
        //    // update the description of the lenses found
        //}

        log(header + 'leave');
    },

    _handleAlloyFingerPinch: function _handleAlloyFingerPinch(evt) {
        const header = 'alloyFingerUtils._handleAlloyFingerPinch: ';
        log(header + 'enter');

        //const zoom = evt.zoom;
        //log(header + 'zoom=' + zoom);

        //var hitElem = evt.target;
        //// get the target DOM element

        //var restId = hitElem.id;
        //// get the Yelp id of the lens whose image was hit
        //// we set the DOM element ids of the lens images to the Yelp ids of the lenses

        //log(header + 'restId=' + restId);

        //showHideRestUtils.hideRestByRestId(restId);
        //// hide the specified lens

        log(header + 'leave');
    },

    _handleMultipointStartAsync: async function _handleMultipointStartAsync(evt) {
        const header = 'alloyFingerUtils._handleMultipointStartAsync: ';
        log(header + 'enter');

        const targetTouches = evt.targetTouches;
        // get the array of touches in the target element

        const touchCount = targetTouches.length;
        // how many touches?

        log(header + 'touchCount=' + touchCount);

        if (touchCount < 3) {
            log(header + 'number of touches is less than 3, so we are done');
            log(header + 'leave');
            return;
        }

        const targetTouch = targetTouches[0];
        // get the first touch object

        const elem = targetTouch.target;
        // get the target DOM element

        const elemId = elem.id;
        // get the DOM element id

        log(header + 'elemId=' + elemId);

        const lensId = lensUIUtils.getLensIdFromElemId(elemId);
        // extract the lens id from the element id

        log(header + 'three finger touch detected, lensId=' + lensId);

        lensUIUtils.toggleLessMore(lensId, false);
        // toggle expand/collapse for the lens card

        log(header + 'leave');
    }
};