Skip to content

Commit

Permalink
Merge branch 'hotfix/1.0.3'
Browse files Browse the repository at this point in the history
  • Loading branch information
jondavidjohn committed Mar 14, 2014
2 parents 1f2e9f0 + faa5b20 commit 2dd8ef0
Show file tree
Hide file tree
Showing 6 changed files with 194 additions and 2 deletions.
4 changes: 4 additions & 0 deletions CHANGELOG
Original file line number Diff line number Diff line change
@@ -1,3 +1,7 @@
= 1.0.3
* Add bower support
* Add built distribution files to the repository

= 1.0.2
* Fix bug with font scaling with multiple text calls (Issue #4)
* Add a few tests
Expand Down
24 changes: 24 additions & 0 deletions bower.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
{
"name": "hidpi-canvas",
"version": "1.0.3",
"homepage": "https://github.com/jondavidjohn/hidpi-canvas-polyfill",
"authors": [
"Jonathan Johnson <jon@crowdfavorite.com>"
],
"description": "A JavaScript drop-in module to polyfill consistent and automatic HiDPI Canvas support.",
"keywords": [
"canvas",
"retina",
"hidpi",
"polyfill"
],
"license": "Apache 2.0",
"ignore": [
"**/.*",
"node_modules",
"bower_components",
"src",
"test",
"tests"
]
}
3 changes: 2 additions & 1 deletion dist/.gitignore
Original file line number Diff line number Diff line change
@@ -1 +1,2 @@
[^.]*
*.zip
*.gz
154 changes: 154 additions & 0 deletions dist/hidpi-canvas.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,154 @@
/**
* HiDPI Canvas Polyfill (1.0.3)
*
* Author: Jonathan D. Johnson (http://jondavidjohn.com)
* Homepage: https://github.com/jondavidjohn/hidpi-canvas-polyfill
* Issue Tracker: https://github.com/jondavidjohn/hidpi-canvas-polyfill/issues
* License: Apache 2.0
*/
(function(prototype) {

var func, value,

getPixelRatio = function(context) {
var backingStore = context.backingStorePixelRatio ||
context.webkitBackingStorePixelRatio ||
context.mozBackingStorePixelRatio ||
context.msBackingStorePixelRatio ||
context.oBackingStorePixelRatio ||
context.backingStorePixelRatio || 1;

return (window.devicePixelRatio || 1) / backingStore;
},

forEach = function(obj, func) {
for (var p in obj) {
if (obj.hasOwnProperty(p)) {
func(obj[p], p);
}
}
},

ratioArgs = {
'fillRect': 'all',
'clearRect': 'all',
'strokeRect': 'all',
'moveTo': 'all',
'lineTo': 'all',
'arc': [0,1,2],
'arcTo': 'all',
'bezierCurveTo': 'all',
'isPointinPath': 'all',
'isPointinStroke': 'all',
'quadraticCurveTo': 'all',
'rect': 'all',
'translate': 'all',
'createRadialGradient': 'all'
};

forEach(ratioArgs, function(value, key) {
prototype[key] = (function(_super) {
return function() {
var i, len,
ratio = getPixelRatio(this),
args = Array.prototype.slice.call(arguments);

if (value === 'all') {
args = args.map(function(a) {
return a * ratio;
});
}
else if (Array.isArray(value)) {
for (i = 0, len = value.length; i < len; i++) {
args[value[i]] *= ratio;
}
}

return _super.apply(this, args);
};
})(prototype[key]);
});

// Text
//
prototype.fillText = (function(_super) {
return function() {
var ratio = getPixelRatio(this),
args = Array.prototype.slice.call(arguments);

args[1] *= ratio; // x
args[2] *= ratio; // y

this.font = this.font.replace(
/(\d+)(px|em|rem|pt)/g,
function(w, m, u) {
return (m * ratio) + u;
}
);

_super.apply(this, args);

this.font = this.font.replace(
/(\d+)(px|em|rem|pt)/g,
function(w, m, u) {
return (m / ratio) + u;
}
);
};
})(prototype.fillText);

prototype.strokeText = (function(_super) {
return function() {
var ratio = getPixelRatio(this),
args = Array.prototype.slice.call(arguments);

args[1] *= ratio; // x
args[2] *= ratio; // y

this.font = this.font.replace(
/(\d+)(px|em|rem|pt)/g,
function(w, m, u) {
return (m * ratio) + u;
}
);

_super.apply(this, args);

this.font = this.font.replace(
/(\d+)(px|em|rem|pt)/g,
function(w, m, u) {
return (m / ratio) + u;
}
);
};
})(prototype.strokeText);
})(CanvasRenderingContext2D.prototype);
;(function(prototype) {
prototype.getContext = (function(_super) {
return function(type) {
var backingStore, ratio,
context = _super.call(this, type);

if (type === '2d') {

backingStore = context.backingStorePixelRatio ||
context.webkitBackingStorePixelRatio ||
context.mozBackingStorePixelRatio ||
context.msBackingStorePixelRatio ||
context.oBackingStorePixelRatio ||
context.backingStorePixelRatio || 1;

ratio = (window.devicePixelRatio || 1) / backingStore;

if (ratio > 1) {
this.style.height = this.height + 'px';
this.style.width = this.width + 'px';
this.width *= ratio;
this.height *= ratio;
}
}

return context;
};
})(prototype.getContext);
})(HTMLCanvasElement.prototype);
9 changes: 9 additions & 0 deletions dist/hidpi-canvas.min.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "hidpi-canvas",
"description": "A JavaScript drop-in module to polyfill consistent and automatic HiDPI Canvas support.",
"version": "1.0.2",
"version": "1.0.3",
"license": "Apache 2.0",
"homepage": "https://github.com/jondavidjohn/hidpi-canvas-polyfill",
"bugs": "https://github.com/jondavidjohn/hidpi-canvas-polyfill/issues",
Expand Down

0 comments on commit 2dd8ef0

Please sign in to comment.