Clean up syntax, upgrade gulp-uglify and rebuild the minified version

This commit is contained in:
Kevin MacMartin 2016-06-20 16:53:45 -04:00
parent 5cae38513c
commit a10f958daf
8 changed files with 64 additions and 47 deletions

14
.editorconfig Normal file
View file

@ -0,0 +1,14 @@
root = true
# All
[*]
charset = utf-8
end_of_line = lf
indent_size = 4
indent_style = space
insert_final_newline = true
trim_trailing_whitespace = true
# JSON
[*.json]
indent_size = 2

2
.gitignore vendored
View file

@ -1,4 +1,2 @@
.DS_Store .DS_Store
# Folders
node_modules node_modules

View file

@ -19,4 +19,3 @@ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE. SOFTWARE.

View file

@ -59,4 +59,3 @@ Written by [Williams New York](http://williamsnewyork.com)
## LICENSE ## LICENSE
Licensed under the [MIT license](http://opensource.org/licenses/MIT). Licensed under the [MIT license](http://opensource.org/licenses/MIT).

View file

@ -3,67 +3,75 @@ function ContainElement(options) {
element = document.getElementById(options.id), element = document.getElementById(options.id),
elementWidth = options.width || element.offsetWidth, elementWidth = options.width || element.offsetWidth,
elementHeight = options.height || element.offsetHeight, elementHeight = options.height || element.offsetHeight,
valign = options.valign || 'center', valign = options.valign || "center",
halign = options.halign || 'center'; halign = options.halign || "center";
// Apply required attributes to the element and its parents // Apply required attributes to the element
element.style.position = 'absolute'; element.style.position = "absolute";
element.parentElement.style.overflow = 'hidden'; element.parentElement.style.overflow = "hidden";
if (['relative', 'absolute', 'fixed'].indexOf(window.getComputedStyle(element.parentElement, null).getPropertyValue('position')) === -1)
element.parentElement.style.position = 'relative'; // Apply relative position to the parent if it doesn't already have relative, absolute or fixed positioning
if ([ "relative", "absolute", "fixed" ].indexOf(window.getComputedStyle(element.parentElement, null).getPropertyValue("position")) === -1) {
element.parentElement.style.position = "relative";
}
function updateContain() { function updateContain() {
var parentWidth = element.parentElement.offsetWidth, var parentWidth = element.parentElement.offsetWidth,
parentHeight = element.parentElement.offsetHeight; parentHeight = element.parentElement.offsetHeight;
// Run the scale/position functionality if able to determine the parent element's width and height // Run the scale/position functionality if able to determine the parent element's width and height
if ((parentWidth) && (parentHeight)) { if (parentWidth && parentHeight) {
// Calculate the scale factor // Calculate the scale factor
if (parentWidth > ((parentHeight / (elementHeight * scaleFactor)) * (elementWidth * scaleFactor))) if (parentWidth > parentHeight / (elementHeight * scaleFactor) * (elementWidth * scaleFactor)) {
scaleFactor = (parentWidth / elementWidth); scaleFactor = parentWidth / elementWidth;
else } else {
scaleFactor = (parentHeight / elementHeight); scaleFactor = parentHeight / elementHeight;
}
// Scale the element using the scale factor // Scale the element using the scale factor
element.style.width = (elementWidth * scaleFactor) + 'px'; element.style.width = elementWidth * scaleFactor + "px";
element.style.height = (elementHeight * scaleFactor) + 'px'; element.style.height = elementHeight * scaleFactor + "px";
// Anchor the element horizontally to the left/center/right // Anchor the element horizontally to the left/center/right
if (parentWidth < (elementWidth * scaleFactor)) { if (parentWidth < elementWidth * scaleFactor) {
switch (halign) { switch (halign) {
case 'left': case "left":
// Anchor horizontally to the left of the parent element // Anchor horizontally to the left of the parent element
element.style.left = 0 + 'px'; element.style.left = "0px";
break; break;
case 'right':
case "right":
// Anchor horizontally to the right of the parent element // Anchor horizontally to the right of the parent element
element.style.left = (0 - ((elementWidth * scaleFactor) - parentWidth)) + 'px'; element.style.left = 0 - (elementWidth * scaleFactor - parentWidth) + "px";
break; break;
default: default:
// Anchor horizontally to the center of the parent element // Anchor horizontally to the center of the parent element
element.style.left = (0 - (((elementWidth * scaleFactor) - parentWidth) / 2)) + 'px'; element.style.left = 0 - (elementWidth * scaleFactor - parentWidth) / 2 + "px";
} }
} else { } else {
element.style.left = 0 + 'px'; element.style.left = "0px";
} }
// Anchor the element vertically to the top/center/bottom // Anchor the element vertically to the top/center/bottom
if ((elementHeight * scaleFactor) > parentHeight) { if (elementHeight * scaleFactor > parentHeight) {
switch (valign) { switch (valign) {
case 'top': case "top":
// Anchor vertically to the top of the parent element // Anchor vertically to the top of the parent element
element.style.top = 0 + 'px'; element.style.top = "0px";
break; break;
case 'bottom':
case "bottom":
// Anchor veritcally to the bottom of the parent element // Anchor veritcally to the bottom of the parent element
element.style.top = (0 - ((elementHeight * scaleFactor) - parentHeight)) + 'px'; element.style.top = 0 - (elementHeight * scaleFactor - parentHeight) + "px";
break; break;
default: default:
// Anchor vertically to the center of the parent element // Anchor vertically to the center of the parent element
element.style.top = (0 - (((elementHeight * scaleFactor) - parentHeight) / 2)) + 'px'; element.style.top = 0 - (elementHeight * scaleFactor - parentHeight) / 2 + "px";
} }
} else { } else {
element.style.top = 0 + 'px'; element.style.top = "0px";
} }
} else { } else {
// Try again in 30ms if the document didn't load enough to determine the parent element's width and height yet // Try again in 30ms if the document didn't load enough to determine the parent element's width and height yet
@ -104,4 +112,3 @@ function ContainElement(options) {
// External function to return the current scale factor // External function to return the current scale factor
this.getScale = function() { return scaleFactor; }; this.getScale = function() { return scaleFactor; };
} }

View file

@ -1 +1 @@
function ContainElement(t){function e(){var t=n.parentElement.offsetWidth,a=n.parentElement.offsetHeight;if(t&&a){if(i=t>a/(s*i)*l*i?t/l:a/s,n.style.width=l*i+"px",n.style.height=s*i+"px",l*i>t)switch(f){case"left":n.style.left="0px";break;case"right":n.style.left=0-(l*i-t)+"px";break;default:n.style.left=0-(l*i-t)/2+"px"}else n.style.left="0px";if(s*i>a)switch(o){case"top":n.style.top="0px";break;case"bottom":n.style.top=0-(s*i-a)+"px";break;default:n.style.top=0-(s*i-a)/2+"px"}else n.style.top="0px"}else window.setTimeout(e,30)}var i=1,n=document.getElementById(t.id),l=t.width||n.offsetWidth,s=t.height||n.offsetHeight,o=t.valign||"center",f=t.halign||"center";n.style.position="absolute",n.parentElement.style.overflow="hidden",-1===["relative","absolute","fixed"].indexOf(window.getComputedStyle(n.parentElement,null).getPropertyValue("position"))&&(n.parentElement.style.position="relative"),e(),this.update=e,this.setWidth=function(t){l=t},this.setHeight=function(t){s=t},this.setValign=function(t){o=t},this.setHalign=function(t){f=t},this.getWidth=function(){return l},this.getHeight=function(){return s},this.getValign=function(){return o},this.getHalign=function(){return f},this.getScale=function(){return i}} function ContainElement(t){function e(){var t=n.parentElement.offsetWidth,a=n.parentElement.offsetHeight;if(t&&a){if(i=t>a/(s*i)*(l*i)?t/l:a/s,n.style.width=l*i+"px",n.style.height=s*i+"px",l*i>t)switch(f){case"left":n.style.left="0px";break;case"right":n.style.left=0-(l*i-t)+"px";break;default:n.style.left=0-(l*i-t)/2+"px"}else n.style.left="0px";if(s*i>a)switch(o){case"top":n.style.top="0px";break;case"bottom":n.style.top=0-(s*i-a)+"px";break;default:n.style.top=0-(s*i-a)/2+"px"}else n.style.top="0px"}else window.setTimeout(e,30)}var i=1,n=document.getElementById(t.id),l=t.width||n.offsetWidth,s=t.height||n.offsetHeight,o=t.valign||"center",f=t.halign||"center";n.style.position="absolute",n.parentElement.style.overflow="hidden",-1===["relative","absolute","fixed"].indexOf(window.getComputedStyle(n.parentElement,null).getPropertyValue("position"))&&(n.parentElement.style.position="relative"),e(),this.update=e,this.setWidth=function(t){l=t},this.setHeight=function(t){s=t},this.setValign=function(t){o=t},this.setHalign=function(t){f=t},this.getWidth=function(){return l},this.getHeight=function(){return s},this.getValign=function(){return o},this.getHalign=function(){return f},this.getScale=function(){return i}}

View file

@ -1,12 +1,12 @@
var gulp = require('gulp'); const gulp = require("gulp"),
var ugly = require('gulp-uglify'); ugly = require("gulp-uglify"),
var concat = require('gulp-concat'); concat = require("gulp-concat");
gulp.task('min', function() { gulp.task("min", function() {
return gulp.src('contain-element.js') return gulp.src("contain-element.js")
.pipe(ugly()) .pipe(ugly())
.pipe(concat('contain-element.min.js')) .pipe(concat("contain-element.min.js"))
.pipe(gulp.dest('./')); .pipe(gulp.dest("./"));
}); });
gulp.task('default', ['min']); gulp.task("default", [ "min" ]);

View file

@ -1,7 +1,7 @@
{ {
"devDependencies": { "devDependencies": {
"gulp": "^3.9.0", "gulp": "^3.9.1",
"gulp-concat": "^2.6.0", "gulp-concat": "^2.6.0",
"gulp-uglify": "^1.2.0" "gulp-uglify": "^1.5.3"
} }
} }