rossi46

Members
  • Content Count

    64
  • Joined

  • Last visited

About rossi46

  • Rank
    Advanced Member

Recent Profile Visitors

1,000 profile views
  1. rossi46

    Error set anchor Bitmaptext

    Ok I will try. And how to extend PIXI.Sprite. I want to add some property to sprite like. PIXI.Sprite.value, PIXI.Sprite.inx... I create a class extends PIXI.Sprite: let class Sprite extends PIXI.Sprite{ value: number; inx: number; contructor(){ super(); } } but when i use: let s = new Sprite(TextureCache["something"]), it say: Sprite doesn't have contructor has on parameter. Thanks
  2. rossi46

    Error set anchor Bitmaptext

    I use typescipt to code my app. When i create a bitmaptext and set anchor for it, but the typescript show error:"Property 'set' does not exist on type 'number | Point'. Property 'set' does not exist on type 'number'.". var txt = new PIXI.extras.BitmapText("0sfsfds", { font: "15px RockerSmall", align: "center" }); txt.anchor.set(0.5); why. Thanks
  3. I had check. I use @types/pixi.js - it's ok
  4. i use webpack, typescript and pixijs to build my app. But when i build it has error: ERROR in ./node_modules/pixi.js/lib/index.js Module not found: Error: Can't resolve './accessibility' in 'D:\Zone\G1\Client\G1.Client\slots\node_modules\pixi.js\lib' @ ./node_modules/pixi.js/lib/index.js 34:21-47 @ ./libs/libs.ts @ multi ./libs/libs.ts ERROR in ./node_modules/pixi.js/lib/index.js Module not found: Error: Can't resolve './core' in 'D:\Zone\G1\Client\G1.Client\slots\node_modules\pixi.js\lib' @ ./node_modules/pixi.js/lib/index.js 18:12-29 @ ./libs/libs.ts @ multi ./libs/libs.ts ERROR in ./node_modules/pixi.js/lib/index.js Module not found: Error: Can't resolve './deprecation' in 'D:\Zone\G1\Client\G1.Client\slots\node_modules\pixi.js\lib' @ ./node_modules/pixi.js/lib/index.js 30:19-43 @ ./libs/libs.ts @ multi ./libs/libs.ts ERROR in ./node_modules/pixi.js/lib/index.js Module not found: Error: Can't resolve './extract' in 'D:\Zone\G1\Client\G1.Client\slots\node_modules\pixi.js\lib' @ ./node_modules/pixi.js/lib/index.js 38:15-35 @ ./libs/libs.ts @ multi ./libs/libs.ts ERROR in ./node_modules/pixi.js/lib/index.js Module not found: Error: Can't resolve './extras' in 'D:\Zone\G1\Client\G1.Client\slots\node_modules\pixi.js\lib' @ ./node_modules/pixi.js/lib/index.js 42:14-33 @ ./libs/libs.ts @ multi ./libs/libs.ts ERROR in ./node_modules/pixi.js/lib/index.js Module not found: Error: Can't resolve './filters' in 'D:\Zone\G1\Client\G1.Client\slots\node_modules\pixi.js\lib' @ ./node_modules/pixi.js/lib/index.js 46:15-35 @ ./libs/libs.ts @ multi ./libs/libs.ts ERROR in ./node_modules/pixi.js/lib/index.js Module not found: Error: Can't resolve './interaction' in 'D:\Zone\G1\Client\G1.Client\slots\node_modules\pixi.js\lib' @ ./node_modules/pixi.js/lib/index.js 50:19-43 @ ./libs/libs.ts @ multi ./libs/libs.ts ERROR in ./node_modules/pixi.js/lib/index.js Module not found: Error: Can't resolve './loaders' in 'D:\Zone\G1\Client\G1.Client\slots\node_modules\pixi.js\lib' @ ./node_modules/pixi.js/lib/index.js 54:15-35 @ ./libs/libs.ts @ multi ./libs/libs.ts ERROR in ./node_modules/pixi.js/lib/index.js Module not found: Error: Can't resolve './mesh' in 'D:\Zone\G1\Client\G1.Client\slots\node_modules\pixi.js\lib' @ ./node_modules/pixi.js/lib/index.js 58:12-29 @ ./libs/libs.ts @ multi ./libs/libs.ts ERROR in ./node_modules/pixi.js/lib/index.js Module not found: Error: Can't resolve './particles' in 'D:\Zone\G1\Client\G1.Client\slots\node_modules\pixi.js\lib' @ ./node_modules/pixi.js/lib/index.js 62:17-39 @ ./libs/libs.ts @ multi ./libs/libs.ts ERROR in ./node_modules/pixi.js/lib/index.js Module not found: Error: Can't resolve './polyfill' in 'D:\Zone\G1\Client\G1.Client\slots\node_modules\pixi.js\lib' @ ./node_modules/pixi.js/lib/index.js 6:16-37 @ ./libs/libs.ts @ multi ./libs/libs.ts ERROR in ./node_modules/pixi.js/lib/index.js Module not found: Error: Can't resolve './prepare' in 'D:\Zone\G1\Client\G1.Client\slots\node_modules\pixi.js\lib' @ ./node_modules/pixi.js/lib/index.js 66:15-35 @ ./libs/libs.ts @ multi ./libs/libs.ts here is my code in libs.ts: import * as PIXI from "pixi.js"; var util = { RandomFrom(min: number, max: number, normal: boolean) { return normal ? (Math.random() * (max - min + 1) + min) : Math.floor(Math.random() * (max - min + 1) + min); }, ParseMoney(money: number, pre: any) { let p = "."; if (pre) p = pre; if (money == undefined) return ""; let strMoney = money.toString().replace(/\B(?=(\d{3})+(?!\d))/g, p); return strMoney; }, NumberToImage(number: any) { var html = ""; var arr = number.split(""); for (var i in arr) { if (arr.hasOwnProperty(i)) { html += (arr[i] === "." ? '<i class="dot"></i> ' : '<i class="n' + arr[i] + '"></i>'); } } return html; }, CountUp(target: any, isCanvas: boolean, isImages: boolean, startVal: number, endVal: number, decimals: number, duration: number, options: any) { var self = this; // default options self.options = { useEasing: true, // toggle easing useGrouping: true, // 1,000,000 vs 1000000 separator: ",", // character to use as a separator decimal: ".", // character to use as a decimal easingFn: easeOutExpo, // optional custom easing function, default is Robert Penner's easeOutExpo formattingFn: util.ParseMoney, // optional custom formatting function, default is formatNumber above prefix: "", // optional text before the result suffix: "", // optional text after the result numerals: [] // optionally pass an array of custom numerals for 0-9 }; // extend default options with passed options object if (options && typeof options === "object") { for (var key in self.options) { if (options.hasOwnProperty(key) && options[key] !== null) { self.options[key] = options[key]; } } } if (self.options.separator === "") { self.options.useGrouping = false; } else { // ensure the separator is a string (formatNumber assumes this) self.options.separator = "" + self.options.separator; } // make sure requestAnimationFrame and cancelAnimationFrame are defined // polyfill for browsers without native support // by Opera engineer Erik M´┐Żller var lastTime = 0; var vendors = ["webkit", "moz", "ms", "o"]; for (var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) { window.requestAnimationFrame = (window as any)[vendors[x] + "RequestAnimationFrame"]; window.cancelAnimationFrame = (window as any)[vendors[x] + "CancelAnimationFrame"] || (window as any)[vendors[x] + "CancelRequestAnimationFrame"]; } if (!window.requestAnimationFrame) { window.requestAnimationFrame = callback => { var currTime = new Date().getTime(); var timeToCall = Math.max(0, 16 - (currTime - lastTime)); var id = window.setTimeout(() => { callback(currTime + timeToCall); }, timeToCall); lastTime = currTime + timeToCall; return id; }; } if (!window.cancelAnimationFrame) { window.cancelAnimationFrame = id => { clearTimeout(id); }; } // Robert Penner's easeOutExpo function easeOutExpo(t: number, b: number, c: number, d: number) { return c * (-Math.pow(2, -10 * t / d) + 1) * 1024 / 1023 + b; } function ensureNumber(n: any) { return (typeof n === "number" && !isNaN(n)); } self.initialize = () => { if (this.initialized) return true; this.error = ""; if (isCanvas) { this.d = target; } else this.d = (typeof target === "string") ? document.getElementById(target) : target; if (!this.d) { this.error = "[CountUp] target is null or undefined" return false; } this.startVal = Number(startVal); this.endVal = Number(endVal); // error checks if (ensureNumber(this.startVal) && ensureNumber(this.endVal)) { this.decimals = Math.max(0, decimals || 0); this.dec = Math.pow(10, this.decimals); this.duration = Number(duration) * 1000 || 2000; this.countDown = (this.startVal > this.endVal); this.frameVal = this.startVal; this.initialized = true; return true; } else { this.error = "[CountUp] startVal (" + startVal + ") or endVal (" + endVal + ") is not a number"; return false; } }; // Print value to target self.printValue = function (value: any) { var result = self.options.formattingFn(value); if (isCanvas) self.d.text = result; else { if (self.d.tagName === "INPUT") { this.d.value = result; } else if (self.d.tagName === "text" || self.d.tagName === "tspan") { this.d.textContent = result; } else { if (isImages) self.d.innerHTML = util.NumberToImage(result); else self.d.innerHTML = result; } } }; self.count = (timestamp: any) => { if (!this.startTime) { this.startTime = timestamp; } this.timestamp = timestamp; var progress = timestamp - this.startTime; this.remaining = this.duration - progress; // to ease or not to ease if (this.options.useEasing) { if (this.countDown) { this.frameVal = this.startVal - this.options.easingFn(progress, 0, this.startVal - this.endVal, this.duration); } else { this.frameVal = this.options.easingFn(progress, this.startVal, this.endVal - this.startVal, this.duration); } } else { if (this.countDown) { this.frameVal = this.startVal - ((this.startVal - this.endVal) * (progress / this.duration)); } else { this.frameVal = this.startVal + (this.endVal - this.startVal) * (progress / this.duration); } } // don't go past endVal since progress can exceed duration in the last frame if (this.countDown) { this.frameVal = (this.frameVal < this.endVal) ? this.endVal : this.frameVal; } else { this.frameVal = (this.frameVal > this.endVal) ? this.endVal : this.frameVal; } // decimal this.frameVal = Math.round(this.frameVal * this.dec) / this.dec; // format and print value this.printValue(this.frameVal); // whether to continue if (progress < this.duration) { this.rAF = requestAnimationFrame(this.count); } else { if (this.callback) this.callback(); } }; // start your animation self.start = (callback: any) => { if (!this.initialize()) return; this.callback = callback; this.rAF = requestAnimationFrame(this.count); }; // toggles pause/resume animation self.pauseResume = () => { if (!this.paused) { this.paused = true; cancelAnimationFrame(this.rAF); } else { this.paused = false; delete this.startTime; this.duration = this.remaining; this.startVal = this.frameVal; requestAnimationFrame(this.count); } }; // reset to startVal so animation can be run again self.reset = () => { this.paused = false; delete this.startTime; this.initialized = false; if (this.initialize()) { cancelAnimationFrame(this.rAF); this.printValue(this.startVal); } }; // pass a new endVal and start animation self.update = (newEndVal: any) => { if (!this.initialize()) return; newEndVal = Number(newEndVal); if (!ensureNumber(newEndVal)) { this.error = "[CountUp] update() - new endVal is not a number: " + newEndVal; return; } this.error = ""; if (newEndVal === this.frameVal) return; cancelAnimationFrame(this.rAF); this.paused = false; delete this.startTime; this.startVal = this.frameVal; this.endVal = newEndVal; this.countDown = (this.startVal > this.endVal); this.rAF = requestAnimationFrame(this.count); }; // format startVal on initialization if (self.initialize()) self.printValue(self.startVal); } }; class Loader { public loader: any; constructor() { this.loader = new PIXI.loaders.Loader(); } public add(arr: any) { for (let i = 0; i < arr.length; i++) { if (arr[i].id !== "") this.loader.add(arr[i].id, arr[i].src); else this.loader.add(arr[i].src); } } public load(process: any, complete: any) { this.loader.load(); if (typeof process === "function") this.loader.on("process", process(this.loader.process)); if (typeof complete === "function") this.loader.onComplete(complete); } public delete(){ this.loader.destroy(); } }; export {util as Util, Loader }; what wrong with this code. Thanks. I attacked my project. slots.rar
  5. i use V 4.5. I create a button in my game. When i click button I want to my game full screen in mobile. But when i click button, my console say : "Failed to execute 'requestFullscreen' on 'Element': API can only be initiated by a user gesture." that.btnSpin.on("pointerover", that.btnOver).on("pointerout", that.btnOut).on("pointerdown", that.btnSpinDown).on("touchstart", checkFullScreen).on("click", checkFullScreen).on("mousedown", checkFullScreen).on("tab", checkFullScreen); var checkFullScreen = function () { document.documentElement.requestFullscreen ? document.documentElement.requestFullscreen() : document.documentElement.msRequestFullscreen ? document.documentElement.msRequestFullscreen() : document.documentElement.mozRequestFullScreen ? document.documentElement.mozRequestFullScreen() : document.documentElement.webkitRequestFullscreen && document.documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
  6. How to set and cancel pixi game in mobile. I use some code but not work: if (document.documentElement.requestFullscreen) { document.documentElement.requestFullscreen(); } else if (document.documentElement.mozRequestFullScreen) { document.documentElement.mozRequestFullScreen(); } else if (document.documentElement.webkitRequestFullscreen) { document.documentElement.webkitRequestFullscreen(); } else if (document.documentElement.msRequestFullscreen) { document.documentElement.msRequestFullscreen(); }
  7. rossi46

    how to create effect lines like this?

    ok thanks. i will try and post result here for your help.
  8. rossi46

    how to create effect lines like this?

    Here is another example. I think it is particles, but i don't know how to do it.
  9. How to create effect lines line this. I attack images. Line have change position. Thanks
  10. rossi46

    webgl has hit a snag

    I deleted all game and i just have create canvas it is hitting the snag. I load one image size 1110x624 and just create game loader.add("iconsAnimation", ConfigSt.BASE_URL + "assets/images/anim.png"); this.game = new PIXI.Application(1140, 500, { antialias: false, transparent: true, resolution: 1 }); //this.game.ticker.speed = 2; //this.game.ticker.minFPS = 60; $("#gamePlay").append(this.game.view); this.mainContainer = new Container(); this.containerColumn1 = new Container(); this.containerColumn2 = new Container(); this.containerColumn3 = new Container(); this.containerColumn4 = new Container(); this.containerColumn5 = new Container(); this.effectContainer = new Container(); this.iconsContainer = new Container(); this.mainContainer.addChild(this.containerColumn1, this.containerColumn2, this.containerColumn3, this.containerColumn4, this.containerColumn5, this.iconsContainer); this.game.stage.addChild(this.mainContainer, this.effectContainer);
  11. rossi46

    webgl has hit a snag

    here is memory of my game. I do not use particles.
  12. rossi46

    webgl has hit a snag

    I create pixi game. when i change tab it normal. but when i minimize browser. it has "webgl has hit a snag". and my canvas fail. console log has: "webgl: context_lost_webgl: losecontext: context lost". How to fixed it. Thanks
  13. I want to create a graphics timer. how to do that. Link demo: http://jsfiddle.net/m1erickson/P2qTq/
  14. rossi46

    how to user pixi timer or eventemitter?

    I use original example of pixi-timer. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Pixi.js Test</title> <script src="https://pixijs.download/v4.5.3/pixi.min.js"></script> <script src="js/pixi-timer.js"></script> </head> <body> <script> var renderer = new PIXI.autoDetectRenderer(800,600); document.body.appendChild(renderer.view); var stage = new PIXI.Container(); function animate(){ window.requestAnimationFrame(animate); renderer.render(stage); PIXI.timerManager.update(); } animate(); var timer = PIXI.timerManager.createTimer(1000); timer.repeat = 15; timer.on('start', function(elapsed){console.log('start')}); timer.on('end', function(elapsed){console.log('end', elapsed)}); timer.on('repeat', function(elapsed, repeat){console.log('repeat', repeat)}); //timer.on('update', function(elapsed, delta){console.log('update',elapsed, delta)}); timer.on('stop', function(elapsed){console.log('stop')}); </script> </body> </html> it doesn't run.
  15. rossi46

    how to user pixi timer or eventemitter?

    i've just tried pixi 4.5.3. it didn't work. i say "Cannot read property 'update' of undefined", but when i use pixi 3.0.8, it works. I use file pixi-timer.js in plugin. I use many timer in game. ticker can replace for setTimeout??