(function webpackUniversalModuleDefinition(root, factory) { if(typeof exports === 'object' && typeof module === 'object') module.exports = factory(); else if(typeof define === 'function' && define.amd) define([], factory); else if(typeof exports === 'object') exports["particlejs"] = factory(); else root["particlejs"] = factory(); })(window, function() { return /******/ (function(modules) { // webpackBootstrap /******/ // The module cache /******/ var installedModules = {}; /******/ /******/ // The require function /******/ function __webpack_require__(moduleId) { /******/ /******/ // Check if module is in cache /******/ if(installedModules[moduleId]) { /******/ return installedModules[moduleId].exports; /******/ } /******/ // Create a new module (and put it into the cache) /******/ var module = installedModules[moduleId] = { /******/ i: moduleId, /******/ l: false, /******/ exports: {} /******/ }; /******/ /******/ // Execute the module function /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); /******/ /******/ // Flag the module as loaded /******/ module.l = true; /******/ /******/ // Return the exports of the module /******/ return module.exports; /******/ } /******/ /******/ /******/ // expose the modules object (__webpack_modules__) /******/ __webpack_require__.m = modules; /******/ /******/ // expose the module cache /******/ __webpack_require__.c = installedModules; /******/ /******/ // define getter function for harmony exports /******/ __webpack_require__.d = function(exports, name, getter) { /******/ if(!__webpack_require__.o(exports, name)) { /******/ Object.defineProperty(exports, name, { /******/ configurable: false, /******/ enumerable: true, /******/ get: getter /******/ }); /******/ } /******/ }; /******/ /******/ // define __esModule on exports /******/ __webpack_require__.r = function(exports) { /******/ Object.defineProperty(exports, '__esModule', { value: true }); /******/ }; /******/ /******/ // getDefaultExport function for compatibility with non-harmony modules /******/ __webpack_require__.n = function(module) { /******/ var getter = module && module.__esModule ? /******/ function getDefault() { return module['default']; } : /******/ function getModuleExports() { return module; }; /******/ __webpack_require__.d(getter, 'a', getter); /******/ return getter; /******/ }; /******/ /******/ // Object.prototype.hasOwnProperty.call /******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); }; /******/ /******/ // __webpack_public_path__ /******/ __webpack_require__.p = ""; /******/ /******/ /******/ // Load entry module and return exports /******/ return __webpack_require__(__webpack_require__.s = 1); /******/ }) /************************************************************************/ /******/ ([ /* 0 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); // CONCATENATED MODULE: ./src/asset-shapes.ts /** * アセットを含むオブジェクトです。このクラスは将来変更する可能性が高いので deprecated とします。 * 利用しないでください。 * @type {{}} */ var Assets = {}; var asset_shapes_images = {}; var asset_shapes_createjs = window["createjs"]; var ss = {}; (function (lib, img, cjs, ss) { var p; // shortcut to reference prototypes // library properties: lib.properties = { width: 550, height: 400, fps: 24, color: "#999999", manifest: [] }; // symbols: for(let i=0;i= framerate) { this._frameCount = 0; } }; /** * 個々のパーティクルを生成し、パーティクルシステムに登録します。 * @returns {Particle} */ ParticleSystem.prototype.emitParticle = function () { var particle = this.generateParticle(); this.container.addChild(particle.particleShape); this._activeParticles.push(particle); }; /** * パーティクルを生成し、パラメーターを設定します。 * @returns {Particle} */ ParticleSystem.prototype.generateParticle = function () { var particle = null; if (this._particlesPool.length >= 1) { particle = this._particlesPool.shift(); } else { particle = new particle_Particle(); } this.setParticleParameter(particle); return particle; }; /** * パーティクルパラメータの設定を行います。 * @param particle */ ParticleSystem.prototype.setParticleParameter = function (particle) { particle.particleShape.removeAllChildren(); particle.isAlive = true; particle.x = this.calcRandomValueWithVariance(this._drawingData.startX, this._drawingData.startXVariance, false); particle.y = this.calcRandomValueWithVariance(this._drawingData.startY, this._drawingData.startYVariance, false); this.generateShape(particle, this._drawingData.shapeIdList); // 生存期間 particle.totalLife = Math.max(1, this.calcRandomValueWithVariance(this._drawingData.lifeSpan, this._drawingData.lifeSpanVariance, true)); particle.currentLife = particle.totalLife; // スピード var speed = Math.max(0, this.calcRandomValueWithVariance(this._drawingData.initialSpeed, this._drawingData.initialSpeedVariance, false)); var angle = createjs.Matrix2D.DEG_TO_RAD * this.calcRandomValueWithVariance(this._drawingData.initialDirection, this._drawingData.initialDirectionVariance, false); particle.vx = Math.cos(angle) * speed; particle.vy = Math.sin(angle) * speed; // アルファ particle.startAlpha = this.calcRandomValueWithRange(0.0, 1.0, this.calcRandomValueWithVariance(this._drawingData.startAlpha, this._drawingData.startAlphaVariance, false)); particle.finishAlpha = this.calcRandomValueWithRange(0.0, 1.0, this.calcRandomValueWithVariance(this._drawingData.finishAlpha, this._drawingData.finishAlphaVariance, false)); // スケール particle.startScale = Math.max(0, this.calcRandomValueWithVariance(this._drawingData.startScale, this._drawingData.startScaleVariance, false)); particle.finishScale = Math.max(0, this.calcRandomValueWithVariance(this._drawingData.finishScale, this._drawingData.finishScaleVariance, false)); // ブレンドモードを設定 particle.particleShape.compositeOperation = this._drawingData.blendMode == true ? "lighter" : null; particle.alphaCurveType = this._drawingData.alphaCurveType; }; /** * パーティクルに使用するシェイプを生成します。 * @param particle * @param shapeIdList */ ParticleSystem.prototype.generateShape = function (particle, shapeIdList) { /* ===== add ===== */ var charaColorArray = [ { h: 330, s: 80, l: 92 }, { h: 47, s: 95, l: 83 }, { h: 104, s: 65, l: 78 }, { h: 353, s: 83, l: 84 }, { h: 218, s: 77, l: 88 }, { h: 196, s: 100, l: 82 }, { h: 253, s: 65, l: 80 } ]; var randomColor = charaColorArray[Math.floor(Math.random() * charaColorArray.length)]; /* ===== add ===== */ particle.particleShape.removeAllChildren(); var startColor = this._drawingData.startColor; /* particle.startColor.hue = this.calcRandomValueWithVariance(startColor.hue, startColor.hueVariance, false) % 360; particle.startColor.luminance = this.calcRandomValueWithVariance(startColor.luminance, startColor.luminanceVariance, false); particle.startColor.saturation = this.calcRandomValueWithVariance(startColor.saturation, startColor.saturationVariance, false); var hue = Number(particle.startColor.hue); var saturation = Number(particle.startColor.saturation); var luminance = Number(particle.startColor.luminance); */ // var color = "hsl(" + hue + ", " + saturation + "%, " + luminance + "%)"; /* ===== add ===== */ var color = "hsl(" + randomColor["h"] + ", " + randomColor["s"] + "%, " + randomColor["l"] + "%)"; /* ===== add ===== */ var r = Math.floor(Math.random() * this._drawingData.shapeIdList.length); var shapeId = this._drawingData.shapeIdList.length == 0 ? "" : this._drawingData.shapeIdList[r]; particle.colorCommand = null; var container = this.shapeGenerator.generateShape(shapeId); particle.particleShape.addChild(container); var shape = container.getChildAt(0); // こういう作りにする if (shape == null) { return; } /* console.log(shape.graphics.instructions) var instructions = shape.graphics.instructions; if (instructions && instructions.length > 0) { for (var i = 0; i < instructions.length; i++) { var cmd = instructions[i]; if (cmd instanceof createjs.Graphics.Fill) { // 塗りのとき // グラデーション塗りだったら if (cmd.style instanceof CanvasGradient) { // 昔のグラデーションを保持 var oldStyle = cmd.style; var g = ParticleSystem.HELPER_GRAPHICS; var newStyle = g.beginRadialGradientFill([color, "hsla(" + hue + ", " + saturation + "%, " + luminance + "%, 0)"], oldStyle.props.ratios, oldStyle.props.x0, oldStyle.props.y0, oldStyle.props.r0, oldStyle.props.x1, oldStyle.props.y1, oldStyle.props.r1).command; instructions[i] = newStyle; } else { // 単色塗りなら cmd.style = color; particle.colorCommand = cmd; } } else if (cmd instanceof createjs.Graphics.Stroke) { // 線のとき cmd.style = color; particle.colorCommand = cmd; } } } */ }; /** * 一時的にパーティクルの再生を停止します。 */ ParticleSystem.prototype.pause = function () { this._playing = false; }; /** * pause()で停止したパーティクルの再生を再開します。 */ ParticleSystem.prototype.resume = function () { this._playing = true; }; /** * 一定範囲の数値を計算します。 * @param minValue * @param maxValue * @param value * @returns {number} */ ParticleSystem.prototype.calcRandomValueWithRange = function (minValue, maxValue, value) { return Math.min(maxValue, Math.max(minValue, value)); }; /** * ばらつきのある値を計算し取得します。 * @param value 基準値です。 * @param variance バラつきの範囲です。 * @param isInteger 整数であるかを指定します。 * @returns {number} 数値を返します。 */ ParticleSystem.prototype.calcRandomValueWithVariance = function (value, variance, isInteger) { var result = Number(value) + (Math.random() - 0.5) * variance; if (isInteger == true) { return Math.floor(result); } return result; }; /** * 現在の年齢依存の数値を計算します。 * @param start 開始時の値です。 * @param end 終了時の値です。 * @param life 現在の寿命を示します。開始時は1.0で、終了時は0.0の想定です。 * @returns {number} 現在の値です。 */ ParticleSystem.prototype.calcCurrentValue = function (start, end, life) { return Number(start) * life + Number(end) * (1 - life); }; Object.defineProperty(ParticleSystem.prototype, "emitFrequency", { /** * 1秒あたりの発生数です。 * @returns {number} */ get: function () { return this._drawingData.emitFrequency; }, /** * 1秒あたりの発生数です。 * @param value */ set: function (value) { this._drawingData.emitFrequency = value; }, enumerable: true, configurable: true }); Object.defineProperty(ParticleSystem.prototype, "startX", { /** * 発生基準位置 - X座標 (px)です。 * @returns {number} */ get: function () { return this._drawingData.startX; }, /** * 発生基準位置 - X座標 (px)です。 * @param value */ set: function (value) { this._drawingData.startX = value; }, enumerable: true, configurable: true }); Object.defineProperty(ParticleSystem.prototype, "startXVariance", { /** * 発生基準位置 - X座標のばらつき (px)です。 * @returns {number} */ get: function () { return this._drawingData.startX; }, /** * 発生基準位置 - X座標のばらつき (px)です。 * @param value */ set: function (value) { this._drawingData.startXVariance = value; }, enumerable: true, configurable: true }); Object.defineProperty(ParticleSystem.prototype, "startY", { /** * 発生位置 - Y座標 (px)です。 * @returns {number} */ get: function () { return this._drawingData.startY; }, /** * 発生位置 - Y座標 (px)です。 * @param value */ set: function (value) { this._drawingData.startY = value; }, enumerable: true, configurable: true }); Object.defineProperty(ParticleSystem.prototype, "startYVariance", { /** * 発生基準位置 - X座標のばらつき (px)です。 * @returns {number} */ get: function () { return this._drawingData.startYVariance; }, /** * 発生基準位置 - X座標のばらつき (px)です。 * @param value */ set: function (value) { this._drawingData.startYVariance = value; }, enumerable: true, configurable: true }); Object.defineProperty(ParticleSystem.prototype, "initialDirection", { /** * 初期速度 - 方向 (度)です。 * @returns {number} */ get: function () { return this._drawingData.initialDirection; }, /** * 初期速度 - 方向 (度)です。 * @param value */ set: function (value) { this._drawingData.initialDirection = value; }, enumerable: true, configurable: true }); Object.defineProperty(ParticleSystem.prototype, "initialDirectionVariance", { /** * 初期速度 - 方向のばらつき (度)です。 * @returns {number} */ get: function () { return this._drawingData.initialDirectionVariance; }, /** * 初期速度 - 方向のばらつき (度)です。 * @param value */ set: function (value) { this._drawingData.initialDirectionVariance = value; }, enumerable: true, configurable: true }); Object.defineProperty(ParticleSystem.prototype, "initialSpeed", { /** * 初期速度 (px)です。 * @returns {number} */ get: function () { return this._drawingData.initialSpeed; }, /** * 初期速度 (px)です。 * @param value */ set: function (value) { this._drawingData.initialSpeed = value; }, enumerable: true, configurable: true }); Object.defineProperty(ParticleSystem.prototype, "initialSpeedVariance", { /** * 初期速度のばらつきです。 * @returns {number} */ get: function () { return this._drawingData.initialSpeedVariance; }, /** * 初期速度のばらつきです。 * @param value */ set: function (value) { this._drawingData.initialSpeedVariance = value; }, enumerable: true, configurable: true }); Object.defineProperty(ParticleSystem.prototype, "friction", { /** * 摩擦です。 * @returns {number} */ get: function () { return this._drawingData.friction; }, /** * 摩擦です。 * @param value */ set: function (value) { this._drawingData.friction = value; }, enumerable: true, configurable: true }); Object.defineProperty(ParticleSystem.prototype, "accelerationSpeed", { /** * 重力です。 * @returns {number} */ get: function () { return this._drawingData.accelerationSpeed; }, /** * 重力です。 * @param value */ set: function (value) { this._drawingData.accelerationSpeed = value; }, enumerable: true, configurable: true }); Object.defineProperty(ParticleSystem.prototype, "accelerationDirection", { /** * 重力です。 * @returns {number} */ get: function () { return this._drawingData.accelerationDirection; }, /** * 重力方向 (度)です。 * @param value */ set: function (value) { this._drawingData.accelerationDirection = value; }, enumerable: true, configurable: true }); Object.defineProperty(ParticleSystem.prototype, "startScale", { /** * 開始時のスケールです。 * @returns {number} */ get: function () { return this._drawingData.startScale; }, /** * 開始時のスケールです。 * @param value */ set: function (value) { this._drawingData.startScale = value; }, enumerable: true, configurable: true }); Object.defineProperty(ParticleSystem.prototype, "startScaleVariance", { /** * 開始時のスケールのばらつきです。 * @returns {number} */ get: function () { return this._drawingData.startScaleVariance; }, /** * 開始時のスケールのばらつきです。 * @param value */ set: function (value) { this._drawingData.startScaleVariance = value; }, enumerable: true, configurable: true }); Object.defineProperty(ParticleSystem.prototype, "finishScale", { /** * 終了時のスケールです。 * @returns {number} */ get: function () { return this._drawingData.finishScale; }, /** * 終了時のスケールです。 * @param value */ set: function (value) { this._drawingData.finishScale = value; }, enumerable: true, configurable: true }); Object.defineProperty(ParticleSystem.prototype, "finishScaleVariance", { /** * 終了時のスケールのばらつきです。 * @returns {number} */ get: function () { return this._drawingData.finishScaleVariance; }, /** * 終了時のスケールのばらつきです。 * @param value */ set: function (value) { this._drawingData.finishScaleVariance = value; }, enumerable: true, configurable: true }); Object.defineProperty(ParticleSystem.prototype, "lifeSpan", { /** * ライフ(フレーム数)です。 * @returns {number} */ get: function () { return this._drawingData.lifeSpan; }, /** * ライフ(フレーム数)です。 * @param value */ set: function (value) { this._drawingData.lifeSpan = value; }, enumerable: true, configurable: true }); Object.defineProperty(ParticleSystem.prototype, "lifeSpanVariance", { /** * ライフのばらつき(フレーム数)です。 * @returns {number} */ get: function () { return this._drawingData.lifeSpanVariance; }, /** * ライフのばらつき(フレーム数)です。 * @param value */ set: function (value) { this._drawingData.lifeSpanVariance = value; }, enumerable: true, configurable: true }); Object.defineProperty(ParticleSystem.prototype, "startAlpha", { /** * 始時の透明度です。 * @returns {number} */ get: function () { return this._drawingData.startAlpha; }, /** * 始時の透明度です。 * @param value */ set: function (value) { this._drawingData.startAlpha = value; }, enumerable: true, configurable: true }); Object.defineProperty(ParticleSystem.prototype, "startAlphaVariance", { /** * 開始時の透明度のばらつきです。 * @returns {number} */ get: function () { return this._drawingData.startAlphaVariance; }, /** * 開始時の透明度のばらつきです。 * @param value */ set: function (value) { this._drawingData.startAlphaVariance = value; }, enumerable: true, configurable: true }); Object.defineProperty(ParticleSystem.prototype, "finishAlpha", { /** * 終了時の透明度です。 * @returns {number} */ get: function () { return this._drawingData.finishAlpha; }, /** * 終了時の透明度です。 * @param value */ set: function (value) { this._drawingData.finishAlpha = value; }, enumerable: true, configurable: true }); Object.defineProperty(ParticleSystem.prototype, "finishAlphaVariance", { /** * 終了時の透明度のばらつきです。 * @returns {number} */ get: function () { return this._drawingData.finishAlphaVariance; }, /** * 終了時の透明度のばらつきです。 * @param value */ set: function (value) { this._drawingData.finishAlphaVariance = value; }, enumerable: true, configurable: true }); Object.defineProperty(ParticleSystem.prototype, "shapeIdList", { /** * 使用するシェイプID設定です。 * @returns {string[]} */ get: function () { return this._drawingData.shapeIdList; }, /** * 使用するシェイプID設定です。 * @param string[] */ set: function (value) { this._drawingData.shapeIdList = value; }, enumerable: true, configurable: true }); Object.defineProperty(ParticleSystem.prototype, "startColor", { /** * 初期カラーの設定です。 * @returns {ColorData} */ get: function () { return this._drawingData.startColor; }, /** * 初期カラーの設定です。 * @param value */ set: function (value) { this._drawingData.startColor = value; }, enumerable: true, configurable: true }); Object.defineProperty(ParticleSystem.prototype, "blendMode", { /** * trueのときシェイプを加算合成します。 * @returns {boolean} */ get: function () { return this._drawingData.blendMode; }, /** * trueのときシェイプを加算合成します。 * @param value */ set: function (value) { this._drawingData.blendMode = value; }, enumerable: true, configurable: true }); Object.defineProperty(ParticleSystem.prototype, "alphaCurveType", { /** * 透明度の計算式の設定です。 * @returns {number} */ get: function () { return this._drawingData.alphaCurveType; }, /** * 透明度の計算式の設定です。 * @param value - 0:通常, 1:ランダム */ set: function (value) { this._drawingData.alphaCurveType = value; }, enumerable: true, configurable: true }); /** * グラフィックオブジェクトです。内部計算に使用します。 */ ParticleSystem.HELPER_GRAPHICS = new createjs.Graphics(); return ParticleSystem; }()); // CONCATENATED MODULE: ./src/particlejs.ts /* concated harmony reexport */__webpack_require__.d(__webpack_exports__, "ParticleSystem", function() { return particle_system_ParticleSystem; }); /* concated harmony reexport */__webpack_require__.d(__webpack_exports__, "Particle", function() { return particle_Particle; }); /* concated harmony reexport */__webpack_require__.d(__webpack_exports__, "VERSION", function() { return VERSION; }); /* concated harmony reexport */__webpack_require__.d(__webpack_exports__, "DrawingData", function() { return data_drawing_DrawingData; }); /* concated harmony reexport */__webpack_require__.d(__webpack_exports__, "ColorData", function() { return ColorData; }); /* concated harmony reexport */__webpack_require__.d(__webpack_exports__, "ShapeData", function() { return ShapeData; }); /* concated harmony reexport */__webpack_require__.d(__webpack_exports__, "ShapeGenerator", function() { return shape_generator_ShapeGenerator; }); /* concated harmony reexport */__webpack_require__.d(__webpack_exports__, "AlphaCurveType", function() { return AlphaCurveType; }); /* concated harmony reexport */__webpack_require__.d(__webpack_exports__, "ShapeType", function() { return ShapeType; }); /* concated harmony reexport */__webpack_require__.d(__webpack_exports__, "Assets", function() { return Assets; }); /***/ }), /* 1 */ /***/ (function(module, exports, __webpack_require__) { module.exports = __webpack_require__(0); /***/ }) /******/ ]); }); //# sourceMappingURL=particlejs.js.map