Blog: Featured

You will want to go through these instructions, copy-paste this blog post to your own Microsoft Word/Google Doc, replace the keys with your own, and print a copy for safe-keeping. This paper copy will be the only thing you need to recover in case of a total loss of all devices. Printing tips Select all of the text on this blog post and copy-paste to a new Microsoft Word/Google Doc with the formatting Adjust the page margins to 0.5" on all sides In Google Docs, remove the tan background color by selecting everything then Format -> Paragraph styles -> Borders and shading -> Background color -> None If you're curious to get a preview of how the setup will look and how pass works, this

This is a fantastic way to upcycle an old iMac that would otherwise be e-waste. I was able to get a 24" 1920x1200 sleek-looking monitor out of this for about $50 in parts. This blog post feels a bit long but it's just a lot of images and reference material. To skip around, here are some links to the sections: Teardown Pinouts and references Project schematics LCD controller boards Building it back up Final result Most of the images are bigger than they appear in this blog post. Right click and open in a new tab to see the full size. Figuring out which iMac you have I'm working with an Apple iMac from 2008, the year before Apple started adding target display mode to iMac's which allows standalone monitor

This guide is just meant as a light reference for others who may be trying to fix their own robot vacuum and wanting to replace the main rolling brush motor. It isn't meant to be a comprehensive guide and will probably only make sense to someone who is already familiar with electronics and debugging. Note: I'm working with a Eufy RoboVac 25C but the Eufy 11S (slim) seems to be pretty much the same vaccuum so this should apply to that as well. Symptoms: "Rolling brush is stuck" This just started out as my vacuum often stopping and giving 10 beep code. Since, I didn't have the app on my phone (no one wants that vendor spyware), I just thought the cliff sensors

Connecting Gitter to the Matrix network (native feeling Matrix bridging). All public Gitter rooms are available via Matrix, and all Gitter users natively exist on Matrix which means you can chat back and forth transparently between users on the Gitter side and the Matrix side. Burning down the list of impedance mismatch between each platform so edits, replies, emoji, markdown, etc all look seamless. Going over how we iteratively tackled this kind of bridging to an existing legacy system without any concept of bridging before-hand. We live in exciting times: open standards-based interoperable communication is on the rise again, and we hope Gitter’s new life in Matrix is the beginning of a new age of cross-project developer collaboration, at last escaping the fragmentation we’ve suffered over the last few years. Read the rest on the Matrix blog.

I wanted more lighting around the apartment and was inspired by the lines that my blinds made on the wall on a sunny day which kinda match the Gitter logo (I work at Gitter/GitLab). Boiled down, this project is some internet of things(IoT) connected LEDs. Lines on the wall created by the blinds that inspired the sign, Parts (bill of materials) Electronics Beaglebone Black (rev. B), https://www.adafruit.com/product/1996 USB battery bank, https://www.amazon.com/gp/product/B00L88VP3Y It's important to make sure that it can be charged and power another device at the same time because it will act as a universal power supply(UPS) for the Beaglebone Black so that it won't get corrupted if the power is cut. 400w, 1u power supply, https://www.amazon.com/gp/product/B014G2OUG2 Any reliable slim power supply, <1.5" tall. I chose a 1u

Unicode is hard. Here's a guide to getting native Unicode Emoji right. The switch from image-based emoji to native Unicode wasn't a straightforward journey and included many intricacies to get production ready. Support varies widely on each OS, even between the browsers on the OS. We also wanted to support falling back to image-based emoji for environments that do not support everything yet, otherwise people would see black squares. As a simple example, most Linux environments do not have Unicode emoji support unless you manually install a font. I consider this blog post the survival manual I wish I had had when implementing native Unicode emoji myself. Read the rest on the GitLab blog.

This guide will go over how to play a sound/alarm/ding and auto-reply when you receive a certain SMS/text message from the Google Hangouts app. The sound will also play regardless of your do not disturb, sleep hours, silence settings. I needed this so my family could wake me up in case of emergency or if I ever overslept when we were supposed to get together. I have been using this setup since July 2016 it has been working great. I have used this on a Moto E (Android 5) and a Google Pixel (Android 7 and 8) with Google Voice. The phone on the right has Tasker running and the left phone sends a standard text message.

NB: This was my experience around September, 2016 and I would consider myself a bit of a Docker noob at the time. Things may have changed and improved since then to make life easier. This just documents the troubles I ran into and shouldn't be considered setup guide worthy. TLDR; Use Docker Toolbox with the VirtualBox driver (Docker for Windows isn't ready) Watch out for CRLF line endings that can get introduced from things like checking stuff out with git. gitter-webapp is the project/repo that is home to the backend and frontend code for Gitter webapp. The team is pretty much exclusively macOS based but I prefer Windows. For a while, I used ShareMouse so that I could use my macOS machine as just another

I've been playing around with Bezier curves and elliptical arcs for my on-going CNC plotter project. Instead of just using g-code commands which are standard on most CNC machines, I decided to support SVG path commands. This means supporting the linear moveTo(M, m) and lineTo(L, l) as well as curve(C, c, S, s -- Q, q, T, t)/arc(A, a) commands. Here are a few articles to get you up to speed if you're unfamiliar with the SVG path commands: SVG Basics—Creating Paths With Line Commands by Steven Bradley SVG Basics—Creating Paths With Curve Commands by Steven Bradley tl;dr, I just need a library The JavaScript and C++ implementations are available on GitHub: SVG Curve Library. I implemented the SVG path commands in JavaScript and ported it

libuv is a multi-platform support library with a focus on asynchronous I/O. It was primarily developed for use by Node.js, but it's also used by Luvit, Julia, pyuv, and others. tldr: cross-platform console/terminal niceties I was interested in this library because it has support for ANSI escape code controlled TTY which Windows doesn't really support on its own. This means cross-platform colored text. libuv is what Node.js uses for all of the CMD/console/terminal/shell niceness across platforms. I found this library confusing and hard to get started with so I decided to consolidate various resources down to this simple tutorial. Guide to Colored Text with libuv This guide will go over getting started and setting up a project to work with libuv. By the end, you

I competed in the 2014 GD.SE Anniversary Game Jam and created Traces, a top-down pseudo-3D shooter. In Traces, the goal is to power each building with a laser beam in sequential order all while killing or avoiding the enemy blobs. Activate the first building in sight and find the next building at the end of laser beam. Eat meat to restore your health. Play Now (online) I decided to make a web canvas game this time because I had a huge barrier to entry problem in my last game jam game, Super Bounce (you had to download the executable and then register the UI system I was using). For this game, I used CraftyJS, a JavaScript canvas game engine library which worked great. I

I discovered Render Components from Guy Bedford in an email exchange where he laid out some basic code for the concept. Bedford has a small writeup on the ZestJS site, but this guide will cover all the same points. Because there is no written spec for Render Components, this guide covers one way of implementing this concept/idea. Details like naming conventions might not be the exact same as someone else. This guide will go over building a pseudo-YouTube video site and workflow setup to start using Render Components. Render components are applicable in many situations, including game UI. Game UI is just like a single page web app. I used render components in Unity with Coherent UI for my games, Radius and

I recently participated in the 3 day 2014 GDSE Game Jam and created a fairly solid result: Super Bounce. You can download it for Windows and Mac at superbouncegame.com . Also, as per the open source guideline of the game jam, the game's source code is available on GitHub. Play Now The journey Super Bounce is based on the super bouncing physics bug from Halo 2. To do a super bounce: just land on a mesh edge with a "crouch" and a relatively high velocity to soar to the sky. I did a lot of super bouncing back in the Halo 2, original Xbox days and even had my own bouncing clan. You can find a lot of super bouncing montages on YouTube

Say you want to create a ground plane that can be scaled to any size and maintain the same texture size on the surface without having to change the material tiling every time. Since this is not default functionality or some setting you can turn on, how can this be accomplished? I had this exact same question about a year ago when messing with Unity. DaveA answered a bit vaguely and re-reading his answer now, I implemented exactly what he suggested. You can see how to create both ideas he suggested in this article. There are two methods to achieve texture tiling based on size. The first way is adjusting actual texture tiling property whenever a change is detected in scale.

I was really intrigued by the BeagleBone Black's (BBB) low cost, great performance, and IO all on the familiar Ubuntu OS. I am still quite new to the BeagleBone Black and hope to create some great projects with it in the future. This is a quick guide to get you up and running with Ubuntu on your BeagleBone Black. I created this guide because many of the guides and instructions are scattered across many places and I wanted a concise place to reference. Flashing/Installing Ubuntu on your BeagleBone Black Download the latest Ubuntu image. Pick the latest .img.xz file (on the bottom) from the rcn-ee site ex. http://rcn-ee.net/deb/flasher/saucy/BBB-eMMC-flasher-ubuntu-13.10-2014-03-27-2gb.img.xz Extract the .img.xz download to get the .img file. You can use 7zip to extract it. If you

Font legibility, crispness(aliasing), and physical size vary between fonts when set at the same font-size. Fonts are designed/optimized at distinct sizes and alias extremely well at those specific size intervals. This makes it hard to set a catch-all size on the web and have it work beautifully with many typefaces. As you can see from the image above, Calibri is a much smaller font compared to Ubuntu and Open Sans. You can also see the varying levels of clarity between the sizes of each font. So what if you have a font stack in CSS that looks like font-family: 'Ubuntu', 'Calibri', sans-serif; and you fallback to Calibri. All of a sudden your sites font size greatly decreases. Of course Calibri is a

With Unity 5, there is no difference in terms of engine features between Personal/Free and Professional editions. This means that "Native Code Plugin Support" is not a problem anymore and there are no restrictions with DLLs and C++(unmanaged) code. This guide really only applies to Unity 4 and below When dealing with unmanaged and managed code, verbiage like P/Invoke, marshaling, interoperability get thrown around. The whole ordeal can be a bit daunting. This guide will go over dealing with DLLs in Unity Free/Standard and Unity Pro. Even with the native(unmanaged) code barrier in Unity Free, it is still possible to use unmanaged code. Overview Specifically, we will be making a C# managed DLL which relies on/references a C++ unmanaged DLL and then use those functions

About WordPress is an open source, PHP based blog and content management system(CMS) made to streamline the process of getting your website up and looking pretty. The WordPress community makes a multitude of plugins (over 30,000) that extend the functionality to make it work just the way you like. There is also an enormous support community to help with any issues. Nginx(pronounced "engine-x") is a popular light-weight server alternative to Apache. It is considered leaner and meaner than Apache because it uses an event-driven system that chomps through requests rather than spinning up separate processes and threads for each request. Prerequisites: User with root privileges Linux, Nginx, MySQL, PHP (LEMP) stack Download WordPress Download the zipped package(archive file) directly from the WordPress website: wget https://wordpress.org/latest.tar.gz Unzip/Extract

This guide will go over compiling the firmware, flashing it to your device, and emulating your first USB device. I was successful using Windows 8(not 8.1) but it still came with challenges. Hopefully this guide can steer you clear of any head-banging issues. If you need help making/assembling your own Facedancer board, follow this guide I made previously. Getting started Inspect your board for any solder bridges, cold joints, etc. Use a multimeter in continuity mode to test. This is important as you are connecting this to your precious pc. Plug in the host side to your pc via USB 2.0. I ran into Blue Screen issues on Windows 8 using USB 3.0. If you want to be cautious, plug it in on an old

The Facedancer is a board to fuzz and emulate/prototype USB devices with host side python, PyUSB. Here is the official Facedancer21 page. It was masterminded by Travis Goodspeed and Sergey Bratus. The Facedancer21 is the 24th revision of the pcb. The Facedancer is not really available pre-assembled for cheap so you will have to build your own. You can buy a fully assembled version from this site but you don't get any SMD soldering practice and it costs about double. If you already have a board and need some help flashing it and emulating your first device, follow this guide. Tools: Soldering Iron Spool of Solder Flux (I used a flux pen) Tweezers Spool of desoldering Wick or Braid Multimeter for testing Helping hands Magnifying glass or something of the sorts Parts: You

Here is a simple guide/tutorial on how to get your linear servo moving. The video below demos what I made. You can see how everything is set up below that: Play video Parts: Teensy 3.0 or 3.1: Substitute your own Arduino/microcontroller Mini Linear Servo 1x 10 uF Capacitor 1x Diode (Optional) Potentiometer for jog code. I was able to run the mini servo off of the Teensy's 3.3V pin which has a 100mA max rating. Code: There are two different demo projects. The first one just jogs the servo back

Here is a simple guide to get your stepper motors spinning. The video below demos what I made. You can see how everything is set up below that: Play video Parts: Teensy 3.0 or 3.1: Substitute your own Arduino/microcontroller Stepper Motors: 1.7A NEMA 17 4-wire Motor Controllers: I used a 3.5A controller with the TB6560 chips Power Supply: 24V 10A (I used a Sopudar SPD-240-24) Wiring Diagram / Schematic: Code (.ino, arduino code): const int stepperX_pul = 0; const int stepperX_dir = 1; const int stepperY_pul = 2; const int stepperY_dir =

Just finished the classic tennis game Pong for my Basys 2 FPGA (built from scratch). The project is written in VHDL and is played on a VGA monitor. You can see a video of it in action at the bottom of this article. Features: Multiplayer: Battle against your friend Play against the AI. Or AI vs AI battles Score Keeping Hidden Mode / Easter Egg (see below) Source: Just visit the GitHub Repo. Controls: ActionControlPlayer Left/1 Paddle movementbtn2 and btn3Player Right/2 Paddle movementbtn0 and btn1Resetswitch0Player Left/1 AI Enableswitch7Player Right/2 AI Enableswitch6 Technology: A small list of things implemented in this design: Collision Detection and Resolution VGA Output, game video Text display on VGA which includes a ram arbiter (uses my other project FP-V-GA Text) Basic AI for the paddles Button and Switch Input Seven-segment driver (BCD converter) Other: I

Go straight to the VGA Simulator About The VGA Simulator is a web based tool to easily view a raw VGA signal without having to hook it up to an actual CRT monitor. Easily review and save any frames generated. It uses horizontal sync, vertical sync, and red, green, blue to recreate pixel perfect frames. The purpose of this tool was to create a faster way to debug FPGA/VHDL projects that utilize VGA. The problem is that synthesizing and generating a bit-file takes too long with Xilinx mainly because it only utilizes a single core. Although we have Simulators such as Isim to debug almost every aspect of a design, it is hard visualize a bunch a 1 or 0 flying past the

I decided to post up this simple script that generates an animated sine wave that scrolls horizontally. I built both versions because I need to use a canvas and some bare-bone pixel manipulation for a future project and want to find the best solution. Update (2013-12-11): I decided to use JavaScript and the HTML5 <canvas> for the project I ended up making. Go check out the VGA Simulator The first one is made with pygame, which runs smooth and is straight forward efficient. The second version made with tkinter is slow and laggy. I even had to batch edit pixels which does not help much. Both of them function exactly the same but the tkinter version is just not as fast. Version made

Coherent UI developed by Coherent Labs is a fully featured GUI system for any Unity (or .NET) game that utilizes the power of HTML, CSS, and Javascript. Use any bleeding edge HTML5, CSS3 features that run on WebKit and any JavaScript libraries you need. It is literally as easy as making a web page on Chrome. It also utilizes the WebKit debugger (just like Chrome) so it is easy find the root cause of any problem. The video explains the whole process but this blog post contains some nice references (see video description for timestamps). Play video

Basic <Directory> tag explanation Here is a sample script allowing all users: <Directory "/var/www/static/"> Options -Indexes Order deny,allow Allow from all AllowOverride All Require all granted </Directory> Options -Indexes: Removes the ability to view all files in directory if index html or php are not present Order deny,allow: Applies the deny operations before the allow operations AllowOverride All: Allows .htaccess to override settings in httpd.conf, etc Require all granted: some mod_authz_core thing. Not completely sure. Create password protected Directory or Location: # PW protect URL <Location "/secret-stuff"> AuthType Basic AuthName "Private Directory" AuthUserFile /etc/httpd/.htpasswd Require valid-user </Location> # PW protect directory <Directory "/path/to/directory"> # ... Look above </Directory> AuthType Basic: Set the Basic authentication method AuthName "Private Directory": Provide a name for the location. This shows up on the login modal/popup (optional) AuthUserFile /etc/httpd/.htpasswd: Specify the pathname to the file that contains usernames and passwords. The usual

This is a basic guide to get Django running with WAMP. This tutorial was written with Python 2.7.5 and Django 1.5 in mind but applies for all versions. You can use the Windows command prompt (cmd) whenever it says to run a command. I suggest using this command prompt alternative. Basic Setup: Install WAMP Get mod_wsgi module for apache. I suggest getting it from here. Add mod_wsgi.sotoC:\wamp-2-4.64bit\bin\apache\Apache2.4.4\modules Add the line in httpd.conf: LoadModule wsgi_module modules/mod_wsgi-ap24-py27.so Install Python 2.7.5 because Python 3.3 does not have enough supported packages Install virtualenv (python package) using this command: pip install virtualenv Create a folder called www-src alongside your wamp www folder and navigate to it in cmd using this command: cd C:\wamp-2-4.64bit\www-src Create a new environment called venv using this command:

I am happy to move on from "under construction" to this iteration of the site. The site is built with Python and Django, my new found go-to for making websites. The design and layout was made with much love by me. This site currently boasts a blog, about page, and contact page. I plan to write about my latest developments, tutorials, and quick guides about the web dev, design, hardware, and more. Feel free to use the contact page to get in touch with me or the about page to get to know me first.