はい、DAFUです。
今回はJavascriptの練習をしてみたいけどHello,World!とか簡単すぎるなって思ってたところ、とらすた氏が以下のようなツイートをしてたので、それならJavascriptの練習の良い題材として作れるのではと思い作ってみました。
※元凶のツイート


ただ、私はJavascriptに関しては今まで雰囲気でやってた人なので、今回初めてきちんとするにあたって一から調べながらやってみました。
以下は作成開始時にどんな機能を付けるか書き出してみたメモです。
【求める機能】
・tipに必要な入力フォーム(通貨選択,送り先入力,金額入力)
・tipbotの残高確認機構(tipnemはbalance all)
・申し訳程度のデザイン(ボタンがデフォルトのデザインなのはダサい)

また、こちらは今回作成するにあたって参考にしたサイト集です。
JavaScriptでIF文を使って条件分岐させる方法:https://techacademy.jp/magazine/5411
フォームの内容でリンク先URLの作成:https://oshiete.goo.ne.jp/qa/4563365.html
現在日時を表示する:http://www.tagindex.com/javascript/time/now2.html
URIエンコード・デコード君:http://kunisan.jp/uri_encode_decode/

と、ネットで調べればある程度情報は出てきます。
ただリンク先URLの生成はif文である必要はないので、そこは外しています。

ソースコード&プレビュー

現在対応しているtipbot→tipmona/zenyhime/zenytips/tipnem/tipxrp/tip_XPchan/bch_tip
(ちなみに私はBCH Tip botの公認ブロガーです(∀`*ゞ)エヘヘ)
JSファイル→http://monaform.starfree.jp/js/tip.js

今回はじめてコードにCodepenを使ってみました。プレビューも出来て使い勝手がいいのでこれからはpreタグの代わりにこれを使って行こうと思います。

See the Pen payYLP by DAFU (@DAFU) on CodePen.



見れば分かりますが、Tipする機構をtip();,残高照会する機構をbalance();としてそれぞれ分けています。
また、一部URIエンコードになおした部分もありますがそこはコメントアウトして読めるようにしています。(jsファイルに直にアクセスした場合エンコード違いで文字化けします。UTF-8に合わせましょう。)

というわけで今回はこの辺で。('ω')ノシ

コメント

コメントフォーム
評価する
  • 1
  • 2
  • 3
  • 4
  • 5
  • リセット
  • 1
  • 2
  • 3
  • 4
  • 5
  • リセット