diff --git a/js/controller/AnimatedPreviewController.js b/js/controller/AnimatedPreviewController.js
index c61e789a..4fec557a 100644
--- a/js/controller/AnimatedPreviewController.js
+++ b/js/controller/AnimatedPreviewController.js
@@ -1,6 +1,6 @@
(function () {
var ns = $.namespace("pskl.controller");
- ns.AnimatedPreviewController = function (piskelController, container, dpi) {
+ ns.AnimatedPreviewController = function (piskelController, container) {
this.piskelController = piskelController;
this.container = container;
@@ -56,7 +56,7 @@
};
/**
- * Calculate the preview DPI depending on the framesheet size
+ * Calculate the preview zoom depending on the framesheet size
*/
ns.AnimatedPreviewController.prototype.calculateZoom_ = function () {
var frame = this.piskelController.getCurrentFrame();
diff --git a/js/controller/PreviewFilmController.js b/js/controller/PreviewFilmController.js
index 64aa1925..a7bd781c 100644
--- a/js/controller/PreviewFilmController.js
+++ b/js/controller/PreviewFilmController.js
@@ -208,7 +208,7 @@
};
/**
- * Calculate the preview DPI depending on the piskel size
+ * Calculate the preview zoom depending on the piskel size
*/
ns.PreviewFilmController.prototype.calculateZoom_ = function () {
var curFrame = this.piskelController.getCurrentFrame(),
@@ -219,6 +219,6 @@
var previewHeight = Constants.PREVIEW_FILM_SIZE * frameHeight / maxFrameDim;
var previewWidth = Constants.PREVIEW_FILM_SIZE * frameWidth / maxFrameDim;
- return pskl.PixelUtils.calculateDPI(previewHeight, previewWidth, frameHeight, frameWidth) || 1;
+ return pskl.PixelUtils.calculateZoom(previewHeight, previewWidth, frameHeight, frameWidth) || 1;
};
})();
\ No newline at end of file
diff --git a/js/controller/settings/GifExportController.js b/js/controller/settings/GifExportController.js
index 42e57d3d..636272f4 100644
--- a/js/controller/settings/GifExportController.js
+++ b/js/controller/settings/GifExportController.js
@@ -8,18 +8,18 @@
/**
* List of Resolutions applicable for Gif export
* @static
- * @type {Array} array of Objects {dpi:{Number}, default:{Boolean}}
+ * @type {Array} array of Objects {zoom:{Number}, default:{Boolean}}
*/
ns.GifExportController.RESOLUTIONS = [
{
- 'dpi' : 1
+ 'zoom' : 1
},{
- 'dpi' : 5
+ 'zoom' : 5
},{
- 'dpi' : 10,
+ 'zoom' : 10,
'default' : true
},{
- 'dpi' : 20
+ 'zoom' : 20
}
];
@@ -37,11 +37,11 @@
ns.GifExportController.prototype.onUploadFormSubmit_ = function (evt) {
evt.originalEvent.preventDefault();
- var selectedDpi = this.getSelectedDpi_(),
+ var selectedZoom = this.getSelectedZoom_(),
fps = this.piskelController.getFPS(),
- dpi = selectedDpi;
+ zoom = selectedZoom;
- this.renderAsImageDataAnimatedGIF(dpi, fps, this.onGifRenderingCompleted_.bind(this));
+ this.renderAsImageDataAnimatedGIF(zoom, fps, this.onGifRenderingCompleted_.bind(this));
};
ns.GifExportController.prototype.onGifRenderingCompleted_ = function (imageData) {
@@ -59,15 +59,15 @@
this.previewContainerEl.innerHTML = "
![]("+src+")
";
};
- ns.GifExportController.prototype.getSelectedDpi_ = function () {
- var radiosColl = this.uploadForm.get(0).querySelectorAll("[name=gif-dpi]"),
+ ns.GifExportController.prototype.getSelectedZoom_ = function () {
+ var radiosColl = this.uploadForm.get(0).querySelectorAll("[name=gif-zoom-level]"),
radios = Array.prototype.slice.call(radiosColl,0);
var selectedRadios = radios.filter(function(radio) {return !!radio.checked;});
if (selectedRadios.length == 1) {
return selectedRadios[0].value;
} else {
- throw "Unexpected error when retrieving selected dpi";
+ throw "Unexpected error when retrieving selected zoom";
}
};
@@ -80,9 +80,9 @@
};
ns.GifExportController.prototype.createRadioForResolution_ = function (resolution) {
- var dpi = resolution.dpi;
- var label = dpi*this.piskelController.getWidth() + "x" + dpi*this.piskelController.getHeight();
- var value = dpi;
+ var zoom = resolution.zoom;
+ var label = zoom*this.piskelController.getWidth() + "x" + zoom*this.piskelController.getHeight();
+ var value = zoom;
var radioHTML = pskl.utils.Template.replace(this.radioTemplate_, {value : value, label : label});
var radioEl = pskl.utils.Template.createFromHTML(radioHTML);
@@ -104,17 +104,17 @@
reader.readAsDataURL(blob);
};
- ns.GifExportController.prototype.renderAsImageDataAnimatedGIF = function(dpi, fps, cb) {
+ ns.GifExportController.prototype.renderAsImageDataAnimatedGIF = function(zoom, fps, cb) {
var gif = new window.GIF({
workers: 2,
quality: 10,
- width: this.piskelController.getWidth()*dpi,
- height: this.piskelController.getHeight()*dpi
+ width: this.piskelController.getWidth()*zoom,
+ height: this.piskelController.getHeight()*zoom
});
for (var i = 0; i < this.piskelController.getFrameCount(); i++) {
var frame = this.piskelController.getFrameAt(i);
- var renderer = new pskl.rendering.CanvasRenderer(frame, dpi);
+ var renderer = new pskl.rendering.CanvasRenderer(frame, zoom);
gif.addFrame(renderer.render(), {
delay: 1000 / fps
});
diff --git a/js/rendering/CanvasRenderer.js b/js/rendering/CanvasRenderer.js
index 2153f207..76414535 100644
--- a/js/rendering/CanvasRenderer.js
+++ b/js/rendering/CanvasRenderer.js
@@ -1,9 +1,9 @@
(function () {
var ns = $.namespace("pskl.rendering");
- ns.CanvasRenderer = function (frame, dpi) {
+ ns.CanvasRenderer = function (frame, zoom) {
this.frame = frame;
- this.dpi = dpi;
+ this.zoom = zoom;
this.transparentColor_ = 'white';
};
@@ -36,12 +36,12 @@
}
context.fillStyle = color;
- context.fillRect(col * this.dpi, row * this.dpi, this.dpi, this.dpi);
+ context.fillRect(col * this.zoom, row * this.zoom, this.zoom, this.zoom);
};
ns.CanvasRenderer.prototype.createCanvas_ = function () {
- var width = this.frame.getWidth() * this.dpi;
- var height = this.frame.getHeight() * this.dpi;
+ var width = this.frame.getWidth() * this.zoom;
+ var height = this.frame.getHeight() * this.zoom;
return pskl.CanvasUtils.createCanvas(width, height);
};
})();
\ No newline at end of file
diff --git a/js/utils/PixelUtils.js b/js/utils/PixelUtils.js
index c0c6973f..767e8b74 100644
--- a/js/utils/PixelUtils.js
+++ b/js/utils/PixelUtils.js
@@ -147,31 +147,31 @@
},
/**
- * Calculate and return the maximal DPI to display a picture in a given container.
+ * Calculate and return the maximal zoom level to display a picture in a given container.
*
* @param container jQueryObject Container where the picture should be displayed
* @param number pictureHeight height in pixels of the picture to display
* @param number pictureWidth width in pixels of the picture to display
- * @return number maximal dpi
+ * @return number maximal zoom
*/
- calculateDPIForContainer : function (container, pictureHeight, pictureWidth) {
- return this.calculateDPI(container.height(), container.width(), pictureHeight, pictureWidth);
+ calculateZoomForContainer : function (container, pictureHeight, pictureWidth) {
+ return this.calculateZoom(container.height(), container.width(), pictureHeight, pictureWidth);
},
/**
- * Calculate and return the maximal DPI to display a picture for a given height and width.
+ * Calculate and return the maximal zoom to display a picture for a given height and width.
*
* @param height number Height available to display the picture
* @param width number Width available to display the picture
* @param number pictureHeight height in pixels of the picture to display
* @param number pictureWidth width in pixels of the picture to display
- * @return number maximal dpi
+ * @return number maximal zoom
*/
- calculateDPI : function (height, width, pictureHeight, pictureWidth) {
- var heightBoundDpi = Math.floor(height / pictureHeight),
- widthBoundDpi = Math.floor(width / pictureWidth);
+ calculateZoom : function (height, width, pictureHeight, pictureWidth) {
+ var heightRatio = Math.floor(height / pictureHeight),
+ widthRatio = Math.floor(width / pictureWidth);
- return Math.min(heightBoundDpi, widthBoundDpi);
+ return Math.min(heightRatio, widthRatio);
}
};
})();
\ No newline at end of file
diff --git a/templates/settings/export-gif.html b/templates/settings/export-gif.html
index 95e1587d..516f237a 100644
--- a/templates/settings/export-gif.html
+++ b/templates/settings/export-gif.html
@@ -6,7 +6,7 @@