delete watchlist without reload
by
a-kuma3
2015-03-18 [2015/03/18 22:52:24]
make it possible to delete watchlist item continuously without reload @ q.hatena.ne.jp
-
/*
* @title delete watchlist without reload
* @description make it possible to delete watchlist item continuously without reload @ q.hatena.ne.jp
* @include http://q.hatena.ne.jp/*
* @license MIT License
* @javascript_url
*/
(function () {
if (window.location.hostname == 'q.hatena.ne.jp' && /\/watchlist$/.exec(window.location.pathname)) {
var frm = document.getElementById('delete-target');
if (! frm) {
var forEach = Array.prototype.forEach;
// target frame
var frm = document.createElement("iframe");
frm.id = 'delete-target';
frm.name = 'delete-target';
frm.style.width = 0;
frm.style.height = 0;
document.body.appendChild(frm);
// display mode
var prof = document.body.querySelector('.profile-account-container');
var e = document.createElement('div');
e.innerHTML = 'interactive delete mode';
var s = e.style;
s.position = 'absolute';
s.padding = '2px 8px';
s.right = 0;
s.backgroundColor = 'red';
s.color = 'white';
prof.appendChild(e);
var eraseItem = function() {
var li_ = this.parentNode;
li_.style.transition = 'all 1.2s';
li_.style.opacity = 0;
var f = (function() {
var li = li_;
return function() {
var ul = li.parentNode;
ul.removeChild(li);
};
})();
setTimeout(f, 1300);
};
var changeTarget = function (context) {
forEach.call(context.querySelectorAll('form.delete'), function (f) {
f.target = 'delete-target';
f.onsubmit = eraseItem;
// I don't need confirm.
var btn = f.querySelector('input[type="image"]');
if (btn) {
btn.onclick = function() {return true;};
}
});
};
changeTarget(document.body);
// https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver
// http://caniuse.com/#feat=mutationobserver
var MutationObserver = window.MutationObserver || window.WebkitMutationObserver;
new MutationObserver(function (records) {
records.forEach(function (record) {
changeTarget(record.target);
});
}).observe(document.body, { childList: true, subtree: true });
}
}
})();
-
- Permalink
- このページへの個別リンクです。
- RAW
- 書かれたコードへの直接のリンクです。
- Packed
- 文字列が圧縮された書かれたコードへのリンクです。
- Userscript
- Greasemonkey 等で利用する場合の .user.js へのリンクです。
- Loader
- @require やソースコードが長い場合に多段ロードする Loader コミのコードへのリンクです。
- Metadata
- コード中にコメントで @xxx と書かれたメタデータの JSON です。