// noprotect
'use strict';

var _get = function get(_x4, _x5, _x6) { var _again = true; _function: while (_again) { var object = _x4, property = _x5, receiver = _x6; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x4 = parent; _x5 = property; _x6 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };

var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();

function _inherits(subClass, superClass) { if (typeof superClass !== 'function' && superClass !== null) { throw new TypeError('Super expression must either be null or a function, not ' + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }

(function () {
  'use strict';
  // prevent form from submitting and redirecting
  document.getElementById('vehicle-form').addEventListener('submit', function (event) {
    event.preventDefault();
    event.stopPropagation();
    return false;
  });

  var createRandomVehicle,
      createVehicleLi,
      vehicleRegistry,
      liData = Symbol('vehicle data'),
      vehicleUl = document.getElementById('vehicle-list'),
      liTemplate = vehicleUl.querySelector('template'),
      nameInput = document.getElementById('name-input'),
      typeSelect = document.getElementById('type-select'),
      createBtn = document.getElementById('create-vehicle'),
      loader = document.getElementById('loader');

  // create classes

  var Vehicle = (function () {
    function Vehicle() {
      var name = arguments.length <= 0 || arguments[0] === undefined ? '' : arguments[0];
      var wheels = arguments.length <= 1 || arguments[1] === undefined ? 1 : arguments[1];
      var seats = arguments.length <= 2 || arguments[2] === undefined ? 1 : arguments[2];

      _classCallCheck(this, Vehicle);

      this.setName(name);
      this.wheels = wheels;
      this.seats = seats;
    }

    _createClass(Vehicle, [{
      key: 'getName',
      value: function getName() {
        return this.name;
      }
    }, {
      key: 'setName',
      value: function setName(newName) {
        return this.name = newName;
      }

      // using the classic _ for "hidden" props
      // could use an ES6 Symbol instead
    }, {
      key: 'toString',
      value: function toString() {
        return 'I am ' + this.name + ', a ' + this.type + ' with ' + this.wheels + ' wheels, and ' + this.seats + ' seats!';
      }
    }, {
      key: 'wheels',
      get: function get() {
        return this._wheels;
      },
      set: function set(newWheels) {
        return this._wheels = newWheels;
      }
    }, {
      key: 'seats',
      get: function get() {
        return this._seats;
      },
      set: function set(newSeats) {
        return this._seats = newSeats;
      }
    }, {
      key: 'type',
      get: function get() {
        return this.constructor.name;
      }
    }]);

    return Vehicle;
  })();

  var Car = (function (_Vehicle) {
    _inherits(Car, _Vehicle);

    function Car(name) {
      _classCallCheck(this, Car);

      _get(Object.getPrototypeOf(Car.prototype), 'constructor', this).call(this, name, 4, 5);
    }

    return Car;
  })(Vehicle);

  var Motorcycle = (function (_Vehicle2) {
    _inherits(Motorcycle, _Vehicle2);

    function Motorcycle(name) {
      _classCallCheck(this, Motorcycle);

      _get(Object.getPrototypeOf(Motorcycle.prototype), 'constructor', this).call(this, name, 2, 2);
    }

    // Populate Vehicle Registry
    return Motorcycle;
  })(Vehicle);

  vehicleRegistry = new Map([['vehicle', Vehicle], ['car', Car], ['motorcycle', Motorcycle]]);

  // create and populate select options
  vehicleRegistry.forEach(function (value, key) {
    var opt = document.createElement('option');

    opt.value = key;
    opt.innerHTML = value.name;

    // pre-select Car
    if (key === 'car') {
      opt.selected = true;
    }

    typeSelect.appendChild(opt);
  });

  // creates a vehicle and adds it to the UL#vehicle-list
  createVehicleLi = function (type, name) {
    var newLi,
        construct = vehicleRegistry.get(type);

    newLi = liTemplate.content.cloneNode(true).children[0];
    newLi.innerHTML = newLi.innerHTML.replace('{{name}}', name);

    // attach vehicle to li element for use later
    newLi[liData] = new construct(name);

    vehicleUl.appendChild(newLi);
  };

  // fetches a random name for the new vehicle
  createRandomVehicle = function (type) {
    try {
      loader.classList.remove('hidden');
      fetch('https://randomuser.me/api/?format=json&results=1').then(function (response) {
        return response.json();
      }).then(function (json) {
        var name = json.results[0].user.name.first;
        name = name.charAt(0).toUpperCase() + name.slice(1);
        createVehicleLi(type, name);
        loader.classList.add('hidden');
      })['catch'](function (error) {
        console.error('Something in the promise chain failed');
        console.error(error.stack || error);
        loader.classList.add('hidden');
      });
    } catch (error) {
      console.error('This browser must not support the Fetch API');
      loader.classList.add('hidden');
    }
  };

  // create vehicle button listener
  createBtn.addEventListener('click', function (event) {
    var type = typeSelect.value,
        name = nameInput.value;

    event.preventDefault();
    event.stopPropagation();

    if (name !== '') {
      createVehicleLi(type, name);
    } else {
      createRandomVehicle(type);
    }

    setImmediate(function () {
      nameInput.value = '';
    });

    return false;
  });

  // info button listener delegated to the UL containing all LIs
  vehicleUl.addEventListener('click', function (evnet) {
    var parent,
        target = event.target;

    if (target.tagName === 'BUTTON' && (parent = target.parentNode)[liData] instanceof Vehicle) {
      alert(parent[liData].toString());
    }
  });
})();