Category Archives: Open Source

Cordova Geofence Plugin Swift 3 version

Cordova Geofence Plugin is a great app when you need to implement the geofence function on your app. However, the original version only supports swift 2.3, which is painful for new Xcode (8.3+). I fork the project and make some changes and let it support swift 3. Hope it will be benefit for all the developers.

I have put it to my GitHub. Please refer to:

cordova plugin add

The updates:

  • Update SwiftyJSON.swift, from, it is officially supporting swift 3.
  • SwiftData.swift, the author doesn’t upgrade to swift 3, so I have to update it myself
  • The plugin itself.
  • Add @Objc to swift functions

Plugin to monitor circular geofences using mobile devices. The purpose is to notify user if crossing the boundary of the monitored geofence.

Geofences persist after device reboot. You do not have to open your app first to monitor added geofences

Some Must-have PHP+MySQL development tools and utilities

After being a web developer for so many years, I find that myself is still a big PHP fan. The reasons are quite obvious: first of all, it is lightweight, very easy to deploy to any server in the world, and it is free! There are also a lot of open source PHP frameworks such as CakePHP, Yii that we can use. As a PHP web developer, I want to share some tools here with my comments. Hope that they are useful.

1. WAMPServer (Apache/MySQL/PHP included)

Setup PHP+MySQL development environment in no time. It is not very hard to setup the development environment by yourself, however this tool is extremely helpful if you don’t want to spend your time to do the job that someone else has already done for you.

2. Framework: Bootstrap 3 (or 2.5)

Originally from Twitter team, it is now becoming famous for its responsive framework. I really like to use it because it really saves me time to write a lot of CSS.

3. Useful gadget: Firebug (plugin for firefox)

It is actually nothing to do with PHP, however, if you are developing a website, you don’t want to miss it.

4. Tortoise SVN for window / Tortoise Git for window

Version control. I like to use it because it is seamless embedded in window explorer.

5. Navicat lite

A lightweight MySQL client software. (No more free, please find it through google for the old version, trust me, old version is good as well)

6. NetBeans IDE

Open source PHP IDE. Other option: If you are developing open source project, you can also get a PHP Storm for free.

What else?

There are bunch of software/tools help to improve the productivity that can be found on Design Junction‘s Ultimate Free Toolkit for Internet Web Ninjas as well. Hundreds of tools are listed.

jCarousel Lite Mouse Hover Event Improvement

jCarousel Lite is a fantastic jQuery plug-in to display photo gallery. You can have a look at the demo at:

On this demo, the photo gallery will only scroll left or right when you click on the left arrow and right arrow. On jCarousel’s document, we can initialize the carousel start scrolling when the page finishes loading by specify the option: auto

visible: 4,
<strong>auto: true</strong>,
speed: 2000

What if I want it to stop when my mouse hover on any of the images? Oh, jCarousel does not originally handle mouse hover event. Well, DIY time.

Firstly, download the carousel original source code from the official website

open that file (jcarousellite_1.0.1.js)

Second, add a code block between line “function go(to){” (about line 292):

//&lt;!--add by koumei
var isMouseOver = false;
isMouseOver = true;
isMouseOver = false;
//add by koumei--&gt;
function go(to) {

Third, modify function go: (around line 293)

Change "if(!running)" to "if(!running &amp;&amp; !isMouseOver)"

Fourth, DONE.

Quite simple, I hope the author will consider this function to the next release. :-)

You can also download my modified version and the demo at: Weather Channel Weather Channel is released today using RSS 2 Json service. For now only have Melbourne, Adelaide and 3 cities in between. Just for my convenience :-)

If you want to make yours, just download the source code yourself: Source Code

The weather service makes use of weather RSS from Yahoo! weather channel. And change to client side RSS to Json converter in (A Simple Rss2Json Service Released!:  So make sure you have javascript supported browser either on the phone or pc.

And here it is: :-)

Gallery CMS MOD: View As HTML or Partial HTML

Gallery CMS  provides an easy-manage CMS (Content Management System) framework for gallery. I like the way they manage data, all the data are exposed as XML or JSON. It is not a complete solution of photo gallery online, but if you need to integrate photo gallery on your website that would be a very good start: you can easily develop or integrate. And guess what is the exciting part? It’s free! For more information, please feel free to download @

It’s easily integrate but sometime you might need more convenience when integrate it to your website. Of course using XML or JSON which is the basic data structure is not that difficult, but I think most of time, for the integration itself, the most easiest and convenient is managing HTML. On the view if you are rendering the content partially, later you can use AJAX to replace the partial HTML content dynamically other than managing JSON on client side: we need rich client application, but if it lose weight a little bit, why don’t we make it lighter?

So, let us apply the MOD to it. It’s MIT license, so, no harm to mod it. Just pay a little attention to it’s license file: Gallery CMS comes with 2 licenses, one license is MIT license which represent itself, and the other license is derived from CodeIgniter which the basic framework.

1.\application\controllers\view.php //Add the following codes to it:

function html() {
$data['row'] = $this->gallery_xml->viewXML();
$data['settings'] = $this->settings_tbl->viewSettings();
$this->load->view(‘view_html’, $data);

2. On\application\views\ folder, create a file view_html.php

Please note that, you can make the view html a full html or you can partially render it like this:

<?php if(isset($row)) {?>
<?php foreach($row as $r){?>
<?php if(isset($r->images)) {
foreach($r->images as $img) { ?>
<div><a href=”<?php echo base_url();?>uploads/<?php echo $img->filename;?>” target=”_blank” title=”<?php echo $img->caption;?>”><img src=”<?php echo base_url();?>uploads/<?php echo $img->thumbnail;?>” border=”0″ align=”absmiddle” width=”<?php echo $settings[0]->thumb_width; ?>” height=”<?php echo $settings[0]->thumb_height; ?>”/></a></div>
<div><?php echo $r->title;?></div>
<div><?php echo $r->description;?></div>
<?php } ?>
<?php } //if  ?>
<?php } ?>
<div style=”clear:both”></div>
<?php }?>

After that, you can use: http://<GALLERY_CMS_WEBSITE>/index.php/html  to retrieve the HTML content. In our mod above, it is just partial HTML, so you can jQuery it:

$.get(‘http://<GALLERY_CMS_WEBSITE>/index.php/html ‘, null, new function(resp){$(‘#html-container’).html(resp);});

Nice and easy.

ASP.NET MVC Whole Site 301 Permanent Redirect

For some reasons, we need to permanently redirect the whole website to another website. It would be much easier that you are the owner of the server. But most of time you just host your website on the server out there. It wouldn’t be a big problem that your hosting company will support you to do some simple 301 redirect or may you have enough privilege to do it yourself. Is it possible to redirect permanently the website to other website by programming a little bit?

Sure you can. With MVC routing facilities, you can define your customized redirect logic: CREATE AN EMPTY MVC PROJECT, MODIFY GLOBAL.ASPX.CS FILE ONLY ON THIS EXAMPLE:

First of all, define two objects which implemented IRouteHandler and IHttpHandler, you can feel free to define those two objects on Global.aspx.cs file:

//@Implements IRouteHandler
class RedirectRouteHandler : IRouteHandler
private string newUrl;
public RedirectRouteHandler(string newUrl) { this.newUrl = newUrl; }
public IHttpHandler GetHttpHandler(RequestContext requestContext)
return new RedirectHandler(newUrl);

//@object implements IHttpHandler
class RedirectHandler : IHttpHandler
private string newUrl;

public RedirectHandler(string newUrl) { this.newUrl = newUrl; }

public bool IsReusable { get { return true; } }

public void ProcessRequest(HttpContext httpContext)
httpContext.Response.Status = “301 Moved Permanently”;
httpContext.Response.StatusCode = 301;
httpContext.Response.AppendHeader(“Location”, newUrl);

Then add one line on RegisterRoutes(RouteCollection routes) method (in Global.aspx.cs):

routes.Add(new Route(“{*pathInfo}”, new RedirectRouteHandler(@””));

Now all request to the website will redirect to “” permanently. :)

Partner of Joomla Development – Part 1 Firefox

Joomla has gained brilliant prestige in open source CMS development. There are heaps of 3rd-party modules and components in Joomla. For Joomla, I would rather say it is an application framework than open source CMS system.

In here, I would like to introduce some useful utilities for Joomla development. Actually the tools are also good for any website development.


I don’t want to spend too much time introduce the open source website browser. There are at least 3 must-have plug-ins for Firefox:

1. Firebug

Good for Javascript debug, CSS preview and website structure analysis.

2. Fireshot

Sometimes we got a headache because you need to capture a screen shot of the website which is oversize in height. For a long time, I need to use window painter to join every single pieces of screenshot together to form a integrated website. With Fireshot, just fire it in one shot. Absolutely good tool.

3. Rainbow

This tool is quite useful if you need to get the color from the website (in hex decimal)

Just 3 tools? Hmm, for me, I think they are enough for the development. Of course you might need other tools to help you. In my opinion, not all tools are useful. But at least those 3 tools, especially Firebug could save you a lot of time if you need to deal with many HTML/CSS and javascript stuff.

My Webklip Plugin For WordPress: Goes Multiple-RSS!

Today I refactory the source code and add new features to Webklip, it becomes 1.2 and, most encouraging, multiple rss supports!

The improvement includes:

  • Uses template engine to show widget. No more embedded HTML.
  • Moves all functions to a util class
  • Supports up to 5 RSS
  • Still reads RSS feed dynamically on client-side

The feature version will be released next day or two, will enhance javascript flexibility. E.g., not compulsorily needs jQuery framework.

You can download the widget on

Relative article:

WordPress Widget: Client-side RSS util, The Web Klip Released!