Hatena::Groupnadesiko

雪乃☆雫のなでしこ日和

2017/08/31 (木)

なでしこ3でバイオリズム表示~0.1.0

| 00:24 | なでしこ3でバイオリズム表示~0.1.0 - 雪乃☆雫のなでしこ日和 を含むブックマーク はてなブックマーク - なでしこ3でバイオリズム表示~0.1.0 - 雪乃☆雫のなでしこ日和 なでしこ3でバイオリズム表示~0.1.0 - 雪乃☆雫のなでしこ日和 のブックマークコメント

 気が付いたら、なんかもう九月だってw(゜o゜)w

 それはさておき、バイオリズムです。

 ボタンが使えなかったので、あんまりかっこよくはないけど、「尋ねる」と「二択」で開いた時に生年月日と表示月を設定することにして、とりあえず完成させてUPしようとしていたら、なななんとなでしこ3がバージョンアップしていたよ!

 イベントが使えるようになってます!!!

 ・・・でっでも、今日のところはこんな感じ~;;;

 イベントの使い方を学んだら、こっちもばーじょんあっぷだ~☆

    <script type="なでしこ">
#--------------------------------------
# ここになでしこのプログラムを記述
#-----------------------------------------------------------
「canvas#cv」のDOM要素取得。
それへ描画開始。
白色線色設定。白色塗り色設定。 #標準は透明ラシイので白で塗りつぶす。
[0,0,640,480]へ四角描画。

#宣言
当日=今日。当日=当日の2だけ文字右部分。 #「今日」は直接文字列として扱えない表示年=今年表示月=今月表示年月=「{表示年}年{表示月}月」
基準日=「{表示年}/{表示月}/01」
月末=31。

#文字描画
「12px MS ゴシック」に描画フォント設定。
文字高さ=14。黒色塗り色設定。  #文字色は「塗り色設定」で変更出来る。
高調期=「高調期」を文字列分解。要注意=「要注意」を文字列分解。低調期=「低調期」を文字列分解。
3
 C=回数-1。
 [2,40-4+文字高さ*回数]へ高調期@Cを文字描画。
 [2,5*40+16+文字高さ*回数]へ要注意@Cを文字描画。
 [2,10*40-4+文字高さ*回数]へ低調期@Cを文字描画ここまで。
「bold 16px MS ゴシック」に描画フォント設定。
青色塗り色設定。[440,30]へ「■身体」を文字描画赤色塗り色設定。[440+60,30]へ「■感情」を文字描画緑色塗り色設定。[440+60*2,30]へ「■知性」を文字描画。
枠描画。

#ローカルストレージ
生年月日=「生年月日」をローカルストレージ読むもし、生年月日=undefinedならば、生年月日登録。 #「undefined」は「」で括ったらダメ。
違えば、
  「生年月日は『{生年月日}』でよろしいですか?」で二択。
  もしそれいいえならば、生年月日登録。
ここまで。

「今月のバイオリズムでよろしいですか?」で二択もしそれいいえならば、
  「表示年月は?{改行}(yyyy/mm)」と尋ねる。
  一時=それを「/」で区切る。
  表示年=一時@0。表示月=一時@1。
  表示年月=「{表示年}年{表示月}月」
  基準日=「{表示年}/{表示月}/01」
ここまで。
バイオリズム表示。

//「生年月日」をローカルストレージキー削除。
#-----------------------------------------------------------
●生年月日登録
  「生年月日は?{改行}(yyyy/mm/dd)」と尋ねる。
  「生年月日」にそれをローカルストレージ保存。
  生年月日=それここまで。
#-----------------------------------------------------------
●枠描画
 白色線色設定。白色塗り色設定。
 [20,40,620,440]へ四角描画。

 黄色線色設定。黄色塗り色設定。
 [20,(5*40+20),600,40]へ四角描画。

 31
  もし、(回数=1)と(回数=31)のORならば、
    黒色線色設定。3に太設定。
  違えば、
    線色RGB(204,204,204)。線色線色設定。1に太設定。
  ここまで。
  [((回数-1)*20+20),40]から[((回数-1)*20+20),440]へ描画。
 ここまで。

 11
  もし、(回数=1)と(回数=11)のORならば、
    黒色線色設定。3に太設定。
  違えばもし、(回数=6)ならば、
    黒色線色設定。1に太設定。
  違えば、
    線色RGB(204,204,204)。線色線色設定。1に太設定。
  ここまで。
  [20,((回数-1)*40+40)]から[620,((回数-1)*40+40)]へ描画。
 ここまで。

 黒色塗り色設定。「14px MS ゴシック」に描画フォント設定。
 (月末)
  [((回数-1)*20+15),460]へ回数文字描画。
 ここまで。
ここまで。

●バイオリズム表示
  一時=生年月日を「/」で区切る。
  生年=一時@0。生月=一時@1。生日=一時@2。
  誕生日=「{生年}年{生月}月{生日}日」。

  もし表示年%4=0でなければ、閏年=いいえ。
  違えばもし表示年%100=0でなければ、閏年=はい。
  違えばもし表示年%400=0でなければ、閏年=いいえ。
  違えば、閏年=はい。

  月末=31。
  もし表示月=2ならば、
    もし、閏年=はいならば、月末=29。
    違えば、月末=28。
  違えばもし、(表示月=4)と(表示月=6)のORならば、
    月末=30。
  違えばもし、(表示月=9)と(表示月=11)のORならば、
    月末=30。
  ここまで。

  「DIV#title」のDOM要素取得。
  「  {誕生日} 生まれの方の {表示年月} のバイオリズム」をDOMテキスト設定。
  枠描画。バイオリズム描画。
ここまで。

●バイオリズム描画
 3に太設定。
 31
  日付=「{表示年}/{表示月}/{回数}」
  結果=生年月日と日付でバイオリズム計算。
  身体2=(結果@0)*2。
  感情2=(結果@1)*2。
  知性2=(結果@2)*2。
  もし回数>1ならば、
    青色線色設定。[(20*(回数-1)),((-身体1)+240)]から[(20*回数),((-身体2)+240)]へ描画。
    赤色線色設定。[(20*(回数-1)),((-感情1)+240)]から[(20*回数),((-感情2)+240)]へ描画。
    緑色線色設定。[(20*(回数-1)),((-知性1)+240)]から[(20*回数),((-知性2)+240)]へ描画。
  ここまで。
  もし、(表示年=今年ならば、
   もし、(表示月=今月ならば、
    もし、(回数=当日)ならば、
     青色線色設定。青色塗り色設定。[(20*回数),((-身体2)+240)]へ5の描画。
     赤色線色設定。赤色塗り色設定。[(20*回数),((-感情2)+240)]へ5の描画。
     緑色線色設定。緑色塗り色設定。[(20*回数),((-知性2)+240)]へ5の描画。
    ここまで。
   ここまで。
  ここまで。
  身体1=身体2。
  感情1=感情2。
  知性1=知性2。
 ここまで。
ここまで。
#-----------------------------------------------------------
●バイオリズム計算(AとBで)
  日数=AとBの日数差。
  結果=配列。  #新しい配列代入する時は「配列」で初期化が必要。
  結果@0=SIN(日数/23*PI*2)*100。
  結果@1=SIN(日数/28*PI*2)*100。
  結果@2=SIN(日数/33*PI*2)*100。
  結果で戻るここまで。
#-----------------------------------------------------------
●日数差(AとBの|AからBまでの)
  A=AをUNIXTIME変換。B=BをUNIXTIME変換。
  結果=(B-A)/(24*60*60)。
  もし、結果>0ならば、結果を切捨で戻る。
  違えば、結果をCEIL戻る。 #なぜか「切り上げ」が出来ないのでCEILを使う。→0.1.5ではできるようになってる!
ここまで。

●今月
  今日の6から2をMID整数変換戻る。 #なぜか「文字抜き出し」が出来ないのでMIDを使う。
ここまで
#-----------------------------------------------------------
    </script>

    <H1>なでしこ3でバイオリズム表示~0.1.0</H1>
    <HR>
    <B><DIV id="title"></DIV></B>
    <canvas id="cv" width=640 height=480></canvas>

http://www.geocities.jp/snowdrops890/wnako3_test/Biorhythm0_1_0.html


 わざわざ「日付加算」ができるようにしてみたりしたケド、よく考えたら、基準日を月初めにしたいだけだったので、は別に全然無くても良かった(^▽^;

 「描画フォント設定」は、フォントサイズとフォント名は省略できない順番が決まっており、フォントスタイル→フォントサイズ→フォント名の順で書かないと無効になるCSSの仕様ラシイ?)

 文字色の設定は、「塗り色設定」でできる。

 ところで、なでしこのことじゃないけど、HTML5では、<BODY>タグのbackground属性なんかは、廃止されてしまったんだね。

 ちゃんと、全部スタイルシートを使えよってことなんだね(><;

 スタイルシートが全然分からないので、てすとページの背景色を変えることさえ出来ないってゆう・・・。しくしくしく。

トラックバック - http://nadesiko.g.hatena.ne.jp/snowdrops89/20170831