Convert Image Sequence to a Video using FFmpeg

Download latest FFmpeg build from its official website here On windows, download the zip archive and unzip to a folder (for ex; c:\FFmpeg). Add bin path of the utility (for ex; c:\FFmpeg\bin) to the system path using environment variables on your windows system since the ffmpeg.exe file will not be automatically found by the windows system. Now copy all sequenced images to a folder. Launch command prompt in windows and change its location to the images folder. Now simply run the following command to generate a video from the images In the above command, filename-%06d.jpg is the filename of image sequence files with leading zeros. This filename will process images from filename-000001.jpgg to filename-999999.jpg. You also need to define a frame rate for videos using -r option. The output file gets created in the same folder where the images are located.

Redirect HTTP URLs to HTTPS in Windows Hosting

After configuring SSL for a website, we need to make sure all existing HTTP URLs are automatically redirected to the HTTPS. For this we need to add a redirect rule in our web.config file. Open your web.config file and add following code snippet under system.webServer tag (copy it before the closing system.webServer tag) Save web.config file and upload it to the server tp replace existing one.

Quick Tip

Resize external website to fit in the iFrame

I recently had to publish a game on my website which was written by another developer and was in public domain. My website was responsive and worked great for PC, tablet and mobile but this game came in a fixed size and was not responsive. It was using canvas which could not be resized inside an iFrame to fit in the available space so I looked for options to fit this game in my website layout and make it work for all devices (PC, tablet, mobile). The idea was to use something which would work similar to how mobile devices use viewport to fit the content in its browser. CSS3 comes with the support for scaling of iFrame content which works perfectly in my scenario so the embeded game/page is scaled down to fit in the iFrame. There is some computation required to scale the embeded page correctly. The article[…]

Quick Tip

Add borders in Puzzle games in Phaser 3

In puzzle games where we need to add borders to our puzzles and mark various zones, we can use Phase Path to draw those lines. For this example we are going to draw something like the image below Let us start by creating our html file and including Phaser 3 js and our game js in it. Now our JS code for would be Try running this locally in your web server and you will see the result as shown in the screenshot.

Configure to use Adaptive Icons in Cordova

Adaptive icons require API 26 or above. We use a combination of legacy icons as well as adaptive icons to serve users who are using Android versions below 26 as well as those using 26 or above. Android will use Adaptive icons for API 26 or above and fallback to use legacy icons for devices with API below 26. For this tutorial we will create icon set using an online service https://easyappicon.com/. Create icon set using the service and download the set. You should see the icons in two folders; Android and iOS. For his tutorial we will use Android icon set. Go inside the folder and you would see folders as following Let us also create an Android app using Cordova as described in the previous article https://www.netexl.com/blog/use-cordova-to-compile-html5-games-to-android-app/ Create a new app by using the command as following A basic skeleton cordova project is created This is the bare[…]