* You should have received a copy of the GNU Affero General Public License
*/
-function GuacamoleClient(display, tunnel) {
+// Guacamole namespace
+var Guacamole = Guacamole || {};
+
+Guacamole.Client = function(display, tunnel) {
var guac_client = this;
// Create buffer if necessary
if (buffer == null) {
- buffer = new Layer(0, 0);
+ buffer = new Guacamole.Layer(0, 0);
buffer.setAutosize(1);
buffers[index] = buffer;
}
if (layer == null) {
// Add new layer
- layer = new Layer(displayWidth, displayHeight);
+ layer = new Guacamole.Layer(displayWidth, displayHeight);
layers[index] = layer;
// (Re)-add existing layers in order
// If already present, remove
if (layers[i].parentNode === display)
- display.removeChild(layers[i]);
+ display.removeChild(layers[i].getCanvas());
// Add to end
- display.appendChild(layers[i]);
+ display.appendChild(layers[i].getCanvas());
}
}
// Add cursor layer last
if (cursor != null) {
if (cursor.parentNode === display)
- display.removeChild(cursor);
- display.appendChild(cursor);
+ display.removeChild(cursor.getCanvas());
+ display.appendChild(cursor.getCanvas());
}
}
var data = parameters[2];
if (cursor == null) {
- cursor = new Layer(displayWidth, displayHeight);
- display.appendChild(cursor);
+ cursor = new Guacamole.Layer(displayWidth, displayHeight);
+ display.appendChild(cursor.getCanvas());
}
// Start cursor image load
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
-function Layer(width, height) {
+// Guacamole namespace
+var Guacamole = Guacamole || {};
+
+/**
+ * Abstract ordered drawing surface. Each Layer contains a canvas element and
+ * provides simple drawing instructions for drawing to that canvas element,
+ * however unlike the canvas element itself, drawing operations on a Layer are
+ * guaranteed to run in order, even if such an operation must wait for an image
+ * to load before completing.
+ *
+ * @constructor
+ *
+ * @param {Number} width The width of the Layer, in pixels. The canvas element
+ * backing this Layer will be given this width.
+ *
+ * @param {Number} height The height of the Layer, in pixels. The canvas element
+ * backing this Layer will be given this height.
+ */
+Guacamole.Layer = function(width, height) {
+
+ var layer = this;
// Off-screen buffer
var display = document.createElement("canvas");
var displayContext = display.getContext("2d");
+ /**
+ * Returns the canvas element backing this Layer.
+ * @returns {Element} The canvas element backing this Layer.
+ */
+ this.getCanvas = function() {
+ return display;
+ };
+
function resize(newWidth, newHeight) {
display.style.position = "absolute";
display.style.left = "0px";
height = newHeight;
}
- display.resize = function(newWidth, newHeight) {
+ /**
+ * Changes the size of this Layer to the given width and height. Resizing
+ * is only attempted if the new size provided is actually different from
+ * the current size.
+ *
+ * @param {Number} newWidth The new width to assign to this Layer.
+ * @param {Number} newHeight The new height to assign to this Layer.
+ */
+ this.resize = function(newWidth, newHeight) {
if (newWidth != width || newHeight != height)
resize(newWidth, newHeight);
};
}
- display.setAutosize = function(flag) {
+ this.setAutosize = function(flag) {
autosize = flag;
};
function reserveJob(handler) {
// If no pending updates, just call (if available) and exit
- if (display.isReady() && handler != null) {
+ if (layer.isReady() && handler != null) {
handler();
return null;
}
}
- display.isReady = function() {
+ this.isReady = function() {
return updates.length == 0;
};
- display.drawImage = function(x, y, image) {
+ this.drawImage = function(x, y, image) {
reserveJob(function() {
if (autosize != 0) fitRect(x, y, image.width, image.height);
displayContext.drawImage(image, x, y);
};
- display.draw = function(x, y, url) {
+ this.draw = function(x, y, url) {
var update = reserveJob(null);
var image = new Image();
};
- // Run arbitrary function as soon as currently pending operations complete.
- // Future operations will not block this function from being called (unlike
- // the ready handler, which requires no pending updates)
- display.sync = function(handler) {
+ /**
+ * Run an arbitrary function as soon as currently pending operations
+ * are complete.
+ *
+ * @param {function} handler The function to call once all currently
+ * pending operations are complete.
+ */
+ this.sync = function(handler) {
reserveJob(handler);
};
- display.copyRect = function(srcLayer, srcx, srcy, w, h, x, y) {
+ this.copyRect = function(srcLayer, srcx, srcy, w, h, x, y) {
function doCopyRect() {
if (autosize != 0) fitRect(x, y, w, h);
// If we ARE the source layer, no need to sync.
// Syncing would result in deadlock.
- if (display === srcLayer)
+ if (layer === srcLayer)
reserveJob(doCopyRect);
// Otherwise synchronize copy operation with source layer
};
- display.clearRect = function(x, y, w, h) {
+ this.clearRect = function(x, y, w, h) {
reserveJob(function() {
if (autosize != 0) fitRect(x, y, w, h);
displayContext.clearRect(x, y, w, h);
});
};
- display.filter = function(filter) {
+ this.filter = function(filter) {
reserveJob(function() {
var imageData = displayContext.getImageData(0, 0, width, height);
filter(imageData.data, width, height);
0xF: "lighter"
};
- display.setChannelMask = function(mask) {
+ this.setChannelMask = function(mask) {
reserveJob(function() {
displayContext.globalCompositeOperation = compositeOperation[mask];
});
};
- return display;
-
}