I’ve moved

Hi everyone!

Today, I’ve an announcement to make….

 

I HAVE MOVED TO JEKYLL + GITHUB..

All content from this blog can be found in my new blog and new blog posts can only be found there.

STEVE0HH.GITHUB.IO

How to add custom search to vimperator

How to add custom search to vimperator

So this is yet another vimperator tip! :)

So I encountered this issue where I wanted to add another search engine to vimperator.

vimperator search
vimperator search

So I thought to myself.. There must be an easier way right?

THIS IS VIMPERATOR!!!

spartan
spartan

Google searched around the internet.. Didn’t found a decent guide….
But I actually followed this post and did some trial and error for it.

So here’s it! :D

But before that, search Mycroft Project to see if they already have the search engine plugin that you have. If they do not have it. Follow the guide below to create one! :)

1) Find the website that you want the custom search engine in. For example, I wanted to add namecheap

2) Go search some useless stuff! :)

useless namecheap search
useless namecheap search

3) See the URL, normally it’ll be a GET request.
So mine was https://www.namecheap.com/domains/registration/results.aspx?domain=helloworld.

4) Analyse

So for namecheap
https://www.namecheap.com/domains/registration/results.aspx?domain=helloworld is the same as my search term!

namecheap url
namecheap url

5) Go to Mycroft Project page
In side side bar, hit “Create/Submit Plugin”

mycroft side nav bar
mycroft side nav bar

Scroll down and you’ll be greeted with this form.

create plugin form
create plugin form

6) Fill it up! The only thing you’ve to take note of is the “Search URL” field.

So you’ll have to edit your search term in your url to {searchTerms}.(Note that it’s case sensitive)

For example, my original url is

https://www.namecheap.com/domains/registration/results.aspx?domain=helloworld

My input at the “Search URL” field will be

https://www.namecheap.com/domains/registration/results.aspx?domain={searchTerms}

7) Generate plugin and Firefox will ask if you would like to add a search engine..
Just follow the on screen instructions and you’ll be done! :)

Do comment in this post if you found any mistakes and I’ll edit it accordingly. :)

Vimperator = <3

Yes, I am a huge fan of vimium for chrome previously which resulted in the previous tips for chrome.

But last week, I’ve tried vimperator and totally fell in love with it! :)
Vimium is nice, but not as powerful as vimperator!

vimperator rocks!
vimperator rocks!

This is the only reason I’m using Firefox. :D

Tips and trick

Vimperator, like vim, uses a RC file to load user’s customization. The file vimperator uses is ~/.vimperatorrc.

Things I like to do so far.

Make j/k scrolling scroll more

:noremap j 3j
:noremap k 3k

Map J/K tab left and right respectively

:noremap J gT
:noremap K gt

and lastly

As vimperator uses so many key bindings, mostly, useful extensions like pinterest, delicious and readability’s key binding will fail. But worry not! :)

Because popular sites like that, often provide bookmarklets for people that do not want to install their extensions.

Vimperator is AWESOME!!

Add our own bookmarklets!

command! -nargs=0 -description="description you want ot put" commandthatyouwant open yourjavascriptcommand

So for example, I would like to have readability’s readnow function, the steps I would take are:

1) Head over to readability’s bookmarklet page

2) Right click on the “Read now” button and click “Copy Link Location”

readnow
readnow

3) Create your bookmarklet!

command! -nargs=0 -description="Read now with readability" readnow open javascript:(%0A%28function%28%29%7Bwindow.baseUrl%3D%27//www.readability.com%27%3Bwindow.readabilityToken%3D%27%27%3Bvar%20s%3Ddocument.createElement%28%27script%27%29%3Bs.setAttribute%28%27type%27%2C%27text/javascript%27%29%3Bs.setAttribute%28%27charset%27%2C%27UTF-8%27%29%3Bs.setAttribute%28%27src%27%2CbaseUrl%2B%27/bookmarklet/read.js%27%29%3Bdocument.documentElement.appendChild%28s%29%3B%7D%29%28%29)

4) Now, go to firefox and hit ; and type readnow then ENTER.

5) Profit! :)

New Circular Saw

New powertool!

Hi guys, I’m here to announce today that I’ve bought the Bosch GSK 190 Professional Circular Saw today.

This is due to the fact that other then programming, I recently got into a new hobby! WOODWORKING!

Anyway..

I am writing this post due to the fact that here in Singapore, I often encounter dudes working in hardware shops that can’t communiate well with me. Probably I am not very good with dialect.
Also, I couldn’t find much reviews online for the GSK 190, hence I am gonna write a review for it! :)

Since I bought mine online, I didn’t know what to expect but I decided to take the plunge nevertheless.

What’s inside the box?

Round up of items
Round up of items
  • Instruction manuals
  • Circular saw with blade
  • Parallel guide

I’ve always thought that Bosch power tools always comes with a box but for this buy, it’s not included. :(

Features

  1. Variable cutting depth
  2. Bevel capability of 56 degrees
  3. 1400 watts

What do I look forward in doing with this circular saw?

1) Making dadoes

And hopefully someday, when I’ve enough space or my own home. I’ll make my own table saw.

Update (Tuesday, 11 March, 2014)

So far so good, made several cuts using this saw and the cuts are straight and nice. :)

DIY Magic Wand

DIY Magic wand

I just sold off my CMStorm Quickfire Pro keyboard and bought apple’s wireless keyboard and trackpad!

I wanted to use the keyboard on my lap without the restrictions of the wires.
Then you ask… why buy the trackpad?

This is because I changed upon Twelve south’s MagicWand. I didn’t wanted to lift my hand all the way up to my table and click on something just because the software is out of focus or sometimes things are just easier done with just a simple click.

BUT ITS SO EXPENSIVE
BUT IT’S SO EXPENSIVE

After much consideration, I decided not to buy Twelve south’s MagicWand in EpiCenter and make one myself.

Reason for not buying it:

  • It’s a piece of plastic
  • It frigging cost approx $50SGD
  • I’m not rich :)

So below is the guide on how did i build another similar one for myself

How to do it then?

Matrials needed

Skills required

  • Acrylic cutting skill (Which I acquired from youtube)
  • Basic DIY skills

Step 1 – Mark it!

Measure about 10cm wide and approximately 38cm long and use a pencil to mark it out.

Acrylic marked out and ready to be cut
Acrylic marked out and ready to be cut

Step 2 – Cut it out!

Using the Acrylic scorer/cutter cut and break the acrylic from the board!

Cut acrylic
Cut acrylic
With protective sticker peeled out
With protective sticker peeled out

Step 2 – Align the acrylic and paste the velcro tapes

Firstly, please your wireless keyboard upside down and place the trackpad on the left of the keyboard.

Note: Make sure you place your trackpad on your left instead of the right as once you flipped it over, the trackpad will be on the right. Unless you are left-handed

Then, paste the velcros on the keyboard and trackpad!

Pasted!
Pasted!

Once done, place the piece of acrylic on the pasted velcro and start pasting over it.

Placing of acrylic over the keyboard
Placing of acrylic over the keyboard
Dont forget the trackpad too
Don’t forget the trackpad too

Flip the piece of acrylic and viola!

The only thing is tht the click won’t work. But tapping is good enough for me. :)

Ps. I am writing this with the keyboard and trackpad on my lap! Pretty awesome eh? haha!

Chrome losing focus on webpage

Hi guys!

Today I am going to share with you guys a tip.

For those that uses vimium, have you always encountered a time where the focus is lost and not on the webpage and will render every shortcut in viumium useless?

I always used to hate that as I didn’t wanted to move my hands to my mouse and always trying to hit the tab button and hopefully the focus would magically appear.

Well! There’s a workaround for that! :)

To open your search engines settings, type the following in your URL bar in chrome.

chrome://settings/searchEngines

Then add a entry to it under the Other search engines, scroll to the bottom, you should see 3 empty fields like the second image below.

Other search engines
Other search engines
the 3 empty fields
the 3 empty fields

Now, add the shortcut!

Under the field Add a new search engine, input something like “Focus on webpage” or something.

Then for the keyword, add the preferred shortcut for your choice to trigger it to make your computer focus on the page.

My preference is

f

Then in the URL with %s in place field, add:

javascript:

It should look something like the image below.
Filled up fields

Then hit the Return key.

So after adding, the settings panel will look like this.

Overall search engine settings
Overall search engine settings

Then hit the done button! :)

How to use it?

So there comes to a scenario, where the focus is not on the page!

scenario
scenario

So most likely I’ll have to hit the tab key a few times before I get my focus on the webpage and be able to use my vimium shortcuts.

Now, time to demostrate the workaround! :)

Hit CMD + L for mac users or CTRL+L for windows user.

Then hit the shortcut u added for the second field, mine was f

About to be triggered
About to be triggered

Then hit the Return key!

There! Focused back on the page! Vimium FTW! :)

Vimium!
Vimium!

Regards,

Steve

SiriProxy + Raspberry Pi + my little lamp = awesome sense of achievement

Not trying to say that I’ve created/invented something very awesome. But the sense of being able to DIY and learning lots of things from it. The sense of achievement is really there. =)

Also, there might already be blogs teaching how to do it, but I am still gonna write about how it works and the problems I’ve faced while doing it and hopefully there would be still some of you guys that will benefit from it.

This is what you’ll get at the end of this tutorial.

Warning! Do proceed with this project with care as you are dealing with AC electricity which could potentially kill you.

Cut the crap! Now for the interesting part!

How did I do it?

What you will need:

  • Some basic electronics and electrical skill
  • 01 x Raspberry Pi with SiriProxy installed
  • 01 x Relay control kit which I happened to have one lying around because I was tinkering with Arduino last time in school.
  • 01 x switch lying around
  • 01 x Raspberry Pi cobbler kit
  • 01 x Multimeter (Optional but will be good for troubleshooting)
  • Some jumper wires

Get SiriProxy running

If you have not installed SiriProxy on your Raspberry Pi, please do so. You can the guide here.

Check if your SiriProxy’s plugin file are working:

Note:

For this example, I am going to edit SiriProxy example instead of creating a new one but if you would like to use this project for many many of your switches at home, it’s generally a good idea to create your own plugin, but for simplicity sake, I shall stick with this.

First in your Raspberry Pi’s terminal,

type :

vim ~/SiriProxy/plugins/siriproxy-example/lib/siriproxy-example.rb

Inside siriproxy-example.rb edit:

listen_for /test siri proxy/i do

to

listen_for /hello siri proxy/i do

I had a hard time troubleshooting if it works because I missed the following step.
In which I’ve found the answer from the SiriProxy’s Wiki page.

After editing of plugin file, type:

siriproxy update .

Then start Siriproxy server on your Raspberry Pi again:

siriproxy server

Now, test from your iPhone that it’s working by launching Siri and saying:

“hello siri proxy”

And if Siri replies you with

siri proxy is up and running

congrats, you have just successfully edited the siriproxy example plugin.

Now install WiringPi!

Installation of WiringPi is pretty, I’ve followed the instructions of @drogon’s and didn’t encounter any problems.

Type your code to make it work! :)

Edit your plugin to make it work! Type the following into your terminal :

vim ~/SiriProxy/plugins/siriproxy-example/lib/siriproxy-example.rb

Then in your file just under the

listen_for /hello siri proxy/i do
    ...
    ...
    ...
end

Add the following code:

listen_for /turn on the lights/i do
    say "turning on the lights"
    request_completed
    system("gpio mode 1 out")
    system("gpio write 1 1")
end

listen_for /turn on the lights/i do
    say "turning on the lights"
    request_completed
    system("gpio mode 1 out")
    system("gpio write 1 1")
end

The code is pretty much self-explainatory for listen_for /turn on the lights/i do and say "turning on the lights"

request_completed tells Siri that the request is completed and stop Siri from the endless spinning awaiting for another command from the server.

system("gpio mode 1 out") makes the Raspberry Pi’s GPIO Pin 01 be an output.

system("gpio write 1 1") makes the Raspberry Pi’s GPIO Pin 01 goes HIGH.

system("gpio write 1 0") makes the Raspberry Pi’s GPIO Pin 01 goes LOW.

After editing, update siriproxy to read the local folder by typing :

siriproxy update .

Then start Siriproxy server on your Raspberry Pi again:

siriproxy server

Testing it (Small scale)

That’s when the Raspberry Pi cobbler kit comes into place.

Make sure your Raspberry Pi is powered down.

Connect the anode(positive) end of an LED to GPIO Pin 01, then connect the cathode(negative) end to GND pin of your Raspberry Pi.

Small scale testing
Small scale testing

Now turn your Raspberry Pi and start Siriproxy!

siriproxy server

Here’s a video of me testing it in a small scale.

Note that I am not using the Raspberry Pi cobble kit, as during that point of time I was too excited to see if it works. Totally not recommended as if any wires were to stray away, it would have made my RPi short circuit.

For those that is new to electronics, you might wanna read this article on instructables on LEDs for begineers.

Now lets do it large scale

Please please do note that we are dealing with AC voltages that could potentially kill you. Please proceed with caution.

  1. Connect GPIO Pin 01 to the CTRL of the relay.

  2. Connect the 5v Pin to the 5v of the Relay circuit board.

  3. Connect the Gnd Pin to the Gnd of the Relay circuit board.

diagram of how its connected in my setup
diagram of how it’s connected in my setup

Please pardon my ugly drawing XD

Connect the ground wire of your appliances to the load of your Relay circuit board.

More information about the Arduino Relay shield on getting it to work, it’s somewhat the same except that the control pin is switch with the Raspberry Pi.

So what did I gained from this project:

  • Refreshed my memory on the electronics stuff that I’ve tinkered with 1 year ago
  • Learnt about WiringPi
  • Awesome sense of achievement

Hope you guys like this article. :)

Regards,

Steve :)

What’s next after installing SiriProxy on Raspberry pi

What’s next after installing SiriProxy on Raspberry pi

I followed DarkTherapy’s guide to install wiringPi on my Rpi!

Here’s the guide that I’ve followed.

Changed some of the codes inside, which is fairly straightforward.

So here’s the video of it! :)

Next up, I’ll hook it up to a relay and toggle the lights! :D

Do post in the comments if you guys would like to have a step by step guide on installing the wiringPi on the Rpi.

Twitter bootstrap navigation bar with Jekyll

Twitter bootstrap navigation bar with Jekyll

Not long ago, I started using Twitter Bootstrap with Jekyll. Jekyll is awesome, so is Twitter Bootstrap.

But there are some minor things issues that I’ve encountered so far and wish to blog about in case you guys have problems with it and found my page while Googling my page.

Problem :

Twitter Navs

When building a static marketing website, we can simple do a for loop in liquid to display the pages in the navigation bar, but that would result in pages not being shown according to how you would want it to be.

The scenario would be something like this :

I wanted Number 3 tab to be at position 3!
And Number 2 tab to be at position 2!

Screwed up Navbar!

So, how do we get twitter’s navigation bar to show pages accordingly to how we want it to be?

Solution:

Weighted pages

I’ve found this useful plugin in Jekyll’s wiki. Which allows us to weight each pages accordingly and display it out on the navigation bar nicely.

So we could create something like this in the _includes folder and name it page_list

{% for node in pages_list %}
  {% if group == null or group == node.group %}
    {% if page.url == node.url %}
      <li class="active"><a href="{{node.url}}" class="active">{{node.title}}</a></li>
    {% else %}
      <li class=""><a href="{{node.url}}">{{node.title}}</a></li>
    {% endif %}
  {% endif %}
{% endfor %}
{% assign pages_list = nil %}
{% assign group = nil %}

then in our default.html, in the place where we want our navigation bar to be, we would code something like this.

<ul class="nav nav-tabs">
  {% assign pages_list = site.weighted_pages %}
  {% assign group = 'navigation' %}
  {% include pages_list %}
</ul>

Now,
in the pages where you want to be displayed in the navigation bar,

we would do something like this in the YAML Front Matter.

In Home page:

---
layout: default
title: Home
group: "navigation"
weight: 1
---

In Number 2 page:

---
layout: default
title: Number 2
group: "navigation"
weight: 2
---

In Number 3 page:

---
layout: default
title: Number 3
group: "navigation"
weight: 3
---

And viola!

A nicely weighted navigation bar!

A nicely weighted nav bar


Soon, I’m going to release my codes on github which has various __includes, which you can add easily in your project, like Thumbnails, Carousel gallery, so stay tuned!

How to backup your Raspberry Pi’s SD card image

How to backup your Raspberry Pi’s SD card image.

I noticed that there are not many decent tutorials on how to back up the Raspberry Pi’s SD card image, I’ve decided to create a tutorial myself. :)

1) Plug in your SD card

Standard.

2) Find out your SD card number

Hit launchpad and search for Disk Utility and select it

image

After that, select your SD card.

image

After selecting your SD card, hit command+i to view more information about the SD card. Inside the window, we can find the disk identifier.

image

So in my case, it’s actually disk2.

3) Time for backup!

The actual command is using dd which I learnt from Stackexchange.

Note : Running this command might actually take sometime. So go grab a coffee and come back. :)

dd if=/dev/diskx of=/path/to/image bs=1m

So in my case, I want to save it to the Desktop, hence my command will be something like

sudo dd if=/dev/disk2 of=/Users/stevetan/Desktop/image bs=1m

It actually took 1553 seconds which is approximately 25 minutes to backup my whole SD card.

image

Follow

Get every new post delivered to your Inbox.