Clockwork coder

This is a quick guide to installing MongoDB.

First download it from http://www.mongodb.org/downloads

Then create a folder structure like the following:
mongodb/
mongodb/bin/
mongodb/data/
mongodb/data/db/
mongodb/logs/

Then Extract the executable files from the donwloaded archive in the bin folder

Open the command line (search cmd.exe and run as admin in Win 7)

CD to the bin directory you put the executables in and run the command:

mongod --logpath C:\mongodb\logs\error.log --logappend --dbpath C:\mongodb\data\db --directoryperdb --install

Make sure you replace the log and db paths with the path to the corresponing folders you created previously.

In reality the folder structure is flexible as long as you have the exe files in the same disk as windows since it doesn't allow you to run a service from another disk (or at least I think so).

Add the bin path to your PATH so you can run mongo from any folder.

Now download the PHP extension from here. You want the Thread Safe version (VC6ts for apache if applicable).

Put the php_mongo.dll file under : wamp\bin\php\php5.3.8\ext

Exit WAMP server if running, start up again and check php>php extension>php_mongo

Restart all services

Done!

A few days ago Facebook introduced i-frames for page tabs and as previously announced will be slowly fading away FBML for good. This is great news for coders starting new applications but not for many who invested a lot of time and money learning how to use FBJS and create FBML apps. Personally I have not been developing Facebook apps for long and already knew this was coming when i started out a couple of months ago.

So I've decided to port my FBML apps (that i was just about to go live with) to i-frame apps. The first problem that I encountered was making my i-frames to not have scroll-bars. So I'm going to explain how to get it done so that your i-frames work smoothly.

First make sure that you have set in your application settings under the Facebook Integration tab the option "IFrame Size" to "Auto-resize".

Then you should make sure you set your body and html tags to overflow hidden. This is important because otherwise you will get a temporary scrollbar while the page is loading which is less than pretty.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
"http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" style="overflow: hidden">
    <head>
        <!-- Header stuff -->
    </head>
    <body style="overflow: hidden">

Then after your FB.init add:

FB.Canvas.setAutoResize(100);

Ending up with:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" style="overflow: hidden">
    <head>
  <!-- Header stuff -->
 </head>
 <body style="overflow: hidden">
 
  <!-- Your Content Here --> 
  
  <div id="fb-root"></div>
 <script type="text/javascript">  
   window.fbAsyncInit = function() {
    FB.init({
     appId: 'your_app_id', 
     status: true, 
     cookie: true, 
     xfbml: true
    });
    
    //this resizes the the i-frame 
    //on an interval of 100ms 
    FB.Canvas.setAutoResize(100);
 
   };
   (function() {
    var e = document.createElement('script');
    e.async = true;
    e.src = document.location.protocol + 
     '//connect.facebook.net/en_US/all.js';
    document.getElementById('fb-root').appendChild(e);   
   }());
  
  </script> 
 </body>
</html>

So there you have it. You can basically use the above code as a starting template for all of of your i-frame apps and never worry about scrollbars again (hopefully).

Clockwork coder

Friday, September 30, 2011

Mongo DB installation with PHP on Wamp Server

Wednesday, February 16, 2011

How-to: Removing facebook Application i-frame scrollabars