trunkdjs-a9f1f17.js

class Trunkd {
  constructor(container, options = {}) {
    this.container = container || '.trunkd';
    this.options = {
      antecedent: options.antecedent || 'Recommended by:',
      consequent: options.consequent || 'others',
      seperator: options.seperator || ','
    }

    const sum = arr => arr.reduce((a, b) => a + b);
    const containerSelector = document.querySelector(this.container);
    const itemSelector = containerSelector.children;

    let availableWidth = containerSelector.clientWidth;
    let totalItems = itemSelector.length;
    let itemsWidths = this.makeArray(itemSelector);
    let itemsWidth = sum(itemsWidths);

    if (itemsWidth >= availableWidth) {
      let totalElement = containerSelector.appendChild(document.createElement('li'));
      totalElement.textContent = `and ${totalItems} ${this.options.consequent}`;
    }
    
    console.log(this);
    console.log(availableWidth);
    console.log(itemsWidth);
  }

  // sum(arr) {
  //   arr => arr.reduce((a, b) => a + b);
  // }

  makeArray(obj) {
    let itemsArr = [];

    for (var i=0; i < obj.length; i++) {
      itemsArr.push(obj[i].clientWidth);
    }

    return itemsArr;
  }
}

// export default Trunkd;

const trunkd = new Trunkd();




// window.addEventListener('resize', function(event) {})

// console.log(container.children.length)


// const container = document.querySelector('.recommendr')
// const rcmdr = new Recommendr(container, {
//   // options...
//   itemSelector: 'li'
// });





// const sum = arr => arr.reduce((a, b) => a + b);

// let containerSelector = document.querySelector('.recommendr');
// let itemSelector = containerSelector.children;
// let totalItems = itemSelector.length - 1;

// let itemsArr = [];

// for (var i = itemSelector.length - 1; i >= 0; i--) {
//   itemsArr.push(itemSelector[i].clientWidth);
// }

// let availableWidth = containerSelector.clientWidth;
// let itemsWidth = sum(itemsArr);

// if (itemsWidth >= availableWidth) {
//   let totalElement = containerSelector.appendChild(document.createElement('li'));
//   totalElement.textContent = `and ${totalItems} others`;
// }

// console.log(availableWidth);
// console.log(itemsWidth);






// totalElement.textContent = `and ${totalItems} others`;

// for (var i = itemSelector.length - 1; i >= 0; i--) {
//   console.log(itemSelector[i].clientWidth);
// }

// for (var i = yearStart; i < yearEnd+1; i++) {
//     arr.push(i);
// }

// window.addEventListener('resize', function(event) {
//   console.log(containerSelector.clientWidth);
// });