Category: Tech

  • Rotated Background Patterns in CSS with SVG

    Rotated Background Patterns in CSS with SVG

    —

    in

    While working on the WordPress theme Tìtsyul Amip Twenty Twenty-Five, a need arose for a more flexible way to implement rotated background patterns in CSS. Existing methods often involve trade-offs, and this exploration led to a technique leveraging the power of SVG.

  • Reverse engineering an IL2CPP NSO binary: Case study of Mojipittan Encore

    Reverse engineering an IL2CPP NSO binary: Case study of Mojipittan Encore

    —

    in

    This is yet another random side project I was working on recently, and my first attempt to reverse engineer a real world application compiled into binary. In this article, I want to talk about how I reversed engineered an Unity IL2CPP binary compiled to NSO, in a step-by-step fashion.

  • Use WebVTT without actually using WebVTT: Another way to monitor playback progress of HTML Media Elements

    Use WebVTT without actually using WebVTT: Another way to monitor playback progress of HTML Media Elements

    —

    in

    Previously, I have introduced how LyricsX handled playback progress of different players, and briefly talked about how I applied its principal to web audio with a requestAnimationFrame() loop. In this article, I’ll talk about how to use WebVTT, a browser-native captioning feature to receive callbacks on specific time ranges.

  • Flexible and dynamic flow control of Azure DevOps YAML Pipelines using variables

    Flexible and dynamic flow control of Azure DevOps YAML Pipelines using variables

    —

    in

    Recently I was working on the release automation at work, and one of the requirements is to gap a specific number of hours between stages, and snap to normal business hours. While having a centralized scheduler won’t be a choice unless I want to flood the run logs, and a pipeline run would mostly be…

  • Content-aware Infinite Scroll Loop using JavaScript

    Content-aware Infinite Scroll Loop using JavaScript

    —

    in

    This project came out from a key highlight of the Luna for CTFd theme, a CTFd theme trying to reproduce the atmosphere of the game Project SEKAI: Colorful Stage feat. Hatsune Miku. In order to recreate the unique and symbolic music selection interface, I went forward to write this piece of code out myself.

  • Extract and Visualize Your Telegram Group Network

    Extract and Visualize Your Telegram Group Network

    —

    in

    This was one of the ideas I wanted to implement for a while: to visualize the members of all groups I joined on Telegram, and see how many circles I had on the single platform. Thanks to the openness of Telegram’s client API, this was rather easy to achieve.

  • Use GraphQL subscription to show progress of time-consuming operations

    Use GraphQL subscription to show progress of time-consuming operations

    —

    in

    GraphQL is feature-rich query language designed to fit majority of needs of generic online applications. The 3 main types of operations in GraphQL are query, mutation and subscription. While queries and mutations are send in HTTP requests, subscriptions are running on WebSocket, which enables it to receive updates in real time. In this article, I…

  • Measure per-letter dimension of text in JavaScript

    Measure per-letter dimension of text in JavaScript

    —

    in

    TL;DR: Create a Range, set proper start and end points up to the text node with proper offset, then use Range.getBoundingClientRect() to get the dimensions. As a part of the Lyricova Jukebox, we wanted to support inline karaoke swipe animation. With the time tags in the data, it is easy to figure out the time…

  • How LyricsX keeps track of progress of media players

    How LyricsX keeps track of progress of media players

    —

    in

    LyricsX is an open source software for macOS to download and display lyrics of current playing track on Music (previously iTunes), Spotify, Audirvana, Vox, Swinsian, or the Now Playing indicator in the OS. It gets time-tagged lyrics files from local storage or internet, and then display the lyrics in sync with the player. As a…