Wednesday, April 09, 2014

Add Wikipedia App to Microsoft Word 2013

Office 2013 and SharePoint apps are great, but I have to admit that I haven’t done much with them yet. Today, I found myself wondering what I’d have to do to get Wikipedia to open when I right-clicked on a word or phrase in Word 2013.


To add Wikipedia, all I had to do was choose Insert from the Ribbon menu at the top of the screen and then click the Wikipedia icon. If you click “My Apps,” you can navigate to the Office 2013 app store and check out what other interesting apps are available.


Once you click the icon, you’ll need to confirm that you trust this new app.


After you’ve trusted the app, you can now quickly look up words or phrases from your Word documents in Wikipedia. Very cool!


Switching the app that opens by default when you choose the “Define” option is not obvious. To choose a different app, you first need to hide the Wikipedia app my clicking “My Apps” in the Ribbon and then clicking “Manage My Apps.”


For example, let’s say you wanted to use the Bing dictionary for the Define option. You can add the Bing app, then choose Manage My Apps—which opens a web page—and hide Wikipedia from that page. Once you hide an app, you should be able to click the “Refresh” button in the My Apps view and see that the app is no longer there.

After you’re done, you can unhide Wikipedia. Note that some people have reported that they had to restart Word after hiding Wikipedia.

I should mention that it’s also possible to have multiple apps running. In the screenshot below, I have both the Bing dictionary and the Wikipedia app open.


Saturday, March 22, 2014

U.N. World Water Day 2014

Today is U.N. World Water day!

My smartass Twitter comment was that I’ll spend the day reflecting on things, but seriously… water is our most precious resource and we really need to start taking care of it. Since joining Aquatic Informatics software, I’ve had much more exposure to stories of water-related issues around the world. We’re working to provide the software the world needs to make smart water policies based on actual data rather than speculation or lobbying. We need to let science decide how we can provide better access to clean drinking water and more widespread use of renewable resources for power generation.

From the U.N. Water Day Facebook page:

“Did YOU know that… by 2035, the global energy demand is projected to grow by more than one-third and demand for electricity is expected to grow by 70%.

22nd of March is World Water Day. The theme for this year is Water & Energy.
Share this picture and help us raise awareness about UN-Water World Water Day


Wednesday, February 26, 2014

Windows XP End of Life is Coming

It's time to move on. Although Windows XP was an important release when it came out, and a surprising number of people and organizations are still running it, it's time to upgrade.

If you know someone still running XP, you should remind him or her in no uncertain terms that 2001 is over. On April 8th, 2014, Windows XP support will end. After that date, there will not be any updates--most notably security updates--for the O/S that should probably be called Windows Classic at this point.

One of my responsibilities at Aquatic Informatics is the supported systems matrix for our software. We had deprecated support for Windows XP a couple of releases ago, but as of our next release, we'll officially be dropping support. There's no doubt that most software companies have already done the same or will be dropping XP support in the near future. So boldly step into the present and take a look at Windows 8.1.

Thursday, January 30, 2014

The Mystery of Why People Use SharePoint

I had to laugh when I read this blog post from the Calgary Herald: Is SharePoint a pain point? Maybe it’s time to ditch it. They used the image below (slightly modified here) to distance themselves from the "righteous" supporters of SharePoint.


Of course SharePoint isn't perfect, but if you require some features that SharPoint provides, then you should run a pilot and try it out; base your decision on your actual use cases. This quote from a white paper that I co-wrote with Colin Spence (he wrote this particular text) sums it up nicely:

“If end users already know how to use SharePoint and have received training on the key tools provided by SharePoint the organization can be more ambitious in the implementation. On the other hand if end users are completely unfamiliar with SharePoint and in general not open to change and not willing to take training, IT should carefully control the complexity of the SharePoint configuration. Projects can be seen as “failures” if a few important end users complain that the SharePoint solution is ‘too complicated,’ or ‘too time consuming.’”

It's a classic case of people believing that there is a perfect system out there and all they need to do is pick the right one. It's simply not reality.

Wednesday, December 18, 2013

Installing Ruby on Rails in Ubuntu 12.04 on Azure

In previous posts, I covered installing Ubuntu on Windows Azure, remotely accessing Linux from Windows Azure, installing LAMP and installing Git on Linux and a few other topics. The next subject I’ll be writing about is the Ruby on Rails web development platform.

There are some great resources out there for learning Ruby and Rails, and when the install goes smoothly, it’s very easy. I’m not an expert on Ruby, but the install didn’t go swimmingly for me, so I’m writing this post.

Step 1 – Install RVM and Ruby

\curl -L | bash -s stable --ruby

Ruby Version Manager (RVM) is a great tool for working with Ruby. You can even run multiple versions of Ruby and easily switch back and forth.


Step 2 – Install Rails

Finally, you can use RubyGems to install rails:

gem install rails (may need sudo, I had to run it with both, see note below)

Note: if you see the error, ERROR:  Error installing rails: activesupport requires Ruby version >= 1.9.3.”, (or some other version) install Ruby 1.9.3 (Yes, even if you have a newer version installed) then use RVM to set the old version as the default using: rvm use ruby-1.9.3. This caused me much angst today. You can use ruby –v to see which version you’re running and rvm list to see the installed versions.

I also ran into this ugly error:

cawood@cawood:~$ rails --version
/usr/lib/ruby/1.9.1/rubygems/dependency.rb:247:in `to_specs': Could not find railties (>= 0) amongst [activesupport-4.0.2, atomic-1.1.14, bigdecimal-1.1.0, bundler-1.3.5, bundler-unload-1.0.2, executable-hooks-1.2.6, gem-wrappers-0.9.2, i18n-0.6.9, io-console-0.3, json-1.5.5, minitest-4.7.5, minitest-2.5.1, multi_json-1.8.2, rake-, rdoc-3.9.5, rubygems-bundler-1.4.2, rvm-, thread_safe-0.1.3, tzinfo-0.3.38] (Gem::LoadError)
        from /usr/lib/ruby/1.9.1/rubygems/dependency.rb:256:in `to_spec'
        from /usr/lib/ruby/1.9.1/rubygems.rb:1210:in `gem'
        from /usr/local/bin/rails:18:in `<main>'

I had to run gem install rails (with no sudo) to get all the gems to install properly. After I did that, I could see that Rails was installed properly:

cawood@cawood:~$ rails --version
Rails 4.0.2

Of course, my list of installed gems was much longer because the missing gems had been installed. It should look like this:

cawood@cawood:~$ gem list

*** LOCAL GEMS ***

actionmailer (4.0.2)
actionpack (4.0.2)
activemodel (4.0.2)
activerecord (4.0.2)
activerecord-deprecated_finders (1.0.3)
activesupport (4.0.2)
arel (4.0.1)
atomic (1.1.14)
bigdecimal (1.1.0)
builder (3.1.4)
bundler (1.3.5)
bundler-unload (1.0.2)
erubis (2.7.0)
executable-hooks (1.2.6)
gem-wrappers (0.9.2)
hike (1.2.3)
i18n (0.6.9)
io-console (0.3)
json (1.5.5)
mail (2.5.4)
mime-types (1.25.1)
minitest (4.7.5, 2.5.1)
multi_json (1.8.2)
polyglot (0.3.3)
rack (1.5.2)
rack-test (0.6.2)
rails (4.0.2)
railties (4.0.2)
rake (
rdoc (3.9.5)
rubygems-bundler (1.4.2)
rvm (
sprockets (2.10.1)
sprockets-rails (2.0.1)
thor (0.18.1)
thread_safe (0.1.3)
tilt (1.4.1)
treetop (1.4.15)
tzinfo (0.3.38)

Alternate Method—This didn’t work for me on Ubuntu 12.04

Step 1 – Install Ruby

You can either install the standard version: sudo apt-get install ruby-full build-essential
or the minimal requirements with: sudo aptitude install ruby build-essential libopenssl-ruby ruby1.8-dev (note the version number – you’ll have to update that).

I’m going with the first option to install ruby-full.


Step 2 – Install the Ruby Version Manager

CAUTION: Normally you would just run: sudo apt-get install ruby-rvm

However, there is an issue with the Ubuntu RVM package, so you should run this instead: \curl -L | bash -s stable --ruby --autolibs=enable --auto-dotfiles

If you do run into issues with RVM. For example, using rvm use doesn’t change to the version you want, you can run these commands to clean your system (see this thread).

sudo apt-get --purge remove ruby-rvm
sudo rm -rf /usr/share/ruby-rvm /etc/rvmrc /etc/profile.d/

Then, open new terminal and validate environment is clean from old RVM settings (should be no output):

env | grep rvm

Step 3 – Check that You’re Using the Latest Version of Ruby

ruby –v will show you which version you’re using.

If you’re not using the one you want, you can use RVM to upgrade. This will download the source that is then used by RVM in the next step to compile and install Ruby; it is not a quick command.

sudo rvm install ruby-1.9.3-p125


sudo rvm install ruby-1.9.3 (Note version number)

However, if you do the second option, you may need to workaround an issue before updating. If you try to install ruby-1.9.3, you might get the error: “ERROR: The requested url does not exist: '' from RVM. You can workaround this by downloading the package yourself.”

sudo curl -o /usr/share/ruby-rvm/archives/ruby-1.9.3-.tar.bz2 \

Check that you’re using the latest Ruby: ruby -v

If not, switch to the latest using RVM: rvm use 1.9.3

Step 4 – Install Rails

Finally, you can use RubyGems to install rails:

sudo gem install rails

Step 5 – Install a Web Server

I use Apache and MySQL, so the LAMP install works for me, but there are other options such as WEBrick or Lighttpd.

Other posts on this topic: getting started

Ubuntu documentation – Ruby on Rails

Thursday, December 05, 2013

Using Wyzz Web-based HTML editing control in ASP.NET MVC

I recently had to put out a web-based single page application (SPA) on short notice. To make that happen, I knew I had to use some open-source controls. One was the jsTree treeview control (which I wrote about on this blog - Using jsTree with ASP.NET MVC) and another was the Wyzz WYSIWYG web-based editing control for HTML.

From their site, “Wyzz is an ultra-small, very light WYSIWYG (What You See Is What You Get) Editor for use in your web applications. It's written in JavaScript, and is free (as in speech and as in beer) for you to use in your web applications and/or alter to your needs (see the license conditions).


Naturally, the first step to add a reference to the wyzz.js script file. Once you have that, you just need to add the control to an HTML <textarea> element. Finally, it’s a simple matter of adding some JavaScript to “make_wyzz” the control.

<script language="JavaScript" type="text/javascript" src="~/Home/wyzz.js"></script>

<textarea name="textEditor" id="textEditor" rows="10" cols="40">No file loaded...</textarea><br />
<script language="javascript1.2">
<div ng-controller="EditorCtrl">
<form novalidate class="simple-form">
<button ng-click="saveFileContent()">save</button>

As you can see in the example above, I’ve chosen to use an AngularJS control to define the behaviour of the save button. In the JavaScript I define a server-side controller function (ASP.NET in this case) and I send it the content of the control by accessing the HTML element that the control is using.

$scope.saveFileContent = function () { 
$'/Home/SaveFileContent', { filePath: document.getElementById("multilingualfile").innerHTML, content: document.getElementById("wysiwyg" + "textEditor").contentWindow.document.body.innerHTML, title: document.getElementById("titleHtml").value })
function (response) {
alert("File Save Result: " +;
function (data) {
alert("Error saving file content");

Update: Here’s the basic format of the server-side part:

public ActionResult SaveFileContent(string filePath, string content, string title)

return Json
Result = "Success",
catch (Exception ex)

return Json
Result = "Error saving content: " + ex.ToString(),

To customize your Wyzz controls, you can edit the wyzz.js file. If you have any issues, refer to the Wyzz discussion forum.

Sunday, December 01, 2013

Using jsTree with ASP.NET MVC

When I wanted to use a pure JavaScript treeview control for a recent ASP.NET MVC5 project, I looked around and found jsTree; it’s a popular and rich solution, so I decided to try it. I ran into a few customization hurdles, so here are my lessons learned.

Note that this is for jsTree 1.0; at the time of writing, 3.0 has not been released.

Step 1: The HTML in the view. Pretty simple…

<div id="FileTree"></div>

Step 2: Loading the tree dynamically from the MVC controller using jQuery.

<script type="text/javascript"> 
// Begin JSTree: courtesy Ivan Bozhanov:

"json_data": {
"ajax": {
"url": "/Home/GetTreeData",
"type": "POST",
"dataType": "json",
"contentType": "application/json charset=utf-8"
"themes": {
"theme": "default",
"dots": false,
"icons": true,
"url": "/jstree/themes/default/style.css"

"contextmenu": {
"items": {
"create": false,
"rename": false,
"remove": false,
"ccp": false,

"plugins": ["themes", "json_data", "dnd", "contextmenu", "ui", "crrm"]


Step 3: Server-side code to populate the tree. This code is based on desalbres’s Simple FileManager with jsTree. (The model code is below.)

// Begin JSTree (Controller code courtesy desalbres:
public ActionResult GetTreeData()
if (AlreadyPopulated == false)
JsTreeModel rootNode = new JsTreeModel();
rootNode.attr = new JsTreeAttribute(); = "Root";
string rootPath = Request.MapPath(dataPath); = rootPath;
PopulateTree(rootPath, rootNode);
AlreadyPopulated = true;
return Json(rootNode);
return null;

/// <summary>
/// Populate a TreeView with directories, subdirectories, and files
/// </summary>
/// <param name="dir">The path of the directory</param>
/// <param name="node">The "master" node, to populate</param>
public void PopulateTree(string dir, JsTreeModel node)
if (node.children == null)
node.children = new List<JsTreeModel>();
// get the information of the directory
DirectoryInfo directory = new DirectoryInfo(dir);
// loop through each subdirectory
foreach (DirectoryInfo d in directory.GetDirectories())
// create a new node
JsTreeModel t = new JsTreeModel();
t.attr = new JsTreeAttribute(); = d.FullName; = d.Name.ToString();
// populate the new node recursively
PopulateTree(d.FullName, t);
node.children.Add(t); // add the node to the "master" node
// loop through each file in the directory, and add these as nodes
foreach (FileInfo f in directory.GetFiles("*.htm"))
// create a new node
JsTreeModel t = new JsTreeModel();
t.attr = new JsTreeAttribute(); = f.FullName; = f.Name.ToString();
// add it to the "master"

// Don't load the jsTree treeview again if it has already been populated.
// Note: this causes a bug where the tree won't repaint on browser refresh
public bool AlreadyPopulated
return (Session["AlreadyPopulated"] == null ? false : (bool)Session["AlreadyPopulated"]);
Session["AlreadyPopulated"] = (bool)value;

// End JSTree

First I had to resolve the issue that a browser refresh would repaint the whole treeview. It’s possible that I simply missed this when I cherry picked code from the FileManager codeproject example.

public ActionResult Test(string returnUrl)
ViewBag.ReturnUrl = returnUrl;
Session["AlreadyPopulated"] = false;
return View();

Next, I had to customize jsTree the way I wanted it to behave. Getting the tree to start collapsed (closed) instead of expanded (open) was the first order of business. The jsTree API took care of the problem.

$('#FileTree').bind("loaded.jstree", function (event, data) { 

Next, I wanted the leaf nodes to use a different background image than the folder nodes. This required changing the server-side code to actually write the leaves (files) as leaf nodes and then add the right CSS to style the jstree-leaf class.

namespace FileEditor.Models 
public class JsTreeModel
public string data;
public JsTreeAttribute attr;
// this was "open" but changing it to “leaf” adds “jstree-leaf” to the class
public string state = "leaf";
public List<JsTreeModel> children;

public class JsTreeAttribute
public string id;

And then styling the leaf nodes with a different background image than the folders.

<style type="text/css"> 
#FileTree .jstree-leaf > a > ins {
background: url("/jstree/themes/default/d.gif");
background-position: -2px -19px !important;

Finally, I wanted to disable the right-click context menu options since I’m not using them. (This code appears in the code above.)

"contextmenu": {
"items": {
"create": false,
"rename": false,
"remove": false,
"ccp": false,

That’s it. jsTree is not working the way I want. I expect that version 3 will be great when it is released.

Other posts on this topic:
jsTree – Few examples with ASP.Net/C#
Simple FileManager width MVC 3 and jsTree