Pinned Posts
Making A Userscript For Micro.blog
My youtube-dl Setup
A Thank You Letter To Developers 
Custom Post Type Indicator
Making A Board Game - Part 6
March 8, 2020

Custom Post Type Indicator

Another day, another self imposed challenge to add something cool to my blog theme! 😀

This time I set out to add a post type indicator’ for each blog post. This is basically a small visual indication as to what the post content is about. For example, a game controller for something video game related, or code brackets for something related to code (like this post).

My blog / website runs on blot so the system fully supports custom metadata types, it was simply a matter of figuring it all out. It wasn’t an easy journey, but it was a fruitful one! I learned a lot about how various formats and technologies work. I went through the city of Mustache, and passed by the town of JSON, all while walking the familiar path of HTML and CSS.

I started out by building/designing the small container that I wanted the indicator to live in. This ended up being this:

Pretty simple CSS for this:

.post_type {
  display: block;
  font-size: 1.5em;
  line-height: 46px;
  color: #f1fa8c;
  background: #282a36;
  height: 45px;
  Width: 45px;
  border: solid 1.5px #bd93f9;
  border-radius: 20%;
  text-align: center;
  left: -12%;
  top: 40px;
  position: absolute;
}

Next, it was time to figure out what would go into the little boxes. Thanks to my wife, she turned me on to Font Awesome which was the perfect solution. This allowed me to build the template in such a way that I could use Font Awesome codes as the meta data string and customize each post with the perfect indicator icon!

The standard metadata in a blot post is:

Date: 2020-01-01 12:00:00  
Tags: Some, Sample, Tags

So I added another line: Type:

This Type metadata is the Font Awesome code you want to use for a post. For example if I wanted it to be a text based post, I can use fas fas-font to render a large A’ inside the indicator box. Such as this:

Now that the individual components are there, it’s time to pull it all together. Shoutout to David (seriously one of the nicest people ever) over at blot for helping me with this as well, I was heading down a path that would probably work but he showed me a way to accomplish it that was much easier.

Quick little heads up: for some reason it appears to be all but impossible to escape Mustache tags (This is a problem I will have to solve another day..) so I have replaced all the double curly braces for the Mustache tags with square brackets [[ ]] in this post. Just remember that all Mustache tags are enclosed with double curly braces.

The metadata value of Type is what I use with Mustache tags to auto populate the Font Awesome code into the html of the template. So in the example of this post, [[entry.metadata.type]] turns into fas fa-font.

The HTML template for each post:

<span class="post_type">
    <span class="[[entry.metadata.type]]"></span>
</span>

And with that, every post with a Type: metadata tag will have a little icon in the indicator box next to it.

There are four other small things to deal with concerning this setup. These are really just related to design and layout.

One. Since Pages’ are essentially Posts’ within blot, I added a line of CSS to each Page to hide this post indicator box. I have to imagine there is a better way to do this, but this will do for now.

/* Used to remove post type indicator from Pages */
.post_type {
    display: none;
}

Two. The Archives page needs smaller icons given the layout, so there is another CSS class for the archives pages .post_type_small. Here is an example of that:

/* Used on archive page */
.post_type_small {
  display: inline-block;
  font-size: 0.8em;
  line-height: 20px;
  color: #f1fa8c;
  background: #282a36;
  height: 20px;
  Width: 20px;
  border: solid 1.5px #bd93f9;
  border-radius: 20%;
  text-align: center;
  margin-right: 10px;
}

Three. On the main page of the blog Entries”, the Mustache tag of [[entry.metadata.type]] needs to be [[metadata.type]].

Four. I have this all turned off for mobile layout currently. Still working out how I want that look. This is what it looks like currently.

/* overrides for mobile media query */
.post_type {
    font-size: 1em;
    line-height: 28px;
    height: 25px;
    width: 25px;
    left: 0%;
    top: -30px;
  }

I think that’s it! It was a fun journey and I am very happy with where I ended up. Hopefully if you were wondering about how to setup custom metadata on your blot site, this project may be of some help to you.

Design Theme Code Blot
February 28, 2020

A Thank You Letter To Developers

Dear Developer (coder, hacker, insert title you prefer),

It’s a rare time we live in where the number of individuals and small teams can have such a massive impact on the populous at large. The apps, systems, and tools that you build are touching lives more regularly that almost any other thing we interact with today as humans. These digital goods are so prevalent, yet hide in the shadows of microchips and circuit boards. The 01100011011011110110010001100101 that you so thoughtfully craft is a marvel of the modern world that is seen by a minority, but experienced by the majority.

I can understand that this path you have chosen can feel thankless but please know that there are many of us out here that appreciate your hard work and dedication. Unfortunately, the perceived value of the work you are doing is being warped to an unsustainable level. Perhaps this is because of the faceless nature of your work, or the warped sense of values and entitlement in the world of technology. Regardless, please know that that the vocal minority does not represent all users. There are many of us who care, and care deeply about the relationship we have with each of you. I admit, we do not express our gratitude often enough or loud enough, but it is unwavering.

People do not go to a farmer’s market and comment about how great the peaches look and then ask why they are not free. I get so upset when someone shows genuine interest in a great app I am using and their first question is What is it called?” immediately followed by is it free?”. No, it isn’t 🤬 free. This mindset has to change. I can only hope I am helping in any small way with my daily interactions with people reminding them that there are people behind these products.

In early settlements each town often had a single individual who would perform a service for everyone else within the town. A blacksmith, chemist, or farrier. In this wild west we call the internet, you are much the same. Albeit, you are providing digital goods rather than physical, and the audience is millions rather than hundreds, the result is the same, a transactional community. We are all part of this community and it is every person’s decision how involved they want to be. Continuing on this train of thought, you act as the shopkeeper of your product and are front and center on Main Street, every single day. I just wanted to let you know that I will do my best to stop in your shop as often as I can, tell others about your shop, and at the very least wave to you every time I walk by to say hello and see how you are doing.

Thank you for all you do and have a great day!

Please feel free to pass this on to anyone you think might need a reminder that they are doing great work and it’s appreciated.

2f2f4a61736f6e

Thank You Developer
February 21, 2020

The Great Blog Cleanup

I have moved my blog around to different platforms as much as anyone. I landed at blot sometime in 2018, and I am very happy with the platform as it fits my style perfectly. With all the moves and migrations, my collection of posts has been degraded in various ways. Broken links, missing images, formatting weirdness, etc.

This is the first time I have felt happy with my blogging setup so it was time to tackle getting things cleaned up and organized to ensure storage and portability for years into the future, and most importantly ensure all my creations are truly mine. We all remember how I lost all posts prior to 2006..
(I don’t want to talk about it.) 😭

This project was mostly a manual process, with some automation sprinkled in where possible with tools like TextSoap.

So, what did I do?
Here is a list of what I set out to accomplish:

Update post metadata

  • Standardized date & time format
    Date: 2020-01-01 12:00:00
  • Standardize tag format (and reduce number of tags)
    Tags: This, Is, How, I, Format, Tags, Now

Update file naming convention

File names: 2020-01-01a.md
File structure hierarchy: posts > 2020 > 2020-01-01a.md

I fixed any links that pointed back to posts on my own blog and attempted to fix any external links as well if possible.

Fix broken images

I attempted to fix any broken image links that I could. Some were simply not possible because I didn’t have any good clues as to what they were. One of the biggest issues with images was not using centralized storage. So this means I had broken image links pointing back to various places like Wordpress and Dropbox accounts that are no longer active. I now store all my images in a dedicated bucket on Wasabi. I can now move the content to any blogging platform and all images will always link correctly. It’s a tiny bit more effort up front, but very worth it!



This project also got me wondering how many actual posts I have (it was 319), and how they were spread across the years. Well, that turned into this little graph project! (It still needs some tweaks, but it was another great little learning project for me!)

Here is a screenshot of what it looks like!
Post Count Project Screenshot

How does this change how my blog looks to the reader? It doesn’t. This was all about maintaining infrastructure and ensuring I have a safe archive of everything in my possession and that data is portable. It definitely wasn’t a fun project, but I am very happy I did it!

Of course, after all this, I am assuming that both Markdown and static site generators will exist for a while into the future! 😬

Migration Files Posts Cleanup Data Portability
February 16, 2020

Music Blast From The Past

A long long long time ago (like 20 years ago) I once thought I could make music. More specifically, electronic music. I had a lot of stuff going on back in this time of my life and I have to think I was using this as some kind of expression to get things out of my head. 🤷‍♂️

I no longer have the original files for these songs, or even remember what applications I used to make them. This was pre-Mac for me, so it would have been some collection of PC programs?

Anyway, a couple of them I find to be ok’, but most of them are not good at all.. I imagine anyone listening to them now will not be into them in the slightest, and although I do not recall exactly what was going through my mind when I made them, I do still to this day feel some sense of connection to them.

I put them all below in this blog post mostly for myself as a way to preserve them. Take a listen if you have run out everything else to do on the internet. 🎧

PurpleZero

  1. The Anthem
  2. GL1
  3. Project Phaded
  4. echo38
  5. NNout
  6. F-mot
  7. Slip N’ Slide
  8. Doppler Effect
  9. Doppler Effect - Power Down Remix
  10. Falling Right Side Down
  11. Fill The Void
  12. Outspace Scratch

Download All (.zip)

Notes

  • The bitrate is not super high. They range from 96-192 kbps. 192 was all you will ever need” back then. 😬
  • I cleaned up the MP3 metadata since it was all garbled.
  • They were never meant to be all together, so I chose an order when writing this that made sense to me.
  • I am not sure how I came up with PurpleZero’. I’m sure it made sense 20+ year ago.
  • I kind of know what the song names meant from the time. Except GL1, no idea what that means.
Music Project The Past PurpleZero Therapy
February 13, 2020

My Setup’ Page

Like my favorites page, I wanted to put together an illustration of what my current computing setup’ looks like in terms of devices and go-to software. I initially started this journey in Omnigraffle, as I often do, to create a pretty illustration of what my setup looks like. As I got part way through the design, an idea jumped out at me; I should try to build it as native html rather than a vector illustration! Building it natively would make for a good learning experience, and would also make it much more accessibility friendly.

I knew what I wanted it to look like, so I saved the Omnigraffle document, closed it, and opened Nova to set out on my (self imposed) web challenge!

Building in Omnigraffle
The beginnings of the Omnigraffle design work

I had a basic shell of what it would be within about the first hour. Then it was time to tweak tweak tweak tweak! After working on it in between other things I had to do that day, I got it almost all the way done relatively quickly. I just needed to get the layout of the individual boxes working correctly. Valerie (@alcedine) to the rescue! She helped me get display: inline-flex; working properly and some other css changes to clean things up a bit and get it looking right! And now, I have this!

It’s definitely not anything super advanced, but I am quite proud of it!
I added it to my CodePen, in case anyone is interested in that kind of thing.

Building in Nova
What it looked like in Nova

html css My Setup Omnigraffle Nova
January 24, 2020

Let There Be.. Dark!

I have been wanting to give this place a facelift for some time and that time has arrived! I went with a Dracula inspired theme because I absolutely love the color palette.

For some time I was working on/managing a light and dark theme that auto switched based on the user’s system scheme preference.

@media (prefers-color-scheme: dark)

This got to be a bit of a pain and I wasn’t really happy with either of the themes. I scrapped all of that and went with just the one theme and am much happier with how things look now!

The theme consists of the following colors:

Blog Screenshot Showing Dracula Theme

Dracula all the things!
Dracula

Design Color Theme Dracula
January 1, 2020

2020. Mark As Complete.

Not resolutions’. Just some things I want to get done. ✅

Five things that will find closure for me in 2020.

  1. Release a board game.
    It’s been in the works for a while but over the past few months it has gotten a lot closer to being realized. It’s time to push it across the finish line.

  2. Edit and publish a short story on my blog.
    I had started a NaNoWriMo in 2017 (maybe 2016?) and got about 70% of it put down on paper. I would like to edit this into a short story and post it on my blog so I can close this project for good. If I choose not to finish it, delete it and move on.

  3. Move from Silicon Valley.
    We are moving onto our next chapter! We have been in The Valley’ for a very long time and some fresh views and perspectives will be a welcome change in 2020.

  4. Change career path.
    I have been in product management / development for a while, predominantly in the area of Med Device related to arterial structures. My gut is telling me it’s time to explore alternate paths and put my skill set to use in another area.

  5. Start a new unrelated project.
    Much like my board game endeavor, I want to get another project going that is out of my comfort zone and creative.

Bonus: Complete the remaining classes needed to complete my degree.

Wishing everyone a happy and productive 2020! Let’s make it a year for positive change in all aspects of life, self, governance, and the world. 🎉

New Year
December 13, 2019

AirPods Pro - First Flight Test

Today was my First flight using AirPods Pro instead of Bose Quiet Comfort headphones!

So how did it compare?

  • I can’t say enough how much better it is to have the tiny AirPods case compared to the giant suitcase you have to carry for the Bose (and other over ear headphones) to fit in. One less giant thing that is required to travel.
  • This is subjective, but I think the Active Noise Cancelling of the AirPods is as good or better than the Bose.
  • The ability to quickly switch between Active Noise Cancelling and Transparency mode is great. I really like not having to remove headphones to talk to someone or hear an announcement.

Airpods Pro Noise Cancelling Screenshot

AirPods Pro Headphones
December 9, 2019

Purchases That Didn’t Work Out

With the end of the year being about buying things and super good deals’ I wanted to look back through 2019 and list out the things that I have purchased this year based on solid recommendations/reviews that turned out to be not that great for me.

  • Luna Display
    See this post. It was never quite right for what I wanted it to do.

  • Brydge Keyboard
    See this post. I tried to like it, but I don’t like typing on it.

  • Elgato Stream Deck
    The LCD buttons did not feel good.

  • Shoulderpod S1
    The quality was not what I expected it to be.

  • Elevation Labs DraftTable for iPad Pro
    Not really compatible with newest iPad Pro.

  • Elevation Labs Family Charger
    See this post.

  • Bose Noise Cancelling Headphones 700
    See this post.

  • HomeSpot Bluetooth Transmitter for Nintendo Switch
    Setup was annoying and it never consistently connected.

  • BlanQuil Weighted Blanket
    Product was fine. Weighted blankets just aren’t for me.

  • Sony WH-1000XM3 Noise Cancelling Headphones
    See this post.

  • HORI Split Pad Pro for Nintendo Switch
    See this post

  • PowerA Joy Con & Pro Controller Charging Dock
    Not nearly as elegant of a solution as I was hoping for.

Regret Products
November 22, 2019

Mac Mini Dock - Satechi Hub

Price: $80 USD

If you use a Mac mini (2018), you know it’s nice to have so many ports on the back for connecting lots of peripherals. The only issue that comes up is with reaching around to the back to access them. Most of the things I plug in stay connected permanently, so no big deal for those. Sometimes you need to plug something else in and having ports on the front would be a convenience. Fortunately, I think I have found the perfect solution! The Satechi Aluminum Stand Hub for Mac mini.

The unit sits perfectly under the Mac mini and looks great. The space grey aluminum color differs slightly from the Mac, but it‘s close enough. It includes vents for air flow and has non-slip feet. This may not seem like a big deal, but the bottom of the mac mini is slippery on my desk, so now it stays put if it gets bumped.

The hub uses only one of the USB-C ports on the back of the Mac mini and adds the following ports to the front for use. Check out the photos below.

  • 1x SD Card Slot (They go in upside down for some reason? It has a nice click when inserted.)
  • 1x Micro SD Card Slot
  • 1x 3.5mm Headphone Jack
  • 3x USB 3.0 Ports - 5GBps (The ports are very loose when inserting a cable. Connection is fine though. It’s actually kind of nice to not have to pull so hard to get a thumbdrive out.)
  • 1x USB-C Data Port - 5GBps

*All the front USB ports do appear to provide charging, although I am not sure how much power is being provided. I plugged in an iPhone 11 Pro with a USB-A > Lightning cable and a USB-C > Lightning cable.

The build quality is very nice, and the convenience is fantastic!

Satechi Mac mini Hub

Satechi Mac mini Hub

Satechi Mac mini Hub Photos: Satechi.net

Update

After a couple months, I have decided to remove this from the bottom of my Mac mini. I have been running some temperature checks and the Mac is definitely running hotter and working harder during times of light use. I think it’s better to have slightly less convenience over a Mac dying prematurely. It might not be a big deal, but I would rather not worry about it. It will be missed!

Mac Mini
November 19, 2019

Raspberry Pi 4 + Touchscreen

Whether it’s HomeBridge, a Minecraft Server, a Network Wide Ad Blocker, a Home Weather Station, or something else entirely, the Raspberry Pi has you covered. The Raspberry Pi has always been an amazing tool since it first launched, and the latest unit is no exception.

I recently picked up a new Pi and a few accessories so I could move my HomeBridge setup from my Mac mini to the new Pi and tuck it away. This project is not terribly different than other Pi projects I have done, but one difference this time is connecting up a small touchscreen to the unit so it’s still headless but has quick access without the need for connecting a keyboard and/or mouse in case of any errors that may occur.

Here is what I got for this project:

  1. Raspberry Pi 4 Model B - 4GB RAM ($60 USD)
    More Info

Raspberry Pi 4 Schematic

  1. Raspberry Pi 4 Touchscreen Kit, MazerPi 3.5 inch ($30 USD)
    Amazon Link

Raspberry Pi 4 Touchscreen Kit

Some other items you may need if you don’t have them around already.

  • USB-C Power Supply
  • Micro HDMI Adapter

It’s pretty neat having a Pi, a case, and a small touchscreen all packed together in one small cube. To be able to have an entire computer with touch input, that can run off a USB power bank is just plain cool!

Raspberry Pi 4 Touchscreen Kit

I am running this Pi with plain old Raspian (version: September 2019), so you may have better or worse luck with different OS options on the Pi.

A couple shortcomings of the LCD

  • Some windows just can’t get small enough to entirely fit on the screen, so you will want to make sure you have some kind of remote connection available (VNC, SSH).
  • After enabling the LCD, it disables both of the HDMI outputs. Which is fine if you were planing on running the unit headless” but if you were looking to use this as an aux screen, that’s a no go with this unit.
Raspberry Pi Touchscreen HomeBridge
November 14, 2019

Playing Games - Luigi’s Mansion 3

Luigi Photo Credit: Nintendo

Luigi’s invited to the towering Last Resort hotel, but when Mario and friends go missing, our green-clad hero will have to conquer his fears to save them!

-Nintendo.com

With so many solo games out there to play, I was very eager for this one to hit the eShop. Luigi’s Mansion 3 is a proper co-op game that is packed with fun! This game instantly feels like a Nintendo classic that pushes all those buttons that Nintendo is so good at. Although this is the third installment in the series, the game feels fresh and new in almost every way. All the mechanics not only feel good from a control standpoint, but they add delight to the whole experience.

Gooigi

Photo Credit: Nintendo

The addition of Gooigi as the second player works very well. I like that it’s not just an exact copy of Luigi but he performs his own unique moves and actions, meaning it’s not just an optional character, but an essential one. Because of this, you do also have the option to play solo and switch between the two depending on what abilities you need for a given challenge. One of my favorite things is how much of the environment you can suck up with the Poltergust! (Most of the stuff you don’t need to suck up, but you want to just for the fun of it!) 👻

Graphically, the game is beautiful and runs great on the switch. The game has smooth transitions, and solid load times throughout. The art style is delightful, and the detail is quite rich in each environment.

Mansion Photo Credit: Nintendo

Slam, blow away, and vacuum up ghosts with the all-new Poltergust G-00, and join forces with Gooigi to overcome the puzzling contraptions and mischievous boss on each themed floor. And that’s just the Last Resort. Enter the ScareScraper for 8-player local wireless or online co-op gameplay.

-Nintendo.com

Available in both physical and digital! It’s a solid get!
nintendo.com/games/detail/luigis-mansion-3-switch/

Luigi’s Mansion 3 Game Box

Games Nintendo Switch Luigi Gooigi
October 29, 2019

HORI Nintendo Switch Split Pad Pro Ergonomic Controller

Price: $50 USD

As much as I love the concept of the Nintendo Switch, playing in handheld mode is not what I would consider enjoyable. The Joy-Cons are ok for very short stints of play, but for me, they are crippling after a very short time using them. I play the Switch in TV Mode’ 98% of the time using a Pro Controller.

The Split Pad Pro on the surface looked to be a merge between the comfort of the Pro Controller but attachable to the Switch like Joy-Cons, so it was worth a shot to give them a try.

I have been using them for about a week, and here is what my takeaways are. (Keep in mind, this is for me, so it may be different for your needs!)

  • They are not Bluetooth and will only function attached to the Switch.
  • The joysticks are pretty solid and feel good.
  • The A, B, X, Y buttons are suitable, not too mushy.
  • The +, -, Home, and Screenshot buttons are rubber for some reason. I would rather them all be hard plastic.
  • There are Assign” and Turbo” buttons on each controller. I don’t have any use for them.
  • The controller is branded for Daemon X Machina, but I am not sure why?
  • Because of said branding, the X” button is stylized, and that makes it kind of weird to look at.
  • The shoulder buttons are just ok.
  • There are additional FL,” and FR triggers underneath where your middle finger would rest. I don’t have a need for them.
  • Overall the controllers feel very hollow and light.
  • Although they are labeled Ergonomic,” they still aren’t anywhere near as comfortable as a Pro Controller.
  • When attached, the Switch is MASSIVE.

Bottom Line For Me: They are somewhat better than Joy-Cons but worse than a Pro Controller. I can see this fitting a very specific need though, so it may be worthwhile for you to give them a try.

Split Pad Pro Attached to Switch

Split PaD Pro Not Attached to Switch

Split Pad Pro Not Attached - Back Sides

Games Nintendo Switch Hori Controller
October 21, 2019

Making A Board Game - Part 4

It’s been a little while since the last update, but I have made a little bit of progress in a few areas!

  1. I now have a name for the game creation company! 🎉
    (This isn’t really necessary, but it was fun coming up with a name and logo)
  2. I have ordered the first set of play testing printed components to try this thing out with actual people. 😱

I am so excited to see the components and actually hold them in my hands. Up until now all the components have been hand made and printed out at home with a laser printer.

I decide to hold off on printing game boards this round for two reasons. They are quite expensive to create as one offs and until I am sure about the actual gameplay mechanics, I don’t want to finalize the boards in case they need to change due to the interactions with the other components.

Obligitory Teaser Screenshots 😉
Board Game Blurred Teaser Photo

Board Game Blurred Teaser Photo

Board Game Blurred Teaser Photo

Previous Updates:
Making A Board Game - Part 3
Dusting Off An Old Project - Part 2
Dusting Off An Old Project - Part 1

Project Board Games
October 21, 2019

Playing Games - RiME

RiME Header

RiME is a relatively short game but felt like the right length to accomplish the storyline. The music was beautiful and thoughtfully executed. How the game art is styled and colored gives it a unique feel that gives you a great visual experience to enjoy as you play through. The play-through gives you the right mix of puzzle and story throughout. I enjoyed the storyline quite a lot and appreciated how little clues were given throughout, but not enough to spoil anything.

The problem that this game suffers from was the performance. I played this game on the Nintendo Switch, and it was an atrocious experience. Horrific frame rates and stuttering throughout. Every time I found myself being immersed in the story and character, the frame rate would seemingly crawl to 3 fps and ruin the whole experience. This port was not ready.

I would recommend the game to someone to check out, but be sure to play it on some other platform (PS4, Xbox One, Steam).

http://www.rimegame.com/

RiME is a single-player puzzle adventure game about a young boy shipwrecked on a mysterious island after a torrential storm. Players must use their wits to decipher the challenges and secrets of an expansive world strewn with rugged terrain, wild creatures and the crumbling ruins of a long-forgotten civilization. With subtle narrative, colorful artwork and a sweeping score, RiME offers players a meaningful journey filled with discovery.

RiME Screenshot One

RiME Screenshot One

RiME Screenshot One

Games Nintendo Switch RiME
Jason Burk | 1999-2020
blot.im! | 🧛‍♂️
📦 Blog Archives 📦

#FreeAds
top