Jamie Balfour BSc

Welcome to my personal website!

Technology enthusiast

I am very interested in technology, particularly relating to computer science. I am most interested in web design and development.

My main hobby is programming. One of my most well known products from this is ZPE. I also am the sole creator of BalfBlog, BalfBar and BalfSlider.

A little bit about me

In 1997, when I was six years of age, I got my very first computer. I was always very interested in the ins and outs of it and dismantled it to see how it worked.

Years later, in 2016 I received my BSc (with honours) in Computer Science, obtaining a First class degree.

I'd like to welcome you to my website and hope you enjoy using it as much as I have enjoyed building it!

Google Plus
Ghost
Me
Jamie Balfour BSc
Full stack developer

Personal Blog

Today I released five new transitions for BalfSlider. They are:

  • Fall
  • Top-to-bottom
  • Bottom-to-top
  • Stretch-top-to-bottom
  • Stretch-bottom-to-top

They are available in the latest version of BalfSliderĀ or as plugins for older versions.

I'm particularly happy with the fall transition - this is the first transition to rely on CSS for transitions too.

I have been working quite a lot recently on my latest project, ClickIt. ClickIt is a web development tool using the new HTML5 drag and drop standards. It has been working fine with all browsers until very recently I discovered it had an issue with both Mozilla Firefox and Microsoft Edge. I have in the past stated my dislike for Firefox after it made my life much harder in one of my courseworks last semester and now my anger continues.

Chrome, Safari and Opera cover a reasonably large base of users but for full compatibability, I'm going out of my way to try and fix an issue which I don't even know what it is. The original problem occured when I used the W3 standard for drag and drop and did this:

JavaScript
function DragBlock(ev, mode) {
	setData(ev, "mode", mode);
	setData(ev, "text", ev.target.innerText);
	setData(ev, "style", ev.target.getAttribute("class"));
}
function setData(ev, x, v){
	ev.originalEvent.dataTransfer.setData(x, v);
}

The problem however is that when I then try to retrieve this information, none of it exists. It does in Chrome and Safari, but not in Firefox or Edge. If I find a solution I will post it here.

My good friend Merlin managed to discover the problem with my implementation, and it's hardly obvious nor expected! The problem actually occurs with the ev.target.innerText function. This function is not supported in Edge or Firefox, but is in Chrome and Safari. So there you have it. My problem is fixed.
Another update on the situation: I fixed the issue altogether after I learned that the first parameter to the setData function is actually not the name of the value but the type. For some reason, Chrome and Safari accept this as the name anyway and transform this to a map from the name to the value (or in this case x -> v). Instead of messing about with this, my solution, which is somewhat crude, is to use a global variable which in turn is a map from x -> v. Since I put these in functions, my functions were simply changed to modify this global variable upon request and retrieve information back from it. This solution is as I say crude since it relies on the fact there is only one object being transferred. I am most puzzled by the fact that the issue is totally different with Safari and Chrome and that they work this as if it were a map.

Site accessibility

A lot of the original functionalities that once existed here have been removed.

This page was generated in 0.25 seconds using 2097152 bytes. Slow? Let me know.

To use project mode, the window must be greater than 920 pixels in width.
Click here to disable Project Mode.
This site uses cookies to deliver its services, to personalise ads, to store preferences and to analyse traffic. Information about your use of this site is shared with other companies. By using this site, you agree to its use of cookies.
Contact me
Contact Jamie Balfour

Get in touch with me via this form.