Monthly Archives: January 2013

Assets:Precompile (Rake Aborted) – Heroku

Hey everyone,

I ran into the following error over the weekend while trying to push to heroku:

Running: rake assets:precompile
rake aborted!
could not connect to server: Connection refused
Is the server running on host “127.0.0.1” and accepting
TCP/IP connections on port 5432?

This stackoverflow post helped to solve the issue. All you need to do is add the following line to your application.rb file:

1
2
#Applicication.rb
config.assets.initialize_on_precompile = false

Let me know if you have any problems.

Browser Out of Date – JavaScript Plugin

Hey everyone,

I’m about to launch a new site and was looking into a quick and easy way to advise users with older browsers to upgrade. A bit of a Google revealed Browser-Update.org. They have a simple script that you add to your site and it will not only inform them that their browser is outdated, but also provide them with instructions on how to replace it.

All you’ve got to do is place their script on your site somewhere:

1
2
3
4
5
6
7
8
9
10
11
<script type="text/javascript"> 
var $buoop = {} 
$buoop.ol = window.onload; 
window.onload=function(){ 
 try {if ($buoop.ol) $buoop.ol();}catch (e) {} 
 var e = document.createElement("script"); 
 e.setAttribute("type", "text/javascript"); 
 e.setAttribute("src", "http://browser-update.org/update.js"); 
 document.body.appendChild(e); 
} 
</script>

You can customise the versions by visiting their site and using the script generator. Once you’ve got it setup, users with older browsers will see a bar at the top of their page:

Browser-Update.org plugin

Browser-Update.org plugin

Let me know if you come across any other useful plugins.

Cheers,
Chris

Twitter Bootstrap Dropdown Button

Dropdown Button – Twitter Bootstrap

Hey everyone,

Just a quick post on how to create a dropdown button using Twitter Bootstrap. It’s pretty straight forward, once you’ve included all your CSS etc just add the following code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<div style='text-align:left;'>
	<div class="btn-group">
	  <a class="btn dropdown-toggle btn-success" data-toggle="dropdown" href="#">
	    Button Text
	    <span class="caret"></span>
	  </a>
	  <ul class="dropdown-menu">
	    <li>
	    	<a href="#">Menu Option #1</a>
	    </li>
	    <li>
	    	<a href="#">Menu Option #2</a>
	    </li>
	    <li>
	    	<a href="#">Menu Option #3</a>
	    </li>
	    <li class='divider'></li>
	    <li>
	    	<a href="#">Menu Option #4</a>
	    </li>
 
	    <li>
	    	<a href="#">Menu Option #5</a>
	    </li>
	  </ul>
	</div>
</div>

Once you save that you should see something similar to the image below:

Twitter Bootstrap Dropdown Button

A standard twitter bootstrap dropdown button.

Change list item text alignment

To change the text alignment of this list items, all you need to do is adjust the text-align style assigned to the wrapper div.

Change dropdown button color

Once again, this is fairly simple, all you need to do is switch the button type. For instance, if you were after an orange button, you can swap btn-success with btn-warning. A list of the default styles is available on the Twitter Bootstrap site.

Let me know if you have any issues.

Installing SQL Developer on Ubuntu – make-sqldeveloper-package chmod: missing operand after `755′

Hey everyone,

I was following a guide while trying to install SQL Developer on Ubuntu, however I ran into the following error:

make-sqldeveloper-package chmod: missing operand after `755′

 

To fix it, simply change line number #381 in ‘/usr/bin /make-sqldeveloper-package’ as follows:

Original

${FIND} "${OPTDIR}" ! \( -type d -o -name "*.jar" \) |${XARGS} ${XARGS_OPTS} ${FILE} ${FILE_OPTS} |${GREP} ${GREP_OPTS} "shell script text executable" |${CUT} ${CUT_OPTS_FUNC_CLEAN} |${XARGS} ${XARGS_OPTS} ${CHMOD} ${CHMOD_OPTS}

Modified

${FIND} "${OPTDIR}" ! \( -type d -o -name "*.jar" \) |${XARGS} ${XARGS_OPTS} ${FILE} ${FILE_OPTS} |${GREP} ${GREP_OPTS} "shell script" | ${GREP} ${GREP_OPTS} "text executable" |${CUT} ${CUT_OPTS_FUNC_CLEAN} |${XARGS} ${XARGS_OPTS} ${CHMOD} ${CHMOD_OPTS}

Thanks to this blog post for the solution, just note that it is Polish.

Let me know if you have any issues!

Change Current Day Color – jQuery FullCalendar

Hey everyone,

Just a quick post on how to change a few of the styles in FullCalendar. All you need to do is add these after the default styles are loaded:

Current Day Background Color

1
2
3
.fc-today{
   background-color: blue;
}

Change Calendar Background Color

1
2
3
4
#calendar .fc-content{
	background-color: #FFFFFF;
	font-size: 80%;
}

Add Box Shadow to Events

1
2
3
#calendar .fc-event{
	box-shadow: 2px 2px 2px #706868;
}

Style Times and Days – Add border radius to headings

1
2
3
4
5
6
7
#calendar .fc-agenda-axis, #calendar .fc-widget-header{
	background-color: #C2E6FF;
	border-color: #AED0EA;
	font-weight: normal;
	padding: 3px;
	border-radius: 3px;
}

How to Block PayPal eCheque Payments

Hey everyone,

Just a quick post on how to block eCheque payments. These are payments that take up to seven days to process and be approved. The site I am currently working on is in no position to reserve services for such a long period of time, so the request has been made to block non-instant payment methods.

In the sandbox environment, you just need to do the following:

  • Login to your applications PayPal account at sandbox.paypal.com
  • Press the My Account tab
  • Select profile (just underneath my account)
  • Under selling preferences, click Payment Receiving Preferences
  • Under Block the following payments, check ‘Payments by eCheque on your website. Note: You may not block echeque payments on eBay’

The credit card statement name can also be set here. Let me know if you have any trouble.

Cheers,
Chris