jonforum

Members
  • Content count

    22
  • Joined

  • Last visited

About jonforum

  • Rank
    Member
  • Birthday 02/01/1987

Profile Information

  • Gender
    Male
  • Location
    canada/quebec
  1. Extracting sprites from screenshots

    this will depend what engine rendering you use. here a part of example with canvas pixi and nwjs This , save all children sprites with alpha setTimeout(function(){ // wait rendering to 0,0 update _displayX,_displayY SceneManager._scene._active = false; var fs = require('fs'); var pathName = `img/parallaxes/${$dataMap.parallaxName}.png`; var snap = Bitmap.snap2(target); var urlData = snap._canvas.toDataURL(); var base64Data = urlData.replace(/^data:image\/png;base64,/, ""); fs.writeFile(pathName, base64Data, 'base64', function(error){ if (error !== undefined && error !== null) { console.error('An error occured while saving the screenshot', error); } }); // PHOTOSHOP MODE if(option["c-save_psd"]){ var newFolderPath = `img/parallaxes/_psd_${$dataMap.parallaxName}`; if(!fs.existsSync(newFolderPath)){ fs.mkdirSync(newFolderPath)}; // create folder if not exsit for (let i = 0; i < target._spriteset.displayLayers.length; i++) { let layer = target._spriteset.displayLayers[i]; let pathName = `${newFolderPath}/${$dataMap.parallaxName}_psd_layer${i}.png`; let snap = Bitmap.snap2(layer); let urlData = snap._canvas.toDataURL(); let base64Data = urlData.replace(/^data:image\/png;base64,/, ""); fs.writeFile(pathName, base64Data, 'base64', function(error){ if (error !== undefined && error !== null) { console.error('An error occured while saving the screenshot', error); } }); } }; iziToast.warning({ transitionOut: 'fadeOutUp', id:'loading', timeout:false, theme: 'dark', icon: 'icon-person', title: 'Rendering and Compile Json Complette', message: 'please Reload', position: 'topCenter', // bottomRight, bottomLeft, topRight, topLeft, topCenter, bottomCenter progressBarColor: 'rgb(0, 255, 184)', backgroundColor: '#f44242', progressBarColor:'#f41002', }); }, 300); }; Bitmap.snap2 = function(stage) { var width = $dataMap.width*48; var height = $dataMap.height*48; var bitmap = new Bitmap(width, height); var context = bitmap._context; var renderTexture = PIXI.RenderTexture.create(width, height); if (stage) { Graphics._renderer.render(stage, renderTexture); stage.worldTransform.identity(); var canvas = null; if (Graphics.isWebGL()) { canvas = Graphics._renderer.extract.canvas(renderTexture); } else { canvas = renderTexture.baseTexture._canvasRenderTarget.canvas; } context.drawImage(canvas, 0, 0); } else { } renderTexture.destroy({ destroyBase: true }); bitmap._setDirty(); return bitmap; };
  2. PIXI.Text with solid color background

    https://github.com/pixijs/pixi.js/wiki/v4-Performance-Tips
  3. PIXI.Text with solid color background

    Graphics too but a bit heavier for the peformances. Sprites are more lightweight.
  4. PIXI.Text with solid color background

    // text const textSprite = new PIXI.Text(`blabla`, {fill:"#ff8000"}); const txtBG = new PIXI.Sprite(PIXI.Texture.WHITE); txtBG.width = textSprite.width,txtBG.height = textSprite.height; // cage text const cage = new PIXI.Container(); cage.addChild(txtBG,textSprite); // add reference for easy debug cage.name = "textSprite"; cage.textSprite = textSprite; cage.txtBG = txtBG;
  5. PIXI-SOUND is not working in IE11 11.0.56

    @charlie_says I was wrong! it has a part of 7%, strangely more than Edge ! That include PC and OSX and Tablet for 2017to2018
  6. PIXI-SOUND is not working in IE11 11.0.56

    http://gs.statcounter.com/browser-market-share Do you really want to complicate your life to get the little 3% people use internet explorer ? its work good on firefox or chrome?
  7. Organising Code

    Unfortunately you cannot master PIXI without having a base in JavaScript! What you call class in C, is call prototyping in JS. My advice is to start with somes tutorials with video2brain. https://www.lynda.com/JavaScript-training-tutorials/244-0.html It is thanks to their video that I was able to start with JavaScript and PixiJs a year ago. Assuming you already have a base in HTML5 and CSS ? Otherwise you have to start with these 2 primary languages.
  8. PIXI Matrix, Skew live Generator Tools ???

    In fact I do not know why we talk about 3d.It is simply 4 point scales. !we have no Z Axe here , only a manual scale 4 per point limitI made a fast gif here to show .We have only XY AXE with a anchor to center. If I understand correctly, pixi only allows the scale by 2 points and not 4 ?
  9. PIXI Matrix, Skew live Generator Tools ???

    ok pixi 5 will have z index for 3d and perspective ?
  10. PIXI Matrix, Skew live Generator Tools ???

    ok i will check. My engine on node.js run with pixi 4.4.1
  11. PIXI Matrix, Skew live Generator Tools ???

    can we do this with pixi sprite? http://westciv.com/tools/3Dtransforms/
  12. How To Disable Pixi Sprite Smoothing?

    hi friend /** * The scale modes that are supported by pixi. * * The {@link PIXI.settings.SCALE_MODE} scale mode affects the default scaling mode of future operations. * It can be re-assigned to either LINEAR or NEAREST, depending upon suitability. * * @static * @constant * @memberof PIXI * @name SCALE_MODES * @type {object} * @property {number} LINEAR Smooth scaling * @property {number} NEAREST Pixelating scaling */ var SCALE_MODES = exports.SCALE_MODES = { LINEAR: 0, NEAREST: 1 }; /** so try this at boot game, or in game befor load texture and sprite PIXI.settings.SCALE_MODE = 1;
  13. Hi everyoneIs there a tool to generate a live preview of the Matrix PIXI.I'm talking about being able to preview live the transformation of a sprite, and get the code.I find it very long and hard to do a lot of rending testing each faith to search the good behavior.It would be really great if someone could make a small live generation tool. (HTML) i made a sample on PS To help understand my need. I hope this overview helps to understand. Ideally, it be something similar to this awesome tools by Karl Matt (bigtimebuddy) https://pixijs.github.io/pixi-text-style/# I would be very happy if a similar tool would exist. thank
  14. hi, is pixi Texture.fromVideo, can take quicktime (.mov) file from after effect , with the Alpha chanel ? thank
  15. Pixi Text Style Generator ? [SOLVED]

    +1 for your color piker && import features