男「あ、そうだ」

男「このスレはあれだ。Hello world的な立ち位置なんだよ」

女「そんな今思いつきましたみたいな言い方しないでよ…」

男「女が散々俺の言うこと否定するからだろ！」

男「そうと決まれば善は急げだ。Firefoxの拡張機能を作ってこ」

女「…し、仕方ないから付き合ってあげる」

女「でも男って拡張機能作ったことあるの？」

男「１回目に引きこもってた時にSafariのなら作ろうとしたことがある」

女「（最初の情報も含めて）すごくどうでもいい」

男「そうデスネ、今回のFirefoxとは全然関係ないデスネ」

女「仕方ないから調べてきてあげたよ」

男「おお流石。出来る女！」

女「えへへ、じゃなくて。まずは適当なディレクトリ（フォルダ）を作ってよ」

男「適当なディレクトリかー。ズバリな名前がいいよな」

女「まあ別にディレクトリ名を参照するわけではないから意味ないけど、せっかくだから拡張機能の名前も含めて安価とる？」

男「いいね、安価。参加型って感じですごくいい。ちなみに安価がいつまでも取られなかったら自分で考えた名前でいく」

女「じゃあ安価は1個下で（日本語名の場合、ローマ字に直すのでご了承のほどを）」

女「しらたき。美味しそうでいい名前だね」

男「た、多機能…（（（ ；゜ Д ゜））） 」

女「期待されちゃっていくぅ」

男「が、頑張ります…」

男「日本語名はたぶん大丈夫だろうけど念のためローマ字表記にしてsiratakiで」

女「shiratakiじゃないの？」

男「一文字でも短くしたいじゃん？」

女「…そか。じゃあsiratakiディレクトリの中にmanifest.jsonっていうファイルを作ってこの内容を書き込んで」
{

"manifest_version": 2,
"name": "sirataki",
"version": "0.1",

"description": "したらば専用多機能（？）ブラウザ",

"content_scripts":[
{
"matches": ["*://jbbs.shitaraba.net/*/*/", "*://jbbs.shitaraba.net/bbs/read.cgi/*/*/*/", "*://jbbs.shitaraba.net/bbs/write.cgi/*/*/*/"],
"js": ["jquery.js", "sirataki.js"]
}
]
}

女「あとはjqueryとか使う気がするからhttps://code.jquery.com/jquery-3.3.1.min.jsをjquery.jsって名前で同じディレクトリに保存しときましょ」

男「You know（有能）！」

インデントががが
まあ、あまり長い関数とかを書かないようにするしかないね…

女「さっきのmanifest.jsonの内容について簡単に説明すると…とりあえず最初の４行はいいわよね」

男「宣言の類だよな。名前とかバージョンとか説明書いてるだけの」

女「そう。特に最初の３行は必須項目らしいから書き漏らしがないようにね」

男「content_scriptは内容から察するに、matchesがこの拡張機能が有効になるURL、jsが読み込むjavascriptファイルってとこかな」

女「そのとーり。男でもそれくらいはわかるよね」

男「そこはかとなく馬鹿にされた気分」

女「ふっ」

男「鼻で笑うな！」

女「じゃあとりあえず本当にHello worldしよっか」

男「さっきのmanifest.jsonで読み込むよう設定した、sirataki.jsを同じディレクトリに作るんだな」

女「そうそう。で、Hello worldと出すように書くと」

男「たしかjqueryでdocumentがreadyなときに発火する関数があったような…」

女「省略形で書くと$(function(){})ってなるアレね」

男「それそれ。だからsirataki.jsにこう書けばいいんだな」
$(function() {
alert("Hello world!!");
})

女「！！って、小学生かな？」

男「勢いが大事」

女「まあいいや。書いただけじゃ仕方ないからこれをFirefoxでロードしないとね」

男「おお、そうだった。どうやるんだ？」

女「about:debuggingってアドレスバーに入力して、右上にある『一時的なアドオンを読み込む』を選んでsiratakiフォルダ内にある適当なファイルを開くの」

男「読み込んだがなにも起こらない…」

女「君、アホなの？」

男「失敬な」

女「自分で『matchesがこの拡張機能が有効になるURL』って言ってたでしょうに」

男「ああ、そうだった。じゃあ男「したらばの専ブラを作るよ！」 - SSまとめ速報
(https://jbbs.shitaraba.net/bbs/read.cgi/internet/14562/1522918833/) に移動してっと」

男「おお！ Hello world!!のポップアップが出た！」

女「さっきはmanifest.jsonでjsだけ指定したけど、cssも指定できるから」

男「つまり、JSとCSSを使ってしたらば掲示板の内容をどうとでもいじることができる…！！」

女「その通りなんだけど、なんか言い方が悪そう」

男「すまんちょっと興奮してたわ」

男「なにはともあれ完成系が見えてきたな」

女「それはちょっと気が早すぎると思うの」

そういえば、専ブラと言いながら今の仕様だとread.cgiとrawmode.cgiの両方にアクセスして2倍の負担をかけていくブラウザになっちゃう
どうにかしてread.cgiの通信を止められるといいんだけど..

男「さてこれで色々とできそうだけど、何から手を付けよう」

女「色々ってのは言い過ぎでしょ。選択肢としてはこんな感じじゃない？」
・とりあえずタイトル一覧ページを作る
・とりあえずスレ表示ページを作る

男「そうだな、そのあたりからだよな。個人的にスレ表示機能の方が先に作りたい」

女「君が作るんだから君のペースでやればいいんじゃない」

男「よし、じゃあスレの表示機能からいこう」

女「matchesの内容的に、一覧ページ、スレページ、書き込みページの３つが同一スクリプトで処理されることになるから、これらを事前に区別しないとね」

男「それなら現在のURLを正規表現で調べるのが良いな。javascriptの正規表現の書き方はどんなだったっけ」

女「色々あるけど例えばこう書けば良いんじゃないかな」
var readcgiReg = /bbs\/read.cgi\/(.*?)\/(.*?)\/(.*?)\/$/
if (readcgiReg.test(string)) {
// なにか処理
}

男「ふむふむつまりsirataki.jsのさっきのalertを消してこうすれば良いんだな」
$(function() {
var readcgiReg = /bbs\/read.cgi\/(.*?)\/(.*?)\/(.*?)\/$/
if (readcgiReg.test(location.href)) {
GetThreadInfo();
}
})

function GetThreadInfo() {
// ここで色々成形とかする
}

女「関数名に疑問を覚えなくもないけどまあそんな感じね」

男「関数名のチョイスはマジでセンスないから突っ込まないでほしい…」

男「いや突っ込んでくれてもいいけど、前向きなアドバイスを添えてほしい」

女「そう…」

男「……」

女「どうしたの？」

男「スレのHTMLをじっと眺めてた」

女「ああ、パースするためにね」

男「そうそう」

女「そんな七面倒くさいことしなくても、rawmode.cgiにアクセスすれば1レス1行にまとまった生データあるよ」

男「マジで！？」

女「…そんなことも知らずに専ブラ作ろうとしてたの？」

男「いや言われてみればそんなものもあったような気がしてきた…」

女「とりあえずhttp://info.5ch.net/index.php/Monazilla/develop/shitarabaを見ようか」

男「へー、便利なページがあるもんだ」

男「これ、区切り文字が<>だって言ってるけど本文中に<>があったらどうなるんだ？」

女「エスケープされてるに決まってるでしょ。だから普通に区切り文字<>で気にせず区切ればいいよ」

男「ふむふむ」

男「つまり、やる手順はこうだな」
1．read.cgiページにアクセスしてる裏でrawmode.cgiページをgetする
2．read.cgiが表示したページを消す
3．rawmode.cgiで取得したデータに基づいて新たにHTMLを記述する
4．CSSで成形する

女「そういうことね」

女（その方法だと一度元ページが表示されて鬱陶しい気がするけど、今はまだ気にする段階じゃないか）

男「よしGetThreadInfo()とそれに必要な関数が大体書けたゾ」
function GetThreadInfo() {
var url = location.href.replace("read", "rawmode");

$.ajax({url:url, cache: false}).done(function(data) {
$("body").html(""); // 元のデータを取り除く
$("body").append( CastThreadData(data) );
});
}

// Rawデータを成形する
function CastThreadData(data) {
var lines = data.split("\n");
var text = "<div class='thread-content'>";
var num, name, mail, date, honbun, title, id;

for (var i = 0; i < lines.length - 1; i++) { // 最後に空行が入るので-1
[num, name, mail, date, honbun, title, id] = lines[i].split("<>");
var less = num + " <span class='thread-name'><b>" + name + "</b></span> Mail:[" + mail + "]" + date + " ID:" + id + "<br/>";
less += honbun + "<br/>";
less = "<div class='honbun'>"+ less + "<br/><br/></div>";
text += less;
}
text += "</div>";
return $(text);
}

女「確かに表示できてるんだけどさ」

男「うん」

女「一瞬、元ページ出るよね」

男「…うん」

女「あれ、なんとかならないの？」

男「なんとかって言われても…。あ、そういえば」

女「？」

男「manifest.jsonのことを調べてた時に…あったこのページだhttps://developer.mozilla.org/en-US/Add-ons/WebExtensions/manifest.json/content_scripts」

女「なにこれ英語じゃない…」

男「Google先生の力を借りれば英語だろうが日本語になるのだ」

女「自力で読まんのかい」

男「ははは…。それはさておき、これによればcontent_script内に"run_at":"document_start"
と書けばドキュメントの読み込み開始と同時にスクリプトを実行できるらしい」

男「……」

女「相変わらず一瞬表示されるね。ちょっと短くなったかもしれないけど」

男「そうだ、javascriptが処理している間、CSSでbody要素を非表示にすれば良いんだ」

女「おー、うまく行ったね」

男「ということで、もろもろ変更した箇所のソースをピックアップしていくと」
# manifest.jsonのcontent_scriptを以下のように変更
"content_scripts":[
{
"matches": ["*://jbbs.shitaraba.net/*/*/", "*://jbbs.shitaraba.net/bbs/read.cgi/*/*/*/", "*://jbbs.shitaraba.net/bbs/write.cgi/*/*/*/"],
"js": ["jquery.js", "sirataki.js"],
"css":["sirataki.css"],
"run_at":"document_start"
}
]

# sirataki.cssを以下の内容で新規作成
body {
display: none;
}

# sirataki.jsのGetThreadInfo関数内に$("body").css("display", "block")を追記
function GetThreadInfo() {
var url = location.href.replace("read", "rawmode");

$.ajax({url:url, cache: false}).done(function(data) {
$("body").html(""); // 元のデータを空にする
$("body").append( CastThreadData(data) );
$("body").css("display", "block");
});
}

男「長いけどこんな感じかな」

女「ホントに表示するだけだね」

男「表示機能がついたら次はやっぱりアレだ」

女「アレ？」

男「>>22だ」
以下から選択
・書き込み
・安価先表示
・CSSで成形
・NG機能（未実装のため亀更新必至）
・その他何か思いつく機能があって実装できそうであれば…

書き込み

男「当然、書き込みだよね」

女「まあ、書き込めなきゃ掲示板見る意味半減だもんね。まとめサイトでも見てろっていうか」

男「そのとーり。ということでどういう方針で実装するか考えよう」

女「あ、いろいろ試してみたけど新規ウィンドウ作って書き込むのは私には無理でした」

男「え、なにそれどういうこと？」

女「まず書き込み専用ウィンドウを作るのが面倒くさい」

女「それができたところで専用ウィンドウから書き込みを実行すると外部からの書き込み扱いになってしたらばに弾かれる」

女「バックグラウンド通信使って専用ウィンドウからスレウィンドウに無理やり書き込み内容送信して、
ajaxでPOSTすると文字コードがよくわからないことになる」

女「と、まあ頑張れば頑張るほどドツボにハマるのですよ」

男「な、なるほど」

女「そんなわけで、私のおススメは
スレ表示ページに書き込みフォームを置いて、それの表示非表示を適当なボタンで切り替える
かな」

男「オーキードーキー。その方針でいこか」

男「それじゃあ、まずはsirataki.jsを使って適当な場所に書き込みフォームを追記しよう」
function GetThreadInfo() {
...一部省略...
$("body").append( CastThreadData(data) );
MakeWriteForm();
$("body").css("display", "block");
});
}

function MakeWriteForm () {
var reg = /https?:\/\/jbbs\.shitaraba\.net\/bbs\/read\.cgi\/(.*?)\/(.*?)\/(.*?)\//;
var dir, boardNum, threadNum;
[dir, boardNum, threadNum] = location.href.match(reg).slice(1,4);
$("body").append(
"<div id='write-form'>" + "<a id='write-form-switch'>▼</a>" +
"<form name='fcs' method='POST' action='" + location.href.replace("read", "write").replace(/\/(l?[0-9]+(-[0-9]+)?)$/, "\/") + "'>" +
'<input name="BBS" value="' + boardNum + '" type="hidden">' +
'<input name="KEY" value="' + threadNum + '" type="hidden">' +
'<input name="DIR" value="' + dir + '" type="hidden">' +
"<span class='noselect'>Name：</span><input type='text' name='NAME' id='write-name'/>" +
"<span class='noselect'>Mail：</span><input type='text' name='MAIL' id='write-mail'/>" +
"<input type='checkbox' id='sage' checked/><label for='sage' class='noselect sage'>sage</label>" +
"<input type='submit' value='書き込み'/><br/><br/>" +
"<textarea name='MESSAGE' id='message'></textarea><br/><br/>" +
"</form></div>"
);
}

女「プログラムよりもHTMLの量が多いね…」

男「フォームをひたすら書き足していけばそりゃこうなるよね」

男「そろそろ分量が増えてきたから、適当なところまでをまとめたものをウェブにあげようと思う」

男「あげる準備ができたらssの方のソースはも少し簡略化するかな」

男「ちなみに上の関数はまだ続く」

function MakeWriteForm () {
...省略...
$("body").append(...省略...); // ここまではさっき書いた分
if ( $("#sage").is(":checked") ) { // チェックボックスとメ欄を連動させる
$("#write-mail").val('sage');
}
$("#sage").change (function(){
if ($(this).is(':checked')) {
$('#write-mail').val('sage');
} else {
$('#write-mail').val('');
}
});
$("#write-form-switch").click(function () { // ▼/▲ を押すと書き込みフォームを収納/展開するよう登録
SwitchWriteForm();
});
}

男「さらに続くよ！」
function SwitchWriteForm() {
var temp = false;
if ($("#write-form").css("bottom").replace("px", "") < 0) {
var writeFormBottom = 0;
temp = true;
} else {
var writeFormBottom = $("#write-form").css("bottom").replace("px", "") - 220;
}
$("#write-form").animate({
'bottom': writeFormBottom + "px"
},400, function () {
if (temp) {
$("#write-form-switch").html("▼");
} else {
$("#write-form-switch").html("▲");
}
});
}

女「ソースはそろそろCSS含めて100行超えるからねー。SSでフルバージョンを載せていくのはだいぶ厳しいね」

男「あーそうだったCSSも書かないとこのコード意味がないんだった」

男「ということでsirataki.cssの追記分。これも長いから2レスに分割かな」
.thread-content {
margin-bottom: 290px;
}

#write-form {
position: fixed;
padding:10px;
height: 250px;
width: 100%;
bottom: 0;
background:rgba(0,0,0,0.4);
color: #f0f0f0;
}

#write-form-switch {
float: right;
margin-right:20px;
font-size: 24px;
color: #f0f0f0;
}

男「ここより下はぶっちゃけおまけだなー。レイアウトを整えるだけの意味合いしかない」
#write-name {
width: 30%;
}

#write-mail{
width: 30%;
}
#message {
width: 50%;
height: 180px;
resize: none;
}

.noselect {
-moz-user-select: none;
-webkit-user-select: none; /* For chrome */
}

男「For chromeって書いてあるのは文字通りChromeで実行した場合に必要な要素。今回はFirefoxが対象だから書かなくてもよき」

女「男はFirefoxで最新版の、Chromeでssと同程度の進行度のしらたきを使って作業してるので一応両方書いてるんだゾ」

男「さて、じゃあ次はどーしよっかな」

女「>>30とかは？」
・すっかり忘れ去られているタイトル表示 ← New
・書き込み後スレ一覧に戻される問題の解消 ← New
・安価先やリンク、画像ファイルのサムネ表示
・前回読んだレスまで飛ばしてくれる機能 ← New
・NG機能（未実装（ｒｙ
・その他実装できそうな機能（具体的に）

その他：置換マネージャ…とか？

女「そうね、置換マネージャなんてどうかしら？」

男「oh…多機能目指してるもんね…それくらいほしいよね…（Hello world的な立ち位置はどこへ）」

女「自分で言ってなんだけど、設定用ウィンドウとか作るの面倒くさいから書き込みのときのパネル方式で誤魔化していきたいところ」

男「というか置換マネージャってやることはNGと同じだよね。testで全文あぼんするかmatchで一致箇所を変換するかの違いしかないじゃん」

女「とりあえず設定パネルはあとから『頑張って』付け足すとして、storage.localに置換の一例を保存しつつ、それを実行してる様子でお茶を濁そうかしら」

男「そ、そうね。設定パネル作るの考えると気持ちがしぼむけど…」

投稿時間とかからお察しいただけると助かりますが私ただのニートなのでどこかで根を上げる可能性高し
逆に言えばニートだから無限の時間を使って実装を進められる可能性もある

女「置換マネージャの実装って言って>>31に書いた通りのことだけやると味気ないからついでに安価先の表示機能もつけよっか」

男「それと置換マネージャ（仮実装）を組み合わせて丁度 https://arigayas.exblog.jp/23724728/ みたいなことをしようという魂胆だな」

女「そそ、そうすれば多少色気があって誤魔化されてくれるかなあって」

男「置換マネージャ（仮）できたー」

女「やっぱり設定パネルとか付けないと早いね」

男「一番難しいところは絶対レイアウトとかだから…」

女「いつかは倒さないといけない敵だよ」

男「ニートにはとんずらっていう必殺技があるから」

女「死ね」

男「改変箇所について簡単に説明すると、こんな感じかな」
・manifest.jsonに"permissions":["storage"]の項目を付け加えた
・CastThreadData内で同期でコンテンツツリーを作成していたのをchrome.storage.local.getの採用に伴い非同期関数化
・レス内容を置換する関数を追加

女「具体的なソースコードは以下にあげておくヨ」
>>29までの内容：http://poke.pgw.jp/sirataki/29/sirataki.zip
ここまでの内容：http://poke.pgw.jp/sirataki/33/sirataki.zip

男「zipを信用できない人はsirataki.zipをsirataki.js, sirataki.css, manifest.json, LICENSE.md, jquery.jsに置き換えればそれぞれの生データを取ってこれるよ」

男「ライセンス関係はよく分からないニートだからjqueryに従ってMITで書いておいたよ。不備があったら教えてほしいんだ」

男「さて、（置換マネージャの設定画面を除けば）順調に作業も進んでることだし次は何するかなー」

女「このニートにカッコ内のせいで順調に進んでいないという現実を突きつけたい」

男「じゃあ次は>>37するかー」
実装できそうなものなら頑張る
設定パネルとかレイアウトを考えなきゃならないものはイメージ図も欲しいな（ないと自分で考えて悲惨な結果になりかねん）

chaikaの置換マネージャを真面目に再現するとなるとすこぶる大変そうだということに今更気づく
条件とかあるのか…

あ、安価は下で

パズドラの遅延イベ走り回りたい気持ちが湧いてこないから置換マネージャの入力フォーム作成ちう…
相変わらず安価は下

書いてる人はニートなのでプログラミングとかの知識とかあまりないテキトーな人だよ
ニートが四苦八苦してるのを眺めながら多機能専ブラが出来上がるのを待つssなんだよ
お茶を沸かす機能とかで安価をとってくれてもいいんだよ（白目

男「じゃあスレ一覧作るか―」

女「こいつ、現実をスルーしおった」

男「い、一応置換マネージャの設定パネル鋭意製作中だから…。（途中からだけど）きちんとバージョン管理もしてるよ」

女「ほーん。じゃあその内抜き打ちでチェックするかな」

男「未完成品提出するぞするぞするぞ」

男「実は暇だったからいくつかの機能をmasterブランチにコミットしちゃった」

女「こいつ、直接masterに…」

男「てへ☆」

女「てへ☆じゃないよ、なんでmasterにコミットしてるんだよもう戻すの面倒くさいじゃん、ていうか戻せるのこれ？」

男「git使うの久しぶりだったから…」

女「そ、そんな上目遣いに言われても許さないんだからね！」

男「次回以降ちゃんとブランチ切るから…」

女「うぅ…分かった分かったよ…」

男（ちょろい）

男「ふむふむ、スレ一覧を取得するには https://jbbs.shitaraba.net/[カテゴリ]/[板番号]/subject.txt を利用すればよいと」

女「にやにや」

男「なんだよそのニヤニヤは」

女「べっつにー」

男「とりあえずあれだな、readcgiのとき同じ感じにajaxで件のページをロードすればよいと」

女「そうだねー」

男「…げ、なんだこれ。文字化け！？」

女「そうだね、文字化けだね」

男「いやしかし、subject.txtもしたらば全体も全部EUC-JPで統一されて書かれてるはずでは…」

女「ふふふ」

男「なんだよ、その奇妙な笑いは…」

女「subject.txtの文字コードをよーく見てみなさい」

男「はあ？ えーっとじゃあ、 nkf --guess subject.txtっと」

男「あれ？ EUCJP-MS？ なんだそれ」

女「それの正体がなにかはともかくとして、どうやらjavascriptがgetするときに（おそらく）UTF-8と誤解してダウンロードするみたいね」

男「な、なんだってー！？」

男「ってどうすりゃええんだそんなの」

女「原因がわかってれば対処は簡単。getする前に、今からDLするファイルの文字コードはEUC-JPだと教えておけばいいのよ」

男「理屈は分かるがコードが分からぬ」

女「調べなさいよ…えーっとほらこういうのをget前に書いておけばいいの」
$.ajaxSetup({
beforeSend: function(xhr){
xhr.overrideMimeType("text/plane;charset=EUC-JP");
}
});

男「へー、そんなこともできるのか」

男「文字化けのトラブルはあったけどできたー。さっき言ったもろもろの追加も含まれてるよ」
http://poke.pgw.jp/sirataki/47/sirataki.zip

女「相変わらずレイアウトは適当というか、やる気を感じないけど」

男「一応、多少見やすさを意識してスレ番号の奇数偶数で背景色変えてたりするのだけど」

女「なんかもっとないの？ 本家chaikaにはスレの作成日とかあったと思うけど」

男「（レイアウトの問題じゃねえけど）スレの作成日ってスレにアクセスする以外に取ってくる方法思いつかない。全スレを同時にgetするわけにもいかないし」

女「chaikaではどうしてたかソース読むとかさあ」

男「ニートで暇って言ったけど読解力があるとは言ってないゾ」

女「はあ、そんなんだからニートなのよ」

男「ちなみにアクセスログを見る限り、ダウンロードされた回数は
女「言わないのが作者のモチベのためだよ」

男「スレ一覧とスレ表示と書き込み機能ができたから最低限の専ブラらしくなったんじゃないかな」

女「確かに世にはスレ立てできない専ブラもあるけど、君のはそれ以外にもいろいろできないよね」

男「辛辣ぅ」

女「目指せ多機能。ということで次は>>50しよ？」

お気に入り機能

女「お気に入り機能つけよ？」

男「待って、それFirefoxのブクマ使うのじゃダメなの？」

女「掲示板専用のブクマ需要もあるだろうし、更新チェックとかも当然できるのがお気に入り機能だと思うの」

男「そういうこと？ 俺ら専ブラニワカだからなんか誤解してたりしない？」

女「してたとしても、今言った機能はあったら便利そうだよね」

男「…今回ばかりはパネルで誤魔化せないからサイドバー必須か…」

ちなみに置換マネージャのパネルは開くためのUIが未実装なことと、レイアウトが雑なことを除けば一応完成した
少しブラッシュアップしたらまたアップロードする予定

サイドバー使うの思ったより簡単そうで助かった

GitKrakenでブランチを切り替えるタイミングでファイルが消滅することがある…GUIを使うなというお告げか…

署名とかしてまで配布する気が起きないから永続インストールしようと思うとFirefox Develop EditionかFirefox Nightlyで未署名のXPIインスコを許可してもらわないとブクマ機能とかはまともに動かない悪寒

chaikaがサイドバーで出してたのは板一覧じゃないっけ
スレ一覧は普通にメインウィンドウで表示してたような
SVN使ったことないでござる

板一覧をサイドバーに出すの良いなって思ったけどしたらばはbbsmenu.html的なの存在しないのか
まあお気に入りとかピックアップした板だけサイドバーに出てれば十分か

男「お気に入りどうやって追加するかなー」

女「無難に右クリックで良いんじゃない？」

男「webextensionで右クリックメニューにオリジナルの要素を追加する方法書いてあったけどおバカだからよく分からなくてなあ」

女「外部サイトで右クリックできる必要ないから、元の右メニュー削除して自作右メニューを表示すればいいんじゃない？」

男「は、確かに」

………………………………

男「右クリックの追加のためにいっぱいjquery関連のライブラリを追加していくぅ」

女「jquery.ui.position.js, jquery.contextMenu.js, jquery.contextMenu.css…あと、置換マネージャのドラッグを可能にするためにjquery.ui.jsを追加。盛りだくさんね」

男「全部jqueryがらみだからライセンスはMITで特に問題ないだろ…（慢心）」

女「一応全部のライセンスチラ見したつもりだけどダメだったらなんとかします」

男「ちなみに、jquery.ui.jsを使ったドラッグの挙動がFirefoxとChromeで違ってて、Chromeだと望まない動作するようになったからChromeで動作テストするのはやめた」

女「設定とか弄れば大丈夫な気もするんだけどねー」

男「右クリックメニューを使えるようになったから置換マネージャを開くためのUIが手に入ったゾ」

女「やったね」

男「逆に右クリックを使ったコピペができなくなったゾ」

女「その辺は自前でまた追加していくしかないね」

男「よく分からない仕事が増えていくぅ」

女「自己責任です」

男「ブックマーク機能は現在鋭意実装ちう…多分夜には出来てる（願望）」

女「manifest.jsonを更新したから、次からはzipファイルをxpiって拡張子に変更すれば未署名アドオンを許可できるFirefoxに永続インストールできるようになるよ」
https://developer.mozilla.org/ja/Add-ons/WebExtensions/Packaging_and_installation
女「詳しくはここを参照してね☆」

男「これでお気に入りや置換用のデータが欠損しなくなる」

女「なお、アプデで消える模様」

男「」

男「まあ、あれだ。早く完成させて更新停止すれば良いってことやろ…」

女「むしろ設定のエクスポート機能とか付ければ良いんじゃない」

男「そしたらインポート機能も必要になるだろ、いい加減にしろ」

女「つければいいじゃない」

男「他人事だと思ってからに…」

今試したらアプデしても別に設定普通に引き継げたわ

CORS ヘッダー ‘Access-Control-Allow-Origin’ が足りない...
たしけて…

ｷﾀ━━━━(ﾟ∀ﾟ)━━━━!!

男「い、一応、夜までにブックマーク機能できたぞ」

女「やけに自信なさげだね」

男「ブックマークをしたら最後、削除できない状態なのだ。あと新着レスの報告機能がない」

女「そんなんで実装したとか笑うわ」

男「時間とやる気さえあれば実装する方針は立ってるんだ…なにもかもサイドバーからgetできなかったのが悪いんだ…解決したけど…」

女「ニートのくせに文句言うな」

男「いちいちニートのくせにをつけないでくれ」

男「ファイルが増えたのでzipのURLと全ファイルの一覧を」
基本URL：http://poke.pgw.jp/sirataki/66/sirataki.zip
jquery.contextMenu.css, jquery.js, jquery.ui.position.js, manifest.json, sidebar.html
sirataki.js, jquery.contextMenu.js, jquery-ui.js, LICENSE.md, README.md, sidebar.js, sirataki.css

女「だいぶ増えたけど半分近くjquery関連で笑う」

男「jqueryがなかったら死んでた」

女「世の中はもっと進んだライブラリを使ってるだろうに、時代遅れなjqueryを使い続ける無能ニートめ」
参考検索ワード：javascript 2016年

男「SSより面白そうな文書を載せるんじゃない」

男「話がそれたけど今回のアプデはブクマ機能と置換マネージャの追加。それ以外はたぶんない」

男「どちらもスレで右クリックすればメニューが出てくるのでわかると思う。サイドバーの表示の仕方はググってどうぞ」

女「なんか適当なURLくらい貼りなさい。例えばこのページでサイドバーの出し方書いてあるよ」
https://support.mozilla.org/ja/kb/use-firefox-sidebar-access-bookmarks-history-and-s

男「置換マネージャについてはほぼ完成形になってる。xボタンの位置がクソだけど」

女「昼間も言った通り、Firefox NightlyやDevelop Editionなら永続インストールが可能なので、暇な人は使ってみてネ」

男「引き続きブックマーク機能の実装は進めるけどそろそろ次にすることを決めたいな」

女（終わってから言えばいいのに）

女「じゃあ、>>71なんてどうかしら」

今までの機能の簡単なまとめ

女「もうなにしてきたか忘れたから簡単になにができるかまとめるとかでどうかしら」

男「健忘症かな」

女「黙れニート」

男「機能まとめといっても、大したことないからなあ。ごく当たり前のところも含めるけど」
・スレ一覧表示、スレ表示（実はスレ表示時にスレタイトルが表示されてない）
・書き込み（スレ立ては未実装）
・安価先表示
・画像ファイルのサムネ表示
・既読スレ閲覧時に既読位置（正確には前回表示位置）まで移動する機能
・ブクマ機能（削除できない）
・置換機能

女「こうやって並べてみると意外と専ブラらしいことをしている…？」

男「専ブラ作るよって言ってるんだからそりゃあね」

女「んー、これを見る限り次は>>73をするのがいいかもね」

特定の掲示板に書き込むときにsageて無い場合、警告ダイアログを50個くらいポップアップする機能
だめなら美味しい唐揚げを作る機能

女「次は特定掲示板でsageてなかったら警告を50個くらい出す機能が良いかもね」

男「警告を出すのは良いが50って」

女「無理なら美味しい唐揚げを揚げる機能でもいいわ」

男「揚げねーよって、ああギャグか。若干分かりづらい」

女「…／／／」

男「自分で言っておいて恥ずかしがってるんじゃねーよ」

サイドバーのリンクを踏むと新しいタブを開くのやめたいんだけどやり方が分からん…
というかそもそもそういうことが出来るのかどうかも分からん
本家ブックマーク以外はリンク踏むと新規タブ開いてる気がする

置換マネージャのときもそうだったけど設定画面つくるのがががががががががが
先に機能だけ実装するか…

男「設定画面も含めて、age警告機能大体できたー」

女「これがsageずに投稿されてたら失敗だけどね」

男「いや流石にないだろ…ないよな」

設定間違えてた

男「これでsageてないよ警告出ずに投稿されてたら唐揚げ買ってくるって覚悟でやったらうまくいった」

女「でも一回失敗してるよね？」

男「1回くらい許してくれんか」

女「>>81」

絶対に許すん！　何があっても許すん！！

女「絶対に許すん！ 何があっても許すん！」

男「…どっちだよ」

女「どっちととるかは男の甲斐性に委ねられました」

男「ニートに何を期待してるんだ」

女「おなか一杯の唐揚げだよ」

男「デブ活かな」

女「なにか言ったかな？」

男「すびばせん、なにも言ってないれす…」

男「唐揚げはともかくとして、次はどうしようかな」

女「sageてないよ警告以外にも地味にアプデされてるのね」

男「お、気づいた？ ブクマ機能に削除と新着通知機能追加したり、IDを書き込み数で色分けするようにしたりしたんだ」

女「ほうほう、だいぶ多機能専ブラらしくなってきたね」

男「だろだろ？ 自分でも使い勝手良いんじゃねって思い始めてきたくらいだ。次は>>84やるか」

現状の機能一覧（DL先 → http://poke.pgw.jp/sirataki/80/sirataki.zip）
・スレ一覧表示、スレ表示（実はスレ表示時にスレタイトルが表示されてない）
・書き込み（スレ立ては未実装）
・書き込み数に応じたIDの色分け ← New
・安価先表示
・IDにカーソル合わせるとそのIDで書きこまれたレスの表示 ← New
・画像ファイルのサムネ表示
・既読スレ閲覧時に前回表示位置まで移動する機能
・ブクマ機能（新着通知付き ← New）
・置換機能
・条件にマッチするスレで書き込み時sageてないと警告を出す機能 ← New

スレ立て

男「いい加減スレ立て機能付けるか」

女「一度実装してるからいつでも実装できるやって後回しにしてたもんね」

男「基本的に書き込みフォームと同じだしな」

女「スレタイ用に入力欄がひとつ増えるだけだっけ」

男「そそ、と話してる間に実装できちゃったよ」

女「物足りなさそうね。それならついでに>>86なんてしたらどうかな」

書き込み画面での文字数と行数の表示
(優先度は文字数>行数)

女「それなら書き込み画面に文字数と行数の表示する機能なんてどうかしら」

男「またライトなのが来たな」

女「ん、まあそうね。ここまで設定画面作ったり、機能そのものが微妙に複雑なものが多かったからそれと比べるとソフトね」

女「でもしたらばって板ごとに文字数と行数に制限あったりするから、書き込み時にきちんと文字数や行数を把握できるのは便利だと思うわ」

男「実装でけた」

女「こっちが話している間に…」

男「だって、textareaにkeyupイベント仕込むだけですし」

女「まあ、そりゃそうよね」

ちなみに：
SS深夜VIPは4096Byte（全角文字で約2000文字）ほどの書き込みまでOKだけど、約というのがネックで文字によってバイト数が違うので『よし2000字以内に収まったから書き込めるゾ』というわけではないのであしからず

男「面倒くさいからバイト数も数えるようにしたぞ」

女（文字コード変換のライブラリをいちいち見つけてきて使い方調べるほうが面倒くさかったんじゃないのとは思いつつ）

女「これで4096Bytesを超える書き込みをしちゃう事故を防げるね」

男「うむ。http://poke.pgw.jp/sirataki/87/sirataki.zip にここまでの成果を上げといたぞ」

女「encoding.jsが追加されたからファイル一覧も更新しないとね」
jquery.contextMenu.css, jquery.js, jquery.ui.position.js, manifest.json, sidebar.html, encoding.js
sirataki.js, jquery.contextMenu.js, jquery-ui.js, LICENSE.md, README.md, sidebar.js, sirataki.css

男「全部MITライセンスだから使っても問題ないハズ。ライセンスの全文はLICENSE.mdに載せてるし」

女「相変わらずライセンスのことはよくわかってないので、ダメ出しやライセンスに関する解説は随時受付中」

男「さて、じゃあ次は>>89だ」

女「いい加減休憩したら？」

男「安価が、来ない！！」

女「もういい加減飽きられたんじゃない？ ワンパターンだし」

男「安価が来ないとアイデアが枯れてしまう。NG機能以外にまともな機能が思いつかないのに」

女「適当な専ブラインストールして調べればいいじゃない」

男「そんなもろパクリみたいなことできない」

女（置換マネージャとかもろchaikaのIFパクってたくせによく言う）

男「それはそれ」

女「ええ…」

男「ということでアイデア募集中。>>90やるよ」

ジェスチャー

男「ジェスチャー機能を実装すりょ」

女「動揺して語尾がおかしくなってる」

男「正直どう実装していいか想像がまったくついてない」

女「すごく大雑把には、クリックしてる間のマウスの挙動を読み取ってクリックが離れた時にその軌跡を解析すれば良いと思うんだけど」

男「せやな、簡単に言うとその通りだな」

女「じゃあ具体的に言うと、
１．mousedownイベントでカーソルログを取り始めるフラグをとりつつカーソル座標の配列を初期化して
２．mousermoveイベントでカーソル座標を配列化して
３．mouseupイベントでカーソル座標を解析する
これでいいんでしょ」

男「１、２は簡単そうだが、３は簡単なのか…？」

女「前後の配列で差分を取って、移動方向を上下左右の4方向くらいに単純化して、配列内容が切り替わるタイミングを取得すればよきよ」

男「お、おお？ なんだかいけそうな気がしてきたぞ」

女「想像の域をでないから実装にかかる時間は想像つかないけどねー」

男「順調なら夜には終わってそうだが…」

女「世の中そんなに甘くないよ、ニート」

男「頑張る。ジェスチャーしたら何をするかもついでにゆるく募集」
例：戻る、書き込みフォームを開く等々

男「なんか時々乗ってくるノイズの除去方法が雑だけど一応ジェスチャーをキャプチャするところまで実装できたー」

女「あとはそのジェスチャーで何をするかだけど…」

男「だけど？」

女「返信なんてどうかしら」

男「変…身…！？」

女「バカ、返信だよ」

男「ああ、すまんてっきりあと3回くらい山場が残ってるのかと」

女「で、返信は実装できそうなの？」

男「現実問題だいぶきびぃっす」

女「なんで？」

男「やろうと思うと、
１．ジェスチャ開始時のページ内のカーソルのY座標を覚えつつ、
２．レスごとのY座標を（最悪ケースで全部）算出して
３．Y座標が適当な範囲内にあるレス番号を取得してくる
って手順を踏むと思うんだけど、2あたりから面倒くさい」

女「手順が見えてるんなら、やれ☆」

男「サーイエッサー」

男「（思ったよりあっさり）できましたー」

女「あら意外と仕事が早いのね、ニートのくせに」

男「とりあえずジェスチャの設定とかはなしで、右クリック押しながら↓→とジェスチャするとジェスチャの開始位置にあったレスに返信できるようにしました」

女「ビビってた割にはけっこう上手くできてるね」

男「コードはどんどん読みづらくなってる気がするけどね」

女「まだ、最悪作り直せばいい程度のコード量よ」

男「そ、そうね…1000行くらいすぐ書けるよね…」

女「できあがったものは以下のURLにあげておいたよ」
http://poke.pgw.jp/sirataki/93/sirataki.zip

男「そういえば、右クリックのメニューをjqueryを使わない、本家webextensionのものに差し替えたよ」

男「とはいえ、サイドバーの右クリックメニューは依然jquery使ってるけど…」

女「…次は>>95でもしようかしらね」

酉とかでレス抽出

>>95
抽出ってことはポップアップではなく新規タブで特定キーワードを含むレスだけを表示する機能、ってことでいいのかな
ちょっと自信ないけどやってみる

女「次はレス抽出機能でもつけようかしらね」

男「できたー」

女「はや。どんな実装にしたの？」

男「アドレスにクエリ（例えば?NAME=酉）を付けたらNAME要素に酉を含むレスだけを表示するようにした」

女「けっこう横着した感じなのね」

男「抽出ってことでNGや置換ほど細かな設定は要らないかなと思って簡単にしたよ。クエリは1個までしか受け付けないよ」

女「ホント、最低限って感じね。でもこんなのでいいのかしら…」

男「よいか悪いかは>>98が決めてくれるさ」

女「じゃあまあそれは置いといて次は>>99でもしてもらうかな」

ID 赤くするついでに (1/9) とかカウントもつけよう
ついでにそろそろスレタイ表示しようぜ

あ、>>98は酉抽出の是非だったのか、すまん
まあ仕様的にはそんなもんでいいんじゃね？と思うけど、
実装済みバージョンが公開されてなくて動作確認できないような気ががが

男「レス抽出機能付けたやつアップロードしてなかったからアップロードしたよ」

女「ついでにIDのカウントとスレタイもいい加減つけたね」

男「タイトルとってくるのめんどくせえって思ってたらdocument.titleにあったから一瞬で終わった」

女「そこになくても>>1の6番目くらいの要素がタイトルだったと思うけどね」

男「>>1だけにしか保存されてないのが嫌らしいよな」

女「まあ、若干>>1を特別扱いしないといけなくて面倒くさい感あるのは認める」

男「話の流れでURLを貼り忘れるところだった」
http://poke.pgw.jp/sirataki/100/sirataki.zip

女「さてスレももう100まで来たことだし記念になにかビッグな機能を実装したいよね」

男「ビッグどころか安価が来るたびにこれはできないんじゃないかと実はビッグビッグ（ビクビク）してるんですが」

女「…つまんな」

男「すみません…。でも本音だよ」

女「ここまで唐揚げ作る機能以外実装できてるしへーきへーき。そんなわけで次は>>101をしよ」

特定任意のCSSを読み込ませる機能、とか？
スキンまで特殊なものじゃなくて良いけど、内蔵しちゃうと好みのカスタマイズ出来ないし

女「外部ファイル読み込みｷﾀ━━━━(ﾟ∀ﾟ)━━━━!!」

男「Webextension自体が外部ファイルみたいなもんなのにそこにさらに読み込みか…」

女「これは私もやり方想像つかないなー。chrome.storage以外に設定ファイルを保存することとかできるのかな」

男「chrome.storageがあるのに設定ファイルを外部に持つ意味なくないか？」

女「んー、確かに。あったとしても適当にググったくらいじゃ出てこないし外部ファイルを読み込む案は捨てたほうがよさそうね」

男「となると要素ごとに設定を作る？」

女「それはいくらなんでも骨が折れるし馬鹿らしい気がする」

男「ああそうだ。CSSをべた書きしてもらって、headタグにappendすればいいんじゃね？」

女「まあ、理屈上できるけど、優先度の問題で!importantでも付けてもらわないとほとんどの設定が反映されないよ」

男「んー……それは不格好。ん、でもユーザー指定のCSSがimportantなのは間違いないのでは」

女「まあ、それはね。でもユーザ――に書かせるのはちょっと違くない？」

男「それなら、";"を" !important;"に変更する正規表現を噛ませれば良いんじゃね？」

女「あー、なるほど」

男「これなら比較的ライトな変更でなんとかなるかな」

男「オリジナルCSS設定機能できたー」

女「右クリックからしらたき → 設定で、スタイルシートを編集を選べばCSSを直接かけるようになるよ」

男「一応、デフォルト値で必要そうな要素名とかが入るようになってるから分かりやすいと思う」

女「すべてのCSSを弄れるから、その気になれば設定ウィンドウとか書き込みフォームのレイアウトも自由自在」

男「divやspanで囲まれてない要素もあったような気がするけど…」

女「そこまでこまかいところ弄りたいなら直接ソースを弄ればよき」

女「空白にすればデフォルト値に戻るので大事故でCSSがよく分からないことになっても安心」

男「内容的にはビッグな更新だけど作業量的にはライトな良いアプデだった」

女「またURL貼り忘れそうになってる」
http://poke.pgw.jp/sirataki/103/sirataki.zip

男「次は>>104をしたいな」

画像サムネイルのマウスオーバーで大きめサイズのポップアップ表示とか

女「カーソルオーバーで画像の拡大表示かー」

男「ポップアップで出そうと思うんだが」

女「それ、たとえばCSSにこれを書き加えるのじゃダメなの？」
.thumb:hover {
max-width: 600px;
max-height: 600px;
}

男「え、あー確かにそれで目的は果たせるな…」

女「デザイン的なこだわりが？」

男「気になるのは>>106だな」

男「気になるのは…」

女「ないなら無理に探さなくてもいいのに」

男「ある、あるが…」

女「なによ」

男「…カッコ悪い」

女「却下」

男「ほれ見ろそういうと思ったんだ…」

女「…はーしょうがないなあ。じゃあ安価のポップアップと同じやりかたで画像も拡大表示だしてあげる」

男「女が、俺の代わりにコードを…！？」

女「そもそも、ここまでかなり私がアドバイスしてると思うんですけど。むしろ貢献度は私の方が高い」

男「ぐぬ、確かに…」

女「そんなわけで画像のポップアップを実装したバージョンをアップロード♪」
http://poke.pgw.jp/sirataki/105/sirataki.zip

女「ついでにスレ閲覧中に←ジェスチャでスレ一覧に戻るようにしたよ。自分が使いたかったから」

男「俺の専ブラを私物化している…！？」

男「とりあえず次の機能を考える前に機能をあらためてまとめるか」
・スレ一覧表示、スレ表示
・書き込みスレ立て
・書き込み数に応じたIDの色分け、書き込み数の表示
・安価先表示
・IDにカーソル合わせるとそのIDで書きこまれたレスの表示
・画像ファイルのサムネ表示
・既読スレ閲覧時に前回表示位置まで移動する機能
・ブクマ機能（新着通知付き）
・置換機能
・条件にマッチするスレで書き込み時sageてないと警告を出す機能
・サムネにカーソルを合わせると拡大画像のポップアップ
・ジェスチャー対応（↓→返信、←スレ一覧に戻る）
・レス抽出機能
・ユーザーCSSの読み込み

女「自分でも書き忘れがありそうなくらい盛りだくさんになってきたわね…」

男「スレ建てとか当たり前の機能は次からは消そうかな」

女「じゃあ次は煩悩に従って>>108をしよっか」

オフラインでも閲覧できるようにしてほしい

女「じゃあ次は煩悩に従ってオフライン閲覧機能を付けよっか」

男「デスクトップマシンで開発してるぅー」

女「LANケーブルを抜けば解決だね☆」

男「せ、せやな」

女「いままでキャッシュはテキトーに保存してたけどもう少し真面目な形式で保存したほうがよさそうね」

男「そうな、chrome.storage中のキャッシュを選択的に削除できるようにしたほうがよさそうだ」

オフラインになるとページを開けない = webextensionにたどり着けない？
バックグラウンドのjavascriptでなんとかならないかな…

少しユーザー側の手間がいるけどでけた

男「できたー」

女「今回ばかりは少しユーザー側の手を煩わせそうね」

男「Firefox側右上のメニュー → その他 からオフラインモードをオンにしてもらう必要があるからね」

男「ただのオフラインだとそもそもwebextensionにたどり着けない問題ががが」

女「でもオフラインモード使えばしらたき使ってなくてもオフラインで閲覧できるよね」

男「せ、専ブラのUIで見れることに意味があるから（震え声）」

女「そうね、そういうことにしておきましょうか…」
http://poke.pgw.jp/sirataki/108/sirataki.zip

男「次は>>113するぞー」

補完
オフラインモードでページを開こうとすると
『現在 Firefox はオフラインモードで動作しており、このページは表示できません。』
と出るけど無視して更新すれば（キャッシュさえあれば）LANケーブル引っこ抜いてても表示できる
安価は下

男「次はついにNG機能実装するぞー」

女「やけに張り切ってるね」

男「とある専ブラで５ｃｈやってるときにNG機能の貧弱さに愕然とした身だからな」

男「例えばワッチョイスレでスクリプトをNGするとほとんどのスレがまともに見えないとか悲しいことになるから」

男「スレタイとかでNGの適用範囲を限定したり、NGにラベル付けしてどういう理由でNGになってるかとか覚えておきたいんだ」

男「透明あぼーんも全体に適用じゃなくて、NGの種類ごととかにやりたいし」

女「お、おう。熱が入ってるのは良いことだけどそのレベルのNG機能となると置換マネージャ以来の大掛かりな設定画面とかが必要だよ」

男「分かってるから後回しにしてたんだ。でも安価もとったことだし大手を振ってNG機能に集中できる」

女（したらば用の専ブラでそんな複雑なNG機能需要あんのかな…）

すっかり忘れてたけど5ch型掲示板汎用ブラウザじゃなくてこれしたらば専用なんだよな…

機能自体は良いんだけど狐自体の重さがネックになるあれ

>>117
狐が快適に動くマシン花王
>>116
とりあえずopen2chのdatファイルの所在は分かったからその気になればopen2chも対応はできそう
本家5chは無理ですな

男「置換マネージャのUI流用したらわりと早くできた」

女「…置換マネージャと競合するIDとか使ってないでしょうね」

男「あったらバグる予感するけどシラネ。実装の半分くらいがそういうののバグとりだったから大丈夫だと思いたいけど」

女「はあ、まあとりあえず動いてるから良としますか」

男「右クリックからNG登録できるよ。単にあぼーんにすることもできるし、あぼーんの代わりにラベルを付けることもできる。当然透明あぼーんもあるよ」

男「あと、（透明あぼーんしてないときは）カーソルを合わせると内容を表示するフラグも用意したよ」

女「カーソルを合わせて内容を表示するのはchaikaリスペクトだね」

男「単純に便利だしね」

女「NGは色を変えて表示とかないの？」

男「カーソル合わせれば表示できるから要らないかなって。そういう使い方したければ置換マネージャで頑張ればできるし」

女「まあ、NGの色変えは私もあまり趣味じゃないからいっか」

男「ということで成果物をアップロード！」
http://poke.pgw.jp/sirataki/118/sirataki.zip

女「次は>>120をしよっか」

なんかやけに重くなった…

重くなるタイミングが分からぬ
忘れてたけど安価は下

Windows再起動したら調子いい？
分からぬぬぬ
安価下

女「次は特定のサフィックス（orプレフィクス）で反応するように実装変更しようか」

男「いまさらーぅ」

女「バグの温床になりそうな変更量であることは認めるわ」

男「そのうえ、リクエストヘッダ弄らないと外部板からの投稿扱いになって投稿できなくなる可能性ががが」

女「その辺も含めてリスキーな更新ね」

男「ここに来て初の頓挫なんてことにもなりかねない」

女「まあ、挑戦は大事よ」

男「今日はもしかするとおでかけするかもしれないから普通に更新遅くなる可能性もある」

女「ニートが日曜に出かけるとかふざけるな」

書き込もうとすると指定されたページまたはファイルは存在しません。になる。。
たしけて…。

たぶん、POSTデータがすっぽ抜けてる…
なぜだ…

リクエストヘッダ改変してReferer付けてるのにリファラを送らないクライアントからの投稿は禁止されていますとかどないせいっちゅーねん

�����鴻��

���鐔�鐔�

文字化けェ…
Referer問題が仮に解決できてもここに帰結するんだよな…

�����������

Referer���蕁�茹ｆ浦������������絖����������茹ｆ浦���������鐚�

164162164162164162

�����鴻��

�����鴻��

������

Referer問題解決したけど文字化け問題が根深い…

文字化け問題解決できそう
ここからが本当の闘いだけど…

これが日本語なら文字化けはおおむねOK%aKorega alphabet なら完璧

改行え…

これで空白改行問題が解決してますように
改行 ←空白 !?その他記号><=+.

男「とりあえずいろいろと呻いてたけど終わりが見えてきたから経過報告」

女「遊びに行ってたんじゃないの」

男「遊びに行ってました。なので一番問題だった書き込み周りのトラブルの解消だけで表示系はほとんど実装が進んでません」

女「…一番重そうな課題をクリアしたことは褒めるべきだけど、表示系が実装進んでなきゃアップロードできないじゃない」

男「その通りです。ホントすみません」

女「で、書き込み周りのトラブルの原因と解決方法はなんだったの？」

男「まず、スキーマ（いわゆるhttpとかの部分）をext+sirataki(ext+は外せない…)に変える都合で、HTMLにフォームをべた書きして投稿することがrefererの問題でできなくなったんだよね」

女「簡単に言って、どうぞ」

男「referer（書き込み元）がhttp://jbbs.shitaraba.net/…じゃないとしたらば側から、外部から書き込みしてるんじゃないよと怒られるのさ」

女「ふむふむ、そりゃあまあ、よそのサイトから大量にスクリプトで書きこまれたら困るものね」

男「そうそう。だからrefererを適切に設定してやる必要があるんだけど、これをやろうとするとHTMLじゃなくてjavascriptでPOSTする必要があるんだよね」

女「スクリプトだと動的にreferer（を含むリクエストヘッダ全般）が弄れるもんね」

男「まあ、厳密には拡張機能のバックグラウンド側のスクリプトでrefererを書き足すんだけどね。たぶんxhrのsetRequestHeader？とかじゃ上手くできないから」

男「まずこのバックグラウンドでrefererを足すのにポカをしたんだよね」

女「ポカ？ どんな」

男「このサイトの通りにやればよかったんだけど、blockingオプションをつけ忘れて、改変したヘッダを送信できてなかったんだ」
https://developer.mozilla.org/ja/Add-ons/WebExtensions/Intercept_HTTP_requests

女「…おバカ」

男「まったくその通りで返す言葉もない…」

男「で、これでようやく投稿できるようになったは良いんだけど、次に待ってたのが文字化け」

女「これは原因自体は分かってたわよね」

男「javascript自体がUnicode系(UTF-16？)で生活してるのにしたらばはEUC-JPで生活してることが問題でしたね」

女「やっぱり。じゃあ単純にEUC-JPに変換してやれば良かったんじゃない？」

男「理屈はそうなんですけどそれで失敗したのが>>134なんだ」

女「あらま、数字だけ」

男「まあ、これも俺が馬鹿だっただけなんですけどね」

女「というと？」

男「URLエンコードかけてなかった」

女「あー、言われてみればそれはして当然だよね。日本語は直接送れないんだから」

男「というわけでURLエンコードかけたのが>>140」

女「改行ぇ…」

男「ちなみにスペースも同じ理屈でダメね」

男「しらたきが使ってるエンコード関連のライブラリ（encoding.js）だと改行を%0Aに変換するんだけど、どうやらしたらばでは%0D%0Aなんだよね」

女「ふむふむ。となると%0Aを%0D%0Aに直接変換すれば…いや、本当に%0Aは改行以外に含まれないのかな」

男「そこなんだよな。もし%0A%XXみたいな文字や%XX%0Aみたいな文字があったら女が言ったみたいな変換は使えないんだよ」

女「不味いじゃん。どうしたの」

男「EUC-JPの仕様を調べた」

女「たまにはちゃんと調べるのね」

男「今回は調べてばっかりだよ…」

男「で、結論から言うと女が心配するようなパターンはなかったから普通に変換した。空白も同様にね」

女「ほうほう」

男「で、ここまでが今の成果。ここからしらたきを実質作り直す勢いでコードを改変していかないといけない」

女「ざまあ」

男「い、いい加減コード整理しないといけないとは思ってたから…。というわけで次の更新はけっこう時間かかりそう」

女「じゃあ、ついでに次にやる案を考えておいてあげる。ありがたく思いなさい」

男「仕事が溜まってるのにやること増やすとか鬼畜！」

女「>>148でどうかしら」

スレ一覧に作成日追加とそれでソート

作成日はファイル名、ここだと1522918833がunixtimeになっててそれを日時に直せばおｋ

女「スレ一覧にスレ作成日の追加とソート機能の追加でどうかしら」

男「だからそれはどうやって取得するか謎の技術だって」

女「ファイル名が作成時間のunixtimeになってるらしいわよ」

男「なん…だと…」

女「じゃ、よろしくね」

男「まだコード整理が1/3くらいしか終わってないんですが…」

女「頑張えー」

男「女に幼女っぽく言われてもなんか頑張る気が起きない」

女「このロリコンが！」

男「今回は機能ごとにできるだけファイル分割してるからファイル数一気に増えそう」

女「代わりにコードの管理はしやすくなるわね」

男「これまでのメインスクリプトが1300行くらいあるからいい加減1ファイルを上下するの辛かったです」

男「地味に変数宣言を真面目にletやconstに直したり、Open2ch対応って安価が来ても大丈夫なようにクラス化？
みたいなこともしたりして単純作業なわりにコピペじゃ済まないから疲れる…」

女「ニートなんだからそれくらい働け☆」

男「とりあえず、スレの表示機能、NG、置換、CSS、下げ確認、書き込み、安価先表示、IDカウント、ID色付け、書き込みくらいまで移植した」

女「重そうなところからやっていくスタイルなのは相変わらずね」

男「NGとか置換とかあとで重いの出てくると萎えるから…そういえばNG機能やっぱりコピペミスしてたわ」

女「案の定…」

あとは、スレ一覧表示、スレ立て、ブクマ、画像のポップアップ表示、レス抽出機能を移植すれば完成！
まだたくさんあるように見えるけどここまでの作業量を考えればだいぶ少ない

テスト

も一度テスト

あとスレ立てとスレ一覧の実装で移植が終わるるるー

男「（移植が）終わったー！」

女「お疲れ様。実働時間で15時間くらいかしらね」

男「まあ、そんなものかな？ 終わったのはホントに移植だけでスレ一覧の作成日取得とソート機能はまだなんだけど」

女「え？ もう次のアイデア考えてたのにひどいわ」

男「ニートを過労死させる気ですか？！」

女「ニートがちょっと頑張ったくらいじゃ過労死なんてしないわ」

男「ひ、ひどい…」

女「とりあえず次に実装するのは>>157が良いと思うの」

男「どんどんアイデアが先行していくぅー」

男「あ、進捗アップロードします」
http://poke.pgw.jp/sirataki/154/sirataki.zip

女「個別ファイルでDLしてる人は過去にいないし、ファイル数が増えたから今後はzipでの配布だけしてくつもりかしら？」

男「個々のファイルもアップしてるので、時間があればApacheの設定いじってIndexofあたりのフラグをオンにするつもりなんだけど」

女「ニートに時間がないわけないのに」

男「訂正：気が向いたら」

女「ああ、そうだスキーマをext+siratakiにした都合で、今までみたいにしたらばを開いてもしらたきは開かないわ」

男「そうだった。手動でURLのhttp（s）の部分をext+siratakiに変えてください」

男「その辺の自動化はおいおいしていくつもり…」

男「平日で安価がこないのを良いことに実装をガンガン進めたぜ」

女「流石ニート」

男「そんなわけで、したらばにアクセスすると自動でhttps -> ext+siratakiにリダイレクトするようにしたぞ」

男「あと作成日と（前回既読分までと比較して）新着レス数をスレ一覧に表示して、各要素でソートできるようにした」

男「それとソートのついでに検索という名のフィルタもできるようになった」

男「こまかいところでは↓↑のジェスチャで更新を追加」

男「こんな感じのアプデをしました」

女「一番大変そうな一覧のソート機能を外部ライブラリに丸投げしたくせに偉そうな」

男「新しく追加したdataTablesライブラリもMITライセンスだから問題ないはず」

女「危うく適当に調べてでてきたGPLv3ライセンスのライブラリ使うところだったもんね」

男「マジで自滅するところだった」

女「成果物は下記にアップロードしてまーす」
http://poke.pgw.jp/sirataki/156/sirataki.zip

男「次は>>158しようかなあ」

自動リダイレクトだと元々の表示で見たいときアドオン無効化しないといけなくて面倒だから
リダイレクトはせずにコンテクストメニューでスキーマ置換してしらたきのブックマークに放り込めるようにしよう

男「自動リダイレクト付けといてなんだけど、元のしたらば見たい時にアドオン無効化するのは面倒なんだよな」

女「>>158みたいにすればいいじゃない」

男「それだと、DAT落ちしたあとにブクマからアクセスすると何も見えなくてよくないんだよな」

女「あー、本当ならread_achive.cgiにリダイレクトされるのが止まっちゃうんだ」

男「うん。あ、でもブクマ含めてしらたき自身からのアクセスだけext+siratakiにリダイレクトさせればいいのか」

男「write.cgi、rawmode.cgiとかいくつかのアクセス先はext+siratakiにリダイレクトしてはいけないとか
read.cgiはしらたき以外からのアクセスではリダイレクトしないってのは単純でいいんだけど」

女「いいんだけど？」

男「板トップのアクセスだけはリダイレクトしたいときとしたくないときが複雑すぎてhrefをext+siratakiとhttpsでかき分けるしかなかった」

女「どうしてそーなった」

男「サイドバーから板名をもらうためにxhrで板トップにアクセスするときはリダイレクトされたくないけど、aのリンクとして扱うときはしらたきにリダイレクトしてほしい」

女「ああ、なるほど。それ、xhrのヘッダ改変機能使って改変したヘッダを検出したときだけリダイレクトなしにすれば解決するんじゃない？」

男「…まあ、目的は果たせてるから良し」

女「あ、面倒くさがった」

男「目的を果たすもっと面倒くさい方法としてはchaikaと同じようにコンテクストメニューからブラウザで直接見るっていう項目を付け足す方法がある」

男「これについては実装方法がぱっと思いつかなかったし>>158の手段と矛盾するから考えることをやめた」

男「したらば（生）側からしらたきにお気に入り登録できるようにした」

女「これで>>158の機能は概ね言われたとおりに実現できたわね」

男「実装の中身が多少違うけれど、見た目上の効果は同じだから許容ラインということで」

男「ついでにいくつかのバグフィクスもしたよ」

女「いつも通りアップロードしたよ」
http://poke.pgw.jp/sirataki/160/sirataki.zip

女「なんかwebextensionをだいぶ使いこなせるようになった気がするね」

男「うむ。Hello world的な立ち位置を通り越してる気はするけど今ならなんでもできる気がするし、>>161でもするか」

ID右クリでNG登録、名前欄でワード選択(主に酉)してレス抽出
は良く使うかな

男「右クリでNGとか抽出とかやるか」

女「抽出は今でもしてないっけ」

男「選択範囲にかかわらずデフォルト検索ターゲットが名前になってるから、右クリックのポジションでターゲットも切り替えられるようにしようかなと」

男「NGはIDとか一発で登録したいし」

女「一応、document.elementFromPointっていう関数はあるらしいから実現はできそうだけど初めて使う関数ね」

男「試し試しやってみるしかないね」

男「そういえば、全然関係ない話だけど友達の勤めてる会社のシャチョーと面談することになった」

女「お、このニートとうとう就活しはじめたか」

男「働きたくないでござる…というか職歴なし人間だから色々自信ないわ…」

女「私からできるアドバイスは>>164かな」

女「私からできるアドバイスは特にないかな」

男「ええ…」

女「人生そんなものよ。あまり他人に期待しすぎないことね」

女「そもそも働きたくないでござるとか言ってるやつにかける言葉なんてないわ」

男「それはその通りですね…」

女「で、しらたきの実装は進んだのかしら？」

男「一応、右クリックから選択範囲要素を識別して抽出の位置検出と一発NG機能は付けたよ」

男「あとスレ一覧のレイアウトを少し弄った」

女「その辺はCSSでユーザー側で弄れる話だからまあ、些末な問題ね」

男「まあね、あといらすとやでしらたきの画像を借りてきてアイコンに設定してみた」

女「…まあ、いいけどどうなのその画像」

男「もっとイカしたやつが欲しいよね」

女「随時募集中ってことね」

男「とりあえずそんな感じでアップロード」
http://poke.pgw.jp/sirataki/164/sirataki.zip

女「次はそろそろ>>165の出番かしらね」

うーん、微修正を挟むたびにバグらせてるな…
ブクマの新着通知機能が部分的に機能しなくなってたから修正
安価下

女「次はそろそろここまで読んだよ機能の実装ね」

男「…一応、前回読んだレスまでスクロールする機能はあるんだけど」

女「あらそうだったかしら？ じゃあ、それがわかりやすいようにここまで読んだってしおりも付けましょ」

男「まあ、それくらいならすぐできるかな」

ここまでの安価はなんだかかなり真面目に専ブラ作ってるけど
へんな安価がきてもニートが困るだけだから気軽に安価とってくれていいんよ
あとSS板だからと言ってSS読むのに役立つ機能じゃなくても全然おｋ

男「既読分のレス番号をもともと保存してたからこのくらいの機能なら実装すぐ終わるよね」

女「あら流石に早いわね」

男「重要な部分は既実装だったからこんなもんでしょ」

女「できることもだいぶ増えてきたから一旦機能の整理でもしようかしらね」

男「確かに、自分でもパッと思い出せないや」
機能一覧
・スレ一覧表示（新着表示、作成日表示、各項目でのソート）
・書き込み数に応じたIDの色分け、書き込み数の表示
・安価先表示
・IDにカーソル合わせるとそのIDで書きこまれたレスの表示
・画像ファイルのサムネ表示
・サムネにカーソルを合わせると拡大画像のポップアップ
・既読スレ閲覧時に前回表示位置まで移動する機能（ここまで読んだのしおり付き）
・ブクマ機能（新着通知付き）
・置換機能
・条件にマッチするスレで書き込み時sageてないと警告を出す機能
・ジェスチャー機能（↓→返信、←スレ一覧に戻る、↓↑更新）
・レス抽出機能
・ユーザーCSSの読み込み
・オフライン時キャッシュ利用閲覧
・NG機能（一発NGあり）

男「次は>>169かなー」

ではOpen2ch対応で

所々仕様が違うからそれなりに大変かな

男「次はOpen2ｃｈ対応かなー」

女「ついに来たか」（ガタッ

男「おう、ノリノリだな」

女「男がひーこら言う姿が想像できるからね」

男「そういうことか…」

女「URLで物事を判断してるところ全部書き換えだよ、やったね」

男「うげ、そうだった…。やべー数あるぞたぶん」

女「バグの温床だね」

男「ちなみに今日昼から件の面談」

女「死んで来い」

男「まあそれはともかく、だから作業が滞る可能性大だよって話ね」

女「許さん」

男「許して」

ふえぇ…Baseクラスを継承したはずのOpen2chオブジェクトの中身が空っぽだよぅ…
Javascriptの似非クラスの感覚はよく分からないんだよぅ

ふあぁ継承できたよこれで実装が進められるんだよ

ajaxだと謎の失敗をするけどXMLHttpRequestだと無事にdatを獲得できる…？
ちなみに面談の結果は来週くらいにほかの上の人を交えて面接することになりました
職歴を手に入れるべきという常識的判断と働きたくないという心の叫びのジレンマに悩む人間の屑

男「とりあえずスレを表示することはできた」

女「そんな中途半端でアップロードするつもりかしら？」

男「ま、まさか…きちんと書き込みとかスレ一覧取得とか、ブクマ機能とか追加するまでやるつもりりりだし」

女「最後の方が動揺を隠せてない気がするけど、まあいいわ」

男「ただ就職が早いと5月にはしてる可能性があるってのが怖いですな」

女「働きたくないもんね？」

男「その通りなんだけど、人に言われると釈然としない」

女「忙しくなりそうなら、おーぷん対応したら署名して配布したら？」

男「署名して配布…。このクソコードを世界にさらしていくのか…」

女「自分でクソコード言わない」

男「自分で書いたコードはもれなくクソに見える病気なんだな」

乗り気がしないっていうのは事実なんだけどそれで両親に反対されるのはどうなんだろうね
悪い人たちじゃないんだけど

心配してるんだよ色々と
会社に迷惑だけかけて辞めないかとか
そうなったら友人とも気まずくなるとか
勿論そうなった時の>>1の事も
どんなにきつくても人間関係が悪くない職場が悪い職場より100倍ましとか色々と悟るには経験も必要
月並みだけど3年は頑張ろう位の気持ちは欲しい所かと

>>180
くだらない愚痴につきあってくれてありがとう
確かに心配だわな


おーぷん２ｃｈ「書き込みが完了しました」
ぼく「なんで書き込めてないんじゃ…」

あああ、エラーメッセージくらいだせやああああああああああ

男「……」

女「どーした、元気ないね？ おっぱい揉む？」

男「いやいいや。まあ、もろもろ考えたくない現実が迫ってきたとかそういう話もあるけどそれ以前に」

女「おっぱいスルーとかだいぶダメそうですね」

男「沈黙のサイト、おーぷん２ｃｈ」

女「そんな沈黙の臓器みたいに…」

男「いや、まじでいろいろエラーメッセージでなさ過ぎて辛いんだけど」

男「jqueryのajax使うとなぜかGETできないし、POSTすれば『書きこみました。』からの書き込み失敗…」

男「リダイレクトするか否かを決めるためにoriginUrlを参照しようとすれば、undefined…」

男「まあ、undefinedはそれ自体を条件に組み込めばよかったから別にいいけど…」

男「もームリ、無言なりエラーなりを吐いてくれるならいくらでも付き合ってやるぜって思うけど、平気な顔されたら俺どうしたらいいか分からへん」

女「平気な顔をして平気じゃなかったのはどこの誰でしょーか」

男「それはそれ、これはこれ」

男「そんなわけで、おーぷん２ｃｈ対応は現状、読み込みオンリー、ブクマ非対応という散々たる有様」

女「ブクマに非対応なのは君の怠慢だけどね」

男「サイドバー周りのコードが短いわりに異常に汚くて（白目）」

男「とりあえず現状でアップロードしちゃう…誰かたしけてくれるのを待ってる」
http://poke.pgw.jp/sirataki/182/sirataki.zip

女「だいぶ疲れてそうだし次はソフトに>>185をしつつ休憩しようか」

cookieつけてないとBotとして弾くような仕様を5chはしていたなような
openはしらん

read.cgiをxhrでgetしてSet-Cookieヘッダを調べてみたけどなんもついてない。。

エラーｷﾀ━━━━(ﾟ∀ﾟ)━━━━!!

書きこめた―！
結局refererをうまく設定できてなｋっただけという罠…

男「書きこめたからスレ立て、書き込み機能を追加したバージョンをアップロードしたよ」
http://poke.pgw.jp/sirataki/189/sirataki.zip

女「結局なにが原因だったの？」

男「refererを設定したつもりで設定できてなかった」

女「ただのポカじゃん。私のやさしさを返してよ」

男「すまんな」

男「ブクマは半対応状態。新着通知とかはしてないけど追加はできるって感じ」

男「あと、俺の環境の問題か分からないけどおーぷん２ｃｈは専ブラ使う使わないにかかわらずなんだかアクセスが遅いときがある」

女「その辺は通信環境の問題な気もするけどねー」

男「いくら信用度の低い手作りLANケーブルが間に挟まってるとはいえそこまで遅くなるとは思えないんだけどな」

女「私は門外漢なのでわかりませーん」

男「…とりあえず次は>>190やる」

おーぷんのついでにSS速報VIPにも対応しちゃおう

テキトーにおーぷんと同じノリでdatファイルを要求したらなにも手に入らなかった

datが手に入らないのに２ｃｈ互換とはいったい…うごごごご

上に普通にリンクがあった
見落としぃ…

datパスの場所間違えていくぅ…

JSが多重継承できないのつらい
ほかの掲示板に対応するとなると基底クラスをしたらばで作ったのが間違いだった感ある

あれ多重継承できないってもしかして複数継承できないってだけで直列にならできるのか？
JSはよくわからない民

書き込みのエラーメッセージが文字化けしてて泣くぁあああああ

男「とりのあえず、SS速報VIPに対応した（ブクマ機能はおーぷんと同じく新着通知に非対応）」

女「SS速報VIPってことはVIPサービスに対応するってことだよね、まあ２ｃｈ互換だからopen2chのクラスを継承すれば簡単そうではあるね」

男「今日一日色々あって作業時間があまり取れなかったけどできた程度には簡単でしたな」

女「そのわりにあらぶっていたように見えたけど」

男「おーぷんとかVIPサービスとかしたらばとかの基本的な構造は大体一緒のくせに、なぜか通用するコードとしないコードがあったり」

男「おーぷんとVIPサービス両方SJISのはずなのに文字コード指定しないと文字化けしたり逆に指定したら文字化けしたりして頭がおかしくなりそうだった」

女「踏み入ると嫌になりそうだからそう、とだけ言っておくわ」

男「ちなみに多重継承できないってのはたぶん複数クラスを継承できないってだけで直列に2個3個と継承していくのはできるみたい」

男「おかげでVIPサービス用のコード修正はほんとに軽微」

男「ただFirefoxの挙動が怪しくて無駄に開発時間が食われた感はある」

女「やっぱりFirefoxのアドオンで開発するのが間違っていたんじゃ…」

男「嫌だ、いまさらElectronに切り替えるなんて絶対に、絶対にやらないからな！！」

女「誰もElectron使えとは言ってないけど」

男「Javascriptで書いたこれまでのコードが流用できるGUI開発環境って言ったらElectronしか思いつかない」

女「別にJavascriptにこだわらなくてもいいのよ」

男「全プラットフォーム共通で使えるっていう条件でもぱっと思いつくのElectronだけなので…」

女「まあ、それはそうかもね」

男「いずれにせよ、いまさら絶対に移植なんてしないからな。それするくらいなら就職してやる！」

女「お、おう。就職は普通にすればいいと思うよ」

男「ということでアップロード」
http://poke.pgw.jp/sirataki/198/sirataki.zip

女「そういえば、このドメインやけにポケモンっぽいわよね」

男「実はポケモンGO関連のちょっとしたツールを使うために取得したドメインだからポケモンっぽいという裏話」

女「へえ…（興味はない）」

男「自分からふっておいて…まあいいや。次は>>201する」

SS一気投下機能

男「次はSS一気投下機能つける」

女「一気にSS板っぽい機能になったね」

男「一気投下といいつつ、実際には連投規制に引っかからないように30秒ごとにPOSTするだけのスクリプトになりそうだけど」

女「まあその辺は仕方ないね」

男「あと普通に就職の方向に話が進んでるので、そろそろ真面目に専ブラ作る暇がなくなるかもしれない」

女「おめでとう、といえばいいのかしら」

男「面接で突如あ、やっぱり採用はなしでって言われたら知らへんけどな」

女「男ならやられかねないわね」

男「伊達や酔狂でニートしてるわけじゃないからな」

てすと１

てすと２

あ

男「一気投下機能実装したよ」

女「はやーい」

男「そんな複雑な機能じゃないしね」

男「自動投稿機能だからくれあくじゃぞ」

女「でもSS書いてると確かに欲しい機能だもんね」

男「うむ」

男「いくつか注意点があって、まとめて投稿中はリロードはしない、区切り文字はあえて改行を含んでいないので例えば」
これ
--
あれ
男「と--で文章を区切りたい場合、区切りは改行コードを含めて--\nと指定すること」

男「区切り文字は正規表現なので区切りを#[0-9]+\nとすれば
ここ
#1
そこ
#2
あそこ
男「と区切ることもできるはず（試してない」

男「そうだ、新しく投稿した内容を専ブラに反映させられないから、投稿状態をきちんと確認したければ別タブで開いてもらう必要があるのも注意」

女「それはなんとかならなかったの？」

男「まあ、HTML構造を少し変えればできなくもないんだけど、そういうレベルの話になってくるからとりあえずスルーした」

男「エラーが出ると投稿が止まるので、勝手に投稿が進む心配はしなくておｋ」

男「投稿間隔は深夜では30数秒にすれば問題なくうごく。30秒は試してないけどいけるかな？」

女「長い」

男「すみません。注意点はこのくらいです」

女「いつも通りアップロード」
http://poke.pgw.jp/sirataki/205/sirataki.zip

男「次は>>210する」

一気投稿の悪用対策で書き込み成功時の名前欄が>>1の名前欄と不一致 or ◆を含まなければ投稿ストップとか

男「一気投稿の悪用対策する」

女「就職準備で忙しそうなのに難しそうなことを…」

男「作ったものには責任を負っていくスタイル」

女「そこまでいうなら付き合うけどね」

男「ということで、>>1のトリップを見て投稿できるか判断しようと思う」

女「セキュリティ的には一番安全っぽい気がするけどさ」

男「けど？」

女「実装はかなり大変だと思うよ」

男「というと」

女「やり方によるけどどちらにしても大きな課題がある」
１．投稿前にトリップを確認する → トリップ計算の仕様を理解する必要がある
２．投稿後にトリップの確認をする → どの投稿が今投稿したものかきちんと識別する術がない

男「あー…、できれば１で実装したいけど…最悪は２で最新の投稿のトリップ比較とかするかな…」

酉か知らんのかｗ 仕様解らんとどうにもならんぞｗｗｗ
掘り起こしてきた、perlだけど
生成コード 従来5,新309、単に生成だけならこれのが解り易いかもな参考コード263

名前記憶機能(スレ毎)も欲しくなるなぁ （ﾁﾗｯ

って書いてたらレス来てたｇんｇｒ

>>212
ありがたやありがたや…
でもperlのcrypt相当のことをMITライセンスでJSでするライブラリがよく分からないよう…
暗号化全般のライブラリ（crypto-js）があるけど、ファイルが多すぎぃ！

てかそもそも2chと仕様同じなのか？テスツ
◆choco.get.なら10桁は同じ

>>214
あああああああああああああああああああああああああああああああああああああああああああああああああああああああ
いや文字コードの違いとかそういう些細な問題かもしれないって思ったけど半角文字なのねー…

自分でもトリップテスト
◆.CzKQna1OUだったらいいなあ

記号が入ると変わってくるのかな

，と’ がEUC-JPとSHIFT-JISで文字コード違うから多分それだ（希望的観測

test

test2

���[���c

◆LLLLLLLLL.？

自分で使えそうなハッシュ化ライブラリを見つける → ライセンスが合わない
ライセンスが合うライブラリを見つける → 使い方が分からない
うーんこの…

心が折れそうだ…（ダクソプレイヤー並みの感想
javascriptでトリップ解析してる人がすでにいてソースも公開されてるけどライセンスがGPLv3…
Crypt(3)部分だけなら2条項BSDっぽいし、これは感染しないものらしいから使っちゃっていいのかな

てすと１

てすと２

てすと１ → h|,yJ6n
てすと２ → h|yJ6n'
てすと３ → h,yJ6n'

テスト４ → h|yJ6n

カンマが2バイトっぽいふるまいをしてる気がする

これ → ha|,yJ6n

てすと → ha|,yJ6

テスト → ha|,yJ

3バイト…だと…
4バイトだったらもう匙投げるレベル
これ → ha|,y

,以降扱わない、とかかな？流石に範囲広すぎんだろ
これ → ha|,

頭混乱してきた
,一文字で4バイト分の領域で計算されてるくさい

これ → haa,y

ブラウザじゃ遅いからnodejsを使って,周辺の4バイトを全探索ちう…
これカンマ以外にも同じようなのがあったらどーすんだろって話があるけど

とりあえず1/256の10/256くらいまで終わった
ちなみに12桁は対応してるんだろうか → #123456789012

対応してねーな → #1234567890

日本語はどーなるのっと → 日本語
期待◆06jO0o602k

それは考えたんだけどエスケープされても%C2だから3バイトなんだよな
4バイトの理由がわからぬから総当たりに逃げるでござる
最悪、カンマいりは非対応にする

＆＃４４；ね↑のは

>>246
そういうことか、会話がrawmode.cgiありきになってて分かりづらいｗｗ
1/256の1/5くらいおわった…あと1200倍(≒1200時間)くらいの時間があれば総当たりは完成するはず
…わかってたけど総当たりは非現実的だな
4バイトになりそうな要因が思いつかない

こうすれば先頭1バイトずつ確認できるのか → #1234567,

1バイト目は1か129だ

これ → #123456,

これ → 12345,

1234,

意味は分からんが、「,」は[1, 23, 1, 77]の4バイトあるいはそれらに128を足した値で表現されてる

とりあえず、,をトリップに使えない改行、タブ、改行、カンマで置換してそれぞれの文字コードを1,23,77に置き換えるようにしてしたらばのトリップ事情に対応
12桁は後々でいいや…

結果論だけど、256^4を総当たりでやってもギリギリ見つけられそうな範囲に答えがあったなーと…

#1234＠∀
酉テスト

男「紆余曲折はあったけどなんとかなったー」

女「2条項BSDのライブラリ（crypt.js）を新しく追加したからライセンス周りの記述をどうすればいいのかいい加減真面目に勉強したほうがよさそうだけど」

男「とりあえずは動いた感動に漬かりたい」

女「まあだいぶ悪戦苦闘してたものね」

男「まずcrypt.jsがやってることをやってくれるMITライセンスのライブラリを見つけられないところで挫折しかける」

女「そしてMITと2条項BSDはだいたい同じで、感染もしないし共存できるんじゃと思いcrypt.jsに手を出すと」

男「言葉は悪いけど、まあうん。ライブラリって武器を手に入れるまでが長かった」

女「その武器を手に入れる前から◆choco.get.問題があったけどね」

男「それなあ、ほんと辛かった。「,」が4バイトだと気づいた自分偉い」

女「その問題も、果たして本当に,だけかって問題が残ってるけどね」

男「まあ見つけたら同じ方法で変換していくしかないね…」

男「なんだかんだで動くものができたらかアップロード！」
http://poke.pgw.jp/sirataki/255/sirataki.zipでDLしてるけどね

女「前回のsirataki.zipはセキュリティ面を考慮して削除しておいたわ」

男「さすが女、仕事が速い」

女「もっと褒めてもいいよ」

男「（面倒くさいからスルーして）、次は>>259を実装しよ」

＼ライセンスの勉強／


マジレスすると、BSD-2+MIT=どっちにしてもいい。
各々のファイルのライセンス表記だけ消さなきゃ成果物はどっちでも可。exe化した時にソース出さないのも自由

URL書くたびに予測変換がつくのやめてほしいのう
ライセンスの勉強か…自学ってとっかかりがなくて辛いんだよな

https://www.catch.jp/oss-license/2013/09/27/mit_license/
ここに従えば、各ファイルのヘッダ部分（ライセンス部分）が残してあればよいとのことだけどヘッダにライセンス情報が載ってないファイルもあるような
あとAUTHORS.txtを書く慣例があるってあるけどjquery系の著作権者って誰になるんだ…

ああ、そうかLISENCEファイル自体も残しておけってことか
逆にLISENCEファイルがないやつもあるけどそれはヘッダだけ残しておけばいいってことかな

他所のLICENSEファイルどこに置けばいいんだ…

https://qiita.com/bremen/items/c5aa9446e73aa4bc1de0
派生ソフトウェアをソースコード形式で頒布する場合：
利用元OSSのソースコード中に「著作権表示」、「ライセンス文」、「免責条項」が含まれているため、これらを故意に除去しなければ特に何もする必要はない。
↑ということは今まで通りでおｋなのか

バイナリ形式で再頒布する場合：
頒布するバイナリファイルと併せて利用元OSSの「著作権表示」、「ライセンス文」、「免責条項」を掲載したライセンスファイル（「COPYINGファイル」や「LICENSEファイル」）を頒布先に提供する必要がある。
↑これが気になる
最終的にもし署名してXPI形式にする場合、なんらかの形でこれをする必要があるけどどういう書式でやればいいのか分からん

いまさらだけどこういうところ見るとサイトによって事前処理される特別な文字は異なるみたいね
サイトごとで少数とは言え真面目に対応しようとすると調べるのは時間かかりそう
https://ja.osdn.net/projects/zerochplus/svn/view/triptest/trunk/trip.cgi?view=markup&root=zerochplus

このサイトしたらばも載ってるけど,のことは載っていない…だと…

酉テスト#<>

#<>a
てすと

#1234567<
テスト

#123456<
テスト

#12345<
テスト

#1234<
テスト

#1<23

#12<23

したらばのsaltをどう置換すればいいのかよくわからない事案
とりあえず<>は.でよさそうだけどあとは一つ一つ試していくしかなかね…
#a:;

#12:
テスト

てすと
#1234:123

#1234:12
てすと

#12;
てすと

#12=
てｓつ

$salt =~ tr/:;<=>?@[\\]^_`/ABCDEFGabcdef/;
この部分が若干信用ならないっぽい
少なくとも<>については.で置換されてるけどこれ以上検証しようと思うとあと10数回同じように酉投稿しないといけなくて面倒くさいお
#12?

#12[
怪しそうなところだけあたりを付けてやるか

男「ふむふむ、ソースで再配布する分にはソースのヘッダあたりにあるライセンス条文を残しておけば問題ないと」

女「きちんと書いてあるソースならそれでいいけど、そうでないソースはどうするのかしら」

男「知らん」

男「ライセンスのお勉強秋田」

女「たしかに、そろそろ次のことやりたいね。>>285なんてどうかな」

安価でグロとか書かれたらサムネがモザイクになるやつ

女「安価でグロ画像にモザイクかけるなんてどうかな」

男「その機能か。うーん…」

女「いつもみたいに乗り気じゃないね」

男「いや機能としては欲しいんだけど、実装どうするかなって」

女「全レス中から安価付きレスをとりだす → その本文にグロが含まれてるか判定する → 安価先にあるimgにモザイクをかける」

男「いつも簡単に言ってくれるぅー」

女「実際それしかないじゃない」

男「そんなもんでいいのかなあ。マグロとか書かれてたらどーすんだよ。モザイクかかっちゃうじゃん」

女「知らんわｗｗ」

男「実装でけた。また追加ライブラリの出番かなって思ったけどCSSだけでできた」

女「ふむふむクリックしてる間はモザイクが解除されるのね」

男「img.blurでfilter: blur(4px);としてるだけだから、フィルタの濃度を変えたければCSS弄ってもらえれば」

女「マグロ対応はどうしたの」

男「スルーした」

女「結局かい」

男「明日面接で緊張して作業が手につかないいののだ」

女「声が震えてるゾ」

男「ニートにとって面接は恐怖…」

女「私とか友達とかとは平気で話せるのに―」

男「そんな調子だから一応次は>>288するつもりだけどいつ完成するかは不明」

女「完成分のアプロード忘れてるー」
http://poke.pgw.jp/sirataki/286/sirataki.zip

面接とか諸々おわた
5/15までは時間ありそう
安価下

男「Android対応のしたらば専ブラ作るか（Firefoxの拡張機能の範囲で）」

女「また大きく出たわね」

男「やっぱり大変かなー」

女「今までみたいにコンテキストメニュー（右クリック）が使えないから、」

女「手動でURLをext+siratakiに書き換えてもらうか、最初の仕様みたいに（ちょっと行儀が悪いけど）したらばを直接書き換える専ブラにするか」

女「どちらかしかないんじゃないかしら」

女「それに右クリック使えないなら一発NGとか設定画面開くとかもろもろもできないし」

女「レイアウトもばっさり変えないといけないし」

女「簡単に済む要素が見当たらないわね」

男「そこはゴールデンウィークパワーで…」

女「まあチャレンジするのは良いことだと思うわ」

初めてスマホ版のしたらば見たけど結構見やすいし使いやすそうでワロ
コンテキストメニューなしで現状の見やすさに対抗する術が思いつかない

あと別プロトコル用意したらAndroidにアドレスのプロトコルが不明ですって言われて弾かれたから行儀が悪いタイプの専ブラしかつくれなさそう

モチベがががが

てすと
ext+sirataki://test/

専ブラというか、デフォルトのしたらばを拡張する方針にしようと思うのだけどどんな機能がいいかな
（read.cgiとrawmode.cgiの同時アクセスとかいうあまり行儀の悪いことしたくないからHTML直接パースするかな…）

男「研修で実家出ちゃったから開発用マシンなくてスレごと放置してたでござる」

女「こいつ、まじめに仕事してたのか…」

男「真面目に仕事してたら土日も仕事の勉強してると思いまーす」

女「給料泥棒か」

男「…」

女「まあクビになればいいと思うよ」

女「で、しらたきのモバイル端末対応は？」

男「Androidマシンがなくなったので検証できません」

女「おい」

男「開発環境がへっぽこ（Surface laptopで実働ほぼ日曜だけ）になったので更新もまともにできるかわかりません」

女「おい」

男「それでもよければ（モバイル対応以外で）とりあえず安価とっｔ」
女「いやいやいや、安価は絶対でしょ。なにモバイル対応をなかったことにしようとしてるの」

男「>>299にも書いたけどモバイル対応しようとするとHTMLを直接パースするとかいう不毛なことをすることになるから…」

男「HTMLとかいつ形式が変わるかわからないデータを解析しても幸せになれないと思うんだ」