aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorBen Beltran <ben@nsovocal.com>2017-02-16 01:22:26 -0600
committerBen Beltran <ben@nsovocal.com>2017-02-16 01:22:26 -0600
commitd0f30873ebe2907b241a936a3e70487dedaf0701 (patch)
tree4b16a66e8f4b0a566f125d91b18c1dfaf560aafd
parenta1c6d8138d774cf9b9e6eee7950e2e4ae18376aa (diff)
parent552e55c2518dba35f072ce7896e884df033f4dbd (diff)
Merge branch 'release/1.0.1'
-rw-r--r--CHANGELOG.md8
-rw-r--r--js/app.js2
-rw-r--r--js/lib/heart_renderer.js52
-rw-r--r--package.json2
4 files changed, 59 insertions, 5 deletions
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 26b9888..4098b59 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -4,6 +4,11 @@ All notable changes to this project will be documented in this file.
The format is based on [Keep a Changelog](http://keepachangelog.com/)
and this project adheres to [Semantic Versioning](http://semver.org/).
+## [1.0.1] - 2017-02-16
+### Added
+- Add mouse following
+- Fix README links
+
## 1.0.0 - 2016-11-10
### Added
- Basic configuration for jsdoc
@@ -13,4 +18,5 @@ and this project adheres to [Semantic Versioning](http://semver.org/).
- This changelog
- Heart Renderer
-[Unreleased]: https://github.com/olivierlacan/keep-a-changelog/compare/master...develop
+[Unreleased]: https://github.com/rbdr/heart/compare/master...develop
+[1.0.1]: https://github.com/rbdr/heart/compare/1.0.0...1.0.1
diff --git a/js/app.js b/js/app.js
index 12065b2..63990dc 100644
--- a/js/app.js
+++ b/js/app.js
@@ -15,6 +15,8 @@
heartRenderer.activate();
window.addEventListener('resize', heartRenderer.resize.bind(heartRenderer));
+ window.addEventListener('blur', heartRenderer.stopFollowingMouse.bind(heartRenderer));
+ window.addEventListener('focus', heartRenderer.startFollowingMouse.bind(heartRenderer));
/**
* Exported global object. This will contain the instance of the heart
diff --git a/js/lib/heart_renderer.js b/js/lib/heart_renderer.js
index fd4adf6..78ca182 100644
--- a/js/lib/heart_renderer.js
+++ b/js/lib/heart_renderer.js
@@ -51,6 +51,8 @@
*/
this.heartSize = 50;
+ this._following = null; // The status of mouse follow.
+ this._center = null;
this._animating = false; // The status of the animation.
this._previousFrameTime = Date.now(); // The timestamp of the last frame for fps control
this._currentColor = { // The current color that will be painted
@@ -59,6 +61,8 @@
green: 50
};
+ this.startFollowingMouse();
+
Object.assign(this, config);
}
@@ -82,7 +86,6 @@
* @memberof HeartRenderer
* @function render
* @instance
- * @param {HTMLElement} element the element where we will attach our canvas
*/
resize() {
@@ -93,6 +96,39 @@
}
/**
+ * Follows the mouse
+ *
+ * @memberof HeartRenderer
+ * @function startFollowingMouse
+ * @instance
+ */
+ startFollowingMouse() {
+
+ if (!this._following) {
+ console.log('Start Following Mouse');
+ this._following = this._setCenterFromMouse.bind(this);
+ this.canvas.addEventListener('mousemove', this._following);
+ }
+ }
+
+ /**
+ * Stop following the mouse
+ *
+ * @memberof HeartRenderer
+ * @function stopFollowingMouse
+ * @instance
+ */
+ stopFollowingMouse() {
+
+ if (this._following) {
+ console.log('Stop Following Mouse');
+ this.canvas.removeEventListener('mouseover', this._following);
+ this._following = null;
+ this._center = null;
+ }
+ }
+
+ /**
* Gets the context from the current canvas and starts the animation process
*
* @memberof HeartRenderer
@@ -175,8 +211,8 @@
const heartSize = Math.round(referenceDimension * this.heartSize * .01);
const radius = heartSize / 2;
- const canvasCenterX = Math.round(canvasWidth / 2);
- const canvasCenterY = Math.round(canvasHeight / 2);
+ let canvasCenterX = this._center ? this._center.x : Math.round(canvasWidth / 2);
+ let canvasCenterY = this._center ? this._center.y : Math.round(canvasHeight / 2);
const centerX = -radius;
const centerY = -radius;
@@ -203,6 +239,16 @@
context.setTransform(1, 0, 0, 1, 0, 0);
}
+
+ // Sets the center from mouse
+ _setCenterFromMouse (event) {
+ this._center = this._center || {};
+
+ console.log('tracking');
+
+ this._center.x = event.offsetX;
+ this._center.y = event.offsetY;
+ }
};
diff --git a/package.json b/package.json
index 36e8f3d..7197e41 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "heart",
- "version": "1.0.0",
+ "version": "1.0.1",
"description": "The heart",
"main": "index.js",
"scripts": {