Wylie

Jul 2 10

Setting up a new dev environment

by admin

There are so many things i forget when setting up a new workstation. This time I took notes so I wont forget.

After installing VMWare fusion3 on my macbook pro I download the latest Ubuntu iso and start a new VM with it. I keep my work on TrueCrypt partitions. Then work my way down this list.

For starters

sudo apt-get install git-core gitk git-gui
sudo apt-get install subversion
sudo apt-get install ssh-client
sudo apt-get install ssh-server
sudo apt-get install vim
sudo apt-get install rake
sudo apt-get install libxml2-dev

Then install sphinx
http://freelancing-god.github.com/ts/en/installing_sphinx.html
./configure, make, sudo make install

VMWare Tools
Turn off shared folders (i always get failures when i dont)
From the virtual machine menu, select install VMTools. Open the virtual DVD and put the zip file on the desktop and extract it there.
From a terminal cd Desktop/vmware…
Then sudo ./vmware-tools-install.pl
Enter key for all the defaults. Then run the networking stop and start commands at the end of the instructions.

Install Ruby

sudo apt-get install ruby-full build-essential

sudo aptitude install ruby build-essential libopenssl-ruby ruby1.8-dev

Install Apache

sudo apt-get install apache2 apache2-mpm-prefork apache2-prefork-dev

Install Ruby Gems

sudo apt-get install rubygems
export PATH=/var/lib/gems/1.8/bin:$PATH

Install Rails

sudo gem install rails

Install MySQL

sudo apt-get install mysql-server mysql-client
sudo apt-get install libmysql-ruby libmysqlclient-dev
sudo gem install mysql

Install Passenger

sudo gem install passenger
sudo apt-get install apache2-threaded-dev libapr1-dev libaprutil1-dev
sudo /var/lib/gems/1.8/bin/passenger-install-apache2-module

[follow passenger instructions]

VMWare Network connections
Since FF is the default browser you need to make a small change to browse the web.
Open FF and put about:config in the URL. Then filter for ipv6 and set false to true and restart FF. You should be online.

Shared Folders
Use TrueCrypt to keep your work on and share /Volumes/[your TC Drive] with VMWare. You will need to shift+apple+g to get the got to folder dialogue to find /Volumes.
You can access the files in your VM here
/mnt/hgfs

Install Gems
[what ever gems you need ]

Configure Apache
(Sill on your VM)

mkdir ~/rails_development
cd ~/rails_development
ln -s /mnt/hgfs/[your drive]/myapp myapp

Now cd to /etc/apachec2/sites-available and sudo scp 000-default myapp
then sudo vim myapp

<VirtualHost *:80>
ServerName myapp.ubuntu
RailsEnv development
DocumentRoot /home/wylie/rails_development/myapp/public
<Directory /home/wylie/rails_development/myapp/public>
AllowOverride all
Options -MultiViews
</Directory>
</VirtualHost>

Then cd ../sites-enabled
and sudo ln -s ../sites-available/myapp
then sudo rm 000-default
Finally restart apache

Set your hostfile
(Back on OS X)
get the IP in your VM and edit your hosts file on OS X
sudo vim /etc/hosts
[ip of VM] myapp.ubuntu
then run dscacheutil -flushcache (i usually have to run this a few times for it to take)

Install the DB
create any databases you need for your apps

Dont’ forget the memcached

sudo apt-get install memcached
sudo /etc/init.d/memcached restart

Fire it up
open your browser and go to myapp.ubuntu

Permission fixes
if you put id in the command line in your VM you will see that UID is 1000. The problem is that VMWare puts you in as UID 501 and GID 20. We need to update Ubuntu to match
sudo vim /etc/passwd
Then find your user and change 1000:1000 to 501:20, save and exit
You wont be able to make any more changes so you need to reboot. You cant log in either so you need to Ctrl + Alt + f1 to switch to terminal. Login there.
Then, you need to cd to /home and change the permissions on everything in your user dir like this
sudo chown -R 501:20 wylie
Then you need to update the group file sudo vim /etc/group
find dialup and change that to wylie [your username]. Then you need to find your username and change 1000 to 20.
sudo reboot, login and permissions are now fixed. Its a good idea to update your apache in /etc/apache2/envars. Change www-data to your username in both places

Git GUI fixes
The text in the UI is huge so you can open synaptic package manage and search for tcl. mark the 8.5 version for install. Then search for the tk8.5 and mark that for instalation. Then in command line
sudo update-alternatives –config wish
select the option with 8.5. It should be number 3.
Now when you open git gui it should look normal

Now get to work…

Jun 25 10

Regular Expression Tools

by admin

A friend shared a RegEx tool that came in really handy. Its www.rubular.com. I dont’t get alot of opportunities to work with regex but when i do, having a new tool can make it almost fun.

I came up with this expression to match various URL’s that users enter that i could create new links from.

(((https?):\/\/)?(([0-9a-zA-Z][-\w]*\.)+[a-zA-Z]{2,9}(:\d{1,4})?([-\w\/#~.?=&%@~])*))

Looks like cartoon swearing.

Mar 30 10

color scheme tool

by admin

How did I get this far without a tool like this?
A friend sent this link to me and I wanted to be sure that I never lost it.
http://colorschemedesigner.com/

Mar 2 10

jQuery Emoticon Selector Plugin

by admin

I couldn’t find an emoticon plugin for inserting an emoticon into a text area. I found plenty that converted the emoticon code into an image. So, I set out to write my first jQuery plugin.

If you choose to use this, keep in mind this was my first plugin and should be thoroughly tested before using it. And if you make it better I would very much like to see what changes you made.

Lets check it out.

The view has two components. The jQuery call and the div with the necessary elements. (my examples are how i used this in Ruby)

<% javascript_tag do %>
$(document).ready(function() {
$("div#emodiv").emoticate({icon: ’smiley-icon’, replacediv: ‘list’});
});
<% end %>

Then the div that you identified in the jQuery call.

<div id="emodiv">
<img src="/images/emoticons/emoticon-0100-smile.png" id="smiley-icon">
<div id="list"> </div>
<select name="emoticons">
<option value=":)">emoticon-0100-smile.png</option>
<option value="|-(">emoticon-0106-crying.png</option>
<option value=";)">emoticon-0105-wink.png</option>
<option value=":(">emoticon-0106-crying.png</option>
<option value="(pt)">279.png</option>
<option value="(ct)">104.png</option>
<option value="(au)">342.png</option>
<option value="(eg)">emoticon-0116-evilgrin.png</option>
<option value=":*">emoticon-0109-kiss.png</option>
</select>
<div style="clear: both;"></div>
<p>
<textarea id="comment_1"></textarea>
</p>
</div>

What is going to happen is that the select and options will be changed to a UL list with the icon images. When an emoticon is clicked it will be inserted into the text area within the div. (The id for the textarea does need to be unique).

And here is the plugin.

(function($){
$.fn.emoticate = function(options){
var defaults = ({
replacediv: ‘replaceme’,
image_path: ‘/images/emoticons/’,
speed: 500,
icon: ’smiley’
});
var options = $.extend(defaults, options);
return this.each(function() {
var select = $(’select’, this);
var area = $(‘textarea’, this);
var icon = $("#" + defaults.icon, this);
var emo =‘<div class="emoticon-box"><ul>’;
$(‘option’, select).each(function () {
var option = $(this);
var emocode = option.val();
var title = option.text();
var link = $.fn.emoticate.emoticlick(title, emocode, defaults.image_path);
emo += ‘<li>’
+ link
+ ‘</li>’;
}); //end option
emo += ‘</ul></div>’;
select.remove(); //get rid of the select to make way for emotification
$("#" + defaults.replacediv, this).html(emo); //put the emotification HTML in the right div
$("#" + defaults.replacediv, this).hide(); //hide the emoticons
var listdiv = $("#" + defaults.replacediv, this); //reset the var so it will work in the icon click.. this probably could be done better
//bind the link for every a tag that is in the replaced div
$(‘a’, this).bind(‘click’, function() {
$.fn.emoticate.insertme(area.attr(‘id’), $(this).attr(‘id’));
return false;
}); //end bind
//click the icon
$(icon, this).bind(‘click’, function (){
listdiv.show(defaults.speed);
});
//function to click anywhere to hide the emoticons
$(document.body)click(function (){
listdiv.hide(defaults.speed);
});
}); //end select
}; //end function
$.fn.emoticate.emoticlick = function(id,emocode, image_path){
return ‘<a href="#" id="’ + emocode +‘"><img src="’ + image_path + id + ‘"></a>’;
};
$.fn.emoticate.insertme = function(areaId,text){
var txtarea = document.getElementById(areaId);
var scrollPos = txtarea.scrollTop;
var strPos = 0;
var br = ((txtarea.selectionStart || txtarea.selectionStart == ‘0′) ?
"ff" : (document.selection ? "ie" : false ) );
if (br == "ie") {
txtarea.focus(); var range = document.selection.createRange(); range.moveStart (‘character’, -txtarea.value.length);
strPos = range.text.length;
}
else if (br == "ff") strPos = txtarea.selectionStart;
var front = (txtarea.value).substring(0,strPos);
var back = (txtarea.value).substring(strPos,txtarea.value.length);
txtarea.value=front+text+back;
strPos = strPos + text.length;
if (br == "ie") {
txtarea.focus();
var range = document.selection.createRange();
range.moveStart (‘character’, -txtarea.value.length);
range.moveStart (‘character’, strPos);
range.moveEnd (‘character’, 0);
range.select();
}
else if (br == "ff") {
txtarea.selectionStart = strPos;
txtarea.selectionEnd = strPos;
txtarea.focus();
}
txtarea.scrollTop = scrollPos;
};
})(jQuery);

Or you can download it here.

Dec 20 09

Installing passenger on ubuntu has some issues

by admin

I followed the instructions on the Ubuntu site and the modrails site and everything would install fine but I could never get passenger to serve pages to apache.

Passenger assumes the permissions of the default apache user. And if you don’t set up your default user as www-data when you install Ubuntu Passenger wont have permission to run the app.

Open up /etc/apache2/envvars and change the www-data user and group to match your default user and group and you should be set.

Oct 30 09

Watch the whitespace

by admin

I have been spending the last hour wondering why this doesnt work.

Post.find_by_sql["SELECT title FROM posts WHERE author = ? AND created > ?", author_id, start_date]

Its because it needed to be like this:
Post.find_by_sql ["SELECT title FROM posts WHERE author = ? AND created > ?", author_id, start_date]

yeah, you need that whitespace there.

Oct 25 09

Confusing signs

by admin

I like taking pictures of confusing signs. It reminds me to be more mindful about the messages I put on clients websites.

On a fishing trip to Yellowstone I came across these signs.

Bears drive?

does excluded mean not allowed, or excluded from the not allowed list?

Oct 11 09

Making a sortable, dynamic grid

by admin

Grid I came up against an interesting challenge on a current project. This was actually pretty fun to figure out. Here is what I came up with.

I needed to display a grid with columns and rows that had information in each cell. The information in the cells needed to be dynamic, or change based on a UI perspective.

Also, if there were more than 10 rows in a column, the remaining cells needed to wrap to the next column.

This is definitely a job for a helper so I wrote these methods for the helper to render this sortable, dynamic grid. So far it seems to be holding up when rendering grids of various columns and rows.

def my_grid
@my_data = ”
@my_data += ‘<table>’
@my_data += ‘<tr>’
num = 1
#this starts a new column for each category
@columns.each do |col|
cell = Cell.find(:all, :conditions => [‘category_id = ?’, col]) rescue nil
count = cell.size
item = 0
itemtotal = 1
cell.each do |row|
#if this is the 0 item start a new column
if item == 0
@my_data += self.start_col
end
score = row.get_my_score(row.id, @grid, @user).to_s
@my_data += self.list_item(score, row, itemtotal)
#if this is the 9th item, or is the last of the cells, close the column and reset count
item += 1
if item == 10 || itemtotal == count
@my_data += self.end_col(num)
num = num.to_i + 1
item = 0
end
itemtotal += 1
end
end
@my_data += ‘</tr>’
@my_data += ‘</table>’
#return @my_data
end

def start_col
@start = ‘<td valign="bottom"><div style="position: relative; bottom: 0px; display: block;">’
@start += ‘<ul style="vertical-align: bottom">’
return @start
end

def end_col(num)
@end = ‘</ul>’
@end += num.to_s
@end += ‘</td>’
return @end
end

def list_item(score, row, item)
@list = ‘<li class=key_’+ score +‘>’
#some stuff here…
@list += ‘</li>’
return @list
end

Oct 3 09

What I think of my hackitosh netbook

by admin

The pros and cons of my new hacintosh netbook… Or as a friend of mine calls it… hackintrash.

First, why did I get a net book?
My MacBook Pro is just over 4 years old now. It have pretty much been working night and day since I have owned it. It’s my 3rd 15″ mac book. Its a great machine and I have more than got my monies worth, but now it is starting to show signs of wear and tear. Taking my netbook to the office is a good way for me to get some more mileage out of the macbook.

Next, the cons. There aren’t many if you don’t have unreal expectations of the smaller processor. But there are a few things to be aware of. Not everything will work flawlessly. Things like bluetooth, ethernet port and the VGA port may have some issues. The webcam will probably work, but the mic might have an issue.

Most of the netbooks on the market at the time of this writing have less powerful processors and video cards. So, if you’re thinking of running photoshop, think again. Don’t even think about Final Cut.

And, for what ever reason, my netbook likes to have a kernel panic about every 3 and a half days if I dont shut it down from time to time. But I like just closing the lid and putting it to sleep, so i put up with the panics.

Now the pros. For 90% of what I used my macbook for around home and the office, the netbook has been pretty seamless. Now with 3 computers in 3 locations, that I need to work on day to day, keeping information synced would seem a daunting challenge. A few key apps and services are key for me to keep things together.

All of my web dev projects for work, freelance and personal are now kept on SVN. Beanstalk has been a perfect companion for my netbook. I can keep my web development work in sync with all my computers very easily.

To keep documents synced up between all these machines I use DropBox. And all my email is web based so Im covered there.

And to keep all my notes, thoughts and ideas in sync, Evernote is perfect.

Its great moving from machine to machine with virtually no difference in my workflow.

Go to these sites for more information:
http://gadgets.boingboing.net/2008/12/17/osx-netbook-compatib.html
http://www.wired.com/gadgetlab/2009/05/eight-months-with-a-hackintosh-netbook-conclusion-fantastic/
http://osxdaily.com/2009/09/19/the-ultimate-resource-for-building-a-hackintosh-netbook-or-hackintosh-desktop/

Sep 30 09

Don’t get your servers wet

by admin

This is a sad site. 3 new xserves, rusted out.

09302009137 Exposed racks are inexpensive… until the ceiling leaks. Needless to say the replacements are in a enclosed, hepa filtered, locked case. And there is a huge ceiling pan with a drain.

I will say, that I was impressed that the servers were still running and serving sites with standing water inside the case. Amazing!

Wylie

Setting up a new dev environment

Regular Expression Tools

color scheme tool

jQuery Emoticon Selector Plugin

Installing passenger on ubuntu has some issues

Watch the whitespace

Confusing signs

Making a sortable, dynamic grid

What I think of my hackitosh netbook

Don’t get your servers wet

Recent Articles

Categories

About

Photos

Search

Recent Articles

Tags

Categories

About

Photos

Search