HTML Email

What some of you may not know is that much of the time at Salesforce was spent in the world of electronic mail (or email for short). Email is interesting and relevant today because almost everyone has it and communicates with it. It is an official form of communication.

What you may not understand is that the world of email is rather confusing. Basically, the email that comes over the wire is presented to you by your email client and where email gets very confusing is that there are a million different email clients. You probably use more than one. If you look at your email on a mobile device and on a computer that is two different clients. Then when you think about 3rd party clients and even GMail which renders in a browser, you have a client which is actually a client within a browser.

Because of the various numbers of email clients and security concerns, while the web has advanced, email was still written and styled like the early 2000s web. This means table layouts, no real stylesheets, and things like the center tag from way back in the day.

When I left Salesforce, I was hoping that my email wondering days were behind me. Well, for the most part, they are, but one common thing our clients need is to send emails to their clients. Bringing me back to writing stylized email HTML like the 2000s in table layouts.

Despite being very forward-thinking when it was first created, Gmail is usually the hardest client to style for. It’s not really their fault. They are presenting your email in a web browser and they have to be secure on their side of things. I don’t begrudge them thinking about branding and security. Still, things are starting to change and Gmail is now supporting some new things:

Gmail isn’t the only client, though. Because of this, much of the email stuff is still being done with tables. This is pretty challenging for those of us who have spent a bunch of time learning to do things right in CSS (though, to be fair, I’m not the best at CSS).

The association for me feels a bit like the Cobal programmers who were needed to fix all the old code used before the year 2000. Granted, we have better tools for conversion, but this does feel a little archaic.

A Good resource is:

https://www.udemy.com/course/html-email/ – a good course on how to work through HTML email.

I’m learning more things as I go through this process. So far, I’ve learned that not all divs are respected and also that you have to use a capital M in margin for outlook. You also cannot use SVGs in email, you must use PNGs. More lessons to come as I dig through this project.

New Home

It’s taken me a fair amount of time to do this transition. I’ve been switching from LunarPages to DreamHost for a while now. LunarPages just stopped being up to date with all the technologies I needed in order to host all the projects I wanted, but I was (sort of still am) worried about moving from host to another. My primary email is associated with this domain (zacharyc.com). Also, I had a lot of secret hidden files and tools placed around the old website that I had been collecting pretty much since college (when I first started using lunar pages). Yes, that was over 13 years ago.

Lets define the type of technologist I am: I enjoy solving technical problems, but time is limited and there are too many problems for me to be an expert in all of them. I don’t want to be an email expert, but I do want email. I don’t want to be a server administrator but I do want my servers to be secure. So I pay other technologists to worry about those problems so I can worry about the ones I need to worry about. If I spent the time it would take to be an expert in those, I wouldn’t have the time to do all the other things that I want to do.

Looks like DreamHost is doing a pretty good job at meeting my needs. The move was stupid easy. When hosting a new domain on DreamHost, there is a checkbox for them to host Google Suite. All you have to do is check that box, and point the name servers to dream host and the magic works. I keep sending test emails to make sure they are still going through, but so far so good.

Also of note, I’m using a new theme here. I found it when I created a temp backup of my WordPress site on WordPress.com. The theme is called Independent Publisher 2. It’s not easily accessible from the themes download but it is public at GitHub: https://github.com/Automattic/themes/tree/master/independent-publisher-2 and it is working great on installation here. Had to do a couple of tweaks to get it where I wanted to be. I dropped the side bar on the main pages, and moved search to the footer. Other than that, pretty smooth.

TLog-007 Nitro Morning

This post was pulled from my TLog project, but it felt relevant enough to make it to this blog as well. Some interesting stuff about reading and writing code.


I’m trying the Nitro Cold Brew coffee from Stumptown that they just started carrying at Planet Granite. It is tasty, but I like the regular cold brew better and will be sticking to that in the future. Still, I do love coffee.

Grateful List

I was listening to a podcast the other day, I believe it was Finding Mastery with Ariana Kukors: Swim. And they were talking about gratitude practice. The part that really stuck with me was that practicing happiness is really hard. Being happy is a by-product of the world around and the best way to approach getting that feeling may be through practicing gratitude. I’m going to try and say three things I’m grateful for each day.

  1. I’m so grateful that we as humans discovered coffee. It has a profound effect on my life and while I only drink about 2 cups a day, I love it.
  2. I’m grateful that I can afford to take as many pictures as I do now. I love photography and there was point when I was in college when I felt like it was too expensive. Thankfully I can now afford great gear and enjoy using it.
  3. I’m very grateful for my climbing community. Yes, I don’t see as many of them as much as I used to, but I love having a second home at the climbing gym. It is more adult that my cheer community (not that I don’t appreciate that as well), and much closer to my house.

Reading Code

I spend a lot of my time reading objective-c code for work. Reading the basic syntax is pretty easy, but understanding what is going on in someone else’s code has always been relatively difficult for me. I’m not sure how everyone else does it, but the way I tend to read code is to go through a live example of the code and see how variables are manipulated. I like to track a path from a point I understand to a point I need to discover. The larger the piece of the code the harder it is for me discover the flow and the process.

The best analogy I have to this process outside of code is my attempt to read the Odyssey. I moved around a lot as kid and didn’t get to read greek theology in school. I have tried to pick up post school, but understanding the Odyssey or the Illiad has been very hard for me. I can read the words and understand the basics of what’s happening, but I’m not sure I can see the forest through the trees. When you are in class, you have a teacher and class to discuss the book with. The concepts in the book are discussed and you collectively discover what is going on.

When reading code, the teacher/class is akin to being able to talk to developer who originally wrote the code. Sometimes they are sitting right next to you. Sometimes they are downstairs or close by. Sometimes they are phone call or email away. Sometimes there are cliff notes in the form of a really good tutorial or ReadMe. Most of the time, though, you just have figure it out on your own. If the code is written using some common conventions (like a restful api, or common design pattern), it can be easier. Sometimes the code is all over the place and impossible to discover.

Yesterday I was working on understanding MGSwipeTableCell. It’s a pretty well built piece of code, but still rather confusing to figure out for me. I figured out what I needed to, but only after a couple hours of debugging. I wish I had done a better job reading the original piece of code from the beginning.

Writing a Safari Extension

I’ve switched to using Safari as my primary browser. It works pretty well because I use it on all my devices so passwords and bookmarks are available on all devices.

The one downside, the developer community isn’t as big. We use Github at work for all of our repositories. Github code diffs are constrained by the width of their center column. On larger diffs this can make it hard to see all of the code without tons of scrolling. There is a chrome extension for this task, but there hasn’t been a safari extension for this same task, so I decided to write one.

I have worked on several chrome extensions in the past, so I thought this would be pretty easy, but there are a couple of challenges that I didn’t expect in completing the code. I’d like to share my experience with anyone else starting to write an extension, so hopefully you don’t run through the same issues that I did.

Firstly, you can see the code I used to make the extension here.

This essentially takes something like this:
Narrow Github

and turns it into something like this:

Wide Github

Here are some of my tips for writing a Safari Extensions:

  • If things aren’t working the way you expect, don’t trust the reload. Restart the browser!
  • Even if you just want to do something simple, you need to have a base html page. This page can hit your javascript, but you need to follow the developer instructs.
  • Your HTML page can listen for events and then send actions to your javascript, but you have to listen to all commands and filter out the ones you don’t want.

While I’ve shared my extension with a coworker, I’m pretty sure I”m the only one who uses it. You an download the extension from here.

Comments and suggestions are welcome.

Custom UITableViewCell Layout

At work we were trying to create a custom UITableViewCell. We wanted something that looked like this:
tip cell

Here are some of the factors that made this problem more difficult:

  • Our one custom cell was in a UITableView of regular cells
  • The fonts for each of the items in the cell were pretty consistent with the rest of the table view
  • Like every other cell, we wanted to it to be indented based on cell.separatorInset

I looked at several ways to approach this. I tried using a custom table view. I tried subclassing a UITableViewCell. I finally landed on trying to override the tableView:willDisplayCell:forRowAtIndexPath: and it is worth explaining why.

First approach was getting a custom view in place. I turned this approach down because my view really wasn’t that custom. It was actually a tablevViewCell. It actually looked remarkably close to a standard table view cell. It had a text (in this case an NSAttributedLabel), and a detail text (the amount). Putting in a custom view would have required hard coding the layout to match the rest of the cells in the table and that seemed wrong. I also ran into a bit of confusion around getting my separator to be the correct size.

Then I tried subclassing the UITableViewCell. I know subclassing is frowned upon, but I only wanted to override layoutSubviews. I took the accessory view and tried and moved it to an offset of the tip label. I ran into a problem where the textLabel and detailTextLabel font color was being set to gray by the fact that I had userInteractionEnabled set to NO. If that sounds crazy, it should. Here’s a picture of what I saw:

cell

After overriding UILabel and trying to see who was calling setColor on it, I came up with nothing useful. This felt like the wrong approach.

Lastly, I looked at tableView:willDisplayCell:forRowAtIndexPath:. When you first get into this method, the cell’s subviews frames have yet to be calculated. I called [cell layoutSubviews]; which is costly, but get the dimensions I needed. Inserting the the editView after the label is then simple math. Here is what the code roughly looks like.

https://gist.github.com/zacharyc/8141791.js
gist

The downsides of this approach is the double rendering of the cell, but the benefit is that we get to keep our cell as close to factory as possible. In our case, we have one custom drawn cell on the page, so the performance doesn’t take that big of a hit.

There are other approaches to this problem, namely Mensa Smart Tables, but including another library seemed like overkill for what we needed.

Screening The Past

It’s been over a year since I left my roll at Motorola working with a team of very talented web developers on Montage. During my time with that group I worked on a side project for automated testing called “Screening”. I wrote a couple of posts (or at least one post) about chromedriver which we used to power screening. Still, one of the big personal accomplishments for me during that time was being published at Ars Technica. I was one of three authors on a post about the tools we were working on. The project has since been abandoned, but you can read about it here.

Properties in C#

I’m a new C# programmer. I’m using it for a project at work. Doing an ASP.NET MVC project. So far I’ve been very happy with the language. It has some nice stuff built in. ASP.NET MVC is pretty nice too. It’s almost as easy to use as rails. So, all in all, I’m pretty happy, but today I ran into something stupid.

I have a method that is trying to do a TryUpdateModel(model, new[] {"prop1", "prop2"}); call and my model wasn’t getting updated. I checked out the associated FormCollection and sure enough my values were in it. The problem was in how I was defining my model.

public class MyModel
{
   public int prop1;
   public DateTime prop2;
}

Can you see the problem?

It took some digging, but it turns out that prop1 and prop2 as defined above are not properties. They are public members of the class MyModel. In order to be properties you need to assign them getters and setters like so:

public class MyModel
{
   public int prop1 { get; set; }
   public DateTime prop2 { get; set; }
}

My frustration is that prop1 and prop2 from my perspective as a consumer don’t really change with the new definition. It seems weird I should have to do that. I’m a new C# programmer and I totally believe that in 3 months more of working with this language I might become a purist and understand the reason to have these things behave differently, but for someone new to the language this isn’t the most intuitive approach.

Sleeping your Mac with a Microsoft Ergo 4000 Keyboard

One of my friends, who will remain nameless for the purpose of this discussion, convinced me start playing around with a Microsoft Natural Ergo Keyboard 4000. I got one at work, then I bought one for the home and I’ve been pretty happy with it. There are just a couple of things missing from my standard mac keyboard.

Firstly, on my old computer, I used to be able to hit the a keyboard combination to get my machine to sleep. I believe it was something like Cmd – Shft – Eject. Well, the Microsoft keyboard doesn’t have Eject. So I’m out of luck there. It does, however, have a set of buttons reserved for favorites. So I decided to code up a little AppleScript and bind it to one of these keys. Here’s the script, and I just saved it as an editable application. Then you can go into the preference pane for the keyboard and assign the whichever key you want to this script. Good luck.

1
2
3
tell application "finder"
   sleep
end tell

Handspringman.com

For those of you who have known me for more than, say, five years, you know that one of my original web properties was handspringman.com. Unfortunately, due to issues with the way domain registration works, it slipped out of my control. At the time it was prohibitively expensive to reposes (somewhere in the several hundred dollar range).

Well, good news, it’s coming home. I recently checked it’s availability on GoDaddy and was able to procure it relatively inexpensively. I will do my best to put something up there soon.

Modified JustSimple WordPress Theme

I’m not much of a PHP guy, but I chose WordPress for this blog because I feel it is the most stable, well refined, yet easy to use blogging tool out there. Once the platform was decided I started looking for themes that worked well. I finally found something that I really liked when I stumbled on Ciaran Walsh’s blog. The theme is called JustSimple.

It’s a great theme, and I enjoy it on my site, but there areas where it has come up short. Mostly in styles for certain elements. I started a simple github project for my changes to JustSimple Project. One such change I’ve made is to add support for Definition Lists. Terms are bold and definitions are padded left.

If you want, you can download the theme from github (with a shameless use of the definition list):

Zip Format
Zip File
Tar Format
Tar File