(by @andrestaltz)
If you prefer to watch video tutorials with live-coding, then check out this series I recorded with the same contents as in this article: Egghead.io - Introduction to Reactive Programming.
| gulp = require 'gulp' | |
| browserify = require 'gulp-browserify' | |
| rename = require 'gulp-rename' | |
| gulp.task 'js', -> | |
| gulp.src('./public/src/app.coffee', { read: false }) | |
| .pipe(browserify({ | |
| transform: ['coffee-reactify'], | |
| extensions: ['.coffee'], | |
| })) |
(by @andrestaltz)
If you prefer to watch video tutorials with live-coding, then check out this series I recorded with the same contents as in this article: Egghead.io - Introduction to Reactive Programming.
| (function () { | |
| var makeCallback = function(eventType, observer) { | |
| if (eventType === 'value') { | |
| return function(snap) { | |
| observer.onNext(snap); | |
| }; | |
| } else { | |
| return function(snap, prevName) { | |
| // Wrap into an object, since we can only pass one argument through. | |
| observer.onNext({snapshot: snap, prevName: prevName}); |
This is an example of pan limiting, trapping for zoom.translate() by passing an array, which is determined by a simple boolean network for each of x and y of the translation to ensure that dragging is constrained within the panExtent.
It is a fork of Pan+Zoom demonstrating an example of d3.behavior.zoom applied using x- and y-scales.
Requirements
create an object variable var panExtent = {x: [0,600], y: [-200,Infinity] }; to set the limits of the pan
when setting the domain test for compliance with the panExtent (the domain should be no bigger than panExtent)
| /* | |
| * Copyright 2014 Chris Banes | |
| * | |
| * Licensed under the Apache License, Version 2.0 (the "License"); | |
| * you may not use this file except in compliance with the License. | |
| * You may obtain a copy of the License at | |
| * | |
| * http://www.apache.org/licenses/LICENSE-2.0 | |
| * | |
| * Unless required by applicable law or agreed to in writing, software |
| # Usage: | |
| # source tmux.zsh | |
| # iTerm2 window/tab color commands | |
| # Requires iTerm2 >= Build 1.0.0.20110804 | |
| # http://code.google.com/p/iterm2/wiki/ProprietaryEscapeCodes | |
| # Change the color of the tab when using tmux | |
| # reset the color after the tmux exits |
| license: gpl-3.0 |
| /** @jsx React.DOM */ | |
| // d3 chart function | |
| // note that this is a higher-order function to | |
| // allowing passing in the component properties/state | |
| update = function(props) { | |
| updateCircle = function(me) { | |
| me | |
| .attr("r", function(d) { return d.r; }) | |
| .attr("cx", function(d) { return 3 + d.r; }) |
| NOTE: Easier way is the X86 way, described on https://www.genymotion.com/help/desktop/faq/#google-play-services | |
| Download the following ZIPs: | |
| ARM Translation Installer v1.1 (http://www.mirrorcreator.com/files/0ZIO8PME/Genymotion-ARM-Translation_v1.1.zip_links) | |
| Download the correct GApps for your Android version: | |
| Google Apps for Android 6.0 (https://www.androidfilehost.com/?fid=24052804347835438 - benzo-gapps-M-20151011-signed-chroma-r3.zip) | |
| Google Apps for Android 5.1 (https://www.androidfilehost.com/?fid=96042739161891406 - gapps-L-4-21-15.zip) | |
| Google Apps for Android 5.0 (https://www.androidfilehost.com/?fid=95784891001614559 - gapps-lp-20141109-signed.zip) |