I’m learning stuffs everyday. Sometimes when I had an idea, and tried to implement it, I will do lots of searches and trails in order to complete the mission. But I’m a horrible person of memorizing these tricks (especially on web programming). Hence, I had this page to document all kinds of tricks related to programming and application design.

highlight.js Language Highlighting Reference

Sometimes I forget the shortcut of the programming language when I use code highlighting, you can find it here.

Customize HTML Table Style

 1table {
 2    border-collapse: collapse;
 3}
 4
 5table, th, td{
 6    border: 1px solid #dedede;
 7}
 8
 9tr:nth-child(even){
10    background: #f2f2f2
11}
12
13tr:nth-child(odd){
14    background: #fff
15}
16
17.table th, .table td{
18    padding: 20px;
19}
20
21tr:hover, td:hover{
22    background: #ffff99;
23}

Use Google Maps

A good start of this is to check out Google’s documentation: Add a Google Map to your website. Here I give an example of include Google Map in GitHub pages.

First of all, you need to include Google Maps javascript in your layout:

1<script src="https://maps.googleapis.com/maps/api/js"></script>

You can usually find layout scripts in _layout (example).

1#map-canvas {
2    width: 500px;
3    height: 400px;
4}

Here you can set the width and height of the map that you want to display.

Then, in you post, you need to define the specifics by implementing initialize function:

 1<script>
 2    function initialize() {
 3        var mapCanvas = document.getElementById('map-canvas');
 4        var mapOptions = {
 5            center: new google.maps.LatLng(44.5403, -78.5463),
 6            zoom: 8,
 7            mapTypeId: google.maps.MapTypeId.ROADMAP
 8        }
 9        var map = new google.maps.Map(mapCanvas, mapOptions)
10    }
11    google.maps.event.addDomListener(window, 'load', initialize);
12</script>

In mapOptions, you can specify details of your desire map. You can find all supported options from here.

After you did everything, you can simply include the map as follows:

1<div id="map-canvas"></div>

Google Charts

I’m looking for a way of visualizing my data in website, and then I found this nice API that is written by Google, namely Google Charts, you can find the full documentation here

Setup Theano in OSX

Setting up Theano on my MacBook Pro used to be hard. I don’t have a GPU on it, and apparently it’s hard to get all requirements easily for OSX. I found the solution today, first, install Anaconda, a nice python distribution that is designed for scientific computing.

However, you will notice that Anaconda itself does not offer you a maintained install of Theano. Then we have to get it from another place: binstar.

You can install the OSX build Theano by:

conda install -c https://conda.binstar.org/shoyer theano

Test for embedding YouTube Videos

Switch off dropout in Torch 7

evaluate() sets the mode of the Module (or sub-modules) to train=false. This is useful for modules like Dropout that have a different behaviour during training vs evaluation.

1net=loadcaffe.load(prototxt, binary);
2net:evaluate(); -- switch off dropout

some tests for Atom

something tests for atom.

Testing for spoiler tag