//============================================================================= // // GkEarthCalender.js JAVAScript Earth Calender 地球の寿命を人間の寿命に換算したとき、あなたが生まれてから何秒? // Programmed by G.K.2018 // //=============================================================================
//変数の宣言=================================================================== var canvas; //キャンバスオブジェクト var ctx; //描画コンテキスト
var winWidth = 600; //CANVASの横幅 var winHeight = 350; //CANVASの高さ
var now_year; // 現在の年月日 数値 var now_mon; var now_days;
var now_date; // 2018/06/30形式の現在の日付 var base_date; // 誕生日日付 var m_diffDays = 0; // 日付差分
var img_back = new Image(); //画像オブジェクト(背景)
var m_daymsec = 86400000; //1日をミリ秒に換算
//関数の宣言========================================================================
//初期化:年選択のオプション追加------------------------------- function initSelect_Year() {
// 現在の年を取得 var now = new Date(); now_year = now.getYear() + 1900; now_mon = now.getMonth(); now_days = now.getDate();
// 年入力ボックスのメニュー項目のセット----- var selectId = document.form1.bdYear;
for (var i = now_year-100; i < now_year+1; i++) { element = document.createElement('option'); element.setAttribute('value', i); element.innerHTML = i; selectId.appendChild( element ); }
// 現在の年を選択状態にする selectId.options[100].selected = true;
// 月入力ボックスのメニュー項目のセット----- selectId = document.form1.bdMonth;
for (var i = 1; i < 12; i++) { element = document.createElement('option'); element.setAttribute('value', i); element.innerHTML = i; selectId.appendChild( element ); }
// 現在の月を選択状態にする selectId.options[now_mon].selected = true;
// 日入力ボックスのメニュー項目のセット----- selectId = document.form1.bdDay;
// メニュー項目のセット for (var i = 1; i < 32; i++) { element = document.createElement('option'); element.setAttribute('value', i); element.innerHTML = i; selectId.appendChild( element ); }
// 現在の日を選択状態にする selectId.options[now_days].selected = true; }
//初期化処理------------------------------------------- function init() {
//描画コンテキストの取得 canvas = document.getElementById("mainCanvas"); if ( ! canvas || ! canvas.getContext ) { return false; } ctx = canvas.getContext('2d');
img_back.src = "back.png";
initSelect_Year(); //年月日選択オプションの初期化
draw_Back();
ctx.font = "24px 'MS Pゴシック'"; //表示フォントの設定 ctx.fillText("生年月日を入力して、計算するボタンを押してね。", 50, 90); }
//計算実行-------------------------------------------- function execCulc() {
draw_Back();
//誕生日、現在の日付の文字列------------------ var selectId = document.form1.bdYear; var num = selectId.selectedIndex; var str_year = selectId.options[num].value;
selectId = document.form1.bdMonth; num = selectId.selectedIndex; var str_mon = selectId.options[num].value;
selectId = document.form1.bdDay; num = selectId.selectedIndex; var str_days = selectId.options[num].value;
var str_birthday = str_year + "年" + str_mon + "月" + str_days + "日"; var str_nowdate = now_year + "年" + (now_mon + 1) + "月" + (now_days + 1) + "日";
//現在の年月日を作成------------------------- var now_mon2 = Number(now_mon) + 1; var now_days2 = Number(now_days) + 1; now_date = now_year + "/" + now_mon2 + "/" + now_days2;
//誕生日の年月日を作成------------------------ base_date = Number(str_year) + "/" + Number(str_mon) + "/" + Number(str_days);
//経過日数を計算、表示----------------------- culcDiffDays(); //日付差分を計算
document.getElementById("detaildata").innerHTML = "あなたの誕生日: " + str_birthday + " 今日は: " + str_nowdate + " あなたが産まれてから: " + m_diffDays + "日";
//結果の計算、表示---------------------------------- ctx.fillStyle = "blue"; ctx.font = "24px 'MS Pゴシック'"; //表示フォントの設定 var resultValue = culcResult(); //日付差分を計算 ctx.fillStyle = "blue"; ctx.fillText("地球の寿命を人間の寿命に換算すると、", 50, 70); ctx.fillText("あなたが産まれてからの時間は " + resultValue + "秒だよ。", 50, 100); ctx.fillStyle = "black";
}
//背景を描画------------------------------------------ function draw_Back() { ctx.clearRect(0, 0, 600, 400); //画面のクリア ctx.drawImage(img_back, 0, 0, 600, 300); }
//日付の差分を計算------------------------------------ function culcDiffDays() { var Date1 = new Date(now_date); var Date2 = new Date(base_date); m_diffDays = Math.ceil((Date1 - Date2) / m_daymsec); //1日は86400000ms
}
//結果の計算------------------------------------------ function culcResult() { var resultValue = 0; //結果ミリ秒
var temp1 = m_diffDays * m_daymsec; //差分日付をミリ秒に resultValue1 = Math.ceil(temp1 / 100000000); //これで割る ミリ秒単位 resultValue = resultValue1 / 1000; //秒単位
return resultValue; }
//最初に実行------------------------------------------ function main(){ init(); //draw(); }
-
|