poi-plugin-item-improvement2 0.0.1

package/views/starcraft/equip-list-view.js

@@ -0,0 +1,100 @@
+"use strict";
+
+exports.__esModule = true;
+exports.EquipListView = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _lodash = _interopRequireDefault(require("lodash"));
+
+var _reactBootstrap = require("react-bootstrap");
+
+var _equipView = require("./equip-view");
+
+var _addNewEquipView = require("./add-new-equip-view");
+
+var _equiptype = require("./equiptype");
+
+var _utils = require("./utils");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+// props:
+// - $equips
+// - equipLevels
+// - equipMstIds
+// - plans
+// - viewMode
+class EquipListView extends _react.Component {
+  shouldComponentUpdate(nextProps) {
+    return this.props.viewMode !== nextProps.viewMode || !_lodash.default.isEqual(this.props.equipMstIds, nextProps.equipMstIds) || !_lodash.default.isEqual(this.props.plans, nextProps.plans) || !(0, _utils.isEquipMasterEqual)(this.props.$equips, nextProps.$equips);
+  }
+
+  render() {
+    // equipment list for those that has plans.
+    const equipList = []; // equipment list for those that doesn't have plans
+
+    const equipListNoPlan = [];
+    const $equips = this.props.$equips;
+    this.props.equipMstIds.map(mstId => {
+      const plans = this.props.plans[mstId];
+      const $equip = $equips[mstId];
+      const name = $equip.api_name;
+      const iconId = (0, _equiptype.getIconId)($equip);
+
+      if (plans) {
+        equipList.push({
+          mstId,
+          name,
+          iconId,
+          plans
+        });
+      } else {
+        equipListNoPlan.push({
+          mstId,
+          name,
+          iconId
+        });
+      }
+    });
+    return _react.default.createElement(_reactBootstrap.ListGroup, {
+      style: {
+        marginBottom: '0'
+      }
+    }, equipList.map(args => _react.default.createElement(_reactBootstrap.ListGroupItem, {
+      style: {
+        padding: '0'
+      },
+      key: args.mstId
+    }, _react.default.createElement("div", null, _react.default.createElement(_equipView.EquipView, _extends({
+      viewMode: this.props.viewMode
+    }, args))))), !this.props.viewMode && equipListNoPlan.length > 0 && _react.default.createElement(_reactBootstrap.ListGroupItem, {
+      style: {
+        padding: '0'
+      },
+      key: "noplan"
+    }, _react.default.createElement("div", null, _react.default.createElement(_addNewEquipView.AddNewEquipView, {
+      equips: equipListNoPlan
+    }))));
+  }
+
+}
+
+exports.EquipListView = EquipListView;
+Object.defineProperty(EquipListView, "propTypes", {
+  configurable: true,
+  enumerable: true,
+  writable: true,
+  value: {
+    viewMode: _propTypes.default.bool.isRequired,
+    $equips: _propTypes.default.object.isRequired,
+    plans: _propTypes.default.object.isRequired,
+    equipMstIds: _propTypes.default.arrayOf(_propTypes.default.number).isRequired
+  }
+});

package/views/starcraft/equip-view.js

@@ -0,0 +1,142 @@
+"use strict";
+
+exports.__esModule = true;
+exports.EquipView = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _reactRedux = require("react-redux");
+
+var _reactBootstrap = require("react-bootstrap");
+
+var _icon = require("views/components/etc/icon");
+
+var _planView = require("./plan-view");
+
+var _planModifyControl = require("./plan-modify-control");
+
+var _utils = require("./utils");
+
+var _selectors = require("../selectors");
+
+var _class, _temp2;
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+const {
+  __
+} = window.i18n['poi-plugin-item-improvement']; // props:
+// - mstId, name, iconId, plans, viewMode
+
+const EquipView = (0, _reactRedux.connect)((state, {
+  mstId
+}) => ({
+  levels: (0, _selectors.itemLevelStatFactory)(mstId)(state)
+}))((_temp2 = _class = class EquipView extends _react.Component {
+  constructor(...args) {
+    var _temp;
+
+    return _temp = super(...args), Object.defineProperty(this, "handleRemove", {
+      configurable: true,
+      enumerable: true,
+      writable: true,
+      value: mstId => () => {
+        (0, _utils.modifyPlans)(plans => {
+          const newPlans = _extends({}, plans);
+
+          delete newPlans[mstId];
+          return newPlans;
+        });
+      }
+    }), _temp;
+  }
+
+  render() {
+    const {
+      mstId,
+      name,
+      iconId,
+      plans,
+      levels,
+      viewMode
+    } = this.props; // sort plans because its is not guaranteed to be ordered.
+
+    const planArr = Object.keys(plans).map(k => {
+      const star = parseInt(k, 10);
+      const planCount = plans[k];
+      const actualCount = levels.filter(lvl => lvl >= star).length;
+      return {
+        star,
+        planCount,
+        actualCount
+      };
+    });
+    planArr.sort((x, y) => x.star - y.star);
+    if (viewMode && planArr.length === 0) return null;
+    return _react.default.createElement("div", null, !this.props.hideTitle && _react.default.createElement("div", {
+      style: {
+        display: 'flex',
+        borderBottom: 'solid 1px #666',
+        alignItems: 'center'
+      }
+    }, _react.default.createElement(_icon.SlotitemIcon, {
+      slotitemId: iconId,
+      className: "equip-icon"
+    }), _react.default.createElement("div", {
+      style: {
+        flex: 1
+      }
+    }, name), // allow an equipment entity to be removed when it's empty
+    planArr.length === 0 && _react.default.createElement(_reactBootstrap.Button, {
+      onClick: this.handleRemove(mstId),
+      style: {
+        margin: '5px'
+      },
+      bsStyle: "warning"
+    }, __('Remove'))), _react.default.createElement("div", {
+      onClick: e => e.stopPropagation(),
+      style: {
+        width: '80%',
+        maxWidth: '500px',
+        margin: 'auto',
+        marginBottom: '2px',
+        marginTop: '2px'
+      }
+    }, planArr.map(args => _react.default.createElement(_planView.PlanView, _extends({
+      viewMode: this.props.viewMode,
+      mstId: mstId,
+      key: `plan-${mstId}-${args.star}`
+    }, args))), !this.props.viewMode && _react.default.createElement(_planModifyControl.PlanModifyControl, {
+      mstId: mstId,
+      plans: plans
+    })));
+  }
+
+}, Object.defineProperty(_class, "propTypes", {
+  configurable: true,
+  enumerable: true,
+  writable: true,
+  value: {
+    mstId: _propTypes.default.number.isRequired,
+    iconId: _propTypes.default.number.isRequired,
+    viewMode: _propTypes.default.bool.isRequired,
+    name: _propTypes.default.string.isRequired,
+    levels: _propTypes.default.arrayOf(_propTypes.default.number).isRequired,
+    plans: _propTypes.default.object.isRequired,
+    hideTitle: _propTypes.default.bool
+  }
+}), Object.defineProperty(_class, "defaultProps", {
+  configurable: true,
+  enumerable: true,
+  writable: true,
+  value: {
+    hideTitle: false
+  }
+}), _temp2));
+exports.EquipView = EquipView;

package/views/starcraft/equiptype.js

@@ -0,0 +1,109 @@
+"use strict";
+
+exports.__esModule = true;
+exports.prepareEquipTypeInfo = exports.getIconId = exports.getCatId = void 0;
+
+/*
+
+   Equipment type related functions
+
+   - Overview
+
+   In "api_mst_slotitem" of "api_start2", equipment type is defined by "api_type",
+   which is an array of length 5 - so there are really 5 different equipment types
+   that one equipment can have.
+
+     - api_type[0]
+
+         Gives a general equipment type, without getting too much into finer details.
+         for example it doesn't distinguish main gun and secondary gun.
+
+     - api_type[1]
+
+         A little more precise than api_type[0]. it distinguishes main
+         and secondary gun, but does not distinguish between seaplanes.
+         (however seaplane fighter does has its own type in this one)
+
+     - api_type[2]: "category"
+
+         One of the most commonly used equipment type, we will be referring to this
+         using term "category". It's the category used in in-game picture book.
+
+     - api_type[3]: "icon"
+
+         Another most commonly used equipment type. Will be referring to this using "icon"
+         This is the equipment icon id used in game.
+
+         Despite that some equipment has the same icon, game mechanism treats them differently.
+         For example some high-angle gun mounts (abbr. HA) are actually
+         small-caliber main guns while other HAs are secondary guns.
+         This is where having notions of both "Category" and "Icon" could be useful.
+
+     - api_type[4]
+
+         Mainly used by aircrafts. Currently I see no need of getting into this.
+
+   - Terms
+
+     - category: api_type[2], see above.
+     - icon: api_type[3], see above.
+
+     - EquipTypeInfo: a structured data
+
+       - catInfo: an object indexed by api_type[2]. its element has the following structure:
+
+         - group: a collection of master ids of equipments of having that icon
+         - icons: all icon ids used by this group of equipments
+
+       - iconInfo: an object indexed by api_type[3], with each element
+         being a collection of master ids of equipments of having that icon
+
+ */
+const getCatId = $equip => $equip.api_type[2];
+
+exports.getCatId = getCatId;
+
+const getIconId = $equip => $equip.api_type[3]; // prepare equipment type related information for further processing
+
+
+exports.getIconId = getIconId;
+
+const prepareEquipTypeInfo = $equips => {
+  const catInfo = {};
+  const iconInfo = {}; // first pass, sets everything but "catInfo[?].icons"
+
+  Object.keys($equips).map(k => {
+    const equip = $equips[k]; // excluding abyssal equipments
+
+    if (equip.api_id > 500) return;
+    const catId = getCatId(equip);
+    const iconId = getIconId(equip);
+    let cat = catInfo[catId];
+    if (typeof cat === 'undefined') cat = {
+      group: []
+    };
+    let icon = iconInfo[iconId];
+    if (typeof icon === 'undefined') icon = [];
+    cat.group.push(equip.api_id);
+    icon.push(equip.api_id);
+    catInfo[catId] = cat;
+    iconInfo[iconId] = icon;
+  }); // second pass, finishing "catInfo[?].icons"
+
+  Object.keys(catInfo).map(k => {
+    const cat = catInfo[k];
+    const icons = [];
+    cat.group.map(mstId => {
+      const equip = $equips[mstId];
+      const iconId = getIconId(equip);
+      if (icons.indexOf(iconId) === -1) icons.push(iconId);
+    });
+    cat.icons = icons.sort();
+  });
+  return {
+    catInfo,
+    iconInfo
+  };
+};
+
+exports.prepareEquipTypeInfo = prepareEquipTypeInfo;

package/views/starcraft/plan-modify-control.js

@@ -0,0 +1,201 @@
+"use strict";
+
+exports.__esModule = true;
+exports.PlanModifyControl = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _reactFontawesome = _interopRequireDefault(require("react-fontawesome"));
+
+var _lodash = _interopRequireDefault(require("lodash"));
+
+var _reactBootstrap = require("react-bootstrap");
+
+var _reactNumericInput = _interopRequireDefault(require("react-numeric-input"));
+
+var _utils = require("./utils");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+const {
+  __
+} = window.i18n['poi-plugin-item-improvement']; // props:
+// - plans: star to plan count
+
+class PlanModifyControl extends _react.Component {
+  constructor() {
+    super();
+    Object.defineProperty(this, "getCurrentAction", {
+      configurable: true,
+      enumerable: true,
+      writable: true,
+      value: () => {
+        if (typeof this.state.planCount !== 'number') return 'invalid';
+        const {
+          star,
+          planCount,
+          isInfinity
+        } = this.state;
+        const oldPlanCount = this.props.plans[star];
+
+        if (oldPlanCount) {
+          // we are editing an existing one
+          return planCount === 0 && !isInfinity ? 'remove' : 'modify';
+        } else {
+          // we are creating a new one
+          return planCount === 0 && !isInfinity ? 'invalid' : 'add';
+        }
+      }
+    });
+    Object.defineProperty(this, "handleChangeStar", {
+      configurable: true,
+      enumerable: true,
+      writable: true,
+      value: e => {
+        const star = parseInt(e.target.value, 10);
+        this.setState({
+          star
+        });
+      }
+    });
+    Object.defineProperty(this, "handleChangeCount", {
+      configurable: true,
+      enumerable: true,
+      writable: true,
+      value: valAsNum => {
+        // note that 'valAsNum' could be 'null'
+        this.setState({
+          planCount: valAsNum
+        });
+      }
+    });
+    Object.defineProperty(this, "handleAction", {
+      configurable: true,
+      enumerable: true,
+      writable: true,
+      value: (action, {
+        star,
+        planCount,
+        isInfinity
+      }) => () => {
+        if (action === 'invalid') return;
+        const mstId = this.props.mstId;
+
+        if (action === 'add' || action === 'modify') {
+          (0, _utils.modifyPlans)(plans => {
+            const newPlans = _extends({}, plans); // it's safe to assume that plans[mstId] must exist at this point
+
+
+            newPlans[mstId] = _extends({}, plans[mstId]);
+            newPlans[mstId][star] = isInfinity ? 10000 : planCount;
+            return newPlans;
+          });
+          return;
+        }
+
+        if (action === 'remove') {
+          (0, _utils.modifyPlans)(plans => {
+            const newPlans = _extends({}, plans); // it's safe to assume that plans[mstId] must exist at this point
+
+
+            newPlans[mstId] = _extends({}, plans[mstId]);
+            delete newPlans[mstId][star];
+            return newPlans;
+          });
+          return;
+        }
+
+        console.error(`undefined action: ${action}`);
+      }
+    });
+    this.state = {
+      star: 0,
+      planCount: 1,
+      isInfinity: true
+    };
+  } // The button action depends on current state
+
+
+  render() {
+    const action = this.getCurrentAction();
+    const [faIcon, btnStyle, btnText] = action === 'add' ? ['plus', 'primary', 'Add'] : action === 'remove' ? ['minus', 'warning', 'Remove'] : action === 'modify' ? ['pencil', 'success', 'Modify'] : action === 'invalid' ? ['ban', 'danger', 'Invalid'] : console.error(`invalid action: ${action}`);
+    const checkboxText = 'Infinity';
+    return _react.default.createElement("div", {
+      style: {
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'space-between',
+        minHeight: '50px'
+      }
+    }, _react.default.createElement(_reactFontawesome.default, {
+      style: {
+        marginRight: '10px',
+        maxWidth: '100px'
+      },
+      name: faIcon
+    }), _react.default.createElement(_reactBootstrap.FormControl, {
+      value: this.state.star,
+      onChange: this.handleChangeStar,
+      style: {
+        flex: 1,
+        marginRight: '10px',
+        maxWidth: '100px'
+      },
+      componentClass: "select"
+    }, _lodash.default.range(0, 10 + 1).map(star => _react.default.createElement("option", {
+      key: star,
+      value: star
+    }, (0, _utils.starText)(star)))), _react.default.createElement("div", {
+      style: {
+        flex: 1,
+        marginRight: '10px',
+        maxWidth: '100px'
+      }
+    }, _react.default.createElement(_reactNumericInput.default, {
+      onChange: this.handleChangeCount,
+      min: 0,
+      disabled: this.state.isInfinity,
+      value: this.state.planCount,
+      className: "form-control"
+    })), _react.default.createElement("div", {
+      style: {
+        flex: 1,
+        marginRight: '10px',
+        maxWidth: '100px',
+        display: 'flex',
+        alignItems: 'center'
+      }
+    }, _react.default.createElement(_reactBootstrap.Checkbox, {
+      checked: this.state.isInfinity,
+      onChange: () => this.setState({
+        isInfinity: !this.state.isInfinity
+      })
+    }, __(checkboxText))), _react.default.createElement(_reactBootstrap.Button, {
+      style: {
+        width: '25%',
+        maxWidth: '100px'
+      },
+      disabled: action === 'invalid',
+      onClick: this.handleAction(action, this.state),
+      bsStyle: btnStyle
+    }, __(btnText)));
+  }
+
+}
+
+exports.PlanModifyControl = PlanModifyControl;
+Object.defineProperty(PlanModifyControl, "propTypes", {
+  configurable: true,
+  enumerable: true,
+  writable: true,
+  value: {
+    mstId: _propTypes.default.number.isRequired,
+    plans: _propTypes.default.object.isRequired
+  }
+});

package/views/starcraft/plan-view.js

@@ -0,0 +1,108 @@
+"use strict";
+
+exports.__esModule = true;
+exports.PlanView = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _reactBootstrap = require("react-bootstrap");
+
+var _utils = require("./utils");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+const {
+  __
+} = window.i18n['poi-plugin-item-improvement'];
+
+class PlanView extends _react.Component {
+  constructor(...args) {
+    var _temp;
+
+    return _temp = super(...args), Object.defineProperty(this, "handleRemove", {
+      configurable: true,
+      enumerable: true,
+      writable: true,
+      value: () => {
+        const {
+          mstId,
+          star
+        } = this.props;
+        (0, _utils.modifyPlans)(plans => {
+          const newPlans = _extends({}, plans);
+
+          newPlans[mstId] = _extends({}, plans[mstId]);
+          delete newPlans[mstId][star];
+
+          if (Object.keys(newPlans[mstId]).length === 0) {
+            delete newPlans[mstId];
+          }
+
+          return newPlans;
+        });
+      }
+    }), _temp;
+  }
+
+  render() {
+    const {
+      star,
+      planCount,
+      actualCount,
+      viewMode
+    } = this.props;
+    const done = actualCount >= planCount;
+    return _react.default.createElement("div", {
+      style: {
+        display: 'flex',
+        alignItems: 'center',
+        fontSize: '16px'
+      }
+    }, _react.default.createElement("div", {
+      key: "1",
+      style: {
+        flex: 1
+      },
+      className: "star-text"
+    }, (0, _utils.starText)(star)), _react.default.createElement("div", {
+      key: "2",
+      style: {
+        flex: 1,
+        display: 'flex',
+        justifyContent: viewMode ? 'flex-end' : 'flex-start'
+      }
+    }, _react.default.createElement("div", {
+      className: done ? 'text-success' : 'text-danger'
+    }, actualCount), _react.default.createElement("div", {
+      style: {
+        marginLeft: '2px'
+      }
+    }, "/", planCount < 9999 ? planCount : '∞')), !viewMode && _react.default.createElement("div", {
+      key: "3"
+    }, _react.default.createElement(_reactBootstrap.Button, {
+      onClick: this.handleRemove,
+      bsStyle: "warning"
+    }, __('Remove'))));
+  }
+
+}
+
+exports.PlanView = PlanView;
+Object.defineProperty(PlanView, "propTypes", {
+  configurable: true,
+  enumerable: true,
+  writable: true,
+  value: {
+    mstId: _propTypes.default.number.isRequired,
+    star: _propTypes.default.number.isRequired,
+    planCount: _propTypes.default.number.isRequired,
+    actualCount: _propTypes.default.number.isRequired,
+    viewMode: _propTypes.default.bool.isRequired
+  }
+});