wbrawner/piskel
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

renamed all references to dpi to zoom for consistency (also wtf dpi anyway !)

Browse source
This commit is contained in:
jdescottes 2013-11-05 22:11:47 +01:00
parent bd030fdf1f
commit c8a8d470a7
6 changed files with 38 additions and 38 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
js/controller/AnimatedPreviewController.js
View file

@ -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();

4
js/controller/PreviewFilmController.js
View file

@ -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;
};
})();

36
js/controller/settings/GifExportController.js
View file

@ -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 = "<div><img style='max-width:240px;' src='"+src+"'/></div>";
};
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
});

10
js/rendering/CanvasRenderer.js
View file

@ -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);
};
})();

20
js/utils/PixelUtils.js
View file

@ -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);
}
};
})();

2
templates/settings/export-gif.html
View file

@ -6,7 +6,7 @@
<label>Select resolution:</label>
<form action="" method="POST" name="gif-export-upload-form">
<script type="text/template" id="gif-export-radio-template">
<label style="display:block"><input type="radio" name="gif-dpi" value="{{value}}"/>
<label style="display:block"><input type="radio" name="gif-zoom-level" value="{{value}}"/>
{{label}}</label>
</script>
<div class="gif-export-radio-group"></div>