Promotion Tool Code
<head> <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0"/> <style> body { color: #333; margin: auto auto 0; max-width: 650px; padding: 0 1em; -ms-overflow-style: none; scrollbar-width: none; } body::-webkit-scrollbar { display: none; } blockquote { background-color: #fff; border: 1px dashed #999; padding: 2em; position: fixed; text-align: center; top: 30%; } blockquote:before { background: rgba(0,0,0,.25); content: ""; display: block; height: 100vh; left: 0; position: fixed; top: 0; width: 100vw; z-index: -1; } form { padding: .5em; } input[type="text"] { appearance: none; -webkit-appearance: none; -moz-appearance: none; border: 1px solid #aaa; border-radius: .25em; display: block; font-size: 1.5em; padding: .25em 0; text-align: center; width: 100%; } ul { list-style: none; margin: 0; padding: 0; } ul li { background: #fff; border: solid #aaa; border-width: 0 1px 1px; cursor: pointer; padding: 0.25em; transition: all .25s ease; } ul li:not(.no):before { content: "> "; } ul li:not(.no):hover { background: #fff0f0; color: #b01; } ul li.no { background: #ddd; color: #999; cursor: auto; } a, button, input[type="button"] { appearance: none; -webkit-appearance: none; -ms-appearance: none; -moz-appearance: none; background: #b01; border: none; box-shadow: 2px 2px 2px #333; color: #fff; cursor: pointer; display: inline-block; font-size: 0.8em; font-weight: bold; margin: 0 0.5em 0.25em 0; outline: none!important; padding: 0.25em 1em; text-shadow: 0 0 2px #ddd; transition: all 0.25s ease-in-out; } button, input[type="button"] { background: #33b; } a.unverified { background: orange; } a:hover, a:active, button:hover, button:active { text-shadow: 0 0 4px #fff, 0 0 7px #fff; } a:active, button:active { box-shadow: 1px 1px 2px #777; } div a:before { content: "×"; margin: 0 0.25em 0 0; } div a:after { content: " ("attr(data-x)")"; } </style> <script> function _Q(query, callback) { var xhr = new XMLHttpRequest(); xhr.onreadystatechange = function() { if(xhr.readyState == 4){ try{ var res = JSON.parse(xhr.responseText); res = res[Object.keys(res)[0]]; callback(res); }catch(e){console.log(e);} } }; xhr.open("GET", "/quickmodule.php?module=MemberLookupQModule&s=578002&q=" + query, true); xhr.send(); } </script> </head> <body> <input type="text" class="new" placeholder="新しい役職"/> <input type="button" onclick="New();" value="追加"/> <ol></ol> <hr> <button onclick="Add()">強制追加（検索にマッチしなかった時用）</button> <form> <input type="text" class="input" placeholder="2文字以上入力すると、候補が表示されます。"/> <ul></ul> </form> <div><span></span></div> <hr> <button onclick="Gen()">生成</button> <pre></pre> URL: <input type="text" class="res" onfocus="this.select();"/> <script> if (window !== window.parent) { const site = `http://${document.referrer.split("http://")[1].split("/")[0]}/`; const _wrap = document.createElement("div"); document.body.appendChild(_wrap); let _old = 0; const url = location.href.replace(/^.*\//, '/'); (function loop() { const _new = _wrap.getBoundingClientRect().top; if (_new !== _old) { const iframe = document.createElement("iframe"); const _rand = String(Math.floor(Math.random() * 10000)); _wrap.innerHTML = ''; iframe.src = `${site}common--javascript/resize-iframe.html?${_rand}#${_new}${url}`; iframe.style.display = "none"; _wrap.appendChild(iframe); _old = _new; } setTimeout(loop, 50); })(); } const _n = document.querySelector('.new'); const _i = document.querySelector('.input'); const _o = document.querySelector('ol'); const _u = document.querySelector('ul'); const _d = document.querySelector('div'); const _p = document.querySelector('pre'); const Which = { 0: "ウィキ運営チーム", 1: "タグ専任チーム", 2: "テクニカルチーム", 3: "グローバルチーム", 4: "渉外チーム", 5: "チャット運営チーム", 6: "広報チーム", 7: "管理者" }; _i.oninput = function(e) { if (e.target.value.length > 1) { searchFunction(e.target.value); } } function searchFunction(que) { _Q(que, function(r) { document.querySelectorAll('ul > li').forEach(_l => _l.remove()); const list = Array.from(document.querySelectorAll('div > *')).map(v => v.innerHTML).filter(v => v); if (r) { r.forEach(function(v) { const _li = document.createElement("li"); _li.innerHTML = v.name; _u.appendChild(_li); if (list.includes(v.name)) { _li.setAttribute("class", "no"); } else { _li.onclick = function(e) { Add(e); _i.value = ""; _u.innerHTML = ""; } } }); } else { const _li = document.createElement("li"); _li.innerHTML = "No results."; _li.setAttribute("class", "no"); _u.appendChild(_li); } }); } function New() { if (_n.value !== "") { const keys = Object.keys(Which); const lastKey = Number(keys[keys.length - 1]) + 1; Which[lastKey] = _n.value; } _o.innerHTML = Object.keys(Which).map(v => `<li>${Which[v]}</li>`).join(""); } New(); function Add(e) { Pop(n => { const tgt = e ? e.target.innerHTML : _i.value; const _a = document.createElement("a"); _a.innerHTML = tgt; _a.setAttribute("data-x", n); if (!e) { _a.setAttribute("class", "unverified"); } _d.appendChild(_a); _a.onclick = Del; }); } function Del(e) { e.target.remove(); } function Pop(callback) { const _b = document.createElement("blockquote"); document.body.appendChild(_b); Object.keys(Which).forEach(num => { const a = document.createElement("button"); _b.appendChild(a); a.onclick = function() { callback(Which[num]); _b.remove(); } a.innerHTML = Which[num]; }); } function Gen() { const obj = {}; let res = "||~ 候補者 ||~ 職種 ||~ YES ||~ NO ||"; document.querySelectorAll('div > a').forEach(a => { const b = a.getAttribute("data-x"); const c = a.innerHTML; if (!obj[b]) { obj[b] = []; } obj[b].push(c); }); for (const k in obj) { for (const a of obj[k]) { res += `\n||[[*user ${a}]]|| ${k} || || ||`; } } _p.innerHTML = res; document.querySelectorAll('input[type="text"]')[2].value = `http://05command-ja.wikidot.com/promotion-tool-code/code/2#${encodeURIComponent(JSON.stringify(obj))}`; } </script> </body>
<head> <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0" /> <link rel="stylesheet" href="https://d3g0gp89917ko0.cloudfront.net/v--3e3a6f7dbcc9/common--theme/base/css/style.css"> <style> body { color: #333; font-size: .75em; margin: 0; padding: 0; -ms-overflow-style: none; scrollbar-width: none; } body::-webkit-scrollbar { display: none; } </style> </head> <body> <table class="wiki-content-table"> <tbody> <tr> <th>候補者</th> <th>職種</th> <th>YES</th> <th>NO</th> </tr> </tbody> </table> <pre contenteditable="true"></pre> <script> if (window !== window.parent) { // based on C-take's resizing iframe method const site = `http://${document.referrer.split("http://")[1].split("/")[0]}/`; const _wrap = document.createElement("div"); document.body.appendChild(_wrap); let _old = 0; const url = location.href.replace(/^.*\//, '/'); (function loop() { const _new = _wrap.getBoundingClientRect().top; if (_new !== _old) { const iframe = document.createElement("iframe"); const _rand = String(Math.floor(Math.random() * 10000)); _wrap.innerHTML = ''; iframe.src = `${site}common--javascript/resize-iframe.html?${_rand}#${_new}${url}`; iframe.style.display = "none"; _wrap.appendChild(iframe); _old = _new; } setTimeout(loop, 50); })(); } const tbl = document.querySelector("table tbody"); const pre = document.querySelector("pre"); const hash = location.href.split("#")[1]; const data = JSON.parse(decodeURIComponent(hash)); const ext = {}; for (const k in data) { for (const a of data[k]) { ext[a] = { "type": k, "check": null }; } } for (const k in ext) { Tr(k, ext[k].type); } function check(name, num, elm) { ext[name].check = num; const E = elm.parentElement; for (const e of E.parentElement.querySelectorAll("td")) { e.style.background = "unset"; } E.style.background = "#b01"; const selectedUsers = []; let res = "||~ 候補者 ||~ 職種 ||~ YES ||~ NO ||"; for (const k in ext) { const n = ext[k].check; res += `\n||[[*user ${k}]]|| ${ext[k].type} ` if (n) { res += (n === 1) ? "|| ✔️ || ||" : "|| || ✔️ ||" ; selectedUsers.push(k); } else { res += "|| || ||"; } } if (selectedUsers.length) { res += `\n\n[[collapsible show="+ 投票事由"]]`; for (const user of selectedUsers) { res += `\n[[*user ${user}]]氏: `; } res += `\n[[/collapsible]]`; } pre.innerHTML = res; } function Tr(name, type) { const tr = document.createElement("tr"); function _td(f) { const a = document.createElement("td"); tr.appendChild(a); f(a); } for (let i = 0; i < 4; i++) { _td(function (td) { td.innerHTML = (i === 0) ? `<a target="_blank" href="http://www.wikidot.com/user:info/${name.replace(/ /g, "-")}">${name}</a>` : (i === 1) ? type : (i === 2) ? (`<button onclick="check('${name}', 1, this)">YES</button>`) : (`<button onclick="check('${name}', 2, this)">NO</button>`); }); } tbl.appendChild(tr); return tr; } </script> </body>
ページリビジョン: 2, 最終更新: 17 Jan 2024 12:47