mirror of
https://github.com/janishutz/color-thief.git
synced 2025-11-25 13:54:25 +00:00
Fixed inital image upload bug and image centering issues
This commit is contained in:
27
index.js
27
index.js
@@ -92,10 +92,14 @@ $(document).ready(function () {
|
||||
$('#draggedImages').prepend( html );
|
||||
|
||||
var img = $('.droppedImage .targetImage').get(0);
|
||||
displayColors( img );
|
||||
util.centerImg( img, 400, 300);
|
||||
|
||||
$('.droppedImage').slideDown();
|
||||
// Must wait for image to load in DOM, not just load from FileReader
|
||||
$(img).on('load', function() {
|
||||
displayColors( img );
|
||||
util.centerImg( img, 400, 300);
|
||||
|
||||
$('.droppedImage').slideDown();
|
||||
});
|
||||
};
|
||||
reader.readAsDataURL(file);
|
||||
} else {
|
||||
@@ -121,16 +125,25 @@ $(document).ready(function () {
|
||||
var util = {
|
||||
centerImg: function( img, containerWidth, containerHeight) {
|
||||
var $img = $(img);
|
||||
var imgHeight = $img.get(0).height;
|
||||
var imgWidth = $img.get(0).width;
|
||||
var imgHeight = $img.get(0).height;
|
||||
var imgAspectRatio = imgHeight/imgWidth;
|
||||
|
||||
if ( imgHeight < containerHeight ) {
|
||||
var vOffset = ( containerHeight - imgHeight )/2;
|
||||
$img.css('margin-top', ( hOffset + "px" ));
|
||||
if ( imgHeight > containerHeight ) {
|
||||
imgWidth = containerHeight / imgAspectRatio;
|
||||
$img.css('width', ( imgWidth + "px" ));
|
||||
}
|
||||
if ( imgWidth > containerWidth ) {
|
||||
$img.css('width', ( containerWidth + "px" ));
|
||||
imgHeight = imgAspectRatio * containerWidth;
|
||||
}
|
||||
if ( imgWidth < containerWidth ) {
|
||||
var hOffset = ( containerWidth - imgWidth )/2;
|
||||
$img.css('margin-left', ( hOffset + "px" ));
|
||||
}
|
||||
if ( imgHeight < containerHeight ) {
|
||||
var vOffset = ( containerHeight - imgHeight )/2;
|
||||
$img.css('margin-top', ( vOffset + "px" ));
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user