Skip to content

Instantly share code, notes, and snippets.

/index.html

Created October 14, 2015 02:16
Show Gist options
  • Save anonymous/5304ab6ca627d615ae80 to your computer and use it in GitHub Desktop.
Save anonymous/5304ab6ca627d615ae80 to your computer and use it in GitHub Desktop.
Download ZIP
JS Bin // source http://jsbin.com/sesugedara
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body>
<div><div><p><p><span><input type="text" value=""></span></p></p></div></div>
<script src="https://code.jquery.com/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/2.3.22/rx.lite.js"></script>
<script id="jsbin-javascript">
'use strict';
var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
function getDomPath(el) {
if (!el) {
return;
}
var stack = [];
var isShadow = false;
while (el.parentNode != null) {
// console.log(el.nodeName);
var sibCount = 0;
var sibIndex = 0;
// get sibling indexes
for (var i = 0; i < el.parentNode.childNodes.length; i++) {
var sib = el.parentNode.childNodes[i];
if (sib.nodeName == el.nodeName) {
if (sib === el) {
sibIndex = sibCount;
}
sibCount++;
}
}
// if ( el.hasAttribute('id') && el.id != '' ) { no id shortcuts, ids are not unique in shadowDom
// stack.unshift(el.nodeName.toLowerCase() + '#' + el.id);
// } else
var nodeName = el.nodeName.toLowerCase();
if (isShadow) {
nodeName += "::shadow";
isShadow = false;
}
if (sibCount > 1) {
stack.unshift(nodeName + ':nth-of-type(' + (sibIndex + 1) + ')');
} else {
stack.unshift(nodeName);
}
el = el.parentNode;
if (el.nodeType === 11) {
// for shadow dom, we
isShadow = true;
el = el.host;
}
}
stack.splice(0, 1); // removes the html element
return stack.join(' > ');
}
var Shit = (function () {
function Shit() {
_classCallCheck(this, Shit);
this.shit();
}
_createClass(Shit, [{
key: 'shit',
value: function shit() {
var $input = $(document).find(":input").not(":submit").not(":reset").not(":button").not(":file").not(":password").not(":disabled").not("[readonly]");
var keyups = Rx.Observable.fromEvent($input, 'change click keypress paste focus');
var debounced = keyups.debounce(500);
var distinct = debounced.distinctUntilChanged();
distinct.subscribe(function (x) {
// element: x.target.localName
console.log(getDomPath(x.target));
console.log(x.target.value);
}, function (err) {
console.log('Error: %s', err);
}, function () {
console.log('Completed');
});
}
}]);
return Shit;
})();
new Shit();
</script>
<script id="jsbin-source-javascript" type="text/javascript">function getDomPath(el) {
if (!el) {
return;
}
var stack = [];
var isShadow = false;
while (el.parentNode != null) {
// console.log(el.nodeName);
var sibCount = 0;
var sibIndex = 0;
// get sibling indexes
for ( var i = 0; i < el.parentNode.childNodes.length; i++ ) {
var sib = el.parentNode.childNodes[i];
if ( sib.nodeName == el.nodeName ) {
if ( sib === el ) {
sibIndex = sibCount;
}
sibCount++;
}
}
// if ( el.hasAttribute('id') && el.id != '' ) { no id shortcuts, ids are not unique in shadowDom
// stack.unshift(el.nodeName.toLowerCase() + '#' + el.id);
// } else
var nodeName = el.nodeName.toLowerCase();
if (isShadow) {
nodeName += "::shadow";
isShadow = false;
}
if ( sibCount > 1 ) {
stack.unshift(nodeName + ':nth-of-type(' + (sibIndex + 1) + ')');
} else {
stack.unshift(nodeName);
}
el = el.parentNode;
if (el.nodeType === 11) { // for shadow dom, we
isShadow = true;
el = el.host;
}
}
stack.splice(0,1); // removes the html element
return stack.join(' > ');
}
class Shit {
constructor() {
this.shit();
}
shit() {
var $input = $(document).find( ":input" ).not( ":submit" ).not( ":reset" ).not( ":button" ).not( ":file" ).not( ":password" ).not( ":disabled" ).not( "[readonly]" );
var keyups = Rx.Observable.fromEvent($input, 'change click keypress paste focus');
var debounced = keyups.debounce(500);
var distinct = debounced.distinctUntilChanged();
distinct.subscribe(
x => {
// element: x.target.localName
console.log(getDomPath(x.target));
console.log(x.target.value);
},
err => {
console.log('Error: %s', err);
},
() => {
console.log('Completed');
}
);
}
}
new Shit();</script></body>
</html>
Raw
jsbin.sesugedara.js
'use strict';
var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
function getDomPath(el) {
if (!el) {
return;
}
var stack = [];
var isShadow = false;
while (el.parentNode != null) {
// console.log(el.nodeName);
var sibCount = 0;
var sibIndex = 0;
// get sibling indexes
for (var i = 0; i < el.parentNode.childNodes.length; i++) {
var sib = el.parentNode.childNodes[i];
if (sib.nodeName == el.nodeName) {
if (sib === el) {
sibIndex = sibCount;
}
sibCount++;
}
}
// if ( el.hasAttribute('id') && el.id != '' ) { no id shortcuts, ids are not unique in shadowDom
// stack.unshift(el.nodeName.toLowerCase() + '#' + el.id);
// } else
var nodeName = el.nodeName.toLowerCase();
if (isShadow) {
nodeName += "::shadow";
isShadow = false;
}
if (sibCount > 1) {
stack.unshift(nodeName + ':nth-of-type(' + (sibIndex + 1) + ')');
} else {
stack.unshift(nodeName);
}
el = el.parentNode;
if (el.nodeType === 11) {
// for shadow dom, we
isShadow = true;
el = el.host;
}
}
stack.splice(0, 1); // removes the html element
return stack.join(' > ');
}
var Shit = (function () {
function Shit() {
_classCallCheck(this, Shit);
this.shit();
}
_createClass(Shit, [{
key: 'shit',
value: function shit() {
var $input = $(document).find(":input").not(":submit").not(":reset").not(":button").not(":file").not(":password").not(":disabled").not("[readonly]");
var keyups = Rx.Observable.fromEvent($input, 'change click keypress paste focus');
var debounced = keyups.debounce(500);
var distinct = debounced.distinctUntilChanged();
distinct.subscribe(function (x) {
// element: x.target.localName
console.log(getDomPath(x.target));
console.log(x.target.value);
}, function (err) {
console.log('Error: %s', err);
}, function () {
console.log('Completed');
});
}
}]);
return Shit;
})();
new Shit();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment