Moms Club Website

One of the many projects I’ve been up to lately is updating the website for the moms club I belong to. It probably doesn’t surprise you that that moms clubs are not typically havens full of geeks, so it probably also doesn’t surprise you that I got recruited into updating the website.

It’s something I don’t mind doing though, I think it will help other moms looking for their niche where they really find community. There’s a lot of stuff the club does that you wouldn’t realize from the website, and who’s going to pore over years worth of back-issues of newsletters (unless, say, one was updating a website and looking for content…) to learn about them?

But before tackling content, the UI was in sore need of a makeover. Here’s a before/after thumbnail:

Certainly, there are still things I think could be better UI-wise, but its a huge improvement, and I’m going for incrementally better changes. By the time I got done with the new homepage, it had been so long since I’d gone back and looked at what I started with, that I’d almost forgotten some of the things I had fixed early on, like the random checkerboard pattern, and half of the headings being images without alt text, in a different color and font-style than the other headings on the page.

I’m going to have a featured article in next month’s member newsletter letting them know about some of the changes. Here’s an excerpt from my article:

Website Update

If you’ve been to our public website recently, you’ve probably noticed some changes. […]

Behind the scenes I’ve been working on sprucing up the website, doing lots of things that you probably haven’t noticed like search engine optimizations and new “404 error” pages, as well as some much more apparent changes like the new look for the home page and additional content throughout the site.

We now have a new contact form where you can easily contact a variety of club officers without having to keep track of who is fulfilling that role at the moment.

There is also a new playgrounds and outings guide that I’m particularly excited about. I’m always looking for ideas on fun things to get out and do, and being new to the area, I don’t automatically “just know” everything there is to do around here, so it was a great discovery to find a list of local attractions collecting dust in the files area. The list has been updated and now is on the website where you can easily share it with your friends, including ones who aren’t members—yet!

Another new addition to the website is a section with visual tutorials on how to use BigTent. To be honest, even I, a total geek who “should” know how to do that kind of stuff, had to search the help area to figure out how to leave a subgroup, so if there’s something that seems like it ought to be easy to do, but isn’t obvious, it’s probably not just you! So I’ve taken some of Ivette’s wonderful BigTent tutorials and added screen-shots and put them on the public website where they should be easy to find, and added direct links to some of the other existing tutorials. Same content, now easier to find.

There are still many more changes in the pipeline, so check back from time to time to see what’s new! And feel free to use the new contact form to send in your comments and suggestions on how we could make the website even more awesome!

Aside from the stuff mentioned in that article, other changes included things like a password protected file upload form with PHP script to let the member discount coordinator update the member discount PDF without me having to upload it and re-link it for her every time (FTP + non-techy = just not going to happen).

I also made “user friendly” 404 pages (and 401, 500, etc), that clearly let you know the page wasn’t found, but still has the navigation available to get back into the rest of the site even if you hit an unexpectedly bad link.

I also updated the entire site’s URL structure to make the URLs more logical. Having a folder called /pages/ in the url is kind of useless information to the person viewing the site. So the new urls follow a hierarchical structure and use folder names instead of filenames (so they don’t have to worry about whether it’s .php or .html), and of course I set up all the redirects in apache so incoming links from search engines don’t break and we don’t lose the page-ranks. And added the right meta-tags to make the snippets shown on google be the important part of the page, so the stuff shown is a bit more meaningful to people searching for the page, etc.

Embedded Iframes

Working with 3rd party embeddable widgets can often enhance the user experience by allowing you to show information you wouldn’t otherwise have access to, or save a click or two to get to a third-party login page, etc. However, not all 3rd party embedding APIs are created equal.

One in particular that I’ve been working with has absolutely no customization options, and the only option for how to embed it is with an iframe. This severely limits the options I have as far as integrating the widget into the rest of the page. The rest of the page has headings in blue, in Arial, and the widget? No way to customize that font.

I’ve looked into it multiple times, but without control over the domain hosting the widget, there’s no way to add CSS to within the iframe, because even if you add the CSS with javascript, you still have to have the CSS on the same domain as the iframe because of cross-site scripting safety.

I did at least find some answers about the limited customizations I do have. You can change the margins, padding, and border, basically, the frame itself. The couple interesting things you can do is use CSS3 features to add shadows to the border, or even rotate the frame (though in my testing the rotation looks terrible and isn’t up to the quality needed to look decent) to at least make the sticking out like a sore thumb widget look intentionally stand-out from the rest of the page…sort of…I’d rather have it at least have matching fonts…but until I figure out some way to do that using an API with no “attach stylesheet” option, my hands are tied.

Delphi 7 for Java Programmers

Comments

Comment Style Java Delphi
// comment yes yes
/* comment */ yes no
(* comment *) no yes
{ comment } no yes

Delphi convention: (* code *) vs {Textual Comment}

Procedure vs Function
Method in Java = either “function” (if it has a return value) or “procedure” (if it has no return value) in Delphi

Overloading a procedure:
In the interface section of your unit, add “overload;” at the end of both overloaded versions of the procedure.

    procedure TranslateForm(form : TTntForm); overload;
    procedure TranslateForm(form : TForm); overload;

Exceptions

Java Delphi
Try Try
Catch Except
Finally Finally
Throw Raise

In order to have both an Except and Finally block for the same line of code, you have to nest Try blocks, like this:

Try
  Try
    causeSomeRandomException();
  except
    on E:Exception do ErrorMsg(num,'Error:',E.Message,True);
  end;
finally
  doSomeCleanup();
end;

Other suggested reading:
http://techinorg.blogspot.com/2008/09/delphi-for-java-developers.html
Comments on some of the differences the author found less enjoyable

http://www.webbasedprogramming.com/Java-Developers-Reference/ch5.htm
It’s going the other way Delphi to Java, so it’ll point out areas of difference, but not the Delphi syntax.

http://www.marcocantu.com/papers/ooplang.htm
Compares C++, Java, and Object Pascal (Delphi)’s OOP Features.

Delphi Reflections

As I continue to learn and work with Delphi, I am finding it to be quite an enjoyable language to program in. Sure, those begin-end blocks with the wordy labels for where they begin and end are a little harder to read than braces would be. But there’s also some little niceties, like single character delimiters for inline comments, that are not the same delimiters you would use to comment out a large block of code temporarily. There are certainly disadvantages to using such an old version of the language/IDE, I dearly miss “find references”, which would be super-useful considering I didn’t write most of the code and have to spend much time discovering how it works. Having struct equivalents, and super-flexible sorted string lists that can be just lists or maps or…(TStringList, THashedStringList)

I also like the UI for editing the GUI fairly well, the stretch to fill client area option and setting the anchor points seems a lot more intuitive to me than some of the Java layout managers/UI editors. I like the power and flexibility that Delphi is so closely related to the C++ language of families that you can use certain C++isms (eg: String pointers) when you need them, but pretend they don’t exist the rest of the time. And being able to use functions from the Windows API makes me feel a little bit at home from my C++ programming days.

Overall, this has been a really fun project to work on, even with the not knowing the language well handicap (yes, there has been LOTS of Googling. Especially since Barnes & Noble didn’t have ANY Delphi related programming books in stock. Maybe next time I’m in the Bay Area I could acquire a printed book or two?

Delphi

I wouldn’t have picked Delphi, personally, as a language to take up. I like, generally, working with languages that use C style syntax, and every time I jump into Visual Basic, which is fairly comparable with Delphi from what I gather, the IDE and GUI Builders are lovely, but the syntax is nutty and harder to remember. I don’t know other Delphi programmers, so I don’t have friends or co-workers to whom I can ask questions about the language. And then the kicker, learning Delphi is not likely to open doors career-wise, you just don’t see hordes of job listings looking for Pascal/Delphi programmers these days. Getting additional practice or depth in a language that I’d be likely to use professionally would just seem so much more “practical”.

But in a way, working with this code written in Delphi is also very much like the real-world. I’m thrust into a code-base I didn’t write, in a language I’m not an expert at, with a specific goal in mind that requires knowledge I don’t already have. Doing the leg-work of research to invent a solution to a problem, with external constraints, is very much a real-world scenario. It takes the same sort of deciphering other people’s code, coming up with a theory about where you need to modify the code to create the change you need to make, doing research to find all the bits and pieces of knowledge you don’t already have and synthesizing them into a solution unique to the problem at hand.

In the end it’s satisfying though. You put the pieces together and see it come closer and closer to a working solution. And then there it is, solved. And I have to say, as I work with Delphi, and overcome the humps of orienting myself with the language and IDE (like why there’s no toolbar button for viewing the call-stack on the debug toolbar) and so on, it’s not a terrible language to work with. I really enjoy this sort of programming, it’s a night and day contrast compared to writing PHP code, even though I’m primarily self-taught in both areas. I enjoy it, even though there’s certainly things that could be documented better that seem basic but not obvious.

Don’t Be That Developer

Back in April of 2005, I came across a strange syntax in some java programming I was doing for work.

Class.forName("[S");

Back then, there was no convenient free StackOverflow site to quickly find an expert who would know off the top of their head what that syntax meant. And searching for “[” on Google certainly wasn’t a winning solution since square braces weren’t even indexed characters. How do you search for something that you don’t know the name of?

It took a while to find the answer. It turns out, it was a tricky way, using reflection of saying the same thing as short[].class

Really? Who would have guessed? It certainly wasn’t clearly documented anywhere, especially not in the code where it was used. And where it was used, there was absolutely no reason it needed to be using reflection and using some sneaky syntax.

Had the developer just kept it simple and written so much as a comment, or used a more straightforward, well-documented syntax the code would have been easier to maintain. We’re not playing Code Golf here (though even if we were, the non-reflection version still comes out shorter)!

Web Typography Cheatsheet

Because I don’t have all of these memorized yet, here is a quick cheat-sheet for making proper dashes and quotation-marks:

– en dash (–)
— em dash (—)
‘ left single quotation mark (‘)
’ right single quotation mark (’)
“ left double quotation mark (“)
” right double quotation mark (”)
‹ single left-pointing angle quotation mark (‹)
› single right-pointing angle quotation mark (›)

Yay! New Insight!

I don’t know why I didn’t think of this solution sooner! I was having this problem on a couple websites I maintain, that I needed to include some additional files, with extra content such as sidebars.
At first, I’d started out with a URL relative to the site root:
<?php include_once "/file.php"; ?>
But…that turns out to be insanely slow, as the php processor makes an HTTP request to download the page rather than loading it directly from the file system, because it treats it as a URL instead of a file system path address.
So then I’d switched the URLs to be relative to the page, so it would load it directly from the file-system. Not so bad in the basic case where everything’s in the same folder:
<?php include_once "./file.php"; ?>
But, when you start including one global file in everything, you can’t just copy and paste the URL from file to file. Somewhere deeper in the site, the include needs to change to include a stack of parent directories to locate the file.
<?php include_once "./../../file.php"; ?>
The other alternative would be to prefix the file with it’s actual location on the file-system, however, with crazy paths like /home4/mydomain/site1/ that I can’t be bothered to remember off the top of my head, let alone change every time I want to re-use the code on a different domain, that didn’t seem like a good solution.
But then, after fixing a few more broken links caused by the author of the new pages copying and pasting a template page from a different directory and forgetting to update those dot-dots, again, I decided to take another look into whether there’s an better way to refer to the file-system without making it super-slow.
And then an insight came to me, perhaps there’s a PHP variable that will give me the path to the site’s root dynamically without all that /home4/ garbage in the include directly. Aha! Yes, there is, $_SERVER["DOCUMENT_ROOT"] and Tada! problem solved!
So I changed all my includes to look more like:
<?php include_once $_SERVER["DOCUMENT_ROOT"]."/file.php"; ?>
and no more having to fix broken sidebars because the include URL went wrong again. And it can copy and paste between domains cleanly. I don’t know why I didn’t think of this solution sooner, but I’m glad I came up with it!

HIPAA Compliance for Online Forms

I started doing a little research about HIPAA compliance and what it takes to make office forms/database secure and compliant with HIPAA.

  • Need various consent statement wordings and access to your privacy practices handout, etc. — rather trivial
  • HTTPS/SSL urls when user is entering any of their information, redirect to secure URL if trying to access insecurely — I haven’t done this before, but it does not look like it would be terribly complicated or difficult to implement
  • database encryption – the user’s personal data needs to be encrypted while stored so that it can’t be accessed by unauthorized persons or hackers. — Smaller businesses have more leeway than a big corporation since there is less data/risk. MySQL does have some built in column level encryption methods, but those seem to be mostly aimed at preventing passwords from being stored in clear text rather than preventing a query from mistakenly bringing up the wrong user’s private records when they go to log in and preventing someone who works for the hosting company or whatever from tampering with user’s data. This is not my area of specialty, may want to consult with an expert. The solution itself is likely to be trivial or relatively easy to implement, knowing what to implement is the hard part.
  • Backups – there’s kind of debate it seems about whether hosting company backups are sufficient. The scale of the business may matter as far as the answer here, but should look into what the backup policies are for the web host.
  • Permanently expunging data that is no longer needed – Mostly, this is handled by not storing data you don’t need to store in the first place. You may want to think about whether this would entail a mechanism to be able to delete an entire person’s record, or whether deleting the database when it’s no longer needed is sufficient.
  • Hosting company should have an information security policy – basically,  the hosting company should have a policy about how information is backed up and who is allowed access to the data on your server. nothing exciting here (unless you were using some fly by night hosting company that isn’t professional).
  • “authentication and non-repudiation of users” – username and “secure” password (eg: 8+ characters) should be used to verify the user is who they say they are, and that they are authorized to access their own data.

Free Online Book on Android HTML 5 Apps

I saw a link to this free online book about Android development on a blog I follow.

The book is called “Building Android Apps with HTML, CSS, and JavaScript” by Jonathan Stark.

Looks potentially useful! I think I shall bookmark this to look at later.