ESP-WROOM-02でTFTに画像を表示する

今日のワンコ

ニャンコの日めくりカレンダーは有るのに、ワンコの日めくりカレンダーが無いのが不思議でしたが、ようやく見つけました。
ワンコだけでなくウサギやインコ／オウムなどもあります。

猫じゃ嫌だ！！という方はこちらからワンコ（あるいはウサギやインコ）の写真を日めくりとして表示することができます。

手順はニャンコの時と同じですが、以下の①と②の部分を変えています。
①画像データをネットからダウンロードする。
②画像データを整形する。
③画像データをESP8266にアップロードする。
④画像データをESP8266で表示する。

画像データをネットからダウンロードするためにRaspberryPi（あるいはその互換ボード）を使います。
ダウンロードするプログラムはpythonで書きました。
以下のコードを「SaveImages.py」で保存してください。
なお、このコードを作るにあたり、以下のページを参考にさせていただきました。ありがとうございます。
python で特定のURLから画像を一括ダウンロード修正版

# -*- coding: utf-8 -*-

              

              import urllib

              import urllib2

              import os.path

              import sys

              import datetime

              from HTMLParser import HTMLParser

              

              def download(url, savename):

              #    print "<download> url
              savename=",

              #    print url,savename

                  img = urllib.urlopen(url)

                  localfile = open(savename, 'wb')

                  localfile.write(img.read())

                  img.close()

                  localfile.close()

              

              def get_url_root(url):

                  if("http://" in url):

                      url_delet_http
              = url.lstrip("http://")

                      if("/" in
              url_delet_http):

                         





















              url_root = "http://" +
              url_delet_http[0:url_delet_http.find("/")]

                         





















              return url_root

                  elif("https://" in url):

                      url_delet_http
              = url.lstrip("https://")

                      if("/" in
              url_delet_http):

                         





















              url_root = "http://" +
              url_delet_http[0:url_delet_http.find("/")]

                         





















              return url_root

                  return 0

              

              class imgParser(HTMLParser):

              

                  def __init__(self):

                     
              HTMLParser.__init__(self)

              

                  def
              handle_starttag(self,tagname,attribute):

                      if
              tagname.lower() == "img":

                         





















              for i in attribute:

                             





















              if i[0].lower() == "src":

                                 





















              img_url=i[1]

                                 





















              # 取得した写真のURLを集めたファイルの作成

                                 





















              f = open("collection_url.txt","a")

                                 





















              f.write("%s\t"%img_url)

                                 





















              f.close()

              

              if __name__ == "__main__":

                  argvs = sys.argv

                  argc = len(argvs)

                  if argc == 1:

                      print "{0:s}
              SaveFileName [id]".format(argvs[0])

                      sys.exit(1)

              

                  savefile = argvs[1]

                  print savefile

                  id = "935"

                  if (argc == 3):

                      id = argvs[2]

                  if len(os.path.dirname(savefile)) == 0:

                    datefile = "./date.gif"

                  if len(os.path.dirname(savefile)) != 0:

                    datefile =
              os.path.dirname(savefile) + "/date.gif"

              

                  NowDate = datetime.datetime.now()

                  input_url =
"http://www.365calendar.net/index?action=user_calendar_detail&calendar_id={0:s}&target={1:%Y%m%d}".format(id,NowDate)

              #    print "input_url",

              #    print input_url

                  serch_url = input_url

                  htmldata = urllib2.urlopen(serch_url)

                  date_url =
"http://www.365calendar.net/lib_image/calendar/img_num{0:%-d}.gif".format(NowDate)

              

                  parser = imgParser()

                  parser.feed(htmldata.read())

              

                  parser.close()

                  htmldata.close()

              

                  # 生成したファイルの読み込み

                  f = open("collection_url.txt","r")

                  for row in f:

                      row_url =
              row.split('\t')

                      len_url =
              len(row_url)

                  f.close()

              

                  number_url = []

              

                  for i in range(0,(len_url-1)):

                     
              number_url.append(row_url[i])

              

                  rcode = 1

                  for j in range(0,(len_url-1)):

                      url =
              number_url[j]

                      if not
              "user_photo.php" in url:

                        





















              continue

              

                      root_url =
              get_url_root(serch_url)

                     
              download(root_url + url, savefile)

                     
              download(date_url, datefile)

                      rcode = 0

              

              

                  # ファイルの削除

                  os.remove("collection_url.txt")

                  sys.exit(rcode)

TFTに表示できる画像ファイルは最大２４０ドット＊３２０ドットの無圧縮BMP形式のファイルです。
そこで、ニヤンコの時と同じく、画像データの画像サイズとファイル形式を、画像編集ソフトのImageMagickを使って変換します。
また、ニヤンコと違って画像データの中に日付が有りません。
そこで、日付のイメージを以下からとってきて合成します。
http://www.365calendar.net/lib_image/calendar/img_numXX.gif (XXは0-31）

Raspberry側に、ftpのコマンドファイル(ftp.cmd)とシェルスクリプト(show_esp8266.sh)を作ります。
【ftp.cmd】

open 192.168.10.99

              user esp8266 esp8266

              binary

              put /tmp/imageDst.bmp image.bmp

              ascii

              put /tmp/upload.txt upload.txt

              bye

【show_esp8266.sh】
日付の合成が不要な方は、この部分をコメントアウトしてください。
また、日付の背景を透かすかどうかもお好みで変更してください。

#!/bin/bash

              #

              #set -x

              HomeDir="/home/orangepi"

              

              #Imageのダウンロード

              SrcFile="/tmp/imageSrc.jpg"

              DstFile="/tmp/imageDst.bmp"

              WorkFile="/tmp/imageWrk.bmp"

              DateFile="/tmp/date.gif"

              

              #犬

              sudo python ${HomeDir}/365cal/SaveImages.py ${SrcFile}

              

              #ウサギ

              #sudo python ${HomeDir}/365cal/SaveImages.py ${SrcFile}
              959

              

              #インコ

              #sudo python ${HomeDir}/365cal/SaveImages.py ${SrcFile}
              961

              

              #画像が無ければ何もしない

              if [ $? = 1 ]; then

                  exit

              fi

              #identify ${SrcFile}

              

              #BMPファイルに変換

              convert ${SrcFile} -geometry 320x240 -compress none
              ${DstFile}

              #identify ${DstFile}

              

              #日付画像の背景を透明にする

              cp ${DateFile} ${WorkFile}

              convert ${WorkFile} -fuzz 10% -transparent white
              ${DateFile}

              

              #BMPファイルに日付ファイルを重ねる

              cp ${DstFile} ${WorkFile}

              composite -compose over ${DateFile} ${WorkFile} ${DstFile}

              

              #ESP8266にアップロード

              touch /tmp/upload.txt

              ftp -p -n < ${HomeDir}/ftp.cmd

日付の画像は背景が白です。そこで-fuzzオプションで白を飛ばしています。
コマンドはこちらから教えていただきました。ありがとうございます。
枠無しにもできたらいいのですが、convertのオプションが分かりません。わかる方がいたら教えて欲しいです。

あとは、ニャンコの時と同じ、このシェルスクリプト(show_esp8266.sh)をcronで実行すればOKです。

# m h  dom mon dow  
              command

              */15 7-22 * * * sudo /home/orangepi/show_esp8266.sh

              */15 23 * * * sudo /home/orangepi/clear_esp8266.sh

              */15 0-6 * * * sudo /home/orangepi/clear_esp8266.sh

大昔(10年以上前）に買ってずっと放置状態だった3.5インチのCDのケースに収めてみました。
拡張ボードやUSBデバイスを買うとサポートCDとしてついてくる小さいCDメディアです。
<余談>
もうフロッピーのプラケースなんて売ってないと思っていましたが楽天にありました。
探せば100均にもあるかもしれません。
</余談>

そのままだと、ちょっと傾斜が付きすぎなので手元にあったL金具で角度を調整してみました。
奥のL金具無しと比べると傾斜の違いが分かります。

もう少し続きが有ります。

続く．．．．