Monday, October 29, 2012

How To Make Ringtones With iTunes

This post discusses how to create an iPhone ringtone from a song in iTunes.  The instructions are specifically for iTunes 10.7, but generally the steps will be the same for other versions.

So, you can't get that catchy tune out of your head?  Make it your ringtone!  This post will explain the simple steps to make free custom ringtones of your favorite songs.

Creating the Ringtone Clip
The first step to making a custom ringtone is to launch iTunes and locate the song in your library.  For this example we will be using "Paper Planes" by M.I.A.:
Now, right-click the desired song and select 'Get Info' (or simply press ⌘I) to open the properties dialog.  Then, select the 'Options' tab:
Notice there are two check boxes for 'Start Time' and 'Stop Time'.  Set these both according to which part of the song you wish to sample for your ringtone, up to a maximum of 30 seconds in duration.   For this example, we will simply choose the first 30 seconds of the song:
(Circled in red.)  Click 'Ok' to close the dialog and return to your iTunes library.  Then, right-click the song again and select 'Create AAC Version', or select 'Create AAC Version' from the Advanced menu.  iTunes will automatically create a new 30-second AAC audio file from the original song:
(Circled in red.)  Yay!  We have created the ringtone clip.  Restore the settings of the original song by going back to the 'Options' dialog and un-checking 'Start Time' and 'Stop Time'.

Change File Extension
Now we have a 30-second clip of the song we wish to use as the ringtone.  The problem is that iTunes doesn't recognize it as a ringtone because the file has an '.m4a' extension.  This can be seen by selecting the clip and viewing its info:
(Circled in red).  To fix this, right-click the clip and select 'Show in Finder', or select 'Show in Finder' from the File menu.  Then, rename the song so that it has an '.m4r' extension:
(Circled in red.)  When you are done renaming, you will see a dialog confirming you wish to make the change:
Click 'Use .m4r' to accept the change.  Yay!  We have successfully changed the file extension.

Import as Ringtone
We changed the extension, but iTunes still thinks our clip is an 'AAC audio file'.  To see this, select the clip in iTunes and open the info dialog.  Notice the extension is '.m4r' but the Kind attribute is still 'AAC audio file':
(Circled in red.)  To fix this, we will first need to remove the clip from the library, and then we will import it back.  

Close the info dialog and return to iTunes.  Select the clip and press the 'Delete' key, or select 'Delete' from the Edit menu.  iTunes will ask you to confirm the deletion with the following dialog:
Click 'Delete Song' to confirm you wish to remove the clip from your iTunes library.  As a secondary precaution, iTunes will then ask if you wish to keep the file on disk or move it to the Trash:
Click 'Keep File' so that we can still view our clip in the Finder window.  Then, return to the Finder window and double-click the clip (with '.m4r' extension).  iTunes will automatically recognize it as a ringtone, and file it under the Tones tab of iTunes:
Yay!  We have imported the clip into iTunes as a ringtone.  Now you can set the ringtone on your iPhone as you normally would.

Friday, October 05, 2012

Dynamic Web Application in Eclipse

This post discusses how to create a dynamic web application (Java EE) in Eclipse.  We also explore how to automatically publish changes during development.

In Add an External Server to Eclipse Workspace, we learned how to configure Eclipse to be aware of the Tomcat server we installed on our Mac.  Now let's build a sample web application for it.

Dynamic Web Project
In Eclipse, the easiest way to build a Java EE web application is by creating a Dynamic Web Project.  Open the File > New > Other... menu, or simply press ⌘N.  In the dialog that opens, select the 'Dynamic Web Project' wizard:
Click 'Next'.  In the subsequent dialog, give the project a name, 'Hello World' for example, and select 'Apache Tomcat v7.0' as the target runtime:
Click 'Finish' when done.  The result will be a new project called 'Hello World':
Yay!  We have created a dynamic web project in Eclipse.

Index JSP
Our Hello World project is great, but not really useful yet.  Let's create a file to be served so that we can see our web application in action.  Open the File > New > Other... menu, or simply press ⌘N.  In the dialog that opens, select the 'JSP File' wizard:
Click 'Next'.  In the subsequent dialog, select "Hello World/WebContent" as the parent folder and name the file 'index.jsp':
Click 'Finish' when done.  Eclipse will automatically open the index.jsp file in the editor.  Add some text to the body, say the phrase "Hello, world!" or something:
Save the file when you are done.

Run on Server
Now we are ready to launch our web application.  Open the Run > Run As > Run on Server menu.  In the subsequent dialog, choose 'Tomcat v7.0 Server at localhost' as the target server, and check the box for 'Always use this server':
(Circled in red.)  Click 'Finished' when done.  Eclipse will automatically start the Tomcat server and open the index.jsp file in the built-in web browser:
You may also open the 'Hello World' application by pointing your browser to http://localhost:8080/Hello_World/:
Yay!  We have successfully created a sample web application.

You may have noticed, the title of the web page still says 'Insert title here':
(Circled in red.)  Returning to Eclipse, open index.jsp in the editor and change the title to 'Hello World':
Save the file when finished.  Back in your browser, refresh the page and notice the new title:
(Circled in red.)  Yay!  Our web application has the correct title.

Publishing Changes
Tomcat picked up the change automatically.  But how did this happen?  To answer this question, double-click on the Tomcat server in the 'Servers' view to open the 'Overview'.  Notice the collapsed 'Publishing' panel in the upper right:
(Circled in red.)  Expand it to reveal the setting to 'Automatically publish when resources change':
Change to 'Never publish automatically' to disable automatic publishing.  Save the changes.

Now, changes to the JSP will have to be published manually.  To illustrate, return to index.jsp in Eclipse and augment the body text to look like this:
Hello, world!<br>
I am a <%= config.getServletName() %>.
Save the file and return to your browser.  This time, when you refresh the page, the change you just made will not appear automatically.  

To manually publish the changes to the server, return to the 'Servers' view, select the Tomcat server, and click the 'Publish' button:
(Circled in red.)  Return to your browser and refresh the page to reveal the changes:
Yay!  We now know how to disable automatic publishing and publish changes manually.  (To restore automatic publishing, return to the server 'Overview' and set the desired option in the 'Publishing' panel.  Save your changes when done.)

Monday, October 01, 2012

Add an External Server to Eclipse Workspace

This post discusses how to add an external Apache Tomcat server to your Eclipse workspace.  The instructions are specifically for Tomcat 7.0.29 on Mac OS X 10.7.4 "Lion" and Eclipse Platform 4.2.0 "Juno", but generally the steps will be the same for other versions.

In Install Tomcat on your Mac, we learned how to install a Tomcat server on our Mac.  Now, to develop Java applications in Eclipse for that server, we must tell the IDE about it.  If you do not have Eclipse installed on your Mac, visit Eclipse IDE for Java EE Developers.

New Server
Adding a server to Eclipse is easy.  Open the File > New > Other... menu, or simply press ⌘N.  In the dialog that opens, select the 'Server' wizard:
 Click 'Next' when done.  In the subsequent dialog, select 'Apache Tomcat v7.0 Server'
Click 'Next when done.  In the final dialog, we will need to enter the path to the Tomcat server.  If you followed the directions in the previous post, there should already be a symbolic link at /Library/Tomcat.  Enter that now:
(Otherwise, find the actual path to your Tomcat installation and use that instead.)  Click 'Finish when done.  When you return to the main view, you should see the server you just installed:
Yay!  We have finished adding an external Tomcat server to our Eclipse workspace.

Verify New Server
Let's confirm that Eclipse recognizes and can control the server.  Show the 'Servers' view by opening the Window > Show View > Servers menu.  The 'Servers' view appears as a tab in the Java EE (default) perspective:
Notice there are buttons to start the server in various modes.  Click the 'Start the server' button (circled in red):
The status message for the server will change to say something like this:
Tomcat v7.0 Server at localhost  [Started, Synchronized]
So, has it really started?  Let's confirm.  In the previous post, we confirmed Tomcat was running by pointing our browser to http://localhost:8080/ and viewing a confirmation page.  Let's try again.  This time you should see something like this:
This is not the confirmation page we expected.  What's going on?  The server is obviously running, as evidenced by the footer ("Apache Tomcat/7.0.29").  However, the confirmation page cannot be found.  Where is Tomcat looking for its files?

Run Configuration
The most straightforward way to answer this question is to look at the command being used to launch Tomcat.  Eclipse uses a run configuration to dynamically construct a command from various inputs specified.  To view all run configurations, open the Run > Run Configurations... menu:
Yay!  There indeed exists a run configuration for our Tomcat server, under the 'Apache Tomcat' group.  Select our server and then click the 'Arguments' tab.  This will expose the 'VM arguments' used to start the server:
(Circled in red.)  There are many arguments listed here.  The leading -D before each one is how Java arguments are specified on the command line.  Ignore them to examine the name of each property and its value.

The most important property for us right now is wtp.deploy.  This specifies the WTP deployment directory, which is where Tomcat looks for web applications.  The value of this property will by default be the .metadata/.plugins/org.eclipse.wst.server.core/tmp0/wtpwebapps subdirectory of your Eclipse workspace.

Let's see what's in there.  Open a Terminal window and type:
$ cd <path_to_workspace>
$ cd .metadata/.plugins/org.eclipse.wst.server.core/tmp0/wtpwebapps
(Replacing path_to_workspace with your own.)  This will change directories to the deployment directory.  Let's list its contents.  In your Terminal window type:
$ ls
The ROOT directory is the default document base for Tomcat (also known as the context root).  In other words, Tomcat will look in thROOT folder for all requests, unless another web app has been configured.  This includes the simple root request "/" itself.  

Let's navigate to that directory and list its contents:
$ cd ROOT
$ ls
As you can see, there is nothing here besides the WEB-INF directory.  This explains why we see the HTTP 404 error page when we point to http://localhost:8080/ -- no file can be found!

Server Overview
An alternative to looking at the run configuration is to open the server's 'Overview' pane by double-clicking our server in the 'Servers' tab:
(Circled in red.)  Looking closer, we see the path to the deployment directory is visible in the 'Server Locations' panel:
(Circled in red).  Notice the radio button for 'Use custom location'.  Click that to reveal the server path:
(Circled in red.)  Yay!  It is  .metadata/.plugins/org.eclipse.wst.server.core/tmp0/wtpwebapps, just as we expected.  Click the 'Use workspace metadata' radio button to restore the original setting.

Index Page
Let's create a page to be served.  In the Terminal window, type the following command:
$ echo 'This is the index page' > index.html
This should create an index.html page to be served when users navigate to http://localhost:8080/.  Refresh the browser to confirm:
Yay!  We have verified our Tomcat server installation.  

Finally, you may stop the server by clicking the 'Stop the server' icon in the 'Servers' tab:
(Circled in red.)  The server status will change to something like this:
Tomcat v7.0 Server at localhost  [Stopped, Synchronized]
You may exit Eclipse when you are done.