Web Programming

Updating the website

Ok, so now that I am able to work with the code and interact with Subversion, it’s time to update the website.
1. SSH userid@therockband.org
2. CD therockband.org/live or CD therockband.org/test
3. svn checkout http://svn.therockband.org .

Note the ‘.’ at the end of the svn checkout command line. Without specifying a path svn will use the path in the repository, which in this case is svn.therockband.org which isn’t what we want. Also, if not careful, the files might go right over top of the repository itself (doing nothing).

To avoid confusion, I’m going to create separate directories for the ‘live’ and ‘test’. Now when I run ‘checkout’ I see all of the files getting copied. When I run ‘update’ I see a list of the files that needed to be updated and the new revision number.

It doesn’t get much easier than that.

Continuing with Subversion in Zend Studio for Eclipse

I’ve been making updates to the code. Now I need to check them into SVN. Since I have the SCPlugin installed, I simply use Finder, right-click on the top folder(s), and select ‘Subversion Commit…’. This recursively lists all files that have changed, and checks them in.

So now I’m wondering how to work with Subversion from within Zend Studio for Eclipse (ZSE).

It appears at this point that I’ve made a mistake by installing Subclipse. It appears that Subversive comes already installed with Zend Server CE, so now I see two ‘SVN’s listed in various places. It isn’t readily apparent that either is better than the other, so I’m going to uninstall Subclipse to avoid confusion. So now my Project Configuration shows:
Subversion Client Adapter (Required) 1.6.0.2
Subversion JavaHL Native Library Adapter (Required) 1.6.2.1
Subversive SVN Team Provider (Incubation) 0.7.7.I20090224-1900
SVNKit Library 1.3.0.5847

This appears to have fixed things. So now in the PHP Explorer I see a symbol to the left of each file if the file is out-of-sync with the repository, and a version number to the right of it. Right clicking on any file gives me all the subversion options under the ‘Team’ menu item, and Compare With and Replace With give me options for working with the repository. This is very cool.

Using Subversion in Eclipse

Having setup a Subversion repository on Dreamhost and imported all the existing code, I’m ready to start using it in my day-to-day programming. I’ve already installed the Subclipse 1.4.8 plugin, so let’s figure out how to use it.

To check out a working copy:
* Eclipse File->Import->SVN/Checkout Projects from SVN, next
* Create a new repository (since this is the first time), next.
* Enter the URL to the repository (http://svn.therockband.org
At this point I got an error “Unable to load default SVN Client”.

On OS X Subclipse requires JavaHL. This appeared to be installed, but maybe this is causing the problem. So I downloaded the Universal Mac package from CollabNet (http://www.open.collab.net/downloads/community/). This appears to be a newer version 1.6.2.
Before continuing with the install, I disabled the existing Subversion plugins in Eclipse (everything except Subversive, which indicated that it was required by the Zend Studio CE.
Installation put a copy of Subversion in /opt/subversion.
Now I installed Subclipse in Eclipse from the 1.6 Subclipse path.

Now I can open the SVN Repositories Perspective. However, the ‘Synchronize’ function isn’t working. I’ll leave that for tomorrow.

Setting up Subversion

Having downloaded and installed subversion, I’m ready to set it up for use with all of my website code. Since I’m working on a MacBook Pro, I’ll be using Terminal’s command line interface.

The svn-book available from http://subversion.tigris.org/ is a very useful document.

DreamHost supports subversion, so I’ve setup a repository there and a subdomain. I can access it at svn+ssh://userid@therockband.org/home/userid/svn/TRBSource. On DreamHost user’s must be specifically created or granted permission to access Subversion, so I added permissions to my main ID and created a couple additional IDs with subversion permission.

DreamHost FAQs list instructions for setting up credentials to allow accessing the site without specifying password every time (SSH#Passwordless_login). I set this up and provided the password one time. Now my accesses can be done quickly without being prompted for a password each time.

The initial set of files are added to the repository using the svn import command:
cd /Users/Ron/Sites (the documentroot folder on my MBP)
svn import newrockband2 svn+ssh://userid@therockband.org/home/userid/svn/TRBSource -m “Initial import”
During the process a message is displayed indicating each file being added.

I can now ‘list’ the files using:
svn list svn+ssh://userid@therockband.org/home/userid/svn/TRBSource
to verify that everything is there. The list shows that ‘application/’, ‘public/’, and ‘tests/’ folders were added. These are the contents of my ‘newrockband2’ folder. The folder itself was not added.

So now I rename the original newrockband2 folder, create a new one, and creating a working copy in the new folder using ‘svn checkout …’ on all 3 directories (from within the new directory).

Ok, so now I realize that this isn’t the layout that I really wanted. I didn’t create the recommended ‘trunk’, ‘branches’, and ‘tags’ directories first. So I’ll need to create these directories, and then move my new directories to trunk/. So a quick check with ‘svn help’ shows ‘move’ and ‘mkdir’ commands (among others). ‘svn help mkdir’ and ‘svn help move’ give info on using these commands. However, I’m get an error when trying to use mkdir telling me that I haven’t setup environment variables to display/edit log messages. So for now I’m going to leave it alone. I’ll add/move those later.

First of course I make sure that my backups are up-to-date. I’m using Time Machine, so I verify that it has completed a recent backup. Now I’m going to cleanup my Sites folder, deleting a lot of old stuff (it’s backed up, right?), then check-out the code I just put there.

Having previously installed SCPlugin, now when I look at my newrockband2 folder in Finder I see green checkboxes next to the directories 🙂

However, browsing to the new copy displays an error message complaining that it cannot open the log.txt file. So I locate the log file and change permissions ‘chmod 777 log.txt’ and all appears to be well now.

Now I need to check out the code to the live site (new.therockband.org). This is described in http://wiki.dreamhost.com/Subversion#Gotchas. So I SSH into the site (ssh userid@therockband.org):
cd therockband.org
svn checkout http://svn.therockband.org

Browsing to the site now, I see that the DB path is incorrect (127.0.0.1). The APPLICATION_ENV is specified in the .htaccess file, so I edit it using pico. There appears to still be an error, which I’ll investigate tomorrow. But for now it appears that Subversion is working, and can directly update live site. Tomorrow I’ll investigate using it to deliver to a test site also.

Web Development

For the past 4 months I have been knee deep in refreshing and extending my web development skills.

I decided to move some of software I wrote at work over to be web based, since many of my users are located in Taiwan and Shanghai. This has been a very interesting project. I’ve had a lot of fun doing it, and learned a lot in the process.

Below is an append that I have made to one of the Zend forums:

I’ve recently moved from Dreamweaver (DW) to Eclipse PDT (without Zend). I’m trying to avoid the $400 to purchase Zend.

I have been pretty much hand coding PHP and JavaScript in DW, using DW to help with CSS and FTP posting to the server.

DW is very helpful when it comes to the graphical/artistic aspects of the site, and was helpful in getting PHP code started. I like the way it helped me get MySQL going, and some of the code it generates for PHP handling of forms, etc.

However, once I outgrew the built-in Spry capability, what I found was that the code it generated was horrible to try to maintain and extend afterwards. I’ve had to refactor/rewrite all of it.

Let me say that using Dreamweaver allowed me to get my last site up quickly, and for that it is a very powerful tool. However, once I reached a certain level of complexity (and personal skills) I needed to ‘graduate’ to something more programmer-centric.

I’ve spent the past couple weeks working with Eclipse+PDT. It took me a day to get things downloaded, mapped to my directories, and the free Zend Debugger installed on my local Apache test server.

The fact that all of this was free was a prime consideration for me at this point. I think if I had had $400 I would have purchased the all-in-one Zend Studio for Eclipse things to simplify and speed up doing all of this. It would be nice to have had technical support during this process.

That gave me a good IDE, but no way to keep my production server updated. I created the Eclipse project right within my local Apache DocumentsRoot so I don’t need to copy to/from the local test server. I also set DocumentsRoot to my AccuRev workspace, so SCM check-in/check-out is quite simple. My company uses AccuRev so I didn’t really have a choice there. If I had the choice I would have installed Subversion and taken a look at Subclipse. I agree with the earlier post that it is worthwhile and probably *not* overkill.

I’ve been using BC2 for synch’ing my local files to the production server. (I use a separate AccuRev workspace to track these changes). This works ok, but I’ve never figured out how to resolve the linux/windows file differences, so the files always appear different until opened and compared. I’ve done a little reading about the RSE(?) project on Eclipse which is supposed to provide remote site management, but haven’t figured it out yet and haven’t wanted to spend a lot of time researching it. My guess is that eventually this will provide the sort of synch capability we all need right within Eclipse.

I purchased Zend Studio 5.5 long ago, and am in the process of evaluating using it instead of Eclipse for now. It appears to provide the main things I needed (Editor, IDE, Debug, FTP) and it also runs on both Mac (my laptop) and Windows (my work desktop).

I hope this long winded post provides you with a few ideas and pointers. Good luck.

Update as of 2/16/09: I convinced my work to purchase a copy of Zend Studio for Eclipse and am now using that. This appears to have been a good choice and well worth the $400 investment.

I’m now part way up the steep learning curve of using Zend Framework. I’ve very excited about this and expect to convert all of my current sites over to Zend framework. I’m working my way through Rob Allen’s “Zend Framework in Action” book, but found that I also needed to view some online youtube tutorials and the Zend online tutorial before it all started clicking for me. I recommend doing this.

(end of forum append)

Having made the point in the first append that I would purchase Zend Studio if I had $400, I went back to my work and requested to purchase it and they agreed. So now I’m using Zend Studio for Eclipse and so far am very happy with it. It’s support for Zend Studio is perhaps the biggest advantage at this point.

I came across Rob Allen’s web site (akrabat.com). This is another good resource for learning about Zend Framework.

Updated ChordsAndLyrics Plugin

I’ve been using the plugin now for a couple months on our church band website with pretty good success. I’m working now on posting it publicly.

I’ve created a folder for it at http://lisles.net/ChordsAndLyrics.

I’ve also created a new category for specifically discussing it on this blog, and will use that category in links back to this blog regarding it.

The latest version 1.2 contains a Site Admin panel in Settings that can be used to select whether to display both Chords and Lyrics or Lyrics only. It also resolves the problem of lyrics wrapping around under a single Chord symbol when the lyrics length is long.

Conversing with Goats

Last Sunday we had a visiting pastor at our church, Brad Brittain. He gave a wonderful sermon and used an illustration about a conversation with a couple goats and a fox that sounded like a great idea for a song. I asked him where he got the idea for the story, and he told me that it “just came to him”. So I asked if he’d mind if I made it into a song, and he likes the idea. So now I’m waiting on the Lord to give me the song 😉

Extending WordPress to Display Music Chords & Lyrics

It plan on extending WordPress to support creating music lead sheets using a ChordPro type syntax. This syntax uses square brackets to enclose tags describing music attributes of a song (eg. [Title], [Composer], [Tempo]) in addition to chord names (eg. [Amaj7]).

It appears that a plug-in can be created which will allow extending WordPress without hacking the source code. Requirements and questions to resolve:

  1. Songs must be easily linkable from multiple locations since songs are used repeatedly and I don’t want to have to cut/paste the song source every time it is used.
  2. Provide all the capability of the current custom PHP songs pages on TheRockBand.org:
    a. Allow display of songs for a given date showing sequence, etc.
    b. Associate with an MP3 file.
    c. Provide alternate displays, for example “List all songs alphabetically”

In addition to providing the existing functionality, it will be good to allow comments/discussions regarding each song, with searchability for previous comments made about a given song.

Plug-In creation steps:

  1. Create name to use for main .php file and folder for additional files
    How about “LeadSheet” or “ChordSheet”?
    This file and folder will need to be copied to wp-content/plugins/ during installation.
  2. Create a readme.txt if I want to publish to wordpress.org/extend/plugins.
  3. Create a homepage for distributing the plugin. Maybe on Lisles.net/LeadSheetPlugin?
  4. Modify main .php file to add plugin API hooks as needed.
  5. Adhere to the WordPress coding standards.
  6. Support Inline Documentation.
  7. Ensure unique names for all functions, etc. Alternatively, encapsulate them in a class.
  8. Do not hardcode “wp_” prefix. Use $spdb->prefix variable instead.
  9. Minimize DB writes.
  10. SELECT only what is needed.
  11. Use add_action in the global execution space to hook actions to new functions.
  12. Use add_filter in the global execution space to hook filters to new functions.
    Data is passed to the new function, and modified data or NULL returned.

It may be better to use a “Page” for each song. Need to investigate how to create and link to pages, etc. The down side may be that Pages don’t use the database, and I like the idea of keeping songs in the database instead of as separate files.

Another possibility is to use a Template Tag.

A plugin Filter might be used to format the ChordPro data prior to display.

A plugin Action might be used to syntax validate a new song upon entry.
This might include allowing cut/paste of existing chord sheets that put chords on a separate line above the lyric lines, and then converting them to ChordPro format.

Provide an Admin display to provide buttons for various chord types and song fields.

Music & Lyrics WordPress Theme

Following some additional study of WordPress, it appears that what I am trying to accomplish can be done by creating a Theme.

WordPress Themes

A Theme is simply a collection of custom Template files.

WordPress Templates

A Template file is simply a modified version of the wp-content/index.php file. Templates can be created to modify the way that specific categories are displayed.

So songs can be displayed in chord/lyric format by assigning them a specific category such as “Song”, and then creating a template for that category to format the chord/lyric display (category-X.php).

Similarly, I should be able to create a category and template for the weekly song lineup.