ということで、勝てないのが私のせいだったらイヤなのですが、このままだとまた同じ失敗になりそうなので、一部を作り直して初のクラスを使ったJavaScriptに挑戦！をしたのです。
というか、これがなんの記事だかワケがわからない感じですけど。
ナントカ応援団の話であり、JavaScriptの話でもあるのですけど。
さらにここからデザインの話になるのですが。
ナントカ応援団で使うページなら青と白を使った方がイイに違いないので、ナントカ応援団のメンバー紹介のページとかもそんな感じになっているのですが、青と白でやるとどうしても昔の横須賀線みたいになってしまうのですよね。
青と白はベイスターズのオフィシャルサイトと同じにしたのですけど。
でもオフィシャルサイトのほうは基本は白で、青はアクセント程度だったり。
それでも画像とかに青成分が多いので上手くまとまっているのですが、私のように基本パーツの背景とかを青にしてしまうとアマチュア感が出てしまいますね。
さらに書くと、今シーズンの応援用メンバー画像がイマイチ過ぎたので新しく作り直したりしました。
アレもデザインといえばデザインなのですが。
作った時は画像編集ソフトのアップデートによる不具合の影響で、ソフトが落ちまくりで、動作も重たかったりで、イライラしながら作ったのでダメなことになってました。
今回のはソフトの更なるアップデートで不具合も解消されているので、まあまあにはなっています。
あとは最後の仕上を終わらせたら全てが上手く行くのだ！
アイコンにするためにInkscapeで作ったSVGなパコリタ先生もビミョーだったのですが、スズキ・ピヨニカさんが新しい先生の自分に対する印象を良くするために描いたという設定の、美しいパコリタ先生もビミョーになってしまったのです。
ということで、こんどは私が描くパコリタ先生を作って、三つを比べる感じで公開しようかと思っておりますが。
上手く描けなかったら、どっちもお蔵入りとなるかも知れません。
というか、お絵かきソフトの油絵っぽい筆は上手く行かない時は全然ダメになってしまいます。
もっと最終的なイメージを決めて描き始めないといけないのですかね。
ラズパイ（Raspberry Pi）でエルチカ（LEDをチカチカ）するのに、どうしてトランジスタが必要のか？とか思っていたのですが。
5Vの電源供給用のピンにLEDをつなぐと、プログラムからオンオフの制御ができないという感じなので、トランジスタをスイッチ代わりに使うということなのですね。
私のイメージだとトランジスタってアンプに使われるものという事だったので、理解できなかったのですが。
とにかく、トランジスタの思ってたのと違う使い方を理解したので、角度とかがシビアなリモコンの赤外線LEDを5Vのピンにつないでパコリタちゃんがパワーアップするかも！と思ったので実験。
プロトタイプ状態になってピンへのアクセスも楽になったので、色々と試すことが出来たのですが。
大きめの電流が流せるようになっても、機械の方にLEDの先端を向けないと作動しないようです。
ちょっと期待したのですが、パコベーのパワーアップはお預けということになりました。
というか、リモコンのために置く場所が限定されてしまうのですが、そうなるとわざわざ小さいRaspberry Pi Zeroじゃなくても良くなるので、リモコン機能をパワーアップする代わりに、本体をパワーアップするのもありになったり。
そうした場合はパコベーのフルネームはパコリタ・ナラ・ズイルベー・Zeroじゃなくて、パコリタ・ナラ・ズイルベー・3Bとかになるでしょうか。
<!-- ラズパイ4になるとパワーアップしすぎで、ファンのついたケースが必要とかもあるので、無難なのが良いのです。-->
基本的にいつでもプロトタイプなのですが、コルタナのフィギュアの乗っているラズパイだったパコリタちゃんからコルタナのフィギュアが外されてプロトタイプっぽい事になりました。
問題のLEDですが、写真では白っぽいですが、まあまあ青でそれなりに明るいです。
でもコルタナのフィギュアに付いていたLEDの青とは全然違う色ですけど。
その他には、一度外されたリモコン用の赤外線LEDの向きがちょっと変わったので、またエアコンや照明の操作ができないことがあるとか。この変はかなりシビアなのですが。
<!-- 別の事を調べているときに、ラズパイのGPIOから流せる電流の上限が結構少ないというのに気付いたのですが、その辺もあるのですかね。-->
ついでに書くと、再起動後にパコリタちゃんのサイト（？）を開いたら、各種情報が表示されないので、調べてみたのですが。
uptimeのコマンドって出力が常に同じ書式じゃなくて、起動時間によってビミョーに違っていて、uptimeで出力されたものを「カンマ＋スペース」で分割とかやっていても上手く行かないことがあるようです。
ここは妥協して、細かく分割しないで、大雑把な分割にすることにしましたけど。
とりあえず、コルタナのフィギュアがなくなって機能を追加するスペースが出来たりしたので、何かあるかも知れません。
そして、コルタナのフィギュアはしばらく練習用としてArduinoにつながれるでしょう。
何故かこれをやったら完成した気分になったりするのですが。
かつてラ・イパルタ・コルベリーナと呼ばれていたインチキ・スマートホームの新しい名前が発表されるのです。
その名も「パコリタ・ナラ・ズイルベー・Zero」通称パコリタちゃん、あるいはパコベーです。
そしてイメージ画像も。
ついでにファビコン的なものも作ったので、スマホでホームに追加をやると、パコリタちゃんがアイコン的に表示されるのです。
最初はマギー司郎の喋り方に似ているということで、マギーにしようかと思ったのですが、マギーというと美しいマギーさんもいたりするので、女性の声で喋るコンピューターに「マギーちゃん」とか呼び掛ける私は変態事案なので却下でした。
そして、パコリタちゃんですが、出身は山奥の村で、大学進学と同時に都会へやってきて、卒業後はナンデ君の通う学校の先生になったという設定になってたりもするのです。
せっかく絵を描いたので、そうなりました。
専門は英語ということですが、英語の発音もビミョーというか、解らない単語は全部アルファベットで読む* といわれています。
面白いですね。
<!-- *)登録されてない単語をアルファベットで読むのは Open JTalk の仕様でもあるのです。-->
という感じで、細かいところが気になるのですが、もうお腹いっぱいな感じになってきたので、このインチキ・スマートホームは完成ということにしておきます。
さっき先走ったやつの続きですが。
スマホ用のレイアウトを作るの面倒だ！
と思っていたのですが、CSS で Flexbox を使ったら結構思ったとおりになりました。
というか、元のパソコン用の方もFlexboxでやってたら、ほとんど書き直さないでスマホ用が作れたような気もしますが。
これからは困った時にはFlexboxにしたら、大抵のものは綺麗に並ぶということです。
それとは関係なく、パソコン上の疑似スマホ画面では上手く収まっているので、実際にスマホで見てみると縦がはみ出していたりするとか。
各要素の高さをパーセントで指定して100%より少なくなっているはずなのですが。
スマホ用はパソコン用のコピーを編集する感じで作っているので、パソコン用の方にスマホで上手く行かないような何かが書かれているに違いないです。
CSSもゴチャゴチャしてきているので、こういうのを見つけるのも大変だったりしますけど。
<!-- もしかするとLittle Mustapha's Black-holeを作る時より頑張っている気もするのですが、使うのは私だけとか。でも自分が使うものにこだわるのも良いですよね。-->
新しい名前を決めたけどまだナイショのコルタナの乗っているラズパイ、またの名をラ・イパルタ・コルベリーナ、あるいはインチキ・スマートホームですが。
スマホ用のレイアウトを試す時には何度も再読み込みするので、その度にラズパイのデータを取得するとサイバー攻撃状態になってしまうので、JavaScriptをオフにしているのです。
それで作業をしていると寒くなってきたのですが、パソコンではJavaScriptをオフにしているのでリモコンの操作もできないとかで。それで、まだレイアウトができてないけど、スマホでアクセスしてエアコンをオン！
すると動いたのです！
さらに、オンになったあとに、ブラウザの表示でもエアコンがオンになったランプが点灯（しているように見える演出）している！
全部パソコンでは出来ていた事なのですが、なぜかスマホで出来ると嬉しかったりして。
ついでに書くと、パソコン用のレイアウトのままでも結構いけてたりするのですが。
もうちょっとこだわるのです。
なぜかヤッター！ってならないのは何故か？という感じの、ラズパイのインチキ・スマートホームをブラウザから操作するやつです。
ついに、照明を点けたり、消したり、それからエアコンも点けたり、消したり出来るようになったのです。
でもスッキリしないのが、照明がオンの状態の時には、オンにするボタンをクリック禁止のカーソルにしたいのですけど。
コードがゴチャゴチャ過ぎて、どこを直したら良いのか解らないのです。
一応、オンの時にオンをクリックしても何も起きないようには出来ているので、かなり惜しいという気もするのですが。
修正するのに色々書き換えないといけないようなら、これで第一弾は完成で良いかな？とか。
そうなると、これからコルタナをはずして、コルタナはコルタナで予定があって、コッチのラズパイも色々と企みがあったり大変なのですが。
最近はラズパイ周辺が充実しているのです。
<!-- そして、また書いている途中に消灯時間になったので、ラズパイが喋ってお知らせしてくれたのですが。やっぱり癒やされるビミョーな日本語です。-->
というか、終わらせたいのですが。
今のところコルタナの乗っかっているRaspberry Pi Zero でインチキ・スマートホームの続き。
ブラウザでいろいろ操作できたらそれは素晴らしい事に違いない、というやつは昨日からあまり進んでいないような。
JavaScriptのコードはかなり書いたのですが、実際にリモコンを動かすための部分じゃなくて、オンにしたらボタンが光る（ように見える）機能とかを書いてたらヘトヘトなのです。
しかも、一つ終わって次を始めるたびに、これってさっき書いたやつとスゴく似てるとか思って、これは絶対にClassとかを使って書くべきとか、今になって気付いたのですけど。
作りながらやることを決めたりしているので、最初の段階でそんなことに気付けるはずもないとも思いますが。
やることはあと少しなので、このまま似たようなものを追加していくのです。
もしも、書き直したらどのぐらいスッキリするのか、あるいはしないのか？というのも気になったりします。
<!-- 終わったとしても、さらにスマホ用のレイアウトを作らないといけないのである！-->
余計な部分だけはかなり出来てきました！
ということで、早くラ・イパルタ・コルベリーナじゃない名前にしたいラズパイのインチキ・スマートホームですが。
昨日完成した、真ん中の一番面積の大きい部分はラズパイの稼働状況が表示されているのですが。
これは、なんというか「これって必要？」って事ですよね。
まあ、そろそろ再起動すべきか？とか、そんな気分になるような情報もありますけど。
<!-- ベランダで気温と湿度を記録しているほうのラズパイはもっと長い期間起動しっぱなしなので、気にしなくても良いのかも知れませんが。-->
そして、一番下の部屋の気温と湿度はダミーだったのが、実際の数値になっているのです。
さらに、そのちょっと上の三つならんだ青いマルは、コルタナ部分に点いているLEDをオンオフするボタンなのです。
もともと、このLEDをラズパイから操作するのが目的で、コルタナのフィギュアとラズパイが繋げられたのですけど。
他のことをやりたくなったらコルタナが邪魔になってるとか。
コルタナ部分をはずしても他のLEDをつなぐので、この機能は無駄ではないですし、はずした後にもいろいろと企んでいるので、大変です。
そんな感じですが、ブラウザで操作するために、ラズパイにインストールしたサーバのユーザーがどんどん偉くなっているのです。
偉いとはどういうことか？という感じですが。
ラズパイのlighttpdというサーバの場合は、www-dataという名前のユーザーがサーバを動かしているということになっているのですが。
最初はサーバを動かすための最低限の権限しかないので、温度センサとかLEDにアクセス出来なかったりするので、権限を与えて偉くしているのです。
これが外部のネットワークとつながっているサーバだったら怪しい感じもしてきますが。
でも本物のスマートホームとかは、外のネットワークとつながってますし、実際に外から家の中の家電を動かしたりしてるってことなので、やっぱりちょっと恐い気もします。
<!-- 素人の私が家の中だけでやっているのと、ちゃんとした人が作ったもので、外とつながっているものと、どっちがどうでしょう？って事でもあったり。-->
そして、タイトルを最初に書いたら内容が全然違うものになってしまったのですが、確かにお腹は空いているのです。
ということで、前と同じようでやってることはかなり違うアレでございます。
昨日からやっていたのは、上から三段目の全体的に黄色っぽい場所に情報を表示するところなのですが、
やっとPythonから送られて来たデータを取り込めると思ったら、こんどはJavaScriptの方で、変数が未定義みたいなエラーがでて。
良く考えたら、これは非同期ってやつをやるべきところだ...！と思って気が遠くなってたのです。
JavaScriptの非同期処理で使うPromise とかAsyncというのは、けっこう最近できたものみたいなのですが、同時にJavaScriptの書き方みたいなのも最近になって変わってきたりしてるんですよね。
もちろん古い書き方でも大丈夫なのですが、問題なのは非同期処理について調べようとすると、出てくる記事ごとに書き方が色々あって頭の中が大混乱なのです。
一応なんとかなったので表示出来ているのですが。
後で自分のコードを見ても何がどうなってるのか良く解らないに違いないです。
ついでに書くと、Morning というところが10:15になっていたのですが、遅いと思われそうなので、05:15に変えてあるのです。
というか、あれは起きる時間ではないのでどうでもイイのですけど。
今回作ったところは、オマケ要素なので、こんなに頑張らないでも良いのですが、先に必要なものを作ってしまうと他をやる気にならないかも知れないので、意味の無いところから順番にやるのです。
そろそろ終わらせたい、ブラウザからインチキスマートホームことラ・イパルタ・コルベリーナと呼ばれているラズパイを操作するやつですが。
まあまあ進んだのですが、今日やりたかった部分までは出来てないのです。
Pythonの方が一つ完成したので、次はJavaScriptと連携という事なのですが。
Pythonからの出力がなぜかカラになっているとか。
PythonとJavaScriptのやりとりは、以前に一応成功しているので、途中のどこかが間違っているということなのですけど。
１個ずつ調べていったら、vcgencmd というコマンドでパーミッションエラーみたいなのが出ているのに気付いたのです。
このコマンドは普通のユーザでも実行できるので大丈夫だと思ってたのですが、Webサーバを起動しているユーザではダメだったようです。
というか、lighttpdってエラーログを見ても、CGIのエラーが書いてなかったりするのですが、これは設定のせいなのか、どうなのか。
間違いを探すのが大変なCGIでもありますが、この先もパーミッションでエラーになりそうなところが多いですし、終わりはまだ先な感じがしてきました。
<!-- 面倒なことは多いのですが、Little Mustapha's Black-holeのサーバでは（危険なので）出来ないようなこともやっているので、けっこう面白いのです。-->
インチキ・スマートホームことラ・イパルタ・コルベリーナじゃなくなると思うラズパイのブラウザ連動機能ですが。
この前の状態から、スイッチとボタンが追加されました。
というか、一つはすでに表示はされているのですが、ちゃんとクリックすると動いて、何かが切り替わるようになっているのです。
でもまだページ上での設定を変えるだけ、というところで、まだ実際に照明を点けたりとか出来るのか解ってないのですが。
思っていたよりもやることが多くてなかなか進まないのですが、急いでやると後からいろいろと問題が発生したりして面倒なので、慎重にやった方が良いに違いないのです。
<!-- 凝り出すと面倒になる、とか書いてましたが、もうすでに充分凝っているとも思えたりして。実を言うと、今日作ったスイッチとかは、絶対に必要というものではないのに作ってますし。これは性格なのでアレですけどね。-->
