mezigh/index.html

## index.html
<!DOCTYPE html>
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/2.3.22/rx.all.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
  <meta name="description" content="Rx JS Intro">
<style id="jsbin-css">
body {
  background: lightblue;
}
#movable {
  display: block;
  position:absolute;
  top:0;
  left:0;
  font-family: sans-serif
}

#movable>p {
    background: red;
    padding:.4em;
}
</style>
</head>
<body>
  <div id="movable">
    <p>MOVE</p>
  </div>
<script id="jsbin-javascript">
console.clear();

function Product (productName,productPrice) {
    this.name = productName;
    this.price = productPrice;
}

var products = [new Product('laptop',1000), new Product('desktop',1500)];
var Observable = Rx.Observable.create(function (observer) {
  // Yield a single value and complete
  observer.onNext(321);
  observer.onCompleted();

  // Any cleanup logic might go here
  return function () {
    console.log('disposed');
  };
});

var Obs = Rx.Observable.range(1, 5);

var ProdObs = Rx.Observable.from(products);

var subscription = ProdObs.subscribe(
  function (prod) { console.log('onNext: '+ prod.name); },
  function (e) { console.log('onError: %s', e); },
  function () { console.log('onCompleted'); }
);

subscription.dispose();

// console.log(products);

/*addEventListener('mousemove', function (e) {
  document.getElementById("movable").style.top = e.clientY+"px";
  document.getElementById("movable").style.left = e.clientX+"px";
});

addEventListener('click', function (e) {
  console.log(e.clientX);
});*/
</script>


<script id="jsbin-source-css" type="text/css">body {
  background: lightblue;
}
#movable {
  display: block;
  position:absolute;
  top:0;
  left:0;
  font-family: sans-serif
}

#movable>p {
    background: red;
    padding:.4em;
}</script>

<script id="jsbin-source-javascript" type="text/javascript">console.clear();

function Product (productName,productPrice) {
    this.name = productName;
    this.price = productPrice;
}

var products = [new Product('laptop',1000), new Product('desktop',1500)];
var Observable = Rx.Observable.create(function (observer) {
  // Yield a single value and complete
  observer.onNext(321);
  observer.onCompleted();

  // Any cleanup logic might go here
  return function () {
    console.log('disposed');
  };
});

var Obs = Rx.Observable.range(1, 5);

var ProdObs = Rx.Observable.from(products);

var subscription = ProdObs.subscribe(
  function (prod) { console.log('onNext: '+ prod.name); },
  function (e) { console.log('onError: %s', e); },
  function () { console.log('onCompleted'); }
);

subscription.dispose();

// console.log(products);

/*addEventListener('mousemove', function (e) {
  document.getElementById("movable").style.top = e.clientY+"px";
  document.getElementById("movable").style.left = e.clientX+"px";
});

addEventListener('click', function (e) {
  console.log(e.clientX);
});*/


</script></body>
</html>

## jsbin.jiwiqu.css
body {
  background: lightblue;
}
#movable {
  display: block;
  position:absolute;
  top:0;
  left:0;
  font-family: sans-serif
}

#movable>p {
    background: red;
    padding:.4em;
}

## jsbin.jiwiqu.js
console.clear();

function Product (productName,productPrice) {
    this.name = productName;
    this.price = productPrice;
}

var products = [new Product('laptop',1000), new Product('desktop',1500)];
var Observable = Rx.Observable.create(function (observer) {
  // Yield a single value and complete
  observer.onNext(321);
  observer.onCompleted();

  // Any cleanup logic might go here
  return function () {
    console.log('disposed');
  };
});

var Obs = Rx.Observable.range(1, 5);

var ProdObs = Rx.Observable.from(products);

var subscription = ProdObs.subscribe(
  function (prod) { console.log('onNext: '+ prod.name); },
  function (e) { console.log('onError: %s', e); },
  function () { console.log('onCompleted'); }
);

subscription.dispose();

// console.log(products);

/*addEventListener('mousemove', function (e) {
  document.getElementById("movable").style.top = e.clientY+"px";
  document.getElementById("movable").style.left = e.clientX+"px";
});

addEventListener('click', function (e) {
  console.log(e.clientX);
});*/
	<!DOCTYPE html>
	<html>
	<head>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/2.3.22/rx.all.js"></script>
	<meta charset="utf-8">
	<title>JS Bin</title>
	<meta name="description" content="Rx JS Intro">
	<style id="jsbin-css">
	body {
	background: lightblue;
	}
	#movable {
	display: block;
	position:absolute;
	top:0;
	left:0;
	font-family: sans-serif
	}

	#movable>p {
	background: red;
	padding:.4em;
	}
	</style>
	</head>
	<body>
	<div id="movable">
	<p>MOVE</p>
	</div>
	<script id="jsbin-javascript">
	console.clear();

	function Product (productName,productPrice) {
	this.name = productName;
	this.price = productPrice;
	}

	var products = [new Product('laptop',1000), new Product('desktop',1500)];
	var Observable = Rx.Observable.create(function (observer) {
	// Yield a single value and complete
	observer.onNext(321);
	observer.onCompleted();

	// Any cleanup logic might go here
	return function () {
	console.log('disposed');
	};
	});

	var Obs = Rx.Observable.range(1, 5);

	var ProdObs = Rx.Observable.from(products);

	var subscription = ProdObs.subscribe(
	function (prod) { console.log('onNext: '+ prod.name); },
	function (e) { console.log('onError: %s', e); },
	function () { console.log('onCompleted'); }
	);

	subscription.dispose();

	// console.log(products);

	/*addEventListener('mousemove', function (e) {
	document.getElementById("movable").style.top = e.clientY+"px";
	document.getElementById("movable").style.left = e.clientX+"px";
	});

	addEventListener('click', function (e) {
	console.log(e.clientX);
	});*/
	</script>


	<script id="jsbin-source-css" type="text/css">body {
	background: lightblue;
	}
	#movable {
	display: block;
	position:absolute;
	top:0;
	left:0;
	font-family: sans-serif
	}

	#movable>p {
	background: red;
	padding:.4em;
	}</script>

	<script id="jsbin-source-javascript" type="text/javascript">console.clear();

	function Product (productName,productPrice) {
	this.name = productName;
	this.price = productPrice;
	}

	var products = [new Product('laptop',1000), new Product('desktop',1500)];
	var Observable = Rx.Observable.create(function (observer) {
	// Yield a single value and complete
	observer.onNext(321);
	observer.onCompleted();

	// Any cleanup logic might go here
	return function () {
	console.log('disposed');
	};
	});

	var Obs = Rx.Observable.range(1, 5);

	var ProdObs = Rx.Observable.from(products);

	var subscription = ProdObs.subscribe(
	function (prod) { console.log('onNext: '+ prod.name); },
	function (e) { console.log('onError: %s', e); },
	function () { console.log('onCompleted'); }
	);

	subscription.dispose();

	// console.log(products);

	/*addEventListener('mousemove', function (e) {
	document.getElementById("movable").style.top = e.clientY+"px";
	document.getElementById("movable").style.left = e.clientX+"px";
	});

	addEventListener('click', function (e) {
	console.log(e.clientX);
	});*/



	</script></body>
	</html>