Ajax

.NETFrameworkから離れて

strangeworker@wankuma.com — Sun, 12 Jul 2009 17:48:00 GMT

PHP+MySQLでサイト構築をしました。

自分のやりたいことしかやってないので使い勝手は微妙ですが、

家計簿をつけるのがめんどくさいという方はぜひ。

ちなみに主にauの携帯電話用なので、アカウント作成は携帯から行なってください。

ぺこり。

http://wallets.s5.pf-x.net/

とりあえず昔作った円グラフ描画クラスとか

strangeworker@wankuma.com — Wed, 28 Jan 2009 05:29:00 GMT

多分prototype.jsとexcanvas.jsが必要だと思います。

あと、主にIE5でしか動作確認していません。

IE6かIE7で描画位置がおかしくなるのは確認済みです。

修正はしてません。

（phpと剥き出しのJavaScript、およびCSSを使っていた頃の知識が欠落しているため、修正不可能になってます。汗。）

使用例：

function tab2SelectedInit () {

    if (null != _pieChart && _pieData.item) {

        _pieChart.Draw(new Point(350, 150), 150, _pieData, '円');

以下、pieChart.js

/*-----------------------------------------------------------------------------

座標クラス

------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------

コンストラクタ

------------------------------------------------------------------------------*/

function Point (x, y) {

    this.X    = x;

    this.Y = y;

/*------------------------------------------------------------------------------

円グラフ描画クラス

------------------------------------------------------------------------------*/

PieChart.ParcentDeg = 360 / 100;    // 1%に相当する角度

/*------------------------------------------------------------------------------

コンストラクタ

------------------------------------------------------------------------------*/

function PieChart (ctx, valueStyle, strokeStyle, fillStyles) {

    this._ctx             = ctx;

    this._valueStyle    = valueStyle;

    this._lineWidth     = 2;

    this._strokeStyle     = strokeStyle;

    this._fillStyles     = fillStyles;

/*------------------------------------------------------------------------------

描画メソッド

------------------------------------------------------------------------------*/

PieChart.prototype.Draw = function (centerPoint, r, data, unitText) {

    var parcentDiv         = this.GetParcentCanvas(centerPoint, r);    // パーセントDIVの親

    var titleDiv         = this.GetTitleCanvas(centerPoint, r);        // 題DIVの親

    var totalValue         = this.GetTotalValue(data);                    // 合計値

    var totalParcent    = 0;                                        // 累計パーセント

    // 円グラフ描画

    for (var i = 0; i < data.item.length; i++) {

        // 開始角度と終了角度を算出

        var currentParcent = data.item[i].value / totalValue * 100;

        var startDeg = PieChart.ParcentDeg * totalParcent;

        var endDeg      = PieChart.ParcentDeg * (totalParcent += currentParcent);

        // 描画

        this.DrawPiece(centerPoint, r, this._fillStyles[i], startDeg, endDeg);

        this.PutParcentText(parcentDiv, currentParcent, centerPoint, r, startDeg, endDeg);

        this.PutTitleText(titleDiv, data.item[i], unitText, this._fillStyles[i], centerPoint, r);

};

/*------------------------------------------------------------------------------

合計値算出

------------------------------------------------------------------------------*/

PieChart.prototype.GetTotalValue = function (data) {

    var total = 0;

    for (var i = 0; i < data.item.length; i++) {

        total += parseInt(data.item[i].value, 10);

    return total;

/*------------------------------------------------------------------------------

タイトル文字追加

------------------------------------------------------------------------------*/

PieChart.prototype.PutTitleText = function (textDiv, item, unitText, fillStyle, centerPoint, r) {

    var base = document.createElement("div");

    textDiv.appendChild(base);

    var colorLabel = document.createElement("span");

    colorLabel.style.backgroundColor     = fillStyle;

    colorLabel.style.border             = "1px solid #c9c9c9";

    colorLabel.innerHTML                 = "&nbsp;&nbsp;&nbsp;";

    base.appendChild(colorLabel);

    var label = document.createElement("span");

    label.innerHTML         = "&nbsp;" + item.title + "<small>&nbsp;(" + PieChart.InsertComma(item.value) + unitText + ")</small>";

    label.style.fontSize     = "12pt";

    base.appendChild(label);

/*------------------------------------------------------------------------------

タイトル文字DIV追加用DIV

------------------------------------------------------------------------------*/

PieChart.prototype.GetTitleCanvas = function (centerPoint, r) {

    if (null == this._titleDiv) {

        var div = document.createElement("div");

        this._ctx.canvas.parentNode.appendChild(div);

        this._titleDiv = div;

    this._titleDiv.innerHTML                = "";

    this._titleDiv.style.position             = "absolute";

    this._titleDiv.style.textAlign             = "left";

    this._titleDiv.style.left                 = this._ctx.canvas.offsetLeft + "px";

    this._titleDiv.style.top                 = this._ctx.canvas.offsetTop  + "px";

    this._titleDiv.style.margin             = "10px";

    this._titleDiv.style.padding             = "0.5em";

    this._titleDiv.style.border             = "2px dashed #c9c9c9";

    this._titleDiv.style.backgroundColor     = "#ffffff";

    return this._titleDiv;

/*------------------------------------------------------------------------------

値文字DIV追加用DIV

------------------------------------------------------------------------------*/

PieChart.prototype.GetParcentCanvas = function (centerPoint, r) {

    if (null == this._valueDiv) {

        var div = document.createElement("div");

        this._ctx.canvas.parentNode.appendChild(div);

        this._valueDiv = div;

    var diameter = r * 2;

    this._valueDiv.innerHTML         = "";

    this._valueDiv.style.position     = "absolute";

    this._valueDiv.style.textAlign     = "left";

    this._valueDiv.style.left         = this._ctx.canvas.offsetLeft + centerPoint.X - r + "px";

    this._valueDiv.style.top         = this._ctx.canvas.offsetTop  + centerPoint.Y - r + "px";

    this._valueDiv.style.width         = diameter + "px";

    this._valueDiv.style.height     = diameter + "px";

    this._valueDiv.style.color        = this._valueStyle;

    return this._valueDiv;

};

/*------------------------------------------------------------------------------

パーセント文字DIV

------------------------------------------------------------------------------*/

PieChart.prototype.PutParcentText = function (textDiv, value, centerPoint, r, startDeg, endDeg) {

    var basePoint = 8;

    var offset = 1.1;

    var halfR = r / 2;

    var customHalfR = halfR * offset;

    var halfDeg = (endDeg - startDeg) / 2

    var halfEndDeg = startDeg + halfDeg;

    var halfEndRad = PieChart.ToRadBaseTop(halfEndDeg);

    var x = Math.ceil(customHalfR * Math.cos(halfEndRad));

    var y = Math.ceil(customHalfR * Math.sin(halfEndRad));

    var label = document.createElement("div");

    label.style.position     = "absolute";

    label.innerHTML         = Math.ceil(value) + "%";

    label.style.left         = r + x - halfR + "px";

    label.style.top         = r + y - halfR + "px";

    label.style.lineHeight    = r + "px";

    label.style.height         = r + "px";

    label.style.width         = r + "px";

    label.style.textAlign     = "center";

    label.style.fontSize     = basePoint + Math.ceil(value / (basePoint / 4)) + "pt";

    label.style.fontWeight     = "bold";

    textDiv.appendChild(label);

/*------------------------------------------------------------------------------

描画メソッド（1欠片）

------------------------------------------------------------------------------*/

PieChart.prototype.DrawPiece = function (centerPoint, r, fillStyle, startDeg, endDeg) {

    this.Fill(centerPoint, r, fillStyle, startDeg, endDeg);

    this.Stroke(centerPoint, r, startDeg, endDeg);

};

/*------------------------------------------------------------------------------

描画メソッド（1欠片）Fill

------------------------------------------------------------------------------*/

PieChart.prototype.Fill = function (centerPoint, r, fillStyle, startDeg, endDeg) {

    this._ctx.fillStyle = fillStyle;

    this._ctx.beginPath();

    this._ctx.moveTo(centerPoint.X, centerPoint.Y);

    this._ctx.arc(centerPoint.X, centerPoint.Y, r, PieChart.ToRadBaseTop(startDeg), PieChart.ToRadBaseTop(endDeg), false);

    this._ctx.lineTo(centerPoint.X, centerPoint.Y);

    this._ctx.closePath();

    this._ctx.fill();

};

/*------------------------------------------------------------------------------

描画メソッド（1欠片）Stroke

------------------------------------------------------------------------------*/

PieChart.prototype.Stroke = function (centerPoint, r, startDeg, endDeg) {

    this._ctx.strokeStyle  = this._strokeStyle;

    this._ctx.lineWidth = this._lineWidth;

    this._ctx.beginPath();

    this._ctx.moveTo(centerPoint.X, centerPoint.Y);

    this._ctx.arc(centerPoint.X, centerPoint.Y, r - this._lineWidth / 2, PieChart.ToRadBaseTop(startDeg), PieChart.ToRadBaseTop(endDeg), false);

    this._ctx.lineTo(centerPoint.X, centerPoint.Y);

    this._ctx.moveTo(centerPoint.X, centerPoint.Y);

    this._ctx.closePath();

    this._ctx.stroke();

};

/*------------------------------------------------------------------------------

通常角度をラジアンに変換する

------------------------------------------------------------------------------*/

PieChart.ToRadBaseTop = function (degrees) {

    return PieChart.ToRad(degrees - 90);

};

/*------------------------------------------------------------------------------

角度をラジアンに変換する

------------------------------------------------------------------------------*/

PieChart.ToRad = function (degrees) {

    return degrees * Math.PI / 180;

};

/*------------------------------------------------------------------------------

カンマ挿入関数

------------------------------------------------------------------------------*/

PieChart.InsertComma = function (sourceStr) {

    var destStr = sourceStr;

    var tmpStr = "";

    while (destStr != (tmpStr = destStr.replace(/^([+-]?\d+)(\d\d\d)/,"$1,$2"))) {

        destStr = tmpStr;

    return destStr;

};

人様の作った日付系クラスとそれを流用したカレンダー描画クラス

strangeworker@wankuma.com — Wed, 28 Jan 2009 05:26:00 GMT

これも多分prototype.jsとexcanvas.jsが必要だと思います。

あと、主にIE5、6とOpera、FireFoxでしか動作確認していません。

動作にはこの辺の画像が必要だと思います。

dayChecker.js

/*------------------------------------------------------------------------------

日付管理クラス

------------------------------------------------------------------------------*/

var DayChecker = Class.create();

// プロトタイプ拡張

DayChecker.prototype = {

    /*------------------------------------------------------------------------------

     コンストラクタ

    ------------------------------------------------------------------------------*/

    initialize: function () {

        var data = (0 == arguments.length) ? new Date() : arguments[0];

        this.currentYear     = data.getYear();

        this.currentYear     = (this.currentYear < 2000) ? this.currentYear + 1900 : this.currentYear;

        this.currentMonth     = data.getMonth() + 1;

        this.currentDay     = data.getDate();

},

    /*------------------------------------------------------------------------------

     今日か

    ------------------------------------------------------------------------------*/

    isToday: function isToday (year, month, day) {

        if(year == this.currentYear && parseInt(month, 10) == this.currentMonth && day == this.currentDay) {

            return true;

        return false;

},

    /*------------------------------------------------------------------------------

     土曜日か

    ------------------------------------------------------------------------------*/

    isSaturday: function isSaturday (year, month, day){

        var week = new Date(year, month-1, day).getDay();

        if(week == 6){

            return true;

        return false;

},

    /*------------------------------------------------------------------------------

     日曜日か

    ------------------------------------------------------------------------------*/

    isSunday: function (year, month, day) {

        var week = new Date(year, month-1, day).getDay();

        if(week == 0){

            return true;

        return false;

},

    /*------------------------------------------------------------------------------

     休日か

    ------------------------------------------------------------------------------*/

    isHoliday: function (year, month, day) {

        if (this.isSunday(year, month, day)) {

            return true;

        switch (parseInt(month, 10)) {

            case 1:

                if (day == 1) {

                    return true;

                if (day == 2 && this.isSunday(year, month, 1)) {

                    return true;

                if (day == (this.getFirstMonday(year, month) + 7)) {

                    return true;

                break;

            case 2:

                if (day == 11){

                    return true;

                if (day == 12 && this.isSunday(year, month, 11)) {

                    return true;

                break;

            case 3:

                if (year > 1979 && year < 2100) {

                    if (day == parseInt(20.8431 + 0.242194 * (year - 1980) - parseInt((year - 1980) / 4))) {

                        return true;

                    if    (day == (parseInt(20.8431 + 0.242194 * (year - 1980) - parseInt((year - 1980) / 4)) + 1)

                        && this.isSunday(year, month, day-1)) {

                            return true;

                break;

            case 4:

                if (day == 29) {

                    return true;

                if (day == 30 && this.isSunday(year, month, 29)) {

                    return true;

                break;

            case 5:

                if (day == 3 || day == 4 || day == 5) {

                    return true;

                if (day == 6 && (this.isSunday(year, month, 3)

                    || this.isSunday(year, month, 4)

                    || this.isSunday(year, month, 5))) {

                    return true;

                 break;

             case 7:

                 if (day == (this.getFirstMonday(year, month) + 14)) {

                     return true;

                break;

            case 9:

                if (day == (this.getFirstMonday(year, month) + 14)) {

                    return true;

                if (year > 1979 && year < 2100) {

                    if (day == parseInt(23.2488 + 0.242194 * (year - 1980) - parseInt((year - 1980) / 4))) {

                        return true;

                    if (day == (parseInt(23.2488 + 0.242194 * (year - 1980) - parseInt((year - 1980) / 4)) + 1)

                        && this.isSunday(year, month, day-1)) {

                        return true;

                break;

            case 10:

                if (day == (this.getFirstMonday(year, month) + 7)) {

                    return true;

                break;

            case 11:

                if(day == 3 || day == 23) {

                    return true;

                if(day == 4 && this.isSunday(year, month, 3)) {

                    return true;

                if(day == 24 && this.isSunday(year, month, 23)) {

                    return true;

                break;

            case 12:

                if(day == 23) {

                    return true;

                if(day == 24 && this.isSunday(year, month, 23)) {

                    return true;

                break;

        return false;

},

    /*------------------------------------------------------------------------------

     最初の月曜日か

    ------------------------------------------------------------------------------*/

    getFirstMonday: function (year, month) {

        var monday;

        for (monday = 1; monday < 8; monday++) {

            if (new Date(year, month-1, monday).getDay() == 1){

                break;

        return monday;

};

calendar.js

/*------------------------------------------------------------------------------

カレンダー描画クラス

------------------------------------------------------------------------------*/

var Calendar = Class.create();

Calendar.WeekInMonth    = 6;

Calendar.Week            = new Array("Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat");

Calendar.Sun            = 0;

Calendar.Sat            = 6;

// プロトタイプ定義

Calendar.prototype = {

    /*------------------------------------------------------------------------------

     コンストラクタ

    ------------------------------------------------------------------------------*/

    initialize: function (parent, today) {

        // 初期値設定

        this.parent             = parent;

        this.today                 = this.cloneDate(today);

        this.selectedDate        = this.cloneDate(today);

        this.coreDisplayDate     = this.cloneDate(today);

        this.dayChecker            = new DayChecker(this.cloneDate(today));

        this.items                 = null;

        this.onDayClick            = null;

},

    /*------------------------------------------------------------------------------

     カレンダー描画

    ------------------------------------------------------------------------------*/

    render: function () {

        // カレンダー構築

        var calendar = this.createCalendar();

        // 一度DIVを初期化してから表示

        this.removeChildren(this.parent);

        this.parent.appendChild(calendar);

},

    /*------------------------------------------------------------------------------

     カレンダーメニュー部分構築

    ------------------------------------------------------------------------------*/

    createCalendarHead: function (tbody) {

        // 角丸上部

        tbody.appendChild(this.createMenuRoundTop());

        // メニュー本体

           tbody.appendChild(this.createMenuCore());

           // 下部

           tbody.appendChild(this.createMenuBottom());

        return tbody;

},

    /*------------------------------------------------------------------------------

     カレンダー日付部分構築

    ------------------------------------------------------------------------------*/

    createCalendarBody: function (tbody) {

        var tr = tbody.appendChild(document.createElement('tr'));

        var td = tr.appendChild(document.createElement('td'));

        td.colSpan = '5';

        td.style.padding = '0px';

        var daysTable = td.appendChild(document.createElement('table'));

        daysTable.width = '100%'

        daysTable.style.borderCollapse = 'collapse';

        daysTable.style.border = '2px solid #EFA6C6';

        var daysTbody = daysTable.appendChild(document.createElement('tbody'));

        // 曜日表示部分作成

        daysTbody.appendChild(this.createBodyHeader());

        // 日付部分作成

        this.items = new Array();

           var startDate = this.getCalendarStartDate(this.coreDisplayDate);

        for (var weekCount = 0; weekCount < Calendar.WeekInMonth; weekCount++) {

            daysTbody.appendChild(this.createWeek(startDate));

        return tbody;

},

    /*------------------------------------------------------------------------------

     カレンダー構築

    ------------------------------------------------------------------------------*/

    createCalendar: function () {

        var mainTable = document.createElement('table');

        mainTable.style.borderCollapse = 'collapse';

        mainTable.style.overflow = 'hidden';

        var tbody = mainTable.appendChild(document.createElement('tbody'));

        // ヘッダ部分構築

        this.createCalendarHead(tbody);

        // ボディ部分構築

        this.createCalendarBody(tbody);

        return mainTable;

},

    /*------------------------------------------------------------------------------

     メニュー角丸上部構築

    ------------------------------------------------------------------------------*/

    createMenuRoundTop: function () {

           var tr = document.createElement('tr');

           var td;

        // 左角丸

        td = tr.appendChild(document.createElement('td'));

        td.style.background = 'url(img/calendar_upper_left.gif) no-repeat left top';

        td.style.width = '6px';

        td.style.height = '6px';

        td.style.padding = '0px';

        // 真ん中部分

        td = tr.appendChild(document.createElement('td'));

        td.colSpan = '3';

        td.style.backgroundColor = '#E7007B';

        // 右角丸

        td = tr.appendChild(document.createElement('td'));

        td.style.background = 'url(img/calendar_upper_right.gif) no-repeat left top';

        td.style.width = '6px';

        td.style.height = '6px';

        td.style.padding = '0px';

        return tr;

},

    /*------------------------------------------------------------------------------

     メニュー本体構築

    ------------------------------------------------------------------------------*/

    createMenuCore: function () {

        var tr = document.createElement('tr');

        var td;

        var anchor;

        // 左脇（角丸の真下）

           td = tr.appendChild(document.createElement('td'));

        td.style.backgroundColor = '#E7007B';

        td.style.padding = '0px';

           // 「<」ボタン

           td = tr.appendChild(document.createElement('td'));

           td.style.backgroundColor = '#E7007B';

           td.style.textAlign = 'left';

           anchor = td.appendChild(document.createElement('a'));

           anchor.href = 'javascript: void(0);'

           anchor.onclick = this.prevMonth_onClick.bindAsEventListener(this);

        img = anchor.appendChild(document.createElement('img'));

        img.border = '0px';

        img.src = 'img/calendar_prev.gif';

           // 年月表示

        td = tr.appendChild(document.createElement('td'));

        td.style.backgroundColor = '#E7007B';

           var div = td.appendChild(document.createElement('div'));

           div.style.textAlign = 'center';

           div.style.width = '100%';

           div.style.fontWeight = 'bold';

           div.style.color = '#ffffff';

           var text = this.coreDisplayDate.getFullYear() + '年' + this.getMonth(this.coreDisplayDate) + '月';

           var textNode = div.appendChild(document.createTextNode(text));

           // 「>」ボタン

           td = tr.appendChild(document.createElement('td'));

           td.style.backgroundColor = '#E7007B';

           td.style.textAlign = 'right';

           anchor = td.appendChild(document.createElement('a'));

           anchor.href = 'javascript: void(0);';

           anchor.onclick = this.nextMonth_onClick.bindAsEventListener(this);

        img = anchor.appendChild(document.createElement('img'));

        img.border = '0px';

        img.src = 'img/calendar_next.gif';

           // 右脇（角丸の真下）

           td = tr.appendChild(document.createElement('td'));

        td.style.backgroundColor = '#E7007B';

        td.style.padding = '0px';

           return tr;

},

    /*------------------------------------------------------------------------------

     メニュー下部構築

    ------------------------------------------------------------------------------*/

    createMenuBottom: function () {

           var tr = document.createElement('tr');

           var td;

        // 真ん中部分

        td = tr.appendChild(document.createElement('td'));

        td.colSpan = '5';

        td.height = '4px';

        td.style.backgroundColor = '#E7007B';

        return tr;

},

    /*------------------------------------------------------------------------------

     カレンダー部タグ構築

    ------------------------------------------------------------------------------*/

    createBodyHeader: function () {

        var tr = document.createElement('tr');

        tr.style.textAlign = 'center';

        tr.style.backgroundColor = '#EFA6C6';

        for (var i = 0; i < Calendar.Week.length; i++) {

            var td = tr.appendChild(document.createElement('td'));

            td.style.border = '1px solid #EFA6C6';

            td.style.fontFamily = 'monospace';

            var textNode = td.appendChild(document.createTextNode(Calendar.Week[i]));

            switch (i) {

                case Calendar.Sun :

                    td.style.color = '#E7007B';

                    break;

                case Calendar.Sat :

                    td.style.color = '#7320E7';

                    break;

                default :

                    td.style.color = '#ffffff';

                    break;

        return tr;

},

    /*------------------------------------------------------------------------------

     カレンダー内容構築（週単位）

    ------------------------------------------------------------------------------*/

    createWeek: function (startDate) {

        var tr = document.createElement('tr');

        var executingDate = startDate;

        for (var weekDay = 0; weekDay < Calendar.Week.length; weekDay++) {

               tr.appendChild(this.createDay(executingDate));

               this.addDate(executingDate, 1);

        return tr;

},

    /*------------------------------------------------------------------------------

     カレンダー内容タグ構築（日単位）

    ------------------------------------------------------------------------------*/

    createDay: function (executingDate) {

        if (this.coreDisplayDate.getMonth() == executingDate.getMonth()) {

            // 当月

            return this.createDayInThisMonth(executingDate);

        } else {

            // 今月ではない

            return this.createDayInOtherMonth(executingDate);

},

    /*------------------------------------------------------------------------------

     カレンダー内容タグ構築（日単位・当月）

    ------------------------------------------------------------------------------*/

    createDayInThisMonth: function (executingDate) {

        var td = document.createElement('td');

        td.style.textAlign = 'right';

        td.style.border = '1px solid #EFA6C6';

        var anchor = td.appendChild(document.createElement('a'));

        var textNode = anchor.appendChild(document.createTextNode(executingDate.getDate()));

        anchor.style.padding = '0.15em';

        anchor.style.display = 'block';

        anchor.date = this.cloneDate(executingDate);

        anchor.href = 'javascript: void(0);';

        anchor.onclick = this.day_onClick.bindAsEventListener(this);

        this.setDateColor(anchor);

        this.items[anchor.date] = anchor;

        return td;

},

    /*------------------------------------------------------------------------------

     カレンダー内容タグ構築（日単位・当月以外）

    ------------------------------------------------------------------------------*/

    createDayInOtherMonth: function (executingDate) {

        var td = document.createElement('td');

        td.style.textAlign = 'right';

        td.style.border = '1px solid #EFA6C6';

        td.style.backgroundColor = '#FFEFEF';

        td.style.color = '#F7A6C6';

        var div = td.appendChild(document.createElement('div'));

        div.style.padding = '0.15em';

        var textNode = div.appendChild(document.createTextNode(executingDate.getDate()));

        return td;

},

    /*------------------------------------------------------------------------------

     カレンダー日付色設定

    ------------------------------------------------------------------------------*/

    setDateColor: function (div) {

        var executingDate = div.date;

        // 当日ならば太字

        if (this.compareDate(this.today, executingDate)) {

            div.style.fontWeight = 'bold';

        // 状態別のスタイル設定

        if (this.compareDate(this.selectedDate, executingDate)) {

            // 選択中

            div.style.color = '#ffffff';

            div.style.backgroundColor = '#E7007B';

        } else if (this.isHoliday(executingDate)) {

            // 日曜日・祝日

            div.style.color = '#E7007B';

            div.style.backgroundColor = '#ffffff';

        } else if (this.isSaturday(executingDate)) {

            // 土曜

            div.style.color = '#7320E7';

            div.style.backgroundColor = '#ffffff';

        } else {

            // 平日

            div.style.color = '#947184';

            div.style.backgroundColor = '#ffffff';

},

    /*------------------------------------------------------------------------------

     選択日設定

    ------------------------------------------------------------------------------*/

    setSelectedDate: function (date) {

        // 選択中の日付を退避してから新しい選択日を設定

        var prevSelectedDate = this.selectedDate;

        this.selectedDate = this.cloneDate(date);

        // それぞれ色を設定しなおす

        var prevAnchor = this.items[prevSelectedDate];

        if (prevAnchor) {

            this.setDateColor(prevAnchor);

        var selectedAnchor = this.items[date];

        if (selectedAnchor) {

            this.setDateColor(selectedAnchor);

},

    /*------------------------------------------------------------------------------

     選択日取得

    ------------------------------------------------------------------------------*/

    getSelectedDate: function () {

        return this.cloneDate(this.selectedDate);

},

    /*------------------------------------------------------------------------------

     表示日設定

    ------------------------------------------------------------------------------*/

    setShowDate: function (date) {

        this.coreDisplayDate = this.cloneDate(date);

},

    /*------------------------------------------------------------------------------

     前月移動ボタンクリック時処理

    ------------------------------------------------------------------------------*/

    prevMonth_onClick: function (e) {

        this.moveMonth(-1);

},

    /*------------------------------------------------------------------------------

     翌月移動ボタンクリック時処理

    ------------------------------------------------------------------------------*/

    nextMonth_onClick: function (e) {

        this.moveMonth(+1);

},

    /*------------------------------------------------------------------------------

     日付クリック時処理

    ------------------------------------------------------------------------------*/

    day_onClick: function (e) {

        if (this.onDayClick) {

            var ele = Event.element(e);

            this.onDayClick (this, ele.date);

},

    /*------------------------------------------------------------------------------

     日曜日・祝日か

    ------------------------------------------------------------------------------*/

    isHoliday: function (date) {

        return this.dayChecker.isHoliday(

            date.getFullYear(), this.getMonth(date), date.getDate());

},

    /*------------------------------------------------------------------------------

     土曜日か

    ------------------------------------------------------------------------------*/

    isSaturday: function (date) {

        return this.dayChecker.isSaturday(

            date.getFullYear(), this.getMonth(date), date.getDate());

},

    /*------------------------------------------------------------------------------

     子を全て削除構築

    ------------------------------------------------------------------------------*/

    removeChildren: function (obj) {

        while (obj.lastChild) {

            obj.removeChild(obj.lastChild);

},

    /*------------------------------------------------------------------------------

     月移動

    ------------------------------------------------------------------------------*/

    moveMonth: function (moveValue) {

        // 月移動

        this.addMonth(this.coreDisplayDate, moveValue);

        // カレンダー再構築

        this.render();

},

    /*------------------------------------------------------------------------------

     カレンダー開始日（当月1日以前の直近の日曜日）を示すDateを取得

    ------------------------------------------------------------------------------*/

    getCalendarStartDate: function (date) {

        var newDate = this.cloneDate(date);

        newDate.setDate(1);

        newDate.setDate(newDate.getDate() - newDate.getDay());

        return newDate;

},

    /*------------------------------------------------------------------------------

     月取得（JavaScriptのDateは月が0から始まるため補正する）

    ------------------------------------------------------------------------------*/

    getMonth: function (date) {

        return date.getMonth() + 1;

},

    /*------------------------------------------------------------------------------

     月加算

    ------------------------------------------------------------------------------*/

    addMonth: function (date, value) {

        return date.setMonth(date.getMonth() + value);

},

    /*------------------------------------------------------------------------------

     日加算

    ------------------------------------------------------------------------------*/

    addDate: function (date, value) {

        return date.setDate(date.getDate() + value);

},

    /*------------------------------------------------------------------------------

     日時比較

    ------------------------------------------------------------------------------*/

    compareDate: function (date1, date2) {

        if (date1.getTime() == date2.getTime()) {

            return true;

        } else {

            return false;

},

    /*------------------------------------------------------------------------------

     日付クローン作成

    ------------------------------------------------------------------------------*/

    cloneDate: function (date) {

        return new Date(date.getFullYear(), date.getMonth(), date.getDate());

};