Real-time log

(Without timestamps)

Continuing the theme of transparency, I thought it might be amusing/illustrative to show how I solve problems like this one. I know what I want to do: make a webpage to post a line of text to look at later. Now to actually do it.

Here's a key to the hightlights:

Before creating the repo

I know I want to use PHP on the server side, since it's ubiquitous. I want to save the content to a file on disk, since databases aren't very durable. My first thought is a fortune(1) file, because that's how you store lots of little snippets of text.

Then I had a moment of clarity: appending over and over like that is going to fuck up at some point. So, let's use lots of little files instead of one big one.

I consider how to group things and make them discoverable. Do I want a web interface to read all the contents back? No: it's useless to me, but very useful to anyone who finds a copy of this on the web and wants to abuse it. Having this be write-only is probably good. Also, it's simpler, less to write.

I'll probably use hashtags to group stuff for myself, and I need to figure out how to publish these ideas later on. But that's the next problem. Now to get it going.

Security? How do I keep other people out of my business? I could do something complicated with magic tokens in the bookmark URL on my phone, but that's going to be complicated. I could put it behind htaccess, but I don't want to log in all the time. The goal is to not disrupt my silly little idea. I think I'm going to run with obscurity: put it in a randomly-named subdirectory on my webhost and go from there. How to structure that subdirectory? I could put it in /i1jo3i1j23oi1j2/ or in /oijoi/oi1231j23/23hbfaf/ -- is one better than the other? The single directory is better: it doesn't allow partial matching (eg the lock codes in movies, where all the digits spin, then the leftmost one locks, then the second locks, etc).

Created the repo with 'undertake project idea_php'

So, PHP and writing files. This is something I've done before, but don't do often enough to remember how to do it. To google! Look up how to write to a file in PHP again: [php write to file]

While that's running, I'm thinking about how to write this first piece of code. I need the PHP script to show the input form if it's called without arguments A crappy Weezer song comes on; I switch over to my browser to snark about it on the twitters That last span reminds me that I should add CSS classes to the different kinds of content in this file. So anyway. I need the PHP to print the form if no arguments, but write the text if it gets arguments. The break in mental state to come over here and Writing on the couch is making my back hurt, moving to the front room. The window is open, need to close it. The curtains get in the way; I'm reminded that I need to buy new curtains. The window is sticky and won't close; I curse old houses, latex paint, and wet days. Maybe I should use my Leatherman to scrape off some paint there? No, need to finish writing this doc. This distraction note itself becomes a non-trivial distraction. Meta.. The break in mental state is Thinking about how to format this so it's clear what's what and so you can possibly maybe read the text around the distractions. Colors? Make the yakshaving/distraction spans super/sub scripts? Should I double the baseline height to make that work with bigger sub/sup text? The break in mental state reminded me that I can use a static HTML page to submit a form to a CGI. It's clearly been a while since I did web stuff.

Google results show a new method I haven't seen before, file_put_contents(), which looks nice. Actually, a coworker used this on a project at work; I was dubious, but it's apparently not a brain-dead implementation, so it's efficient. But efficiency doesn't matter here, so that's fine (it mattered a lot at work). Oh, wait, it's PHP5 only. Going to use fopen/fwrite/fclose, since I don't know if my webhost is on PHP4 or 5 and don't really care.

Look up the API calls to double-check my understanding of them. fopen(), fwrite(), can see fclose()Should I make these things fixed-width/tt? Is tt still the right tag for that? Meta-distraction: emacs autocompleted "distr" to "distractions", so I had to glance back to make sure whether I was using it in singular or plural. in the example code for those, so I feel confident in how it works.

Write 5 lines of PHP, including dummy variables for the filename and the idea text.

Now to get the variable content out of a PHP POST. [php POST variables]. Easy, though I misremembered the var name (I thought $POST, not $_POST).

Update 1 line of PHP to extract the POST content.

PHP time() is time(), right? Search for it on the PHP site: time(): yep.

Update 1 line of PHP to set the filename to time() + ".txt".

Now to remember how to write an HTML form: [html form]. W3Schools' HTML Form Page has an example that's good enough for me. They also have a thing that reminds me that the tag for a big text box is textarea, and that I can specify cols and rows. Not doing that for now.

Add a trivial HTML form: 4 lines of HTML.

Now to test run. Does OS X's ~/Sites/ support PHP scripts? Just trying it with a dumb little foo.php that does "echo 'hi';". Nope, rendered as a text file. A quick google confirms this: [os x webserver php] gets me A complicated tutorial for Leopard. Not directly relevant, but it's discouraging enough for me.

Throwing it on my webhost. Surprisingly, it worked. Now to commit and then start documentation.

Looking at the PHP before committing, I realize that I want to not create empty text files by accident. Add error handling. 5 lines of PHP.

Documentation above committed as a first draft. Now need to add CSS for style, then review the above and put the right CSS classes on the elements. After that, I want to templatize the HTML directory here.

Have working code, commit and revise doco

Net result of above: 11 lines of PHP and a 4 line HTML Form (wrapped in a bunch of emacs default HTML).

Making a new CSS file for this log thingy, since I may do this again on another project. Created the file, now cribbing off another webpage's link rel tag to remember the sort of arcane syntax for this. Cut and paste from a webpage. Noticed the number of arguments and possible orderings: it seems like there's a lot of data in the order of them, whether or not media is included, etc, wondering if it's possible to fingerprint them or trace lineage. Hunh.

Actually writing CSS now Cleaning up browser tabs to close a window full of junk, realize that a tab that I closed automatically needs to get put into the links document for the project I was working on a couple hours ago. Reopening closed tabs to find it, then cutting and pasting over.

CSS looks okay structurally; committing now, then one more structural/semantic edit pass, then a pass to make it pretty.

Looking over this, decide that I want to add coding sections to show how little code actually came out of all of the above. Paying attention to how distractable I am reminds me that maybe I need to take my next ADD pill. Check the clock. Not yet. Look back over, add total line counts, seems like it's coming together.

Feels like this is taking forever. Try to figure out how long I've been working on this, kind of space out in the process. Catch myself, realize I can check the git log, since undertaker creates an initial commit of the README, and I committed the working copy pretty quickly. I can make the time estimate even better by looking at the copy I scp'd up to my webhost. 15 minutes to get to a workingprogram, and just over an hour to now. Seems longer. Also, I have a small hangnail that's bothering me (fingernails are one of my nervous/bored/unfocused tics).

Take a small mental brake to clear my head, then come back for the actual semantic review, which I got distracted from by adding the coding sections above.

Added a key to the top of the document. I'm going to make this more attractive, then go back to the review. The webpage is kind of unreadable, and reiewing in HTML is distracting to me.

Need to make the non-core things easier to separate from the text. Maybe the baseline thing I was thinking about. Looking for how to adjust baseline in CSS: [CSS vertical spacing], after a few false starts ("text baseline", "CSS text baseline"). Editing this paragraph made me think enough to realize it's probably a terrible idea, more distracting than not spacing things, so back to finding suitably faint highlighting colors for the other properties.

I need to pick colors. I think about digging out the stuff I've done before, but I'm not sure where it's at, so I'm going to start from scratch, again. Looking for color scheme generators or something [html color picker] doesn't get what I was looking for (obvious in retrospect), but does get me, which is useful, even though OS X the exact same damned thing built in (somewhere, which I'd have to find).

Okay, that looks much better. Calling it finished enough. Fuck templatizing for now. I'm going to send this to some friends and get feedback. And actually deploy it to a private place on my server!

Commit doco

Committed everything above. Now what? Wow, I'm really hungry, and the alarm for my pill went off a bit ago, and the mail just came. I think it's time to eat and figure this out. I'll deploy a copy first, though, and set it up on my phone while I eat. Actually, doing an 'undertake publish' first. scp'd to webhost. Obviously, I need to update the index.html. I also want to touch up the README, and then push a copy into github. Once that's done, I'll link to it from my twitter.


Copyright © 2013-2015 Josh Myer. Released under the GPL v2.