()

咲-Saki-のブログです。

推奨ブラウザ:Google Chrome / Firefox
非推奨:Internet Explorer / Edge(表示の不具合に対応中です)
Edgeで閲覧の際に画面の一部がぼやける問題は解消しました。
当サイトで使用している画像その他著作物の著作権は、すべて各著作権者様に帰属します。

まだ途中経過っぽい感じですが、一応テスト版
あ、「入力モード切替ボタン」には何の機能もありません。
自動切替にする方向で、結局使わなさそう。
動作がおかしいときは再表示→上のテキストエリアにフォーカスで、多少改善します。

前記事の disPai()を改造中に面白いものができたので載せておきます。

入力欄に牌コードを書き込むと、リアルタイムで牌画が表示されていきます。
入力文字を確定前に認識する JSコードは、HTMLを書き変える方法を探していた時に
たまたまこちらのサイト様で見つけました。
鷹の島>JavaScript で日本語の変換途中の文字列を取得する
求めていた以上のお宝を発見できて、ちょーうれしいよー。
ここに記して御礼申し上げます。

さて、まずは例文をコピペしてみて、要領が分かったら自分で打ち込んでみて下さい。
簡単な牌コード表と規則は、下の方にあります。
操作具合の感想など頂けたら幸いです。

例文
  • 次のツモの,nan,をカン…嶺上牌の,m8,で和了って原村さんをまくる…!
  • てめェさっきの,p7,はなんだ!!
  • m1,m9,s1,s9,p9,p9,p9,nan,sha,pei,hak,hat,chu,,フ・・・ パタン
  • p3,p4,sha,sha,sha,nan,nan,,p2,ツモ,,ura,pei,pei,ura,,ton,ton,y_ton,8000・16000ですよー!

下の領域に牌画が表示されます。


disPai() ver.1.01 牌コードと規則

区切り文字,(コンマ) コンマを続けて書くとその部分に全角スペースが挿入されます。
但しコンマ自体を文字として表示することはできません
萬子m1,m2,m3,m4,m5,m6,m7,m8,m9
筒子p1,p2,p3,p4,p5,p6,p7,p8,p9
索子s1,s2,s3,s4,s5,s6,s7,s8,s9
字牌ton,nan,sha,pei,hak,hat,chu
赤ドラm5a,p5a,s5a
その他pch,qst,ura
横に倒す牌先頭に y_ をつける 【例】 y_ton, y_m5a など(uraは倒せません)
浮かせる牌最後に _k をつける 【例】 nan_k, p5a_k など(y_との同時指定不可)
無効な文字改行、タブ、区切り前後の全角・半角スペース
その他上記以外の文字列はそのまま出力されます。

少し前、スプライト画像を利用する牌画表示法の記事を書きました。
作った当初は<img>タグよりはかなり短くて済むんでわりと満足してたんですが、
客観的にみると



これを表示するためだけに
<span class="ancoro tile_m5">五</span><span class="ancoro tile_m6">六</span><span class="ancoro tile_m6">六</span><span class="ancoro tile_p1">①</span><span class="ancoro tile_p2">②</span><span class="ancoro tile_p3">③</span><span class="ancoro tile_p3">③</span><span class="ancoro tile_p3">③</span><span class="ancoro tile_p6">⑥</span><span class="ancoro tile_p8">⑧</span><span class="ancoro tile_s5">Ⅴ</span><span class="ancoro tile_s6">Ⅵ</span><span class="ancoro tile_s7">Ⅶ</span>
やっぱ、長いよね…

というわけで、もう少し短く書けるように JavaScript で置換ツールを作ってみました。
それがこちら。
<script type="text/javascript">
disPai("m5,m6,m6,p1,p2,p3,p3,p3,p6,p8,s5,s6,s7");
</script>
牌を表示させたいところに scriptタグを置き、この中に disPai() という関数を一行書き込むだけ。
牌を示す符号を文字列として渡してやれば、JavaScript が上の長いコードに翻訳して HTML に書き出してくれます。
ちなみに disPai というのは display pai …のつもりです(笑)

以下、今さら需要も無いとは思いますが、書いておきたいから書きます。
牌テクノロジーだ!文句あっか!て感じで続きを読む

あは。
先週は、発売日を一週間勘違いしてしまったよ。

早朝四時起きして、わざわざ高浜のコンビニへ行った。

好きな子の地元にお金を落としたかったし、
あの階段の上で、彼女を感じながら、待ちに待った最新話を読みたかったんだ。

でも、YGは売ってなかった。
店員さんに聞いたら、この辺では雑誌の配達は五時以降だけど、ウチの店で扱ってるかどうかは自分にはわかりません。
とのことだった。あうち地元とは思えない!

五時まで待ってもよかったんだけど、早く読みたくて。
引き返した。
始めからここで買ってれば…と、最寄りのローソンへ。
売り切れてるマジかよセッニョールまだ朝の五時過ぎだぜ?

発売来週だったよ!と気づいたのはそのすぐあとのこと。
やれやれ、とんだドジ踏んじまったぜ。


そしてやっと昨日、無事ゲット。

そんなNSに、神がまさかの贈り物。
Thanks be to ritz

これはそんな記事さ。

以下、ネタバレ注意でお願いするよ。続きを読む

というわけで、前の記事の続きです。
もうすぐアノ日だから急いで書かなきゃ。

続きを読む


先日俺が読んだSS様に、僭越ながらヘッダ画像切り替えの方法をご紹介したところ、早速採用して下さり、記事にも取り上げて下さいました。
その記事に御成約?御礼のコメントをしましたら、管理人まそ様からこんなコメ返が。
教えていただき本当にありがとうございました(´・∀・`)
せっかく教えていただいたのに反映するのが遅くなって申し訳ありません。
さすがにトップに簡単に戻れるようにしないと読む人大変かなと判断し、こういう形にしてみました。
いえいえ、ウチのような殺風景なブログにそっと色を添えてくれる一輪の花、その通りかもしれませんよ!(笑)
さすがにトップに簡単に戻れるようにしないと読む人大変かな
さすがにトップに簡単に戻れるようにしないと読む人大変かな
さすがにトップに簡単に戻れるようにしないと読む人大変かな

Hey man, トップページリンクあぽーんするとかあり得ねえだろ!(´・∀・`)



という声が聞こえた気がした…(被害妄想)

ブログのヘッダ画像にはトップページへのリンクという大事な機能があり、今回NSが紹介したやり方だと画像切り替えのためにそれができなくなってしまうわけです。
その辺のことをちょっと軽く考えていて、申しわけなかった…と反省し、自動で画像が切り替わる(つまり、リンクが使える)方法をまとめてみることにしました。
まそ様、すみまそんでした!(反省してない)

続きを読む

このページのトップヘ