Jump to content


  • Content Count

  • Joined

  • Last visited

Everything posted by martiniti

  1. Here is my next question. Thats all great if you not using a PIXI.Filter. Unfortnatelly autoFit parameter deformate my media content with size of application. I noticed that autoFit based on bounds of canvas and fit my images/videos according to canvas size. Is there way to autoFit for example by maxHeight and by maxWidth sizes of canvas?
  2. Hey guys! I have solution for those who searching answers for this question. But I still have one question. First of all you need to create canvas exactly with sizes that you want. For example for square proportion you can set vw (1080) x vh (1080) PIXI.settings.RESOLUTION = 2; app = new PIXI.Application({ width: vw, height: vh, backgroundColor: bgColor, }); videoContainer.appendChild(app.view); const renderer = PIXI.autoDetectRenderer({ width: vw, height: vh, resolution: 2 }); renderer.view.style.width = `${vw}px`; renderer.view.style.height = `${vh}px`; Then I
  3. Hello everyone! Maybe someone has experience and can share with it. The question is how you guys croping media content inside PIXI Application. I have a lot of different stock video and images with different sizes. User can choose aspect ratio of final result: landscape (1920x1080), square (1080x1080), vertical (607,5x1080). The size of main container always is 1920x1080. Also there should be good resolution, let`s say: PIXI.settings.RESOLUTION = 2; I made some images to demonstrate how I want to make it. For example, user can choose vertical ratio and w
  4. Wow! Thank you so much, Ivan, for such a detailed explanation! I will try! Is it important what I'm trying to upload, a video or a picture?
  5. Hey guys! I need to add a UID to my headers for getting Texture (video or images). Is there any way to do this in PIXI? For example: PIXI.Texture.from(testVideo, {header: { 'UID': 'XXX' }}); I also tryed PIXI.Texture.fromUrl but had the same result.
  6. Hey guys! Here is a solution for this question: function recordVideoWithCCapture(){ const videoContainer = document.getElementById('recordContainer'); // Modern let capturer = null; const isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1; const options = { FirefoxFramerate: 120, FirefoxQuality: 100, ChromeFramerate: 30, ChromeQuality: 99.9, } function initRecording(){ capturer = new CCapture( { //verbose: true, // print info to console display: true, // display record info //motio
  7. The reason why I am trying to use CCapture.js is because I want to keep video in a good quality with 60 FPS. I also try to record with MediaRecorder but result was with low quality and freezes.
  8. To be honest, I don’t know. Just hope it does. I used the example below and it working good, so I see no problem to capture canvas in my case https://codepen.io/adkanojia/pen/EZJvJL
  9. Hey guys! I'm stuck with one task, maybe someone has experience to help with it. For recording video I using CCapture.js, but when I start it everything stops with no errors. My basic code is: const videoContainer = document.getElementById('videoContainer'); vw = 1280, vh = 720, videoUrl = 'assets/video/landscape.mp4'; PIXI.settings.RESOLUTION = 2; app = new PIXI.Application({ width: vw, height: vh, backgroundColor: bgColor, }); const videoBg = PIXI.Texture.from(videoUrl); const videoSprite = new PIXI.Sprite(videoBg); const videoControler = videoSprite._te
  • Create New...