curvy-tabs - npm Package Compare versions

Comparing version 2.3.2 to 2.3.3

index.js

@@ -41,2 +41,4 @@ /* eslint-env browser */
 
+var RATIO;
+
 function CurvyTabs(container, selectedContentElement) {
@@ -69,8 +71,23 @@ injectStylesheet();
     var canvas = this.canvas = document.createElement('canvas');
+    var gc = this.gc = canvas.getContext('2d');
+
+    // get device pixel ratio
+    RATIO = (
+        window.devicePixelRatio || 1
+    ) / (
+        gc.webkitBackingStorePixelRatio ||
+        gc.mozBackingStorePixelRatio ||
+        gc.msBackingStorePixelRatio ||
+        gc.oBackingStorePixelRatio ||
+        gc.backingStorePixelRatio || 1
+    );
+
     container.appendChild(canvas);
-    canvas.width = containerRect.width;
-    this.size = CurvyTabs.size;
+
+    this.width = containerRect.width; // invoke setter to set canvas width and resolution
+    this.size = CurvyTabs.size; // invoke setter to set canvas height and resolution
+
     this.height = this.height; // invoke setter to calculate and set content height; invokes paint()
 
-    this.canvas.addEventListener('click', clickHandler.bind(this));
+    canvas.addEventListener('click', clickHandler.bind(this));
 }
@@ -134,16 +151,23 @@
     get width() {
-        return this.width;
+        return this._width;
     },
     set width(width) {
-        tabBar.container.style.width = width + 'px';
-        tabBar.canvas.width = tabBar.container.getBoundingClientRect().width;
-        tabBar.paint();
+        width = Math.floor(width);
+        this._width = width;
+        this.canvas.width = width * RATIO;
+        this.container.style.width = width + 'px';
+        this.gc.scale(RATIO, RATIO);
+        this.paint();
     },
 
     get size() {
-        return this.canvas.height;
+        return this._height;
     },
-    set size(size) {
-        this.canvas.height = size;
-        this.contents.style.top = size - 1 + 'px';
+    set size(height) {
+        height = Math.floor(height);
+        this._height = height;
+        this.canvas.height = height * RATIO;
+        this.canvas.style.height = height + 'px';
+        this.gc.scale(RATIO, RATIO);
+        this.contents.style.top = height - 1 + 'px';
         this.paint();
@@ -243,3 +267,2 @@ },
 
-        this.gc = this.canvas.getContext('2d');
         this.gc.textAlign = 'center';
@@ -408,4 +431,4 @@ this.gc.clearRect(0, 0, this.canvas.width, this.size);
 
-CurvyTabs.version = '2.3.2';
+CurvyTabs.version = '2.3.3';
 
 module.exports = CurvyTabs;

package.json

 {
   "name": "curvy-tabs",
-  "version": "2.3.2",
+  "version": "2.3.3",
   "description": "Tab bar with fancy tabs",
@@ -5,0 +5,0 @@ "main": "index.js",

README.md

@@ -45,3 +45,3 @@ See the [demo](https://joneit.github.io/curvy-tabs/2.1.1).
 
-Contains the version string `2.3.2` (major.minor.patch of current version, with no leading `v`).
+Contains the version string `2.3.1` (major.minor.patch of current version, with no leading `v`).
 
@@ -276,3 +276,6 @@ #### `CurvyTabs.prototype.getTab(idxOrNamOrEl)` method
 ## Version History
-See [version-history.md](version-history.md
+* `2.3.3`
+   * Fix `width` setter (was always throwing error)
+   * Set `<canvas>` element to device’s resolution for crisper imaginge (especially text) on high-DPI devices (like Apple Retina screen)
+   * Pull build script out of package.json, which failed on Windows (in GitBash), and put in new file build.sh
 * `2.3.2`
@@ -279,0 +282,0 @@ * Fix `catch` that was itself was throwing error (in `getTab` on unknown tab)

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

26127

increased by3.56%

Lines of code

360

increased by5.26%

Number of lines in readme file

307

increased by0.99%

Worsened metrics

Number of package files

4

decreased by-20%

No dependency changes