spatio - npm Package Compare versions

Comparing version 1.0.0 to 1.1.0

index.js

@@ -1,46 +0,77 @@
-var converters = {
-  ew: function(value, context) {
-    var width = context.getBoundingClientRect().width;
-    return (Number(value) / 100) * width;
-  },
+;(function() {
 
-  eh: function(value, context) {
-    var height = context.getBoundingClientRect().height;
-    return (Number(value) / 100) * height;
+  var units = {
+    ew: function(context) {
+      var width = context.getBoundingClientRect().width;
+      return width / 100;
+    },
+
+    eh: function(context) {
+      var height = context.getBoundingClientRect().height;
+      return height / 100;
+    },
+
+    lh: function(context) {
+      var element = document.createElement('div');
+      element.innerHTML = 'spatio';
+
+      Object.assign(element.style, {
+        visibility: 'hidden',
+        position: 'fixed'
+      });
+
+      context.appendChild(element);
+      return spatio('100eh', 'px', element);
+    },
+
+    ls: function(context) {
+      return spatio(2.998e10 + 'cm', 'px');
+    }
+  };
+
+  function convert(expression, context) {
+    expression = Object.keys(units).reduce(
+      function(expression, key) {
+        return expression.replace(
+          new RegExp('([0-9]*(?:\\.[0-9]*)?)' + key, 'g'),
+          function(match, value) { return units[key](context) * Number(value) + 'px'; }
+        )
+      }
+    , expression);
+
+    var element = document.createElement('div');
+
+    Object.assign(element.style, {
+      width: expression,
+      height: '1px',
+      visibility: 'hidden',
+      position: 'fixed'
+    });
+
+    context.appendChild(element);
+    var elementRect = element.getBoundingClientRect()
+    element.remove();
+    return elementRect.width / elementRect.height;
   }
-};
 
-function convert(expression, context) {
-  return Object.keys(converters).reduce(
-    function(expression, key) {
-      return expression.replace(
-        new RegExp('([0-9]*(?:\\.[0-9]*)?)' + key, 'g'),
-        function(match, value) { return converters[key](Number(value), context) + 'px'; }
-      )
-    }, expression);
-}
 
-function measure(expression, unit, context) {
-  if (!unit) unit = 'px';
-  if (!context) context = document.body;
+  function spatio(expression, unit, context) {
+    unit = unit || 'px';
+    context = context || document.body;
 
-  var element = document.createElement('div')
+    var from = convert(expression, context);
+    var to = convert('1' + unit, context);
 
-  Object.assign(element.style, {
-    width: convert(expression, context),
-    height: 1 + unit,
-    visibility: 'hidden',
-    position: 'fixed'
-  });
+    return from / to;
+  }
 
-  context.appendChild(element);
-  var elementRect = element.getBoundingClientRect()
-  element.remove();
-  return elementRect.width / elementRect.height;
-}
+  spatio.addUnits = function(newUnits) {
+    units = Object.assign({}, units, newUnits);
+  };
 
-if (typeof module !== 'undefined') {
-  module.exports = measure;
-} else {
-  self.spatio = measure;
-}
+  if (typeof module !== 'undefined') {
+    module.exports = spatio;
+  } else {
+    self.spatio = spatio;
+  }
+})();

package.json

 {
   "name": "spatio",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "description": "Measure space",
@@ -5,0 +5,0 @@ "main": "index.js",

README.md

 # spatio
-Measure space
+Measure space!
+
+
+## Usage
+
+```javascript
+// Measure 1em in pixels
+spatio('10pt', 'px');  // i.e. 13.328125
+
+// Calcucate at will!
+spatio('calc(100vh - 5pt)'); // i.e. 957.328125, defaults to pixels
+
+// Pass context element for relative space
+var el = document.createElement('div');
+el.style.fontSize = '24px';
+document.body.appendChild(el);
+
+spatio('1em', 'px', el); // 24
+```
+
+
+### Additional units
+
+```javascript
+// Line height
+spatio('1lh');
+
+// Element width and height
+spatio('100ew', document.body); // 1920
+spatio('100eh', document.body); // 940
+
+// Light seconds
+spatio('0.00001ls', 'px') // 335.53125
+
+// Add custom units
+
+// A meter beer is defined as 13 beers, so 1 beer is 100cm / 13
+spatio.addUnits({
+  beer: spatio('calc(100cm / 13)')
+});
+
+spatio('1beer', 'cm') // 7.694789081885856
+```

No alert changes

Improved metrics

Total package byte prevSize

6193

29.26%

Lines of code

61

56.41%

Number of lines in readme file

45

1400%

No dependency changes