Uncategorized

We have a wiki at work that we use for documentation called Confluence. It has the ability to export pages to Word or PDF, but a lacking feature is the ability to take a table and export it for Excel. So, I decided to create a bookmarklet that will allow you to select an HTML table on any web page and create a CSV file from that table that can be downloaded to your machine. Below is the bookmarklet. Just drag it to your bookmarks toolbar. Then give it a shot by clicking the bookmarklet and the below example table should get a link right before it that says “Export to CSV”. Click that link and you will be prompted to download the CSV version of that table. Let me know if it is useful for you.

On thing of note, this will not work correctly in Internet Explorer 9 and below as IE will not allow data uri’s for anything other than images.

Bookmarklet:
Export to CSV <- drag this to your bookmarks toolbar

Update:
05/08/2019 – Enhanced to not kill line breaks.
09/16/2016 – Now works with IE 10+.
04/19/2016 – Fixed issue with tables that have header cells not on top.

Example Table:

Bookmarklet Source: 

javascript:(function(){
    function getJavaScript(url, success) {
        var script = document.createElement('script');
            script.src = url;
        var head = document.getElementsByTagName('head')[0],
            done = false;
        script.onload = script.onreadystatechange = function(){
            if (!done && (!this.readyState || this.readyState == 'loaded' || this.readyState == 'complete')) {
                done = true;
                success();
                script.onload = script.onreadystatechange = null;
                head.removeChild(script);
            }
        };
        head.appendChild(script);
    }
    function addCSVLinks() {
        jQuery('.csvLink').remove();
        
        jQuery('table').each(function(index){
            jQuery(this).attr('data-csvtable', index).before('<a href="#" class="csvLink" data-forcsvtable="' + index + '">Export to CSV</a>');
        });
        
        jQuery('.csvLink').click(function(){
            var text = '';
            var csvTableIndex = jQuery(this).attr('data-forcsvtable');
            jQuery('table[data-csvtable="' + csvTableIndex + '"] tr').each(function(){
                jQuery('td, th', this).each(function(index){
                    if(index != 0) {
                        text += ',';
                    }
                    text += '"' + formatedText(jQuery(this).html()) + '"';
                });
                text += '\r\n';
            });
            jQuery('.csvLink').remove();
            downloadCSVFile('TableExport.csv', 'text/csv', text);
        });
    }
	function formatedText(html) {
		var ret = html;
		
		//replace line breaks
		ret = ret.replace(/\n/g, ' ');
		
		//replace tabs
		ret = ret.replace(/\t/g, ' ');
		
		//replace multiple spaces
		ret = ret.replace(/\s+/g, ' ');
		
		//Fix html encoded characters
		ret = decodeHtml(ret);
		
		//Deal with lines breaks and paragraphs
		ret = ret.replace(/<br>/ig, '\n<br>');
		ret = ret.replace(/<br/ig, '\n<br ');
		ret = ret.replace(/<p/ig, '\n<p ');
		
		//Deal with quotes
		ret = ret.replace(/"/ig, '""');
		
		//Deal first character being line break
		ret = ret.replace(/^\n/, '');
		
		//Remove HTML tags
		ret = ret.replace(/(<([^>]+)>)/ig,"");

		return ret;
	}
	function decodeHtml(html) {
		var txt = document.createElement('textarea');
		txt.innerHTML = html;
		return txt.value;
	}
    function downloadCSVFile(filename, mime, text) {
        if (window.navigator.msSaveOrOpenBlob){
            // IE 10+
            var blob = new Blob([decodeURIComponent(encodeURI(text))], {
                type: 'text/csv;charset=utf-8'
            });
            window.navigator.msSaveBlob(blob, filename);
        } else {
            var pom = document.createElement('a');
            pom.setAttribute('href', 'data:' + mime + ';charset=utf-8,' + encodeURIComponent(text));
            pom.setAttribute('download', filename);
            document.body.appendChild(pom);
            pom.click();
            document.body.removeChild(pom);
        }
    }
    if(typeof jQuery == 'undefined') {
        getJavaScript(
            '//code.jquery.com/jquery-latest.min.js',
            function(){
                addCSVLinks();
            }
        )
    } else {
        addCSVLinks();
    }
})();

Today, I went to change the password on my Microsoft account from a shortish hard to remember and type password to a nice and secure long and easy to type passphrase. With all of the hubbub these days around hacked accounts I want to make sure that my accounts are nice and secure. I just wish Microsoft was on-board with that.

I went to my account and put in a pass phrase that seems pretty decent to me. Here is the first message I got. It seems that my nineteen character passphrase is too long. Why is this an issue I ask? Why does Microsoft care if I want to have a long password? If I want to take on the burden of typing those extra characters what is it to them? This is not a limitation with any other Microsoft system I have ever used (personal machine and work machines). I’m sure their own systems are based on their own stack, so this is an artificial limit that they have put in that has no real value except to make my account easier to hack.

Ok, since I can only have up to sixteen characters in my password I guess I’ll have to comply. Sixteen characters is still pretty long right? So, I swapped out some words and made a few tweaks only to be presented with this. REALLY!? By the way, the character that they do not like is a space. So, I thought I would see what characters they do allow. They allow A-Z, a-z, 0-9, and every special character printed on your keyboard … just not space. Ugh!! It seems they are going out of their way to discourage pass phrases when it has been shown time, and again, and again, and again that pass phrases are more secure than passwords.

So, in the end, I am forced to bow to their ridiculous security policy that excludes one character and forces me to 16 characters. What do you think?

So, I want the Leap Motion to be this awesome thing that makes my computer word kinda like Minority Report. I really want it to be a totally new way of using my machine that doesn’t just replace the keyboard and mouse but can enhance it much the same way that touch interaction has these day. Unfortunately, I just can’t say that right now.

So far it has been kind of a let down … especially the apps that are geared toward native computer interaction. So far the app that Leap has put forward is just way too hard to use. It is super difficult to figure out in 3D space where to put you hand so that you get a cursor on your monitor, and once you have done that actually pointing at something and “clicking” it is super painful. I have to go so slow that it makes it worthless to use. I was hoping that they would give you the ability to calibrate the Leap to the position of your monitor and they in essence allow you to use your monitor as a touch screen … thus making it much more easy to accurately “click” on things and interact with the native OS. Similar to this Youtube video. Alas, they went for the 3D air clicking approach which just doesn’t work.

Granted this is a new device and hopefully it will continue to get better. I do hope that someone decides to create an app that lets you turn ordinary monitors into touch screens … maybe I’ll work on it. 

Desmond always amazes me as to how much he can grasp. Kids are such sponges and they can do way more that we think they can do. For example we let him go to a few websites that we have deemed safe for him to look at. I am amazed that he picks up how the games work without Melissa or I telling him how to do them. He has gotten really good at using the mouse.

Anyway, occasionally we would let him look at these sites and then later we would find that he minimized the browser and Quicken or something else that we didn’t want him messing with was up on the computer. So, I decided to make a web browser specifically tailored to his age so that he can only go to the sites that we say are ok and he cannot click out of them into anything else. Also, I didn’t want him to easily be able to minimize the browser or close it. Thus, KidBrowser was born.

I don’t claim that it is any great work of programming, and it could probably be more visually appealing, but I am no graphic designer. Anyway, if you have kids and you want to use it yourself feel free to grab a copy and set it up on your machine. I don’t claim that it will work perfectly on your machine. I have only tested it on my box, which is a Windows 7 machine. However, if you have issues let me know and I will try and fix it.

I have created a bitbucket project for this browser, so feel free to download the source and make fun of my coding abilities if you want to.  Links and screenshots are below.

Bitbucket Project
https://bitbucket.org/fredclown/kidbrowser/wiki/Home

Latest Compiled Version
http://bit.ly/sfdF4P

This is what the browser looks like. The left navigation is the web pages that we have deemed are ok for him to look at. You can add as many as you like.  If you add more than will appear in the column you will see scroll arrows appear so that you can scroll the nav.

This is the config module.  You can use this to add sites to the navigation menu. Currently, I suggest using the Gecko browser option as IE seems to have an issue with at least one site I that I know of, Disney Junior.  The configuration module isn’t pretty and I will probably work on it a bit more, but I wanted to get something made so that the browser could be easily configured. I think most everything is pretty self explanatory. There are a couple things that I will explain below.

Resolves To:
This is mainly used in conjunction with the “Allow Sub-links” checkbox. Sometimes if you put in a web address it will redirect you to another page. For instance if you put in http://www.disney.com it might redirect you to http://go.disney.com. If you have allow Sub-links checked and your “Site URL” is set to http://www.disney.com then you would be able to visit any links that start with http://www.disney.com, unless specifically blocked in the block section.  However, if the site automatically redirects the home page to something else such as http://go.disney.com then in order to get all of the pages under http://www.disney.com and the home page http://go.disney.com you would need two different entries. That is why implemented the “Resolves To” so that the browser will consider the redirected first page to be apart of the rest of the site.

Allow Sub-links:
This will allow any pages that start with the “Site URL” to be viewed.  Thus is the “Site URL” is http://www.disney.com, then http://www.disney.com/junior would be available as well.

Blocked Sites:
Blocked sites take precedent over the Allowed Sites.  By default everything is blocked except what is specifically allowed.  However, if you allow sub links for a certain site there may still be a couple undesirable pages. You can block these pages specifically. Additionally you can block sub pages or any pages that start with a certain URL. Thus, if http://www.disney.com/junior was allowed with sub-links, you could block the Winnie the Pooh video page by putting in http://www.disney.com/junior/winniethepooh/video for a blocked url. If you clicked “Block Sub-links” then anything under http://www.disney.com/junior/winniethepooh/video would also be blocked … such as http://www.disney.com/junior/winniethepooh/video/theblusteryday.