Integrating WikiPack with other apps, like Address Book

Last one for the day, I promise! Borrowing (cough, stealing…) an idea from Brett Terpstra on connecting nvAlt & Address Book, I tried using WikiPack to do the same thing and whipped up a quick video in the process:

☙❦❧

Integrating with other apps

This technique can be used with any app that accepts text input, like TaskPaper which I use and love for managing todo lists. For example, I’m often debugging issues and have log file snippets and notes related to an issue I’m working on, but want to keep my actionable list in TaskPaper clean and free of clutter, so I’ll often add a link in TaskPaper as a note:

My important project:
  http://beet.wikipackit.com/pages/ImportantProject
  - improve test coverage
  - fix issues
  - deploy updates

TaskPaper will actually render the page’s URL as a clickable link, that opens it in a browser. Handy!

Checkout WikiPack at http://wikipackit.com

Using WikiPack - adding links & pics to a wish list page

An impromptu video showing some of my own day to day usage of WikiPack, today it is adding a link to a game review with a screenshot:

Visualising changes in your Markdown pages

Following on from the last update which added a change history to your pages, this update polishes it off with the ability to visually compare between two versions of your Markdown pages:

Unlocking a hidden time machine

Did you know that when you use Dropbox to share your files between devices, it actually keeps a history of each change you make to your files? If you’re using the Mac/PC client, or an iOS app with Dropbox support, you’d never know, but locked away in Dropbox’s cloud is a history of your edits made from any of your devices & apps.

The only other way that I’m aware of to revert back to a previous version of a file is to log into the Dropbox website and do it manually. Unless you’re using a revision control system like SVN/Git, or Apple’s Time Machine, you may have experienced the frustration of having nuked one of your files. WikiPack just solved that problem.

For a Markdown editor with Dropbox sync, WikiPack is now an extremely powerful tool that lets you focus on writing your content without having to worry about what happens to it. Edit away, go crazy, because if you don’t like it or mess something up, you can easily compare it to an older version and revert it back as needed.

Check it out at http://wikipackit.com

Reverting back to previous versions of your Markdown pages

This is a bit of a game changer - WikiPack now keeps a history of changes made to your pages, and allows you to revert them back to a previous version!

It’s live now, and already provides access to changes made to your pages previously.

First web-based Markdown editor with Dropbox sync and change history?

For a wiki, page history is an expected feature, but for a web-based Markdown editor I believe this is a first. It is an extremely powerful feature that isn’t available as part of your standard suite of Markdown tools. The only other way to revert changes to your pages is to log into the Dropbox website and manually revert them back (or use a SCM system, or Apple’s Time Machine).

WikiPack is now quite possibly the first web application with Dropbox sync that provides a simple way of both editing your Markdown pages, and also viewing & reverting to a complete history of your changes. I’m really excited about this update!

Comparing changes

This is the first iteration of page histories, the next iteration that I’ll be working on is the ability to compare previous versions, so stay tuned.

Mark

Try it out at http://wikipackit.com

Embedding images into your Markdown pages

Markdown has great support for images, and they come in handy for bringing WikiPack pages to life. I use them for a lot of things:

• I keep a wishlist page with photos of iOS games I’d like to try one day, geek tools that look cool, and stationary items that I really like the idea of but will never use
• Before buying new things, like a burr grinder or cold-press juicer that I’m considering at the moment, I research he best products out there on a page with links to reviews and photos of each item
• I keep a page for my favourite apps containing tips & tricks, often accompanied by a screenshot

In this video I demonstrate two methods for adding images to your pages:

1. Hot-linking to externally hosted images (a bit naughty)
2. Using an image sharing service like Cloud.ly to upload an image from your computer

The method of embedding the image is the same in each case, using the following Markdown syntax:

![alt-text](URL)

A note on Trunk Notes images

Those of you who use WikiPack as a companion for Trunk Notes may be wondering about the possibility of supporting it’s images. Trunk Notes allows you to save images into a folder on Dropbox, and display them in your wiki using either it’s {{image}} function, or a standard Markdown image like ![image](../images/Image.jpg).

As the files are stored locally on your iOS device, it doesn’t use any bandwidth to view images within Trunk Notes, but I haven’t implemented support for Trunk Notes images in WikiPack yet.

What I’m thinking about is looking into whether it might be possible to use hot-linking to display the images directly from Dropbox, because it won’t be practical to keep a local cache of a large no. of users images. At least not for the time being. If it turns out that there’s no other way to implement support for Trunk Notes images, it might have to become a premium feature or something. Not making any promises at this point though.

Page links - organising your Markdown pages

The secret sauce of WikiPack, so to speak, is the way it organises your information by linking it together. It does this by starting with a foundation of Markdown pages, and augmenting them with WikiWords that give your pages context, and form relationships between them.

What are WikiWords?

Say you have a page called "My sensible page of serious things". To represent that as a WikiWord, we remove the spaces, and capitalise each word to give:

MySensiblePageOfSeriousThings

So to add that page to your wiki, you’d create a page called "MySensiblePageOfSeriousThings", and it would automatically have your chosen Markdown file extension added to it. (You can choose which extension to use when setting up your account)

Linking pages together

The power of WikiPack is the way it allows you to freely link your pages together using wiki links. Currently, wiki links come in two flavours, standard and custom.

Standard wiki links

To link one page to another, simply wrap the target page’s WikiWord in double square brackets. For example:

[[MySensiblePageOfSeriousThings]]

Standard wiki links are rendered on the page as the WikiWord, in this case as “MySensiblePageOfSeriousThings”, but most times you’ll probably want to customise the link text.

Custom link text

To customise the link text that is shown on the page, use a “pipe” character | as so:

[[MySensiblePageOfSeriousThings|my sensible serious page]]

In this case, the link will appear on the page as “my sensible serious page”, or whatever you enter after the pipe.

Inter-page links

WikiPack builds a database of links between your pages, so that as you navigate your wiki you can use the convenient links at the bottom of each page to jump to other pages that link to it. As your wiki grows and you organise your pages in different ways by renaming them, it automatically updates the inter-page links, but will also automagically update the links within the referring pages.

So the context & relationships you create between your pages is always maintained, making it a powerful personal information organiser.

A note on naming conventions and Windows incompatible characters

If you’ve used an awesome iPhone app called Trunk Notes, or indeed many other wiki-like tools, you may have Markdown files using a naming convention like “Special:Header.markdown”, and may have even adopted it for your own purposes. I started using names like “Todo:Home.markdown”, “Todo:Word.markdown” etc. This helps give files context, and in WikiPack makes them easy to find using the quick search box, but unfortunately it causes problems with Dropbox sync.

It turns out that the Windows file system has several characters that cannot be used in filenames, including the colon. There’s a full list on this Dropbox support page:

• < (less than)
• > (greater than)
• : (colon)
• ” (double quote)
• / (forward slash)
• \ (backslash)
• | (vertical bar or pipe)
• ? (question mark)
• • (asterisk)

The Dropbox API is inconsistent in that it allows apps to upload files with colons in the filename, but will not allow them to be renamed. Currently WikiPack will break if you attempt to rename a file and leave a colon in the filename, but I’m working on it.

Get your pages organised at http://wikipackit.com

Streamlined signup process

Several people had commented on the overly clunky and complex signup process, so I made an effort to streamline and simplify it.

Where the initial signup form had a page of fields to fill in, it now just asks for an email address and password, and then walks you though the rest of the setup process:

After your account is setup, you can optionally customise some of your wiki’s settings:

• Your wiki subdomain
• A personalised name for your wiki
• Your login user name
• Your login password

Dropbox authorisation

I also polished up the Dropbox authorisation a bit. Some people were put off by WikiPack asking for “full Dropbox” access instead of “app folder” (sandbox) mode, but it turns out that when you’re using other apps that allow you to browse your Dropbox folder, they’re using full Dropbox access too.

Here’s a list of the apps I’ve granted access to my Dropbox folder, all using Full Dropbox mode:

You can check which apps have full access to your Dropbox contents here

Once you’ve either selected a folder containing existing Markdown files and imported them, or used the template option to create a new folder, WikiPack will only access files within that folder.

To see it in action, head over to http://wikipackit.com

Thanks

On trust & security

A keen observer noticed on the new WikiPack homepage that amongst the example usages were tracking fitness records and financial details like tax calculations etc. They also noticed that WikiPack does not (as of Feb 2012) currently use SSL encryption, so if you edit a page containing sensitive medical or financial data, it will currently be transmitted from your browser to the WikiPack servers in the clear.

Security vulnerability

What does that mean? Should someone with malicious intentions, and the appropriate technical expertise, wish to access your personal data, they could theoretically intercept it enroute.

SSL encryption

While WikiPack is in open beta, I have not yet purchased or deployed an SSL certificate, but will do so before going live. This will encrypt your data as it is transmitted between your browser and the WikiPack servers.

So, what’s stored on our servers?

You may have read recently of the debacle ensuing from the discovery that Path were uploading their user’s Address Book contents to their servers without their consent. They apologised and claim to have deleted the data, but some still feel it was disingenuous.

So I’d like to be forthright in explaining exactly what get’s stored on WikiPack servers:

• Your email address (used to activate your account)
  • Subscription to the mailing list is opt-in
  • I did take the liberty of adding some early adopters to the mailing list with clear instructions on how to opt-out, which so far only two people have followed, otherwise you will not receive unsolicited email from WikiPack
• Your user name
• No passwords are recorded in plaintext
  • They are encrypted and cannot be recovered if forgotten
• No Dropbox user details are stored on WikiPack
  • When you authorised your account with WikiPack, Dropbox provided a unique session ID which is recorded in the database
  • This session ID is only used by WikiPack to access the contents of the folder you selected when setting up your account
• Page data:
  • The system keeps a local cache, in the database, of the complete contents of each page in your wiki
  • This database is protected by a secure Linux server
  • When you view a page on WikiPack, it is loaded instantly from the database, rather than fetching it remotely from Dropbox. This makes it fast, and responsive.
  • When you edit a page on WikiPack, it updates the database, and a background process picks it up later (a second or two) and uploads it securely in the background to Dropbox. Again, this ensures a fast, pleasant user experience.
  • WikiPack scans your pages for wiki links, and builds a tree in the database of how they are linked together. It uses this tree for presenting navigation links in the user interface only.

To summarise, WikiPack keeps a copy of your wiki pages in a secure database which acts as a local cache for read & write operations to your Dropbox files. This makes the system fast, and responsive. Attempting to load the data remotely from Dropbox each time you view a page would be slow, and impractical.

Your page data within the database is unencrypted, which means that if the database was compromised, your data would be accessible. I do not believe that will ever happen, but a relationship of trust should be built on facts, and that’s the reality of the situation.

A matter of trust

So my advise to you when considering whether to trust your data to WikiPack or not, is do not put any sensitive information in your wiki that you wouldn’t trust to other online services like Google Docs or Gmail.

As a general rule of thumb, if you’d trust your information to a Google Docs document, you’d probably be happy to put it on a WikiPack page.

I personally have my accounting info and my health & fitness records in my wiki, because I built it and I trust it completely. But I understand that you don’t know me, and might not trust me at all. That’s why it’s important that I give you as much information as I can so that you can at least make an informed decision.

In closing, I’ll be putting up a privacy policy page soon, and I believe that your data is as at least as safe on WikiPack as it is on most other cloud services, much safer in fact than some. Take that as you will.

Regards,
Mark Beattie
Developer & Founder of WikiPack

GUI Markdown editor

Very excited to announce that a new experimental feature has been added to WikiPack, a GUI Markdown editor.

It’s brand spanking new, and currently only has toolbar buttons for a few basic editing functions, but I’d like to get it into people’s hands to play with and find out what you think.

Couple of things I didn’t mention in the video:

• Formatting text with bold, and italics:
  • You can hit the keyboard shortcut as you’re typing to insert the formatting characters and place the cursor in between them
  • You can then type the text that you wish to format
  • You don’t have to type the text first, select it, and then apply the formatting.
• QuickCursor integration
  • The usual means of invoking QuickCursor doesn't capture the Markdown text; the editor window comes up empty
  • Before invoking QuickCursor, use your standard select-all keyboard shortcut (CMD/CTRL-A) and then invoke QuickCursor

iOS - a bit disappointed

I was really excited about getting the GUI editing features on iOS, because I personally use WikiPack on my iPad quite a bit, but unfortunately it doesn’t quite work as I was hoping.

Some of the toolbar buttons work, like the heading button, and the link/image buttons, but the formatting buttons are another story.

The problem is that the GUI editor is overriding the iOS text selection mechanism, so you can’t select words or position the cursor.

I’m disappointed about that, but will be working on finding a solution.