SyntaxHighlighter

Thursday, June 26, 2008

Rails Javascript Widget

At Entertonement (I know, the name sounds like a old appliance, but that's the retro cool thing about it), we're building a rails app to upload and work with sound clips. You can add a clip - then we'll convert it - allow you to make a ring tone out of it, embed it in a blog, etc. Here's the first test of the javascript widget that we're making. Sorry - it'll probably break if you're not logged into our dev site.

Some details about the Rails Javascript Widget:

I have a simple .rhtml file that looks like so:

<% style = params[:style]; size = params[:size] || 'medium' %> <br /><% width = (size == 'large') ? '200px' : '100px' %> <br />(function(){ <br />document.write('<div style="border:solid 1px grey; width:<%= width %>;overflow:hidden;text-align:center;font:normal 11pt verdana;padding:3px;<%= style %>">'); <br />document.write('<%= image_tag( @clip.image_file(size.to_sym || :medium), :style => "width:#{width};padding:0px;border:0px") %><br>'); <br />document.write('<object align="top" data="&lt;%= DOMAIN %&gt;/embed/button/musicplayer.swf?&amp;song_url=&lt;%= @clip.audio_path %&gt;&amp;" height="17" style="margin:5px" type="application/x-shockwave-flash" width="17">'); <br />document.write('<param name="movie" value="/embed/button/musicplayer.swf?&song_url=<%= @clip.audio_path %>&" />'); <br />document.write('<img alt="" height="17" src="noflash.gif" width="17" />'); <br />document.write('</object>'); <br />document.write('<div style="border-top:solid 1px #EEE;padding:5px 0px;line-height:19px;">'); <br />document.write('<a href="<%= escape_javascript @clip.url %>" style="color:#888;font-size:8pt"><strong><%= escape_javascript(h(@clip.name)) %></strong><br>Sound clip on<br><span style="color:#C4222B;white-space:nowrap">ENTER<span style="color:#418CC5">TONE</span>MENT</span></a>'); <br />document.write('</div></div>'); <br />})()

Mainly a bunch of document.write calls to display the appropriate html.

When you add it to a website - you simple add this kind of code:

<script type="text/javascript" src="http://devsite.entertonement.com/clips/embed/400084"></script>

This will be on the live site soon enough to test for real.

Monday, June 09, 2008

Paperclip - uploads, attachments, and thumbnails in Rails

I tend to use image upload and resizing on most of the apps I create. Even my latest KidFlick - where it's easy to share photos privately.

Paperclip is a great new plugin that just works the way it's supposed to.

Check it out at: Paperclip - uploading files, no hassle