Ali Naci Erdem

I use my desktop workstation as a home-server of sorts. It is great to game in the comfort of your living room, on the TV, with your favorite game pad if you have an Apple TV (or any other compatible device). This is possible using a variety of software; Steam Link , Rainway or if you have an NVIDIA GPU using the open source streaming alternative Moonlight . There is a problem though: I have an ultra-wide monitor which does not play well with some game/streaming app combinations. It forces you to switch the game between fullscreen and windowed modes when you are on the actual terminal vs remote.

Let’s imagine that we want to manage cancellation of an async operation using generator functions in javascript. When a secondary event occurs, we can listen for it and force the generator function to return by calling its return method and handle cleanup in the finally block, which will always run before a generator returns. Say we have the following imaginary async generator, which will wait for a second and yield; var generator = async function*() { try { yield await new Promise((r) => { setTimeout(r, 1000) }).then(() => 'Waited for 1 sec.') // More yields... } finally { // Do cleanup here. e.g. abort an XHR or invoke a // cancellation on some ongoing operation console.log('Did cleanup.') }} Then we want to run such a generator to completion in a loop. One way to do this is using an asynchronous for await…of loop. Let’s say we call return before the async operation in the generator is complete. va...

Animation is a pain if you do not know how it is implemented. Basically, you are updating a value with respect to time. This is generally done by calculating the time elapsed since the last frame and interpolating this value between its initial and final values. The interpolation needn’t be linear, there are many such interpolating functions with for example some easing. Even there are methods that will consider previous and later values such as Catmull-Rom splines. In this article, I’ll not go into the details but just introduce a simple ‘hack’ if you will. This approach is influenced mainly from Unity coroutines with the yield keyword. Similarly,with the help of new ECMAscript features, namely async functions and await, we can define an animate function as such; const startValue = 0; // start valueconst endValue = 100; // end valueconst totalTime = 1000; // Aniation time in millisecondslet value = startValue;async function animate() { const lastTime = perf...

I was recently building a web app using Polymer 2.0 and need to include some SVG assets for wider resolution support. As you may know, Polymer fully supports native shadow DOM with the 2.0 version. When using a shadow DOM context, the style tag will apply the given CSS rules inside the shadow context. This introduces some problems with an inline SVG image. Consider this example; <svg width="100%" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1080 360"> <defs> <style>.a{fill:none;}.b{opacity:0.3;}.c{fill:#ddb464;}.d{clip-path:url(#a);} </style> <clipPath id="a"><rect class="a" x="129" y="112" width="822" height="216" rx="40" ry="40"/> </clipPath> </defs> <rect class="b" x="143" y="129" width="820" h...

Node.js is a javascript runtime based on Chromium’s V8 javascript engine. It is really simple to create a basic HTTP server using the node.js API and a web based proxy is just an HTTP server that relays incoming requests back to the original recipient. So we will capture the requests and forward them using a an http.request. There are already programs to be used as debugging proxies (such as Charles, Fiddler, mitmproxy) but they are often limited and it is hard/complicated when it comes to composing a little bit complicated rules. For example once I needed a simple rule that repeats the origin of the orginal request in the proxied response to be able to circumvent CORS restrictions whentesting a web application. Sometimesit is easier to write a little bit of javascript code if you know how. #!/usr/bin/env node//Import the http modulevar http = require("http");//Create the server listening on port 8888http.createServer(function(request, response) {//Log the URL for debugging e...

JavaScript is becoming more and more popular every day and I was wondering if I could make a standalone javaScript App. I knew that a Chromium ( http://www.chromium.org/ ) portable package has a “kiosk” mode which disables many of the integrated UI. Next I decided to use a Chrome App together with Chromium (Portable version) and managed (after several fails and testing) to make it run locally (without a custom build) with full NaCl ( Native Client ) support. The generated app can also be published on Chrome Web store and many UI functionality can easily be programmed using Javascript like developing a web page. NaCl opens the possibility of using low level stuff when needed. The Chromium App allows some customizations via a “.ini” file named exactly as the main executable (mine was in App\AppInfo\Launcher) and mine looks something like this; (Documented at portableapps.com ) [Launch]ProgramExecutable=Chromium\32\Chrome.exeDirectoryMoveOK=yesMinOS=XPSingleAppInsta...