EN Templates: Phone Message with Checkbox [GTD Wannabe]

There’s a bit of a demand over at the EverNote forum for a slight adjusted phone template.  Now that I’ve introduced you to the EverNote Template engine, and got you started on changing labels, I’d like to address the following requests re the phone template:

  1. When the phone message is added to the tape, it should have the “To Do” and “Phone Message” categories automatically selected.
  2. The order of the fields should be: Phone, Name, Message.  (The default is Name, Phone, Message.)
  3. The cursor should go to the Phone field when a new phone message is added.
  4. Tab/Shift-Tab navigable.

The last request on the forum was to have some real logic built into the template so that you could have either clickable buttons or a drop down list with alternative outcomes to the call.  Depending on which choice you picked, the status of the note would change from “To Do” to “Done” and a specific time-stamped message would be added to the message.  I’ll tell you right now - that one’s too complicated to even think about ;)  There was also a request for an auto-hyphenated phone number.  Sorry again, I don’t believe that this is possible either.  The EN template engine is just not sophisticated enough for that kind of behaviour.  As I mentioned on the forum itself; we’re not talking about Microsoft Access here. 

The other points I should be able to do something about.

Order of Fields

Let’s do the easy one first.  Similar to changing labels, it’s pretty easy to move fields around.  You just have to be consistent.

Let’s take a look at the Phone Message template in the template editor.  I’ve circled some interesting parts in the figure below:

The name label is the first cell, followed by the name field, followed by the phone label, followed by the phone field.  You’ll notice that each cell in the table is represented by a <td…></td> tag.  As long as you don’t mess with the contents of the tags, you can just reorder them in the same row.

So, just cut the first two <td…></td> rows (the ones that contain Name: and echo name) and paste them directly below the other two rows.

Before

<td width=”15″ align=”right” valign=”bottom” bgcolor=”lavender”><IMG src=”phone.png” width=”16″ height=”16″ border=”0″> <b>Name: </b></td>
<td width=”40%” align=”left” valign=”top” bgcolor=”white”><%echo name %></td>

<td width=”15″ align=”right” valign=”bottom” bgcolor=”lavender”><b>Phone: </b></td>
<td width=”40%” align=”left” valign=”top” bgcolor=”white”><%echo phone %></td>

After

<td width=”15″ align=”right” valign=”bottom” bgcolor=”lavender”><b>Phone: </b></td>
<td width=”40%” align=”left” valign=”top” bgcolor=”white”><%echo phone %></td>
<td width=”15″ align=”right” valign=”bottom” bgcolor=”lavender”><IMG src=”phone.png” width=”16″ height=”16″ border=”0″> <b>Name: </b></td>
<td width=”40%” align=”left” valign=”top” bgcolor=”white”><%echo name %></td>

Now, hit F5 to refresh the preview panel, and you now have:

Automatic Categories Assigned to Note

This one’s pretty easy.  You can make autocategories in EN that are based on the template type.  So, all you need is a category that automatically filters on notes whose template is “Phone Message”.  Problem half-solved.  For the “To Do”/”Done” category, you can do it as well with the automatic To Do/Done categories in EN.  All you have to do is turn the phone message template into one that makes use of a checkbox.

Because this is a standard template, i.e., not a fully editable one, you can’t insert a manual checkbox, say by using Ctrl+Alt+C.  Instead, we’re going to have to add a checkbox field to the template.

The easiest way to learn how to modify templates is to look at other ones to get ideas.  In this case, let’s look at the “To Do List” template, since I know it uses checkbox.

Here’s what the variable declaration part of that template looks like:

The type “checkbox” is what you want to use.  You can name it anything you want.  In the To Do List, you see done[], which means that the variable name is done, and the [] means that it’s an array (because the To Do List has rows, each one of which has a checkbox).  In our case, we don’t need an array, since we only want one checkbox.  Let’s call it “done”.  So, we need to put this declaration in the Phone Message template’s variable declaration.

Before

<% string name, phone, message; %>

After

<% string name, phone, message; checkbox done%>

Now we need somewhere to put it in the template itself.  I think the easiest part will be to simply add another cell to the first row of the table.  I’m not going to bother with a field name for it (that would require another cell as well).  And I think I’m going to stick it as the first column, so the first thing you see is the checkbox.

Adding a Cell

As I said earlier, a cell in a row is in a <td…></td> tag.  To add a cell, figure out in the code where you want it to go, and just add a new <td> line (Blue shows changes).

<tr>

<td width=”5″ bgcolor=”lavender”><%echo done %></td>
<td width=”15″ align=”right” valign=”bottom” bgcolor=”lavender”><b>Phone: </b></td>
<td width=”40%” align=”left” valign=”top” bgcolor=”white”><%echo phone %></td>
<td width=”15″ align=”right” valign=”bottom” bgcolor=”lavender”><IMG src=”phone.png” width=”16″ height=”16″ border=”0″> <b>Name: </b></td>
<td width=”40%” align=”left” valign=”top” bgcolor=”white”><%echo name %></td>
</tr>

After

The first thing you’ll notice is that the template looks hinky, like this:

That’s because we added a cell to the first row, but not the second, so it’s lopsided.  I’m going to take care of this by making the “Message” label in the second row span two columns.  You do this by adding ‘colspan=”2″‘ to the <td> tag for that field, like this:

<table cellSpacing=”collapse” border=”1″ bordercolor=”#ADB6DE” cellpadding=”2″ width=”100%”>
<tr>
<td width=”5″ bgcolor=”lavender”><%echo done %></td>
<td width=”15″ align=”right” valign=”bottom” bgcolor=”lavender”><b>Phone: </b></td>
<td width=”40%” align=”left” valign=”top” bgcolor=”white”><%echo phone %></td>
<td width=”15″ align=”right” valign=”bottom” bgcolor=”lavender”><IMG src=”phone.png” width=”16″ height=”16″ border=”0″> <b>Name: </b></td>
<td width=”40%” align=”left” valign=”top” bgcolor=”white”><%echo name %></td>
</tr>
<tr>
<td colspan=”2″ align=”right” valign=”top” bgcolor=”lavender”><b>Message:</b><p><br></p></td>
<TD width=”*” align=”left” valign=”top” colspan=3 bgcolor=”white”><p><%echo message %></p></TD></tr>
</table>

Now you have this:

Not bad for a first attempt at a serious modification. 

Removing the Phone Icon

If you want to move the phone icon, or remove it altogether, that’s also possible.  If you look at the line containing the Name label:

<td width=”15″ align=”right” valign=”bottom” bgcolor=”lavender”><IMG src=”phone.png” width=”16″ height=”16″ border=”0″> <b>Name: </b></td>

The phone icon is everything in the <IMG…> tag.  to move it, just cut that tag and place it where you want.  To remove it, just delete it altogether.

Tab Navigation

Because we’re dealing with a standard template still, it is tab-navigable.  Tab moves you through the fields in this order: Phone -> Name -> Message -> Phone.  Shift-Tab goes backwards.

Start in Phone Field

Through some bizarre quirk in EverNote, be it in EverNote or in the underlying editor, the cursor starts in the field that was last active, the last time you were in a note of that template type.  So, if you’re working in a phone message note, and the last thing you type is in the message field, then the next time you create a new phone message note, your cursor will be in the message field.  Nope, I don’t know how to change that.  I’m pretty sure that the template engine doesn’t have an auto-focus capability in it.

Final Result

Here’s what the final template looks like.  (Note the phone icon is above Name because I made my EN skinny to take this screenshot.)

Download the xml here.  Import it under Tools/Templates/Import.  Done.

Categories: , ,

Original post here: GTD Wannabe

30 April 2007 | Uncategorized | Comments

Comments:

  1.  
  2.  
  3.