Dustin Davis
Developer, Entrepreneur

I love the idea of Disney Circle, Torch, and Luma where you can get on your phone and pause the internet for certain devices at home.

But Circle being the cheapest, I didn’t really want to shell out $99 for yet another device when I just paid $155 for a new Nighthawk R7000 router and took the time to set up DD-WRT on it so I could put time-based internet access on my kids’ devices. I have OpenDNS for filtering already, so the only thing I was really missing was the internet pause button.

And to be honest, I don’t know exactly how those services work. Can you tie multiple devices to one person or group and pause them all at once? Because that is what I wanted to do.

After playing around with some ideas I think I have found a decent working solution.

Step 1: Create Static Leases

For each device you want to control, you need to create a static IP address. You do this by going to Services -> Services. Then under Static Leases you click the Add button to add a row. Enter the MAC address of your device, a hostname, IP address and client lease time.

I have 3 TV ares in my home: Living Room, Basement, Master Bedroom. I put all the devices in each area in their own IP range. For example:

  • Living Room: ~
    • Samsung TV:
    • Apple TV:
    • Chromecast:
  • Basement: ~
    • Amazon FireTV:
    • Roku:
    • Wii:
  • Master Bedroom: ~
    • HiSense TV:
    • Apple TV:
    • Chromecast:
    • Roku:

Finding and entering MAC addresses can be time consuming. If you Status -> LAN you can see the list of clients you have connected to your router along with their IP address. Some Hostnames are not very readable or may just show *. If you click on the MAC address it will give you some information that may help you figure out what the device is that is connecting.

For example, one Hostname might be * and the MAC address starts with 74:C2:46, this link will tell you that the device was made by Amazon Technologies Inc. That might be my FireTV.

If you still are not sure, you can generally go to your various devices and go to the settings options to find your MAC address.

Pro Tip: Also, because the MAC address is a link, it can make it difficult to copy/paste those MAC addresses. I copied the whole table of DHCP Clients and pasted into a text editor. That way I could copy the MAC address easier and also I don’t have to keep switching between tabs in the the dd-wrt interface.

Step 2: Create Access Restrictions

On the dd-wrt control panel, go to Access Restrictions -> WAN Access. Under Access Policy, select an open policy. Give it a name and edit the list of clients.

So, for example, say I select Policy 1 ( ). I name it Living Room TV. I would then click on Edit List of Clients. A new window opens. At the bottom of that screen for IP Range 01 I enter ~ and then click Apply Settings, then click Close.

I set the policy to Deny Everyday, but I leave it Disabled then apply settings.

Now, whenever I want to disable all my living room TVs I can come back to this setting and change the Status to Enable and then click Apply Settings – Boom! No internet to the Living Room TVs.

You can also get creative with these access restrictions. The other night, my 6 year old woke up at 1 AM and decided to turn on the TV. You can put time based access restrictions so that they can’t watch TV during certain hours of the day (or night) and leave these restrictions always on.

Step 3: Enable Access Restrictions from your Phone

The biggest appeal of the hardware I mentioned above is that you can pause the internet from your phone.

If you are connected to your wifi, you can access this web interface from your phone using the same IP you use on your computer (generally But what if you leave the home and put your kids to bed and you arrive at the movie theater with your spouse and you realize there is no way your little angels are going to obey you and leave the TV off and go to bed.

Wouldn’t it be nice to open your phone and disable things remotely?

On your dd-wrt control panel, go to Administration -> Management. Under Web Access enable the HTTPS protocol. Under Remote Access, select Enable and Use HTTPS. Select a Web GUI Port. Default is 8080. You can leave all the other settings. Click Apply Settings

Now you should be able to access your router’s control panel from anywhere if you have a static IP to your home. I have Comcast Business and while I don’t pay for a static IP, I’ve noticed my IP has never changed in all the years I’ve had Comcast.

To get your home’s IP address you can go to myIPaddress.com. So, let’s say your IP address was You would then go to on your phone to access the control panel (You may want to bookmark this page).

The interface isn’t the greatest from a phone browser there are a few clicks to get there, but the effects are the same, you can pause the internet on certain devices from anywhere!

BTW: There is a dd-wrt app in the iTunes store that you can enter your connection and login details so you don’t have to login via a browser if you prefer.

In our home we have an old iMac for the kids to use. They each have their own login. Each login has a parental control that logs them out after one hour. This has been helpful to prevent fights over who has been on too long and limits their screen time.

The problem I’ve had lately is that we ask them to do homework and chores before getting on the computer, yet they get on anyway.

So I had this idea to change their passwords every day and email the new passwords to my wife and I each morning. This way they we can make sure they have their jobs done before they get on the computer. I know, it sucks to be a nerd’s child.

Here is the python script that makes the magic happen…

#!/usr/bin/env python
import random
import smtplib

from subprocess import call
from email.mime.text import MIMEText

USE_TLS = True
TO = ''
LOGINS = 'child1 child2 child3 etc'.split()

passwords = {}
for login in LOGINS:
    # get 4 digit random number for the new password
    password = random.randint(1000, 9999)
    command = 'dscl -u {0} -P {1} . -passwd /Users/{2} {3}'.format(
        ADMIN_USERNAME, ADMIN_PASSWORD, login, password)
    passwords[login] = password

msg = '';
for key, val in passwords.iteritems():
    msg += '{0}: {1}\n'.format(key.title(), val)
msg = MIMEText(msg)
msg['Subject'] = 'Today\'s passwords';
msg['From'] = FROM_EMAIL
msg['To'] = TO

s.sendmail(FROM_EMAIL, TO.split(), msg.as_string())

If you’d like to use this, just enter all the GLOBAL variables at the top. I named this file daily.py and set it to run at 6 am every day with the following crontab setting:

0 6 * * * python /Users/dustin/daily.py

I set up a free account on Mailjet to use as an SMTP server. Thanks Mailjet.

As soon as I ran the script for the first time, my wife got a Gmail notification in the other room and said, “Thank you!” #winning

As I have been working on a new project in Aurelia the past few weeks, I’ve encountered a number of problems. Solutions come that seem obvious after the fact, but a slow process to get to them.

In this simple tutorial, I show show a simple proof-of-concept I came up with for an accordion resource component. Hopefully this can give a good example of components within components, and dependency injection between them.

If you are not familiar with accordions check out the jQuery UI accordion demo.

Here are the basic requirements for what I want to build:

  • Click on a section title to expand it’s associated content area
  • If you click on another title, close the section that is currently open
  • Open the first section by default. You should never have all sections closed

Let’s start with the desired html markup. I would like to create my accordion like so (app.html):

  <accordion-section title="Section 1">
    Content area 1
  <accordion-section title="Section 2">
    Content area 2
  <accordion-section title="Section 3">
    Content area 3
  <accordion-section title="Section 4">
    Content area 4

So I will need at least two components, accordion and accordion-section.

My accordion template is simple (accordion.html):

  <div class="accordion">

Basically I’m just wrapping this component in a div with the class of “accordion” so I can use this class for CSS. The <content></content> tags basically tell the component to insert whatever markup I put inside my component tag. In this case, it is each of my <accordion-section> tags.

My accordion-section template is also pretty straight forward (accordion-section.html):

  <h3 click.trigger="showContent()">${title}</h3>
  <div show.bind="isVisible">

Notice my bindings here.

  • click.trigger="showContent()": this will make a call to show this associated content
  • ${title}: display the title of this accordion-section
  • show.bind="isVisible": I’ll have a variable to set whether this content section is displayed

Now on to the view models…

The tricky part of this component is that each accordion-section needs to “talk” to the other accordion-sections because when I open one, I need the others to close.

So I’m going to keep track of all the sections in my Accordion view-model and use dependency injection to inject my parent class into each child class.

So my parent class (Accordion) is pretty simple (accordion.js):

export class Accordion {
  constructor() {
    this.sections = [];

I’m basically creating an empty array named sections when I instantiate this class. I can then use this array in my AccordionSection view-model class, which looks like this (accordion-section.js):

import {bindable, inject} from 'aurelia-framework';

import {Accordion} from './accordion';

export class AccordionSection {
  @bindable title;
  constructor(accordion) {
    this.accordion = accordion;
  attached() {
    this.accordion.sections[0].isVisible = true;
  showContent() {
    for (let section of this.accordion.sections) {
      section.isVisible = false;
    this.isVisible = true;

What’s going on here?

First, my imports. I’m importing bindable & inject from ‘aurelia-framework’. I’m also importing my Accordion class and injecting it into my AccordionSection class.

I’m making the title variable bindable so that I can read the title attribute set in our html markup.

When the component is attached(), I’m adding this view-model class to the Accordion class sections array. I then set the first item in that array to visible.

In the showContent() method (called on the title click) I first set all the section’s isVisible parameter to false, then set the clicked section isVisible to true.

That’s all there is to this simple component. To see it in action, check out this plunker.

Now go build upon this and add some styles and transitions. That’s not my department. ūüėČ

TL;DR – After analyzing the current state of Angular 1, Angular 2, React/Redux, Aurelia, Ember & Meteor, I’m using Aurelia for my next project.

Since attending ng-conf 2015, and the announcement of Angular 2, I felt 2015 would be the year the internet stood still to wait for Angular 2.

It turns out that wasn’t the case at all. Instead, it seems React became the new hot thing. I haven’t done anything serious in React, I’ve done a few tutorials. It seems pretty straight forward. I know there are people that really like it.

But for whatever reason, I just can’t seem to take the React plunge. I can’t really put my finger on it. Maybe it is because it is not a full framework, but rather just a tool to make components. I haven’t really looked into Flux or Redux either.

Perhaps it is jsx that just feels weird to me. I don’t really mind jsx either. But, one thing that I think would annoy me often enough is to remember to use className instead of class in my elements. And I’m sure className would end up in some of my html where I don’t intend it to be.

As Angular 2 has neared its beta release, I decided to give it a try. I was excited. I REALLY wanted to like it. I even have tickets for ng-conf 2016 for the 3rd year in a row. I think it is fair to say I have drunk the Angular kool-aid.

But the Angular 2¬†tutorial¬†really left a bad taste in my mouth. I hated the new syntax. It’s difficult to type and hard to grok. For example:

<li *ngFor="#hero of heroes"
    [class.selected]="hero === selectedHero"
    <span class="badge">{{hero.id}}</span> {{hero.name}}

Look at all those new symbols: *, #, [], ()

If I felt uncomfortable with jsx, this makes me more uncomfortable.

As for TypeScript, I’m fine with transpilers. I’ve taken a liking to CoffeeScript. There are a number of things I don’t like about CoffeeScript, but I prefer it over ES5. But again, TypeScript left me feeling frustrated. Want to make JavaScript more verbose and unpleasant? Use TypeScript. (Note: After attending ng-conf and using ES2016 for a while, I may give TypeScript another try at some some point to see if I like strong typing)

So now what?

In my frustration somehow I came across a new framework that was in the works – Aurelia.

I knew nothing of Rob Eisenberg or Durandal or anything else he did. I didn’t know that he used to be on the Angular 2 core team and he left because he didn’t like the direction things were going.

But when I saw the templating syntax, it just made sense. Want to bind to value? value.bind. What if you just one way binding? value.one-way Want to specify two way binding? value.two-way Want to just bind once? value.bind-once What if you want to bind to src of an anchor tag? src.bind

Just carry that pattern where ever you need to.

So that led me down a path of learning more about Aurelia Рand I like what I see.

Anothor choice I briefly considered was Ember. I’ve heard good things about ember.js, but I have never looked into it because I’ve often heard it compared to Ruby on Rails. I’ve heard it has a steep learning curve and it is very opinionated. From what I’ve seen of Aurelia, if Ember was like RoR, I would compare Aurelia to Django. You use convention over configuration to save you time and help you manage your project, but if you need to step out of the framework, you can.

Also, one more choice I briefly considered was Meteor.¬†I suppose if I were started a new project from scratch, I would probably go with Meteor as it gives you so much out of the box. But I wouldn’t use Blaze. I would opt for Angular or React for templating. Blaze just doesn’t give you much.¬†But whereas I am starting a new project with a back-end in place and many existing APIs,¬†I think Aurelia is a better choice.

So today at work we spent a couple of hours deliberating the pros and cons of Angular 2, Aurelia and React. We even went so far as to rate various benefits and provide rankings to them such as syntax legibility, learnability, community, etc. Our scores looked something like this:

Angular 2: 487
Aurelia: 649
React: 656

Our data based decision would point us to React. But then we did a straw poll. 7 people voted and these are the results:

Angular 2: 0
Aurelia: 5
React: 2

So the decision has been made. We will be starting two new projects in Aurelia.


I just saw WordPress admin is now running on node/react/flux. That is pretty huge. I’ve downloaded their mac desktop app and I’m writing my first post using it.

While I don’t do much PHP development these days, a lot of my day has moved from Python to JavaScript. I’ve always felt that is the way things are going. So this is huge to see WordPress moving this direction.¬†I don’t know what their plans are for WordPress sites, but if they move the whole platform to JavaScript it will really be a death nail to PHP.

Thanks to Matt Berther for this nice little command to create an iso image from a directory in OS X.

hdiutil makehybrid -o ~/image.iso ~/path/to/folder -iso -joliet

Let’s be honest, I’m not going to remember this command in 6 months when I need to run it again. So I created a service. I’ll show you how simple it was.

Open Automator & create a new service

Automator - Service

Add the action to Run Shell Script

Run Shell Script

The service receives selected folders in Finder. Set the shell to /usr/bin/python and pass input as arguments. Add the following 3 lines of python:

import sys
from subprocess import call

call('hdiutil makehybrid -o {0}.iso {0} -iso -joliet'.format(sys.argv[1]), shell=True)

Python Script

Save the service and give it a name such as “Create .iso”

Now you can right-click on a directory to create an iso image.
Create .iso service

I\’ve been using django-helpdesk for my support software on my Django powered site. It works well enough, but I didn\’t really like it.

I started looking around for \”better\” support tools. I actually found an article that tried to rank 76 support tools! Everything I tried I didn\’t really love.

Then one day I as I was listening to a MicroConf from HIten Shah, in the Q&A someone asked him about support and he said he still prefers to use Gmail.

That settled it for me. Here are the reasons why I prefer to use Gmail for customer support.

It is how customers prefer to communicate

I hate using support ticket systems. They are all slightly different and all annoying. They are even more annoying when not integrated well and I have to create a new account just for the support system and knowledge base. I prefer to just email support. So, I assume most of my customers prefer the same.

Canned Responses

I\’ve heard a lot of people use canned responses, but I prefer aText. It has more features (labels, cursor placement) and its faster.

You can also add lots of extra shortcuts you can use while communicating with your customers. Shortcuts could include sub canned responses and links.

For example, I could type eb.faq.banks which would then automatically change to a url to the FAQ page on banks for Envelope Budget.

Add Forms to your App to Give Yourself More Context

Creating a form in your SaaS app for customers to use to send you a support email has a few benefits. You can add text to the subject line or in the body of the email to make things even easier. Here are some examples:

  • Username: If you use usernames you can append this to the message so you don\’t have to look it up manually.
  • Category: Sometimes you will see help desk software have you select a category. You could do the same and prepend it to your subject line. Then create a Gmail filter to auto assign it to the matching label.
  • Priority: Likewise if you want priorities you could do something similar and star the email that comes in.
  • Link to customer profile You could append a link to the customers profile so you can go right to it and learn more about the customer if applicable. Alternatively, you could just append all the info you need in the ticket.

Here are the items I like to see for each customer when they contact me:

  1. Username
  2. Plan type
  3. Date Joined

You can get more information about your customers

Reparative can give you more details about your customer. I often find myself relating better to customers when I know more about them. For example, if I see a link to their twitter or LinkedIn profile and see they are also a programmer, I can be more technical and use a bit more bevity in technical responses.

Context & History

One of my favorite features when gmail was first released was how it group replied & forwarded conversation. This is really handy.

Often customers will open an old email and reply to it when they have a new question. I have no problem with this. In fact, I prefer it because then I can see our past conversations as well and have some context when working with the customer.

Undo Send

Ever hit the send button and then immediately thought, \”oh wait, I forgot something!\” It happens occasionally. Undo send give you about 10 seconds to change your mind after hitting send.


I recently came across this tool that looks helpful when working with others in support. As I grow I may look into it. But as a one man support team, it is just not needed right now. At least I know there are tools to help me in the future.

Stars & Labels

Right now, my support volume is so low I maintain inbox zero with ease. I know that will not always be the case and I\’ll want a way to prioritize. Having multiple stars and labels will help keep me organized.

Mailbox & Boomerang

I often use the Mailbox app on my mac or iPhone, or Boomerang in Gmail to archive message and have them return to my inbox and a certain time.

Sometimes when a but report comes in I tell a person I will get back to them when it is fixed. I can then boomerang it for when I think it should be fix. When it shows up in the inbox again I can reply and let them know it is fixed, or remember to hurry and fix the bug so I can reply!


I heard someone share their first response time for support tickets. I thought, \”I wish I had a way to track this.\” Wouldn\’t you know, there already is. Check out Gmail Meter. It actually has this stat and builds it for you – along with other interest email stats. And, like Gmail, its free.


I don\’t need a special app on my iPhone or iPad. I can use the default mail client or the Gmail app (or Mailbox or a myriad of other apps I\’m sure).


Sometimes a customer may also use Gmail and may be online. You can quickly pull up a Google Hangouts or chat session with them.

Offline Mode

Want to go to lunch and answer all your support emails? You don\’t have wifi or tethering? Just use Gmail\’s offline mode to read and reply to all your emails and have them all synced and sent when you get back online.

I love collecting t-shirts at programming conference. So far I’ve gotten some good ones at ng-conf. Here are the eight shirts I added to my wardrobe. Counting down to my favorite.


8. CDK Global

These guys were awesome to put a t-shirt in every swag bag so you didn’t have to go ask for it. Unfortunately it is my least favorite because it is black. Two words, beard dandruff.


7. ng-conf

This is the shirt everyone got in their swag bad. It is a nice simple design. I like the shirt fabric much better than last years. This is year the shirt is white print on gray shirt. It’s a nice minimalistic design that I like, but I feel like a race car driver with all the logos not the back of the shirt. But hey, thanks to the ng-conf sponsors!


6. Domo (T-Shirt)

A nice soft t-shirt. Gray with Domo logo on the front and Domo careers xml markup on the back.


5. Capital One Tech

I had the choice of red or blue. I kind of wish I went with red since I have a few other blue shirts. This has a nice simple logo, again with a nice soft fabric.


4. AirPair

This was the only light colored shirt I saw so it stands out a bit more. Great fabric with two color print. Their was a catch to get this shirt – you had to sign up on their website. But that wasn’t a problem because I would have anyway. They have an interesting service where I can get paid to mentor someone on the things I have expertise in. Or, I could find a mentor to help me out with a project.


3. Firebase

Nice soft blue t-shirt. I love that this was designed custom for this event with the year on it. I like the snowflake in the background of the Angular logo – giving it a touch of Salt Lake City. I also got a nice yellow beanie with the Firebase logo.


2. Domo (Soccer shirt)

This has to have been the most expensive shirt being handed out at the conference. Many people would probably put this shirt #1 on the list. But I’m not a soccer fan. Had it been a baseball jersey, easily #1 on this list!


1. Ionic Framework

I got this same shirt last year and I wore it all the time. I love the minimal and interesting logo. Unfortunately I left it in a condo in St. George a few months ago when we took a family trip to hike Zion National Park. I found out about this shirt on twitter and found Mike Hartington and he hooked me up with a new shirt.

There were other t-shirts being handed out of course, but I didn’t get one either because I didn’t know about it, or it didn’t look like something I’d wear (black shirt with colorful bubbles all over it, for example)

Yesterday I attended the advanced workshop at ng-conf. I thought I\’d share some of the highlights.

There were four rooms for the advanced workshops. We stayed in the same room while the instructors rotated.

AngularJS Animation

Our first session was on AngularJS Animation by Lukas Ruebbelke. I\’ll be honest, I\’ve been spoiled by being able to work with great designers the past 5 years or so, so I haven\’t kept up on design & CSS. So that said, I\’ve relied on them to do all the amazing UX animations & such.

So this was all new to me and it was great to see the magic behind CSS transitions and how to make them work with angular. We did have some issues with wifi so it took a little longer to get started that we had hoped.

Lukas had some great demos setup up for us to play around with. I had the most fun with this example adding a jack-in-the-box transition effect to the images.

Advanced Directives

Our second session was on advanced directives by Joe Maddalone. This was my favorite session due to the topic, the content, and the hands on examples.

I know I don\’t use directives enough in AngularJS. It was great to see some of the advanced features in directives.

It was interesting to see how to build a directive to loop through data as an alternative to ng-repeat. I especially enjoyed learning about transclude: \'element\'. I admit it was a little hard to grasp, so I may have to go over it again and play around with it more.


Lunch was provided and catered by the Little America Hotel. It was amazing as their food always is. I just wanted to give a shout out, that\’s all.

Angular Formly

Our third session was on Angular Formly by Kent C. Dodds.

I have to admit, I really hate writing forms. In fact, over 10 years ago I wrote sort of mini language to create forms. I would parse it with Perl to generate html for forms.

One feature I really love in Django is their forms implementation.

I haven\’t really had to work with forms for several months, so I haven\’t felt that pain, but I would say that if I were to create any type of form with more than 3 or 4 fields, or if I had an app with multiple forms, I would most likely use Formly.

Firmly basically lets you code out your forms in JavaScript. I limits the amount of coding you have to do and gives you consistent looking forms with many great features to do everything you need to get done.


Our last session was on Protractor by Ben Clickinbeard.

Protractor is basically an end to end testing framework for Angular apps.

I apologize to Ben, but I kind of checked out of this session and went back to learning about animation and css transitions.

It had nothing to do with the presenter, but rather the topic. I spend 7 years in QA and I find testing a boring subject overall. I know some companies are all about test driven development, but I\’m not a fan so this whole topic just had me disinterested.


Overall it was a great day to step out of the home office and spend the day learning new things – and I did learn a lot of new things. Good job Egghead.io team for the presentations.

  1. Type text in Legothick font
  2. Highlight text and select Object -> Expand
  3. Select the Live Paint Bucket tool by pressing K
  4. Select white as the background color. With the text object highlighted, click inside each letter to fill it with white.
  5. With the text selected, select Object -> Path -> Offset Path…. Turn on preview and select the level of offset you want.
  6. With the offset path selected (it is selected by default, but if you happen to deselect, you may need to right click on the object and select Ungroup), choose yellow for the background color and no stroke.