From 950606235d26c7fbcb2552d791aee35acdec9a56 Mon Sep 17 00:00:00 2001 From: Kevin MacMartin Date: Mon, 14 May 2018 15:10:46 -0400 Subject: [PATCH] Parse vertical and horizontal alignment separately so one set function doesn't cause the other value to divide itself by 100 --- contain-element-module.js | 51 +++++++++++++++++++++------------------ contain-element.js | 47 +++++++++++++++++++----------------- contain-element.min.js | 2 +- 3 files changed, 53 insertions(+), 47 deletions(-) diff --git a/contain-element-module.js b/contain-element-module.js index bfee9d4..b9fa4ec 100644 --- a/contain-element-module.js +++ b/contain-element-module.js @@ -22,25 +22,7 @@ module.exports = function(options) { element.parentElement.style.position = "relative"; } - function parseAlignment() { - // Convert halign to decimal percent - switch (halign) { - case "left": - halign = 0; - break; - - case "center": - halign = 0.5; - break; - - case "right": - halign = 1; - break; - - default: - halign = Number(halign) / 100; - } - + function parseVerticalAlignment() { // Convert valign to decimal percent switch (valign) { case "top": @@ -60,6 +42,26 @@ module.exports = function(options) { } } + function parseHorizontalAlignment() { + // Convert halign to decimal percent + switch (halign) { + case "left": + halign = 0; + break; + + case "center": + halign = 0.5; + break; + + case "right": + halign = 1; + break; + + default: + halign = Number(halign) / 100; + } + } + function updateContain() { var parentWidth = element.parentElement.offsetWidth, parentHeight = element.parentElement.offsetHeight, @@ -117,7 +119,8 @@ module.exports = function(options) { } // Parse the valign and halign options - parseAlignment(); + parseVerticalAlignment(); + parseHorizontalAlignment(); // Run the function to scale and anchor the element updateContain(); @@ -127,24 +130,24 @@ module.exports = function(options) { // External function to set elementWidth this.setWidth = function(newWidth) { - elementWidth = newWidth; + elementWidth = Number(newWidth); }; // External function to set elementHeight this.setHeight = function(newHeight) { - elementHeight = newHeight; + elementHeight = Number(newHeight); }; // External function to set valign this.setValign = function(newValign) { valign = newValign; - parseAlignment(); + parseVerticalAlignment(); }; // External function to set halign this.setHalign = function(newHalign) { halign = newHalign; - parseAlignment(); + parseHorizontalAlignment(); }; // External function to set fit diff --git a/contain-element.js b/contain-element.js index db8c881..00b8be8 100644 --- a/contain-element.js +++ b/contain-element.js @@ -22,25 +22,7 @@ function ContainElement(options) { element.parentElement.style.position = "relative"; } - function parseAlignment() { - // Convert halign to decimal percent - switch (halign) { - case "left": - halign = 0; - break; - - case "center": - halign = 0.5; - break; - - case "right": - halign = 1; - break; - - default: - halign = Number(halign) / 100; - } - + function parseVerticalAlignment() { // Convert valign to decimal percent switch (valign) { case "top": @@ -60,6 +42,26 @@ function ContainElement(options) { } } + function parseHorizontalAlignment() { + // Convert halign to decimal percent + switch (halign) { + case "left": + halign = 0; + break; + + case "center": + halign = 0.5; + break; + + case "right": + halign = 1; + break; + + default: + halign = Number(halign) / 100; + } + } + function updateContain() { var parentWidth = element.parentElement.offsetWidth, parentHeight = element.parentElement.offsetHeight, @@ -117,7 +119,8 @@ function ContainElement(options) { } // Parse the valign and halign options - parseAlignment(); + parseVerticalAlignment(); + parseHorizontalAlignment(); // Run the function to scale and anchor the element updateContain(); @@ -138,13 +141,13 @@ function ContainElement(options) { // External function to set valign this.setValign = function(newValign) { valign = newValign; - parseAlignment(); + parseVerticalAlignment(); }; // External function to set halign this.setHalign = function(newHalign) { halign = newHalign; - parseAlignment(); + parseHorizontalAlignment(); }; // External function to set fit diff --git a/contain-element.min.js b/contain-element.min.js index 837aa81..1617297 100644 --- a/contain-element.min.js +++ b/contain-element.min.js @@ -1 +1 @@ -function ContainElement(t){var r=1,s=t.element||document.getElementById(t.id),o=Number(t.width)||s.offsetWidth,u=Number(t.height)||s.offsetHeight,a=t.valign||"center",l=t.halign||"center",c=t.fit||"cover",f=t.scale;function e(){switch(l){case"left":l=0;break;case"center":l=.5;break;case"right":l=1;break;default:l=Number(l)/100}switch(a){case"top":a=0;break;case"center":a=.5;break;case"bottom":a=1;break;default:a=Number(a)/100}}function h(){var t=s.parentElement.offsetWidth,e=s.parentElement.offsetHeight,n=0-(o*r-t),i=0-(u*r-e);t&&e?(r="cover"===c?e/u*o