So I am taking a little time away from games development at the moment to explore a few other projects and ideas. I want to solve real problems that either I or others have had. I want the projects to be short so I don't get bored and frustrated and I want to also learn new techniques and technologies as I build them.



The first of these little projects is called [Trello Tasks](https://chrome.google.com/webstore/detail/trello-tasks/icedfgfhjcnidibolnnfbjnjbkbfgcic).

[![screenshot-01-640x400](https://www.mikecann.blog/wp-content/uploads/2015/11/screenshot-01-640x400.png)](https://www.mikecann.blog/wp-content/uploads/2015/11/screenshot-01-640x400.png)

The TL;DR of Trello Tasks is: it augments Trello by turning Cards into "completable" tasks.

I have [spoken about Trello before](https://www.mikecann.blog/misc/indie-game-project-management-with-trello/) but if you arent familiar with Trello its a super simple, popular and free [Kanban](https://en.wikipedia.org/wiki/Kanban) style app designed to organise any data. You can create any number of "Lists" which you then populate with "Cards". You can add images, links, comments etc to cards which allows you to organise just about any sort of project.

![](https://www.mikecann.blog/wp-content/uploads/2014/09/drag-drop-trello.gif)

One of the most common ways to use Trello is in the "ToDo" style. In this style you have three lists, ToDo, Doing and Done:

[![2015-11-25_08-28-57](https://www.mikecann.blog/wp-content/uploads/2015/11/2015-11-25_08-28-57.png)](https://www.mikecann.blog/wp-content/uploads/2015/11/2015-11-25_08-28-57.png)

In this style, when you start work on something, you move it from the "ToDo" List to "Doing" List then when its complete you move it to "Done" List.

This is all well and good but what if you use a different system of organisation such as arranging the items by category:

[![2015-11-25_08-31-45](https://www.mikecann.blog/wp-content/uploads/2015/11/2015-11-25_08-31-45.png)](https://www.mikecann.blog/wp-content/uploads/2015/11/2015-11-25_08-31-45.png)

Now if you want to indicate that you have read a book or watched a movie you would have to either drag it into the "Done" list (and loose the categorisation) or create a "Done" list for each category. One other option is to "Archive" the card but doing this removes it from the list altogether.

[![2015-11-25_08-36-50](https://www.mikecann.blog/wp-content/uploads/2015/11/2015-11-25_08-36-50.gif)](https://www.mikecann.blog/wp-content/uploads/2015/11/2015-11-25_08-36-50.gif)

So I decided to try and solve this very particular but annoying problem. My solution is to add a checkbox to each card. Now cards can be marked "complete" and "uncomplete" by simply checking the checkbox.

[![2015-11-25_08-41-18](https://www.mikecann.blog/wp-content/uploads/2015/11/2015-11-25_08-41-18.png)](https://www.mikecann.blog/wp-content/uploads/2015/11/2015-11-25_08-41-18.png)

The extension works by piggybacking on Trello's comments system. So each time you complete or uncomplete a task the extension adds a comment to the card.

[![2015-11-25_08-43-25](https://www.mikecann.blog/wp-content/uploads/2015/11/2015-11-25_08-43-25.png)](https://www.mikecann.blog/wp-content/uploads/2015/11/2015-11-25_08-43-25.png)

This means that in a multi-user board you can tell who completed or uncompleted a task and syncing "just works":

[![2015-11-25_08-47-32](https://www.mikecann.blog/wp-content/uploads/2015/11/2015-11-25_08-47-32.gif)](https://www.mikecann.blog/wp-content/uploads/2015/11/2015-11-25_08-47-32.gif)

So I think its a pretty neat solution to a problem that I personally have had while using Trello. You can grab the extension now and for free from the Chrome store:

[https://chrome.google.com/webstore/detail/trello-tasks/icedfgfhjcnidibolnnfbjnjbkbfgcic](https://chrome.google.com/webstore/detail/trello-tasks/icedfgfhjcnidibolnnfbjnjbkbfgcic)

I have a few more ideas like this I would love to explore and solve over the coming weeks so stay tuned!

[![](/wp-content/uploads/2011/06/banbanbnanbab.jpg "banbanbnanbab")](/wp-content/uploads/2011/06/banbanbnanbab.jpg)

Had a little free time this weekend so thought I would scratch an itch that has been bugging me for a while.



I started the second version of my [Chrome Crawler](/posts/chrome-crawler-a-web-crawler-written-in-javascript/) extension a little while back. I have been using the language [HaXe ](https://haxe.org/)to develop it in. It's a great language and I wanted to explore its JS target a little more so I thought, why not make a chrome extension using it. I have had several emails from various people requesting features for Chrome Crawler so I thought I would extend the extension and rewrite it in HaXe at the same time.

I managed to get the basics of the crawler working a few months back but through lack of time got no further. The second thing I wanted to work on after the basic crawling code was how to represent the crawled data. The current method is simply as a list:

![](/wp-content/uploads/2010/12/Shot_002.png)

A while back however I recieved a mail from "**[MrJimmyCzech](https://www.youtube.com/user/MrJimmyCzech)**" who sent me a link to a video he had made using Chrome Crawler and Gephi:

<iframe width="100%" height="400" src="https://www.youtube.com/embed/C8P6ZttaZRo" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

As you can see its pretty cool, visually graphed out as a big node tree.

So it got me thinking, can I replicate this directly in Chrome Crawler? To do this I would need to be able to render thousands of nodes and hopefully have them all moving about in a spring like manner determined by the relationships of the crawled pages.

The first thing I tried was using the [HaXe version of the Raphael library](https://lib.haxe.org/p/raphaelExtern). The library is designed for graphing and uses the Canvas with SVG for rendering, so I thought it would be perfect for replicating Gephi. I tested it however and only managed about 300 circles moving and updating at 25FPS:

[![](/wp-content/uploads/2011/06/outttt.jpg "outttt")](/wp-content/uploads/2011/06/outttt.jpg)

300 nodes just wasnt going to cut it, I needed more.

Enter the recent [HaXe externs](https://github.com/jgranick/three.js-completion) for [Three.js](https://mrdoob.com/blog/post/693) and its WebGL renderer. Three.js is rapidly becoming the defacto 3D engine for Javascript and takes alot of the headaches away from setting up and rendering to WebGL.

After a little jiggery pokery with the [still very new externs](https://haxe.1354130.n2.nabble.com/Extern-classes-for-three-js-Javascript-3D-like-ro-me-td6447961.html) I managed to get something running:

[![](/wp-content/uploads/2011/06/threjsjsjs.jpg "threjsjsjs")](/wp-content/uploads/2011/06/threjsjsjs.jpg)

Thats 2000 sprites running at 25fps which is less that I would have hoped for WebGL but still probably enough for ChromeCrawler. Im not too sure why the sprites are upside-down, nothing I can do seems to right them, perhaps someone can suggest the solution?

If you have a[ compatible browser](https://www.doesmybrowsersupportwebgl.com/) you can check it out [here](/Work/ChromeCrawler/01/crawlerTab.html). I have also uploaded the [source to its own project](https://code.google.com/p/chrome-crawler/source/browse/#svn%2Ftrunk%2FHaXe) if you are interested.

The next step is to take the data from the crawl and then render it as a node graph, exiting stuff!

[![](/wp-content/uploads/2010/10/Shot_004.png "Shot_004")](/wp-content/uploads/2010/10/Shot_004.png)

Just made a quick little update to my chrome extension "Post To Tumblr".



In this update I finally worked out how to catch bad username or password returns from the Tumbr API. Basically it just involved me using the ajax rather than the post jQuery function and using "async:false" like so:

```javascript
\$.ajax({
  url: "https://www.tumblr.com/api/write",
  type: "POST",
  data: o,
  async: false,
  complete: function (transport) {
    if (transport.status == 200 || transport.status == 201) {
      postingNote.cancel();
      var postedNote = webkitNotifications.createNotification(
        "images/icon48.png",
        "Image Posted!",
        info.srcUrl
      );
      setTimeout(function () {
        postedNote.cancel();
      }, 5000);
      postedNote.show();
    } else if (transport.status == 403) {
      postingNote.cancel();
      var errorNote = webkitNotifications.createNotification(
        "images/icon48.png",
        "Posting Error!",
        "Bad email or password"
      );
      setTimeout(function () {
        errorNote.cancel();
      }, 5000);
      errorNote.show();
    }
  },
});
```

In addition I have added some notifications to indicate when the extension is doing something.

I have made a little demo video below to show this off:

<iframe width="100%" height="400" src="https://www.youtube.com/embed/Rr7JxuUmZt8" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

Chrome should auto update for you. If you dont have the extension yet [head over to the extension gallery to grab it now](https://chrome.google.com/extensions/detail/dbpicbbcpanckagpdjflgojlknomoiah)!

[![](/wp-content/uploads/2010/10/Shot_002.png "Shot_002")](/wp-content/uploads/2010/10/Shot_002.png)

Woo! I have just published my first Chrome extension :)



It was really annoying me that when I found a funny cat or some other silly image I would have to go through an annoying process to get that image on [my Tumblr account](https://mikeysee.tumblr.com).

What I really wanted was some right-click-post action going on and wondered why no one had done one it yet. So with an hour or so to spare I whipped this extension up really quick.

It uses the Chrome 6 Context Menu API so you obviously need to have Chrome 6 to be able to use it.

Currently it only posts images as that's all I needed for now but if enough people want more then ill whip out the other data types.

The source couldn't be any simpler really, infact this is it here:

```typescript
chrome.contextMenus.create({
  title: "Post Image To Tumblr",
  contexts: ["image"],
  onclick: postImage,
});

function postImage(info, tab) {
  var email = localStorage["tumblr_email"];
  var password = localStorage["tumblr_pass"];

  if (!email || email == "" || !password || password == "") {
    alert("Need to set your Tumblr username and password in the options before posting!");
  } else {
    var o = {
      email: email,
      password: password,
      type: "photo",
      source: info.srcUrl,
    };

    var success = function (data, textStatus, request) {
      if (textStatus == "success") {
        alert("Image posted to Tumblr. Image -> " + info.srcUrl);
      } else {
        alert("Bad email or password");
      }
    };

    $.post("https://www.tumblr.com/api/write", o, success);
  }
}
```

Simples!

Theres even an option page where you put in your Tumblr details:

[![](/wp-content/uploads/2010/10/Shot_003.png "Shot_003")](/wp-content/uploads/2010/10/Shot_003.png)

Oh, there is one issue.

No matter what I tried I couldn't manage to get the Tumblr API to return an error. So if you enter your username or password incorrectly it still reports success, not entirely sure why, if someone knows I would love to hear why!

Interested? You can go grab it over on the chrome extensions gallery page -> [HERE](https://chrome.google.com/extensions/detail/dbpicbbcpanckagpdjflgojlknomoiah?hl=en)

**Go To Definition**
I love the Ctrl &amp; click feature in Eclipse/Netbeans and the Go To Definition feature in Visual Studio and have decided to implement them in [Flash develop](https://www.flashdevelop.org/community/index.php). After an evening or so of trying to write this myself I come accross the "ASComplete.DeclarationLookup()" method. To my great astonishment, this does exactly what I want. So thankyou to [Philippe](https://www.flashdevelop.org/community/memberlist.php?mode=viewprofile&u=3) or whoever wrote this method and did all the hardwork of the plugin for me ;)



**Screenshot**

![](https://www.mikecann.blog/Files/GoToS01.png)

**DLL**
[https://www.mikecann.blog/Files/GoToDefinition.dll](https://www.mikecann.blog/Files/GoToDefinition.dll)

**Source**
[https://www.mikecann.blog/Files/GoToDefinition_source.zip](https://www.mikecann.blog/Files/GoToDefinition_source.zip)

**Post**
[https://www.flashdevelop.org/community/viewtopic.php?f=4&amp;t=4722](https://www.flashdevelop.org/community/viewtopic.php?f=4&t=4722)

**EDIT:**
It appears that the same functionality is built as standard into FD with the use of the F4 key. Oh well, you can still use this as a shortcut ;)

This sort of things brings a big smile to my face; I got an excellent email yesterday from a chap named [Dave Hancock](https://gonegothic.com/) asking my permission to post an update he had made to my [Highlight Selected](https://www.mikecann.blog/?p=403) plugin.



Its an excellent upgrade and brings some extra features that were lacking in my very basic version.

**Copy / Paste of his update:**

Liked the plugin so much I decided to add a few features! Posting here with Mike's permission.

**Screenshot**
![](https://gonegothic.com/files/flashdevelop/HighlightSelection/HighlightSelection01.jpg)

**Updates**
Added 4 plugin setting options:

Highlight Color (Choose a color for the highlight)
Highlight Whole Words (Choose whether to highlight whole words only or include partial text)
Match Case (Choose whether to match the case of the selection or not)
Add Line Marker (Display a line marker next to highlighted text)

No longer highlights white-space characters

**Installation**

- Open FlashDevelop, Click Tools -> Application Files
- Copy the DLL to the "Plugins" directory
- Restart FlashDevelop

**DLL**
[https://gonegothic.com/files/flashdevelo ... ection.dll](https://gonegothic.com/files/flashdevelop/HighlightSelection/HighlightSelection.dll)

**Source**
[https://gonegothic.com/files/flashdevelo ... ection.zip](https://gonegothic.com/files/flashdevelop/HighlightSelection/HighlightSelection.zip)

Well for the last few evenings I have been working on this little proof of concept. One of my work colleague Ade ([@6t8](https://twitter.com/6t8)) came up with the idea "someone should make a game that you can play over twitter". Well after abit of excitement and talk I decided to have a go at coding this idea. Once I had started I realised that it could be possible to do alot more with this, so I decided to make the project a little more generic and turn it into a pluggable bot for automating twitter.



After a few evenings work however I decided that this project was going to take up a bit too much of my time, especially when I had so much other work to do. So I have decided to release what I have done and let other take it and develop it if they wish.

You login using a twitter account:

![1](/wp-content/uploads/2009/04/1.gif "1")

Once logged in you are presented with the main interface, plugins are loaded automatically from the directory and displayed as tabs. The reason for doing them as plugins is to allow users to pick and choose what functionality they want their twittbot to have. Also it allows for easy upgrading to newer plugin versions.

![2](/wp-content/uploads/2009/04/2.gif "2")

Hangman was the primary idea for this project and is implemented as a simple plugin that consists of 3 simple commands:

![3](/wp-content/uploads/2009/04/3.gif "3")

I have built a simple polling timer for checking new messages from Twitter:

![4](/wp-content/uploads/2009/04/4.gif "4")

The interface uses docking panels provided by the[ .NET DockPanel Suite](https://sourceforge.net/projects/dockpanelsuite/). Docking is demonstrated below with the log window:

![5](/wp-content/uploads/2009/04/5.gif "5")

The next shot shows me sending a direct message to the "[twittgames](https://www.twitter.com/twittgames)" account from my "[mikeysee](https://www.twitter.com/mikeysee)" account:

![6](/wp-content/uploads/2009/04/6.gif "6")

After refreshing, the Hangman plugin then shows the active game states:

![7](/wp-content/uploads/2009/04/7.gif "7")

Then you play the game by making guesses:

![8](/wp-content/uploads/2009/04/8.gif "8")A

And the plugin responds to your guesses:

![9](/wp-content/uploads/2009/04/9.gif "9")

It is far from complete but as a proof of concept I think it demonstrates the idea. There are many things that could be improved and/or worked upon, such as:

- Implement async calls rather than halting the thread when making a call
- Completing the Auto-follow plugin
- Implementing a database to log previously handled messages
- Enable back-messaging so you can search for previous messages and handle them
- Implement an interface for loading/unloading plugins
  For the technology side of things, its was developed in C# .NET 3.5 using the excellent [TweetSharp ](https://code.google.com/p/tweetsharp/)library for interfacing with Twitter. Docking panel functionality is provided by [DockPanel Suite](https://sourceforge.net/projects/dockpanelsuite/).

You can grab the binary for this here: [TwitterBot.zip](Files/TwitterBot.zip)

Source code is available on request. Email: mike.cann@gmail.com