ニュース

【Webアプリ】『ひらがな移調』最後の投稿!?アップデート内容を公開!

パソコンのキーボードを打っている手の写真

ブログとYouTubeに関連した内容だけを投稿するInstagramのアカウントを作ったので、ここからぜひともフォローしてほしい。

ちなみに前のアカウントは、食べ物と風景を投稿する路線を走ることにした。

最初の投稿は、「次回カバーする曲のアレンジが完成したぞ〜」の画像。
近日、YouTubeのスイフーチャンネルにて、歌ってみた動画を公開予定。

 

この投稿をInstagramで見る

 

楽譜ができた。録音しよう。 #音楽 #アカペラ #ギター #多重録音 #カバー #歌ってみた #楽譜 #スコア #松本英子 #Squall

日景健貴(スイフー)さん(@kh_suifu7)がシェアした投稿 –


本日、『ひらがな移調』アプリをver.1.0.0から1.01にマイナーバージョンアップ。不具合の修正を行った。『ひらがな移調』については、これ以上機能を追加する必要がないため、おそらく今回が最後の記事になるだろう。

スイフー
スイフー
ありがとう『ひらがな移調』!君のことは忘れないよ!……さて、次のアプリ完成させるか〜。
イフちゃん
イフちゃん
あっさりですね。皆さんは引き続き、暗号を考えたり、誰かに愛のメッセージを送ったりするときに使ってくださいね。

ひらがな移調 修正内容

マイナーバージョンアップなので、大した内容ではないが、一応書き残しておく。

ひらがな移調のロゴ
【Webアプリ】『ひらがな移調』開発の備忘録を公開!SoundCloudにプレイリストを追加した。 曲目は、以前に投稿したオリジナル曲『ナチュラル』と『♭♯』。 『♭♯...

1.移調の数値の上限を超えても実行できてしまう問題

『ひらがな移調』アプリに数値を入力しているスクリーンショット
修正前

移調の程度を決める数値が100以上に設定されていても実行できる

修正後

数値が100以上に設定された状態で実行しても何も起こらない

修正前は、1,000や10,000を超える数値を入力しても実行できていた。PCのブラウザ限定だが、数値を入力するボックスの右側に付いている矢印をクリックして数値を増加させると、上限の「100」でストップする。ところが、直接入力するとそれより大きい数値を入力できてしまっていた。

HTML
<input type="number" id="number" value="1" min="0" max="100" placeholder="0〜100">

JavaScript側で特に処理をしていなかっただけなので、修正は簡単。

JavaScript
// 省略
if(入力された数値 < 101) {
 // 処理を実行
} else {
 // それ以外のとき
}

これで、数値が101より小さいときだけ移調が実行される。

2.結果が空白でもコピーできてしまう問題

『ひらがな移調』アプリのボタンを無効化しているスクリーンショット
修正前

移調の結果が表示されるテキストエリアが空白の場合でもコピーできる

修正後

結果が空白のときはコピーとツイートボタンを無効化する

修正前は、テキストエリアが空白のときにコピーを押すと、謎の文字列がクリップボードにコピーされる現象が発生。スマホだけに起こる問題を見落としていたので反省。

スイフー
スイフー
はっ発生と反省で韻を踏んでしまった…!?どうしよう!
イフちゃん
イフちゃん
誰も気にしませんよ。
HTML
<input type="button" id="copy" value="コピー">
<input type="button" id="share" value="ツイート">
JavaScript
// 省略
if(result.value.length > 0) {
  // 文字が入力されているとき
  copy.disabled = false;
  share.disabled = false;
} else {
  // 空白のとき
  copy.disabled = true;
  share.disabled = true;
}
  • .value.length で文字数を取得する
  • .disabled = true で無効化する
  • .disabled = false で解除する

テキストエリアに文字が入力されていないときはボタンを無効にすることで、クリック(タップ)できないようにした。文字が入力されているときは、ボタンが有効になる。

『ひらがな移調』アプリのボタンの動作を改善しているスクリーンショット
▽スイフーの情報はこちらから▽
スイフー
スイフー
最後までご覧くださりありがとうございます!
イフちゃん
イフちゃん
フォローやチャンネル登録、お待ちしております!

COMMENT

メールアドレスが公開されることはありません。