Keep Moving

Include jQuery in the Browser JavaScript Console

2012-10-10T17:50:00.000-04:00

To play around with jQuery in your browser's JavaScript Console, copy and paste the following lines!

var jq = document.createElement('script');
jq.src = "http://code.jquery.com/jquery-latest.min.js";
document.getElementsByTagName('head')[0].appendChild(jq);
jQuery.noConflict();

Using changelist for SVN

2012-07-12T14:33:00.001-04:00

Changelist is useful for organizing your code changes when you're working on more than one projects. You can mark files with different changelist flags to keep them organized.

For example, we changed three files for ticket 66, and then commit them all together later:

$ svn changelist ticket66 a.py b.py c.py
Path 'a.py' is now a member of changelist 'ticket66'.
Path 'b.py' is now a member of changelist 'ticket66'.
Path 'c.py' is now a member of changelist 'ticket66'.

$ svn status
A       someotherfile.py
A       test/sometest.py

--- Changelist 'ticket 66':
A       a.py
A       b.py
A       c.py

$ svn commit --changelist ticket66 -m "Fixing ticket 66."
Adding         a.py
Adding         b.py
Adding         c.py
Transmitting file data ...
Committed revision 2.

Integer validation in JavaScript

2012-05-09T15:29:00.003-04:00

function isInteger(val) {
    var intRegEx = /\D/g;
    return (!intRegEx.test(val));
}

Request the parent window to open a URL from an iframe with different domains

2012-03-20T10:03:00.000-04:00

Sometime we are developing something within an iframe, but we want the parent window to refresh or open a URL. The code to use is:

top.location.href = URL;

SVN commands

2012-03-08T10:30:00.000-05:00

Create a patch
svn diff > ~/fix_ugly_bug.diff

Apply a patch
patch -p0 -i ~/fix_ugly_bug.diff

Text lineup using html span tag

2012-03-05T16:01:00.000-05:00

<style type="text/css">
span {
  display: inline-block;
  width: 50px;
}
</style>

Intersection of lists in Python

2012-01-31T12:52:00.003-05:00

def intersect(a, b):
    return list(set(a) & set(b))

Install software from source on a shared Linux server

2011-12-17T17:35:00.000-05:00

It's a very common task that installing a software from source on a shared Linux server. If you have root privilege, it suffice to install the package by "sudo apt-get install package_name" on Ubuntu or Fedora, or "yum install package_name" on redhat or centOS. However, the common case is that we do not have root privilege and do not have write access to folders other than $HOME. To install a software or package in this situation, we have to build it from source as follows.

$ mkdir -p ~/tmp      # create a temp folder for installation process
$ export TEMP=~/tmp   # set it to be the sys tmp folder
$ wget url            # get the package source from URL, or you can upload it to the server by sftp
$ unzip file          # if the package is .zip
$ tar xf file         # if the package is a tar ball
$ cd source           # source should be replaced by the folder you just unpacked from .zip or .tar
$ ./configure --prefix=$HOME
$ make
$ make install
$ make clean

Fibonacci calculation algorithm

2011-12-15T14:42:00.005-05:00

Iterative version:

int fibonacci(int n) {
    if (n < 2)
        return n;
    int prev = 0;
    int last = 1;
    for (int i=2; i<=n; ++i) {
        prev = last;
        last = prev + last;
    }
    return last;
}

The time complexity is O(n) while the space complexity is O(3) or constant.

Recursive version:

int fib(int n) {
    if (n < 2)
      return n;
    return fib(n - 1) + fib(n - 2);
}

However, this straightforward solution for Fibonacci is extremely inefficient. Since the computation complexity would be exponential as many text books indicated. An intelligent solution is given below, which is O(n). The origin of this solution is here.

int fib(int n, int p0=0, int p1=1) {
    if (n==0)
        return 0;
    else if (n==1)
        return p1;
    else
        return fib(n - 1, p1, p0 + p1);
}

There are recursive solutions are doing even better than O(n). See this link.

Find the ith smallest element of the array in O(n)

2011-12-12T21:35:00.000-05:00

How to find the ith smallest element of the array in O(n) time is a frequently asked question. The straightforward solution is sorting the array and return the ith element. However, for general cases, it's proven that sorting algorithms like merge sorting, is lower bound to O(nlogn). Thus finding the ith smallest element is unfeasible by a merge sorting. Although for some special cases, such as, the possible values or data range of the array is relatively small, counting sorting can give a O(n) solution, it doesn't work for general cases. The solution below works generally and the expected running time is O(n).

int find_ith_smallest_elem(int* A, int left, int right, int i) {
    if (left==right)  //only one element left, then it's the answer
        return A[left];
    pivot = random_partition(A,left,right);
    left_partition_length = pivot - left + 1; //1 counts for the pivot itself
    if (i==left_partition_length)
        return A[pivot];  //pivot is the answer
    else if (i<left_partition_length)
        return find_ith_smallest_elem(A,left,pivot-1,i);
    else
        return find_ith_smallest_elem(A,pivot+1,right,i-left_partition_length);
}

//randomly choose a pivot and partition the array into two parts, where the left part only
//contains elements smaller than the pivot while the right part only contains larger ones
int random_partition(int* A, int left, int right) {
    int pivot = rand(left,right);
    swap(A,pivot,right); // swap the pivot and the right-most element
    int pivot_value = A[right];
    int i = left - 1;
    for(int j=left; j<right; ++j) {
        if (A[j]<=pivot_value) {
            i++;
            swap(A,i,j); 
        }
    }
    swap(A,i+1,right);
    return i+1;
}

JSON Parsing in java with Jackson

2011-12-08T11:00:00.017-05:00

When it comes to API data and results (like google APIs), json is of great favor to java developers. There are more than 50 libraries for json processing in different languages. To get an overview of json structure and access the libraries, please refer to http://www.json.org/.

Jackson offers three alternative methods for processing JSON:

Streaming API reads and writes JSON content as discrete events.
Tree Model provides a mutable in-memory tree representation of a JSON document.
Data Binding converts JSON to and from POJOs based either on property accessor conventions or annotations.

For a known structure of API return and the requirement to reconstruct similar data skeleton, it would be effortless if Tree Model is used for the recovery.

To download the latest version of Jackson, please refer to:http://wiki.fasterxml.com/JacksonDownload. Both jackson.core and jackson.mapper will be needed for Tree Model processing.

To add the dependencies from internal jars in Eclipse, refer to:How to Add JARs to Project Build Paths in Eclipse

Tree Model Processing Step by Step

Facebook JavaScript SDK Call after FB.init()

2011-12-07T15:46:00.000-05:00

When developing Facebook Apps, the JavaScript SDK is usually loaded asynchronously to not block loading other elements of your page. However, it leaves us a problem: every JavaScript SDK call must be made after the SDK loading. Otherwise, a "FB not defined" error will be thrown. There are two common ways to handle this situation.

Put the codes inside the callback function of fbAsyncInit process

<div id="fb-root">
</div>
<script>
  window.fbAsyncInit = function() {
    FB.init({
      appId      : 'YOUR_APP_ID',
      channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html',
      status     : true,
      cookie     : true,
      oauth      : true,
      xfbml      : true
    });
    // Put Your Codes Here
  };

  (function(d){
     var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
     js = d.createElement('script'); js.id = id; js.async = true;
     js.src = "//connect.facebook.net/en_US/all.js";
     d.getElementsByTagName('head')[0].appendChild(js);
   }(document));
</script>

Add delay to your SDK call

/**
 * do something when user leaves a new comment
 */
function fb_event_subscribe() {
    try {
        FB.Event.subscribe('comment.create', function(response) {
            // do something here
        });
    }
    catch(err) {
        setTimeout("fb_event_subscribe()",1000); // try again later
    }
};

/**
 * subscribe the Facebook event "comment.create" after a one second delay, which
 * makes sure FB JavaScript SDK asynchronous initialization FB.init() is finished.
 */
setTimeout("fb_event_subscribe()",1000);

Iterate over a Map(HashMap) in Java

2011-11-29T16:58:00.008-05:00

Here are three methods of iterating through a Map(HashMap) in Java and their pros and cons. They all works for any map implementation in Java, e.g. HashMap, TreeMap, HashTable,LinkedHashMap.

Method #1
Iterating over Entries

Map<Integer, Integer>; map = new HashMap<Integer, Integer>(); for (Map.Entry<Integer, Integer> entry : map.entrySet()) { System.out.println("Key = " + entry.getKey() + ", Value = " + entry.getValue()); }
pros : You can get both keys and values via entrySet().
cons: NullPointerException will be thrown if you try to iterate over a null map. You should always check for null references before iterating.

Method #2
Iterating over either Key or Value Sets

Map<Integer, Integer> map = new HashMap<Integer, Integer>();

//iterating over keys only
for (Integer key : map.keySet()) {
System.out.println("Key = " + key);
}

//iterating over values only
for (Integer value : map.values()) {
System.out.println("Value = " + value);
}

pros: If all you need is either key sets or value sets, this method is about 10% faster than iteration over entrySet(), and also cleaner.

cons: The same as above

Method #3
Iterating using Iterator

--With Generics

Map<Integer, Integer> map = new HashMap<Integer, Integer>();
Iterator<Map.Entry<Integer, Integer>> entries = map.entrySet().iterator();
while (entries.hasNext()) {
Map.Entry<Integer, Integer> entry = entries.next();
System.out.println("Key = " + entry.getKey() + ", Value = " + entry.getValue());
}

--Without Generics

Map map = new HashMap();
Iterator entries = map.entrySet().iterator();
while (entries.hasNext()) {
Map.Entry entry = (Map.Entry) entries.next();
Integer key = (Integer)entry.getKey();
Integer value = (Integer)entry.getValue();
System.out.println("Key = " + key + ", Value = " + value);
}

The same method can be used for obtaining the key and value sets respectively. Its performance is equal to for-each loop.

pros: It is the only way if you want to remove entries during iteration by implementing iterator.remove(). If you do this in for-each loop, you will get unpredictable results.

cons: Look a little redundant than other methods.

Method #4
Iterating over key sets and search values (inefficient)

Map<Integer, Integer> map = new HashMap<Integer, Integer>();
for (Integer key : map.keySet()) {
Integer value = map.get(key);
System.out.println("Key = " + key + ", Value = " + value);
}

Getting values by keys is inefficient and time-consuming, in different Maps it can be 20% to 200% slower than Method #1.

Arrow keys not working in Vim on Cygwin

2011-11-29T14:02:00.000-05:00

Installed Cygwin today on my machine (ThinkPad, XP SP3). The arrow keys in Vim always bring me out from insert mode. And there is no syntax highlight at all.

The quick fix is copy /usr/share/vim/vim73/vimrc_example.vim to ~/.vimrc. Then everything works perfectly now.

Read and write cookies in mod_wsgi application

2011-11-27T14:01:00.000-05:00

Read a cookie from HTTP header:

def application(environ, start_response):
    import Cookie
    cookie = Cookie.SimpleCookie()
    cookie.load(environ['HTTP_COOKIE'])
    access_token = cookie['access_token'].value

Write a cookie to HTTP header:

def application(environ, start_response):
    import Cookie
    cookie = Cookie.SimpleCookie()
    cookie['access_token'] = '1xRD3WXsdfsw23rjfsj9L'
    access_token = cookie['access_token'].value
    start_response('200 OK', ('Set-Cookie',cookie["access_token"].OutputString())])

The envrion dictionary in mod_wsgi applications

2011-11-23T01:12:00.000-05:00

The following codes will show the content of the environ dictionary for quick debugging.

def application(environ, start_response):
    output = ['%s: %s' % (key, value) for key, value in sorted(environ.items())]
    output = '\n'.join(output)

    response_headers = [
        ('Content-Length', str(len(output))),
        ('Content-Type', 'text/plain'),
    ]
    start_response('200 OK', response_headers)
    return [output]

URI redirection in mod_wsgi scripts

2011-11-23T00:50:00.001-05:00

See this simple example:

def application(environ, start_response):
    if environ['REQUEST_METHOD']!='GET':
        start_response('301 Redirect', [('Location',  http://example.com'),])
        return []

    response_headers = [
        ('Content-Length', str(len(output))),
        ('Content-Type', 'text/plain'),
    ]

    start_response('200 OK', response_headers)

    return ["Hello World"]

VIM highlight file with certain extensions

2011-11-23T00:09:00.000-05:00

For example, to force VIM highlight *.wsgi files with Python syntax, add folllowing lines to your .vimrc file.

syntax on
filetype on
au BufNewFile,BufRead *.wsgi set filetype=python

Start-Up Spirit

2011-11-22T14:42:00.000-05:00

AngelList

http://angel.co/about_angellist

Add all unversioned files to SVN

2011-11-21T18:23:00.002-05:00

svn st | grep "^\?" | awk "{print \$2}" | xargs svn add $1

Difference between GET and POST

2011-11-15T19:11:00.000-05:00

Use GET for safe actions and POST for unsafe actions.
Use POST when dealing with sensitive data.
Use POST when dealing with long requests.
Use GET in AJAX environments.

SQL subquery examples

2011-11-15T17:54:00.000-05:00

Join a subquery

SELECT DISTINCT Email FROM Accounts JOIN 
(
    SELECT CouponId, UserId, AccountId 
    FROM Coupons JOIN Users USING(UserId) 
    WHERE CouponType=123
) AS tbl
USING(AccountId);

Quick start on latex beamer [Ubuntu]

2011-11-13T15:59:00.002-05:00

Beamer is a Tex class to make slide presentations. The advantages of Beamer over PowerPoint or OpenOffice:

If you are creating slides from a larger document, you can simply re-use your LaTeX source material from that document.
If you need mathematical content in your slides, you have the wealth of mathematical constructs in LaTeX to draw upon.
The slides you create are multi-platform.

Installation on Ubuntu
$ sudo apt-get install latex-beamer

Create your own slides from a template
A good template can be found here. Note: compile it by PdfLatex, or press F6 in TexMaker.

The order of Python dictionary

2011-11-08T17:32:00.000-05:00

Dictionary is one of the most useful datatype in Python. It provides quick access to the value stored with the key. For example,

>>>author={'Harry Potter':'JK Rowling'}
>>>print author['Harry Potter']
JK Rowling

The advantage of dictionary is quick access to the value associated with the key. The time complexity of searching and insertion are both O(1), which is much faster than array (i.e., list in Python). However, the disadvantage is that dictionary is implemented by hash table, which doesn't keep the original order in which the keys and values are inserted. For example,

>>>author={'A Tale of Two Cities':'Charles Dickens','Harry Potter':'JK Rowling'}
>>>author.items()
[('Harry Potter', 'JK Rowling'), ('A Tale of Two Cities', 'Charles Dickens')]

Where the order of the printed out results is not same as the original order in the initialization. To solve this problem, use following codes to display the dictionary contents by the order of keys.

keys = author.keys()
keys.sort()
for key in keys:
    print "key=%s, value=%s" % (key,author[key])

JavaScript: waiting 5 seconds and auto redirects

2011-11-07T00:14:00.005-05:00

<div>Redirect to the home page in <span id="countdown">5</span> secondes...</div>
<script type="text/javascript">
function countDown(){
 var count = document.getElementById('countdown').innerHTML-1;
 document.getElementById('countdown').innerHTML = count;
 if (count<=0) {
  location.href = "http://networkplot.tk";
 }
 else {
  t=setTimeout("countDown()",1000);
 }
}
countDown();
</script>