{"version":3,"sources":["webpack:///./app/javascript/packs/bo_seats/select_seats.js"],"names":["SelectSeat","seatBoxes","Array","from","document","querySelectorAll","selectedSeatNumbersInput","querySelector","selectedSeatIdsInput","forEach","seatBox","addEventListener","event","seatState","getAttribute","isOverSelected","style","background","setAttribute","_updateSelectedSeatBox","this","_seatBoxes","_selectedSeatNumbersInput","_selectedSeatIdsInput","selectedSeatBoxes","_selectedSeatBoxes","selectedSeatNumbers","map","selectedSeatIds","id","value","filter","length","selectedCount","MAX_SELECTABLE_SEAT_COUNT"],"mappings":"qPAAMA,E,WACJ,aAAe,IAAD,Q,4FAAA,SACZ,IAAMC,EAAYC,MAAMC,KAAKC,SAASC,iBAAiB,cACjDC,EAA2BF,SAASG,cAAc,sBAClDC,EAAuBJ,SAASG,cAAc,sBAEpDN,EAAUQ,SAAQ,SAAAC,GAChBA,EAAQC,iBAAiB,SAAS,SAAAC,GAChC,IAAMC,EAAYH,EAAQI,aAAa,QACrB,cAAdD,EACE,EAAKE,iBAGPL,EAAQM,MAAMC,WAAa,oBAC3BP,EAAQQ,aAAa,OAAQ,iBAER,iBAAdL,IACTH,EAAQM,MAAMC,WAAa,qBAC3BP,EAAQQ,aAAa,OAAQ,cAG/B,EAAKC,+BAKTC,KAAKC,WAAapB,EAGlBmB,KAAKE,0BAA4BhB,EAGjCc,KAAKG,sBAAwBf,E,wEAa7B,IAAMgB,EAAoBJ,KAAKK,qBACzBC,EAAsBF,EAAkBG,KAAI,SAAAjB,GAAO,OAAIA,EAAQI,aAAa,YAC5Ec,EAAkBJ,EAAkBG,KAAI,SAAAjB,GAAO,OAAIA,EAAQmB,MACjET,KAAKE,0BAA0BQ,MAAQJ,EACvCN,KAAKG,sBAAsBO,MAAQF,I,2CAQnC,OAAOR,KAAKC,WAAWU,QAAO,SAAArB,GAAO,MAAqC,iBAAjCA,EAAQI,aAAa,a,oCArB1C,OAAOM,KAAKK,qBAAqBO,S,qCAGhC,OAAOZ,KAAKa,eAAiBjC,EAAWkC,+B,gCAsBjElC,EAAWkC,0BAA4B,EAEvC9B,SAASO,iBAAiB,oBAAoB,WAC5C,IAAIX,O","file":"js/bo_seats/select_seats-157b3d29165f940d6be7.chunk.js","sourcesContent":["class SelectSeat {\n  constructor() {\n    const seatBoxes = Array.from(document.querySelectorAll('.seat-box'))\n    const selectedSeatNumbersInput = document.querySelector('.selected-seat-num')\n    const selectedSeatIdsInput = document.querySelector('.selected-seat-ids')\n\n    seatBoxes.forEach(seatBox => {\n      seatBox.addEventListener('click', event => {\n        const seatState = seatBox.getAttribute('name')\n        if (seatState === 'seat-free') {\n          if (this.isOverSelected) {\n            //[TODO] 上限越えを表すアラートなど\n          } else {\n            seatBox.style.background = 'rgb(92, 110, 255)'\n            seatBox.setAttribute('name', 'seat-holding')\n          }\n        } else if (seatState === 'seat-holding') {\n          seatBox.style.background = 'rgb(255, 255, 255)'\n          seatBox.setAttribute('name', 'seat-free')\n        }\n\n        this._updateSelectedSeatBox()\n      })\n    })\n\n    /** @private {Array<HTMLElement>} */\n    this._seatBoxes = seatBoxes\n\n    /** @private {HTMLElement} */\n    this._selectedSeatNumbersInput = selectedSeatNumbersInput\n\n    /** @private {HTMLElement} */\n    this._selectedSeatIdsInput = selectedSeatIdsInput\n  }\n\n  /** @returns {Number} 選択中のシートの数 */\n  get selectedCount() { return this._selectedSeatBoxes().length }\n\n  /** @returns {Boolean} 選択中のシートが上限数を超えているか */\n  get isOverSelected() { return this.selectedCount >= SelectSeat.MAX_SELECTABLE_SEAT_COUNT }\n\n  /**\n   * @private\n   */\n  _updateSelectedSeatBox() {\n    const selectedSeatBoxes = this._selectedSeatBoxes()\n    const selectedSeatNumbers = selectedSeatBoxes.map(seatBox => seatBox.getAttribute('value'))\n    const selectedSeatIds = selectedSeatBoxes.map(seatBox => seatBox.id)\n    this._selectedSeatNumbersInput.value = selectedSeatNumbers\n    this._selectedSeatIdsInput.value = selectedSeatIds\n  }\n\n  /**\n   * @returns {Array<HTMLElement>} 選択中のシート要素の配列\n   * @private\n   */\n  _selectedSeatBoxes() {\n    return this._seatBoxes.filter(seatBox => seatBox.getAttribute('name') === 'seat-holding')\n  }\n}\n\nSelectSeat.MAX_SELECTABLE_SEAT_COUNT = 5\n\ndocument.addEventListener('DOMContentLoaded', () => {\n  new SelectSeat()\n})\n"],"sourceRoot":""}