2018-02-19
v3.0.31をダウンロードしたりバイオリズムを修正したり
近頃たいしたことはしてませんが、ちょこちょことなんだかんだした件を三件ほど。
まずは、ぼやき記事に追記を入れただけで放置してましたケド、v3.0.21で新たに論理OR、論理AND、論理NOTが追加され、ANDやORは、なでしこ1同様のビット演算に戻りました☆
おかげさまでこんな感じに♪
#数当て表作成 60回 数=回数。 6回 もし、AND(数,2^(回数-1))=0でなければ、数当表[回数-1]=数当表[回数-1]に数を一行追加。 ここまで。 ここまで。
あと、前回密かに一行追加がどうもうまくいかないと思っていたら、v1非互換で、ちゃんと代入しなきゃならなかったみたい。
・数当てカード
http://snowdrops.starfree.jp/wnako3_test/13_kazuate2.html
いきなり始まるのもアレなんでボタンを押して開始するようにした。
・数当てカードを二進数で表示
http://snowdrops.starfree.jp/wnako3_test/13_kazuatehyo.html
テーブルで表示するようにしてみた。
cellspacingに該当するCSSが分からん・・・;
ところで、なでしこ3は、いつの間にかさらにバージョンアップしてv3.0.31になってました。
PC版の機能が大幅に拡張されてWebサーバを作成する機能が追加されたんだってさー。って・・・ナンカヨクワカンナイケド;
これまでWeb版しかお試ししてこなかったからね。
でもとりあえず、ちょこっとだうんろーどしてみたところ・・・解凍できませんでした。
そっからか。ワタシって・・・無能すぎる。
しくしくしくしく。
なんか、ファイル名または拡張子が長すぎて、フォルダが作成出来ませんとか言われてしまう~。えらく階層の深そうな、書き写すどころか見たくない感じのフォルダ名が表示されておる~。
・・・とゆうわけでしばし放置していたんだけど、急にひらめきました。
書庫名でフォルダを作ってそこに解凍する設定にしてたんだけど、どっちみちちゃんとフォルダを作った中に全部展開されるようになってるからなーと、その設定をオフにしたらできました。フォルダ一個分・・・?
たぶん、てきとーにデスクトップに解凍しようとしたのもいけませんでした;
・・・でっ、解凍さえ出来ましたら、バッチファイルを実行であっさりと無事にエディタが起動しました☆
だけど・・・保存したファイルをファイル一覧から見ようとしてもナゼか、問答無用で「こんにちは」と表示。になってしまうみたいなんだよね;むむむ(?_?)
↑ 3.0.32で解消されました!
それはさておき、NADE APPに投稿していたバイオリズムの、前月表示や翌月表示が近頃ちゃんと動いてなかったことを発見。
自前の日付加算がダメでした;
12月の絡んだ計算がエラーになってしまう。
v3.0.19頃から、UNIXTIME変換がシビアになったみたいなんですね。
まえは、「2017/0/1」みたいな日付が通っていたんですよ~w
それで計算もちゃんと合ってる風味だったんで、スルーしてたんですが、直しました。
●日付加算(SにAを) 記号=Aの1だけ文字左部分。 A=Aの1から1だけ文字削除。 A=Aを「/」で区切る。 y=A@1/12を切捨。m=A@1%12。 S=Sを「/」で区切る。 もし、記号=「+」ならば、 y=y+(S@1+m)/12を切捨。 S@0=S@0+A@0+y。 S@1=(S@1+m)%12。 違えば、 S@0=S@0-A@0-y。 S@1=S@1-m。 ここまで。 もし、S@1=0ならば、 S@1=12。S@0=S@0-1。 ここまで。 d=(A@2)*(24*60*60)。 年=S@0。月=S@1。日=S@2。 S=「{年}/{月}/{日}」をUNIXTIME変換。 もし、記号=「+」ならば、S=S+d。 違えば、S=S-d。 S=Sを日時変換。 S=Sの10だけ文字左部分。 Sで戻る。 ここまで。
http://www.eznavi.net/app/index2.php?pagetop=25&only=one
http://www.eznavi.net/app/index2.php?pagetop=27&only=one
あっ、プラグインのは問題なく動くんですけどね。
2017-09-04
バイオリズム完成(なでしこ3~0.1.5)
とゆうわけで、イベントが使えるようになりましたので、なでしこ1で作ったのと同様に、ボタンで、前月や翌月の表示を行えるようにできました☆
そうそう、この一月ずつ移動するような計算の時、日付加算が便利だったんですよ~。
今回は、うぇいくさまに作って頂いた、日付時間計算プラグインを入れてみています。
ちゃんと動きました。素晴らしい!
(日数差が自前の関数のままなのは、日付が「2017/09/04」を「2017/9/4」と入った時エラーとなってしまうので、ゼロ埋めして回避するように直すのがめんどーだったからw)
ついでに、ローカルストレージに、デフォルトの生年月日を覚えさせたり消したりするボタンもつけて、完成♪\(^▽^)/
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes"> <title>バイオリズム0.1.5</title> <style type="text/css"> <!-- body {background-color: #FFEEEE;} div.biorhythm {width: 640px; margin:auto;} /*画面幅が767px以下*/ @media (max-width: 767px) { div.biorhythm {width: 100%;} canvas#cv {width: 100%;} h1 {font-size: 150%;} } --> </style> </head> <body> <!-- なでしこを使うために必要なスクリプト --> <script src="https://nadesi.com/v3/0.1.5/release/wnako3.js?run"></script> <!-- うぇいくさまの日付時間計算プラグイン --> <script src="http://weyk.la.coocan.jp/weyk/nadesiko3/release/plugin_weykdatetime.js"></script> <!-- type="なでしこ" のスクリプトが実行される --> <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 ゴシック」に描画フォント設定。 青色に塗り色設定。[40,30]へ「■身体」を文字描画。 赤色に塗り色設定。[40+70,30]へ「■感情」を文字描画。 緑色に塗り色設定。[40+70*2,30]へ「■知性」を文字描画。 枠線描画。 #イベント設定 「#zen」の「onclick」に「前月表示」をDOMイベント設定。 「#kon」の「onclick」に「今月表示」をDOMイベント設定。 「#yoku」の「onclick」に「翌月表示」をDOMイベント設定。 「#hyoji」の「onclick」に「生年月日入力」をDOMイベント設定。 「#toroku」の「onclick」に「生年月日登録」をDOMイベント設定。 「#del」の「onclick」に「生年月日削除」をDOMイベント設定。 #ローカルストレージ 生年月日=「生年月日」をローカルストレージ読む。 もし、生年月日=undefinedならば、 「#title」に「誕生日を入力し、『表示』ボタンを押して下さい」をDOMテキスト設定。 違えば、 「#birthday」に生年月日をDOMテキスト設定。 バイオリズム表示。 ここまで。 #----------------------------------------------------------- ●前月表示 基準日=基準日に「-0/1/0」を日付加算。 バイオリズム表示。 ここまで。 ●今月表示 表示年=今年。表示月=今月。 基準日=「{表示年}/{表示月}/01」 バイオリズム表示。 ここまで。 ●翌月表示 基準日=基準日に「+0/1/0」を日付加算。 バイオリズム表示。 ここまで。 ●生年月日入力 生年月日=「#birthday」のDOMテキスト取得。 表示年=今年。表示月=今月。 基準日=「{表示年}/{表示月}/01」 バイオリズム表示。 ここまで。 ●生年月日登録 生年月日=「#birthday」のDOMテキスト取得。 「生年月日」に生年月日をローカルストレージ保存。 「{生年月日}に設定しました」と言う。 今月表示。 ここまで。 ●生年月日削除 「生年月日」をローカルストレージキー削除。 「#birthday」に空をDOMテキスト設定。 「#title」に「誕生日を入力し、『表示』ボタンを押して下さい」をDOMテキスト設定。 「削除しました」と言う。 枠線描画。 ここまで。 #----------------------------------------------------------- ●枠線描画 白色に線色設定。白色に塗り色設定。 [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。 誕生日=「{生年}年{生月}月{生日}日」。 一時=基準日を「/」で区切る。 表示年=一時@0。表示月=一時@1。 表示年月=「{表示年}年{表示月}月」 もし、表示年%4=0でなければ、閏年=いいえ。 違えば、もし、表示年%100=0でなければ、閏年=はい。 違えば、もし、表示年%400=0でなければ、閏年=いいえ。 違えば、閏年=はい。 月末=31。 もし、表示月=2ならば、 もし、閏年=はいならば、月末=29。 違えば、月末=28。 違えば、もし、(表示月=4)と(表示月=6)のORならば、 月末=30。 違えば、もし、(表示月=9)と(表示月=11)のORならば、 月末=30。 ここまで。 「#title」に「{誕生日} 生まれの方の {表示年月} のバイオリズム」を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ならば、結果を切捨で戻る。 違えば、結果を切り上げで戻る。 ここまで。 ●今月 今日の6から2をMIDで戻る。 #「文字抜き出し」が出来ないのでMIDを使う。 ここまで #----------------------------------------------------------- </script> <H1>なでしこ3でバイオリズム表示</H1> <HR> <div class="biorhythm"> <P><div style="font-weight: bold; text-align: center;"> <label>生年月日(yyyy/mm/dd):<input id="birthday" type="text" maxlength="10" size="10"></label> <button id="hyoji"> 表示 </button> <button id="toroku"> 登録 </button> <button id="del"> 削除 </button> </div></P> <BR> <div id="title" style="font-size:large; font-weight: bold; text-align: center;"></div> <div style="text-align: right;"> <button id="zen"> 前月 </button> <button id="kon"> 今月 </button> <button id="yoku"> 翌月 </button><BR> </div> <canvas id="cv" width=640 height=480></canvas> </div> <HR> </body> </html>
http://www.geocities.jp/snowdrops890/wnako3_test/Biorhythm0_1_5.html
たぶん、間違いなく動いてると思うんだけど・・・
うまく表示しなかった場合は、リロードしてみて下さい;
あと、なでしこのことじゃないけど、スマホで見た時に、ちっちゃこく縮小されないようにする呪文を覚えたので、やってみました!
「meta」要素で「viewport」とやらを指定すればいいラシイ。
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">
コレは呪文なので、意味はよく知りません(えっ;)
いや・・見たんだけど、あまり理解しませんでした;;;
「user-scalable」は「no」にすると、ユーザーによる拡大縮小ができないようになるそうです。
そして、スタイルシートにスマホの場合の設定をします。
<style type="text/css"> <!-- body {background-color: #FFEEEE;} div.biorhythm {width: 640px; margin:auto;} /*画面幅が767px以下*/ @media (max-width: 767px) { div.biorhythm {width: 100%;} canvas#cv {width: 100%;} h1 {font-size: 150%;} } --> </style>
画面幅が767px以下とゆうのは、タブレットを縦持ちしたときの幅が、だいたい768px以上となっているので、それ未満はスマホってことでいいんじゃね? という数値のようです。といっても、どうせ自分のスマホからしか確認出来ませんが;
とりあえず、「width」的な値を、決め打ちではなく解像度に合わせて可変となるよう、%で指定すればいいようです。
できました♪
いちおう、縮小したのを拡大したり、はみ出たのを縮小したりすることなく見れるようになりました(≧▽≦)
2017-09-02
イベントを使うよ!
なでしこ3がバージョンアップして、イベントが使えるようになったので、早速お試ししてみます☆
ついでに、前回わからんと言ってた、スタイルシートも学んで、背景色の設定の仕方も分かった。
実は、ワタシが間違っていただけで、「background」は壁紙で、背景色は「bgcolor」だったとゆうオチだったんだけど(´д`;;;
とっ、とにかく、そうゆうのは使うなとゆうことであるらしく、ちゃんとCSSで設定する術を覚えたので、それも活かしてこんなの。
てゆうか前回背景色を変えようとしたのは、単に、canvasの地色がどうやら白じゃなくて透明っぽいと気付いたので、それをちょこっと確認してみようとしただけだったんだけどねw
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>なでしこ3てすと</title> <style id="bg" type="text/css"> body {background-color: #FFCCCC;} </style> <title>なでしこ3てすと</title> </head> <body> <!-- なでしこを使うために必要なスクリプト --> <script src="https://nadesi.com/v3/0.1.5/release/wnako3.js?run"></script> <!-- type="なでしこ" のスクリプトが実行される --> <script type="なでしこ"> #-------------------------------------- # ここになでしこのプログラムを記述 #----------------------------------------------------------- 「#a」の「onclick」に「ボタン選択」をDOMイベント設定。 「#RGB」に「#FFCCCC」をDOMテキスト設定。 ●ボタン選択 背景色=16777215の乱数。背景色=背景色のHEXを6でゼロ埋め。 「#bg」に「body {波カッコ}background-color: #{背景色};」をDOM_HTML設定。 #{波カッコ閉じ}が使えない。無くても動いたからいいけどΣ(゜д゜; 「#RGB」に「#{背景色}」をDOMテキスト設定。 ここまで。 </script> <H1>なでしこ3てすと~ボタンをクリック</H1> <HR> <button id="a">背景色変更</button> <input id="RGB" type="text"> <HR> </body> </html>
ボタンを押したら、ランダムに背景色が変わります。
http://www.geocities.jp/snowdrops890/wnako3_test/04_button.html
ところで、「波カッコ閉じ」がつかえない~><; ←0.1.6で対応されました!(10/7追記)
そういえば、前にも「カッコ」「波カッコ」はできるのに、「カッコ閉じ」「波カッコ閉じ」が、「undefined」となってしまうと騒いでいた気が;;;
取りあえず、閉じなくてもちゃんと動いたからいいけど。
(↑・・・そっそれはともかく、DOMスタイル設定を使えばいいんじゃ?・・・ってことに最近気付いたよ・・・(バカ;)(9/20追記))
そういえば、ボタンは押すに決まっているモノだけど、canvasなんかもonclickは使えるのかなー? と思って試してみたら、使えた!
コレが出来ると、ちょっとゲームが作れそうな気がしてくるんじゃないですか?(喜)
しかし、どうやら「DOMイベント設定」では、関数に引数をつけては設定出来ないっぽいんだよね。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>なでしこ3てすと~canvasをクリック</title> <style id="bg" type="text/css"> body {background-color: #FFFFFF;} </style> </head> <body> <!-- なでしこを使うために必要なスクリプト --> <script src="https://nadesi.com/v3/0.1.5/release/wnako3.js?run"></script> <!-- type="なでしこ" のスクリプトが実行される --> <script type="なでしこ"> #-------------------------------------- # ここになでしこのプログラムを記述 #----------------------------------------------------------- 色リスト=["FFEEEE","EEEEFF","EEFFEE","FFFFEE","FFEEFF","EEFFFF"] 6回 C=回数-1。背景色=色リスト[C] 「canvas#color{C}」のDOM要素取得。それへ描画開始。 「#{背景色}」へ塗り色設定。[0,0,30,30]に四角描画。 // 「#color{C}」の「onclick」に「背景色選択({C})」をDOMイベント設定。 #関数に引数をつけての設定は出来ない? 「#color{C}」の「onclick」に「色ボタン押下{C}」をDOMイベント設定。 ここまで。 ●背景色選択(No) 背景色=色リスト[No] 「#bg」に「body {波カッコ}background-color: #{背景色};」をDOM_HTML設定。 ここまで。 ●色ボタン押下0 背景色選択(0) ここまで。 ●色ボタン押下1 背景色選択(1) ここまで。 ●色ボタン押下2 背景色選択(2) ここまで。 ●色ボタン押下3 背景色選択(3) ここまで。 ●色ボタン押下4 背景色選択(4) ここまで。 ●色ボタン押下5 背景色選択(5) ここまで。 </script> <H1>なでしこ3てすと~canvasをクリック</H1> <HR> <div id="a"> <canvas id="color0" width="30" height="30"></canvas> <canvas id="color1" width="30" height="30"></canvas> <canvas id="color2" width="30" height="30"></canvas> <canvas id="color3" width="30" height="30"></canvas> <canvas id="color4" width="30" height="30"></canvas> <canvas id="color5" width="30" height="30"></canvas> </div> <HR> </body> </html>
どーなんですかこりゃwww
でもまあ、とりあえず、押すとその色に変わる、やふーのトップページにあるみたいなヤツ。
http://www.geocities.jp/snowdrops890/wnako3_test/04_canvas.html
面倒だからしなかったけど、ローカルストレージを使えば、コレを覚えさせとくことも可能って訳ですね~。
「onclick」に直接「背景色選択({C})」が設定できれば、とっても便利なように思われるんですけど・・・むむむ。
てゆうか、だって、これにマウス入った時の処理もつけようとかなったら、当然、マウス出た時も必要だから・・・(´д`;
・・・それとも、なんかワタシが間違ってるかにゃぁ・・・・・・;;;
あるいは、他に何か、どれが押されたかを取得出来る上手い手があるのかしらん・・・
あと、「DOM要素作成」などの命令が追加されたので、canvasも連番で動的に作成できるかなあと思ったんだけど・・・
作成はできまして、「width」と「height」のDOMスタイル設定も出来て、連番のIDを使って、DOMイベント設定をして、押したら色が変わるようにまでは出来たんですけどね。
なぜか、描画がおかしなコトになってしまうのですよ(?_?)
どうやら、DOM要素作成した時点で、デフォルトの300*150のサイズで作成されてしまい、一旦作成した後は、変更しても変わるのは見た目だけで本当のサイズはかわらないっぽい。
2017-08-31
なでしこ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属性なんかは、廃止されてしまったんだね。
ちゃんと、全部スタイルシートを使えよってことなんだね(><;
2017-08-28
ローカルストレージを使うよ!
てゆうか、ローカルストレージってなんすか;
・・・っと思っていたら、これもcanvas同様、HTML5から追加になったヤツみたい。
cookieよりも大容量で、有効期限も無いとゆう、便利機能ラシイ。
もっとも、cookieのことも別によく知らないし、とりあえず、ようするにバイオリズムで毎回生年月日を入力するのは面倒だから、覚えさせておきたいなー・・・なんてコトが、なでしこ3でも出来る的な?
こういったことは、なんとなく、とてもめんどーそうに思ってたけど、実際にやってみたら、わざわざ記事にすることなど何も無いくらいに、ものすごくカンタンでした♪
しかし、とりあえず、折角新しいことを学んだので、ココへ記しておく。
#ローカルストレージの使い方 「名前は?」と尋ねる。 「名前」にそれをローカルストレージ保存。 ローカルストレージキー列挙して言う。 「名前」をローカルストレージ読む。 それを言う。 「名前」のローカルストレージキー削除。 ローカルストレージキー列挙して言う。
有効期限が無いとゆうことは、消さない限りはエディタのページに「名前」というキーが残ってしまうので、削除して終わっていますが、残しておけば、次回開いた時にもその名前を引っ張り出して使うことが出来るとゆうことだね。
こんな感じ?
<script type="なでしこ"> #----------------------------------------------------------- 名前=「名前」をローカルストレージ読む。 名前=それ。 もし、名前=undefinedならば、 「名前は?」と尋ねる。 名前=それ。 「名前」にそれをローカルストレージ保存。 ここまで。 「DIV#name」をDOM要素取得。 「 いらっしゃいませ。{名前}さん!」をDOMテキスト設定。 #----------------------------------------------------------- </script> <H1>なでしこ3てすと~ローカルストレージ</H1> <HR> <DIV id="name"></DIV> <HR>
よくある、ユーザー名でご挨拶してくれる的な。
http://www.geocities.jp/snowdrops890/wnako3_test/03_localStorage.html