Monatsarchiv für May 2012

ztxt code editor

Over a year ago I created a code editor called ztxt for use in my classes. After a semester of use, I decided to start using ztxt as my main editor. It’s still in beta, but it works really nicely. Here is a short video showing how to get started with it:

To showcase ztxt a little more, I recorded this video showing how to make a localStorage based note program:

23. May 2012 | html, html5, javascript, jquery | Comments (9)

How many ways can I make a point?

 
// how many ways can I make a point?
 
// 1)
function Point(x, y, z) {
  this.x = x;
  this.y = y;
  this.z = z;
}
Point.prototype.offset = function(tx, ty, tz) {
  this.x += tx;
  this.y += ty;
  this.z += tz;
};
Point.prototype.add = function(point) {
  this.offset(point.x, point.y, point.z);
};
Point.prototype.subtract = function(point) {
  this.x -= point.x;
  this.y -= point.y;
  this.z -= point.z;
};
Point.prototype.clone = function() {
  return new Point(this.x, this.y, this.z);
};
 
var one = new Point(10, 10, 10);
 
// 2)
function Point(x, y, z) {
  this.x = x;
  this.y = y;
  this.z = z;
}
Point.prototype = {
  constructor: Point,
  offset: function(tx, ty, tz) {
    this.x += tx;
    this.y += ty;
    this.z += tz;
  },
  add: function(point) {
    this.offset(point.x, point.y, point.z);
  },
  subtract: function(point) {
    this.x -= point.x;
    this.y -= point.y;
    this.z -= point.z;
  },
  clone: function() {
    return new Point(this.x, this.y, this.z);
  }
};
 
var two = new Point(10, 10, 10);
 
// 3)
function Point(x, y, z) {
  this.x = x;
  this.y = y;
  this.z = z;
  this.offset = function(tx, ty, tz) {
    this.x += tx;
    this.y += ty;
    this.z += tz;
  };
  this.add = function(point) {
    this.offset(point.x, point.y, point.z);
  };
  this.subtract = function(point) {
    this.x -= point.x;
    this.y -= point.y;
    this.z -= point.z;
  };
  this.clone = function() {
    return new Point(this.x, this.y, this.z);
  };
}
 
var three = new Point(10, 10, 10);
 
// 4)
function Point(x, y, z) {
  var self = {
    x: x,
    y: y,
    z: z,
    offset: function(tx, ty, tz) {
      self.x += tx;
      self.y += ty;
      self.z += tz;
    },
    add: function(point) {
      self.offset(point.x, point.y, point.z);
    },
    subtract: function(point) {
      self.x -= point.x;
      self.y -= point.y;
      self.z -= point.z;
    },
    clone: function() {
      return Point(self.x, self.y, self.z);
    }
  };
  return self;
};
 
var four = Point(10, 10, 10); // note no new keyword
 
// 5) this is one way to use Object.create() (lots of other ways)
var Point = {
  x: 0,
  y: 0,
  z: 0,
  init: function(x, y, z) {
    this.x = x;
    this.y = y;
    this.z = z;
    return this;
  },
  offset: function(tx, ty, tz) {
    this.x += tx;
    this.y += ty;
    this.z += tz;
  },
  add: function(point) {
    this.offset(point.x, point.y, point.z);
  },
  subtract: function(point) {
    this.x -= point.x;
    this.y -= point.y;
    this.z -= point.z;
  },
  clone: function() {
    return Object.create(Point).init(this.x, this.y, this.z);
  }
};
 
var five = Object.create(Point).init(10, 10, 10);
 
// There are a bunch more ways, especially when you introduce javascript libraries.