おぐCOJ

COJは終わった

AgentLaboのスクリプトについて Ver.1.4EX2対応版の記録

ogner.hateblo.jp

これが前の記事です。

Ver.1.4EX2に入って、AgentLabo上での画像に関する実装がそこそこ変わったみたいなので、コードの書き換えを余儀なくされました。
本当にやめてほしいですね。
こういうときはWeb担当者寝ていていいんだよ。

いつもの通り、お問合せはTwitterまで!
おぐなー / Ogner#1930 (@biree100) | Twitter
大丈夫だよ。優しい人だよ。



ほんだい

今回のセガ側の実装変更は、カード一覧とかで表示されているカードのサムネイル画像の実体とか表示方法とかそういうのが変更になったって感じの内容でした。

ですので、画像関係のスクリプトに修正が入っています。

(携帯端末上では以前から同じような実装だったので、それ用に組んでいたスクリプトのコードを流用できて助かった感じはあります)


使い方は四半世紀前ぐらいに撮影した以下の動画から変わっていません。
www.youtube.com



スクリプト1(リスト編集モードに入るやつ)

通常版
javascript:(function(d){(w=box_wrapper).style.top=0;(c=box_container).style.background='#000';w.style.height=c.style.height=(innerHeight-110)+'px';card_detail_wrapper.style.top='100%';pv=[];Array.prototype.forEach.call(c.childNodes[1].childNodes,function(e){if(!(e.n=+(e.q=e.childNodes[3]).innerHTML.match(/\d/)))e.style.display='none';e.onclick=function(){this.style.display='none';pv.push(this);};e.oncontextmenu=function(){this.q.innerHTML='x'+(this.n=this.n-1||9);return false;};});box_search.onclick=function(){pv.length&&(pv.pop().style.display='inline-block');};})(document);
4枚以上所持している余剰分だけを残すバージョン
javascript:(function(d){(w=box_wrapper).style.top=0;(c=box_container).style.background='#000';w.style.height=c.style.height=(innerHeight-110)+'px';card_detail_wrapper.style.top='100%';pv=[];Array.prototype.forEach.call(c.childNodes[1].childNodes,function(e){if((e.n=+(e.q=e.childNodes[3]).innerHTML.match(/\d/))<4)e.style.display='none';e.n-=3;e.q.innerHTML='x'+e.n;e.onclick=function(){this.style.display='none';pv.push(this);};e.oncontextmenu=function(){this.q.innerHTML='x'+(this.n=this.n-1||9);return false;};});box_search.onclick=function(){pv.length&&(pv.pop().style.display='inline-block');};})(document);
3枚に達していない不足分を計算するバージョン フルフォイラー向け
javascript:(function(d){u=d.defaultView.getComputedStyle(button_decoration.childNodes[0],'').backgroundImage.match(/foil/)?'':10000;xc=new XMLHttpRequest();xc.onreadystatechange=function(){if(xc.readyState==4&&xc.status==200){jc=JSON.parse(xc.responseText);ac=[];t=jc.card_master_list;for(i in t)ac[t[i].no]=t[i];xq=new XMLHttpRequest();xq.onreadystatechange=function(){if(xq.readyState==4&&xq.status==200){jq=JSON.parse(xq.responseText);aq=[];t=jq.result.user_card_list;for(i=0;i<t.length;i++)aq[t[i].card_id]=t[i].card_count;tx=[];for(t in ac)if(n=Math.max(3-(aq[ac[t].id+u]||0),0))tx.push('<li id="shortage'+ac[t].id+'">\n<div'+(u&&' class="foil_thum"')+'></div>\n<div class="card_quantity">x'+n+'</div>\n<div class="card_image" style="background:url(..'+ac[t].s_img+'.jpg);background-size:cover"></div>\n</li>');(w=box_wrapper).style.top=0;(c=box_container).style.background='#000';w.style.height=c.style.height=(innerHeight-110)+'px';card_detail_wrapper.style.top='100%';(ul=c.childNodes[1]).className='cardbox_rotate_end';ul.innerHTML=tx.join('');pv=[];Array.prototype.forEach.call(ul.childNodes,function(e){if(!(e.n=+(e.q=e.childNodes[3]).innerHTML.match(/\d/)))e.style.display='none';e.onclick=function(){this.style.display='none';pv.push(this);};e.oncontextmenu=function(){this.q.innerHTML='x'+(this.n=this.n-1||9);return false;};});box_search.onclick=function(){pv.length&&(pv.pop().style.display='inline-block');};}};xq.open('GET','card_list_detail/hi-pixels',true);xq.send();}};xc.open('GET','get_card_master',true);xc.send();})(document);

スクリプト2(リストの画像出力するやつ)

PC用
javascript:(function(d){clm=16;a=[];Array.prototype.forEach.call(c.childNodes[1].childNodes,function(e){if(e.style.display!='none'){s=e.childNodes;b=new Image();b.src=b.src=(cs=d.defaultView.getComputedStyle(s[5],'')).backgroundImage.match(/i.+jpg/);ps=cs.backgroundPosition.split(/\s/);b.px=2*ps[0].match(/\d+/);b.py=2*ps[1].match(/(?:\d|\.)+/);b.f=s[1].className;b.n=e.n;a.push(b);}});f=new Image();f.src='img/pc/foil/foil_thum.png';q=new Image();q.src='img/pc/deck/card_quantity_bg.png';v=d.createElement('canvas');v.width=o=Math.min(clm,a.length)*60;v.height=p=(((a.length-1)/clm|0)+1)*84;t=v.getContext('2d');t.font='18pt Helvetica';t.fillRect(0,0,o,p);t.fillStyle='#FFF';for(m=0;m<a.length;m++){x=(m% clm)*60;y=(m/clm|0)*84;t.drawImage(a[m],a[m].px,a[m].py,120,169,x,y,60,84);if(a[m].f)t.drawImage(f,x,y,60,84);t.drawImage(q,x+30,y+61,30,23);t.fillText('x'+a[m].n,x+34,y+81);}i=new Image();with(i.style){display='block';position='fixed';top=0;right=0;zIndex=100;}i.src=v.toDataURL();d.body.appendChild(i);i.onclick=function(){d.body.removeChild(this);};})(document);
モバイル端末用
javascript:(function(d){a=[];Array.prototype.forEach.call(c.childNodes[1].childNodes,function(e){if(e.style.display!='none'){s=e.childNodes;b=new Image();b.src=(cs=d.defaultView.getComputedStyle(s[5],'')).backgroundImage.match(/i.+?_.+?\//)+'m_thum/thum_'+('00'+e.id.match(/\d+/)).slice(-3)+'.jpg';b.f=s[1].className;b.n=e.n;a.push(b);}});f=new Image();f.src='img/mobile/foil/foil_m_thum.png';q=new Image();q.src='img/pc/deck/card_quantity_bg.png';v=d.createElement('canvas');v.width=o=Math.min(16,a.length)*40;v.height=p=(((a.length-1)/16|0)+1)*56;t=v.getContext('2d');t.font='12pt Arial';t.fillRect(0,0,o,p);t.fillStyle='#FFF';ct=0;for(m=0;m<a.length;m++){x=(m%(16))*40;y=(m/16|0)*56;a[m].onload=(function(x,y,z){return function(){t.drawImage(z,x,y,40,56);if(z.f)t.drawImage(f,x,y,40,56);t.drawImage(q,x+19,y+40,21,16);t.fillText('x'+z.n,x+22,y+54);if(++ct==a.length){i.src=v.toDataURL();d.body.appendChild(i);}};})(x,y,a[m]);}i=new Image();with(i.style){display='block';position='fixed';top=0;right=0;zIndex=100;}i.onclick=function(){d.body.removeChild(this);};})(document);

番外編 デッキ編集画面でデッキ画像を出力するやつ

PC用 Micro$oftの犬だからInternet Explorerしか使えない人向け
javascript:(function(d){v=d.createElement('canvas');v.width=480;v.height=424;t=v.getContext('2d');t.fillRect(0,0,480,424);k=deck_container.childNodes[1].childNodes;f=new Image();f.src='../img/pc/foil/foil_thum.png';a=[];for(n=0;n<k.length;n++){s=k[n].childNodes;c=new Image();c.src=(cs=d.defaultView.getComputedStyle(s[11],'')).backgroundImage.match(/i.+jpg/);ps=cs.backgroundPosition.split(/\s/);c.px=2*ps[0].match(/\d+/);c.py=2*ps[1].match(/(?:\d|\.)+/);c.f=s[1].className;for(m=0;m<s[9].innerHTML.match(/\d/);m++)a.push(c);}for(m=0;m<a.length;m++){x=(m%8)*60;y=(m/8|0)*85;t.drawImage(a[m],a[m].px,a[m].py,120,169,x,y,60,84);if(a[m].f)t.drawImage(f,x,y,60,84);}i=new Image();with(i.style){display='block';position='fixed';top=0;right=0;zIndex=100;}i.src=v.toDataURL();d.body.appendChild(i);i.onclick=function(){d.body.removeChild(this);};})(document);
PC用 OperaとかOperaとかその他IE以外のブラウザを使っている人向け IE向けより便利よ
javascript:(function(d){v=d.createElement('canvas');v.width=480;v.height=424;t=v.getContext('2d');t.fillRect(0,0,480,424);k=deck_container.childNodes[1].childNodes;f=new Image();f.src='../img/pc/foil/foil_thum.png';a=[];for(n=0;n<k.length;n++){s=k[n].childNodes;c=new Image();c.src=(cs=d.defaultView.getComputedStyle(s[11],'')).backgroundImage.match(/i.+jpg/);ps=cs.backgroundPosition.split(/\s/);c.px=2*ps[0].match(/\d+/);c.py=2*ps[1].match(/(?:\d|\.)+/);c.f=s[1].className;for(m=0;m<s[9].innerHTML.match(/\d/);m++)a.push(c);}for(m=0;m<a.length;m++){x=(m%8)*60;y=(m/8|0)*85;t.drawImage(a[m],a[m].px,a[m].py,120,169,x,y,60,84);if(a[m].f)t.drawImage(f,x,y,60,84);}l=d.createElement('a');l.href=v.toDataURL();l.download='deck';d.body.appendChild(l);l.click();})(document);

だいたい常に最新版は
http://ogner.ehoh.net/scripts.html
にあります