
function Page(parentElement, patient, dateTime){
    // Page コンストラクタを生成
    var elm = newDIV(parentElement, "");
    
    // 付箋エリア ====================================
    this.postItArea = newDIV(elm, "");

    // PAGE HEADER =================================
    var div = newDIV(elm, "");
    this.header = div;
    div.style.fontSize = "10pt";
    var sp = newSPAN(div, ""); // 受診日
    var num = weekOfDate(dateTime);
    sp.innerHTML = dateTime + " " + _weeks[num];
    sp.style.paddingLeft = "2px";
    sp.style.paddingRight = "20px";
    sp.style.color = "#00c";
    var sp = newSPAN(div, ""); // 受診者 漢字氏名
    sp.innerHTML = patient.kanjiName;
    sp.style.fontSize = "12pt";
    sp.style.fontWeight = "bold";
    sp.style.paddingRight = "10px";
    var sp = newSPAN(div, ""); // 受診者 ふりがな氏名
    sp.innerHTML = patient.kanaName;
    sp.style.paddingRight = "10px";
    var sp = newSPAN(div, ""); // 受診者 年齢
    sp.innerHTML = ageAtDate(patient.birthDate, dateTime) + " 才"
    
    // ページ・ヘッダーのアイコン・ギャラリー表示行 =======
    this.toolArea = newDIV(elm, "/clearfix");
    this.toolArea.style.paddingRight = "10px";
    this.toolArea.style.paddingBottom = "5px";

    // PAGE BODY ===================================
    this.body = newDIV(elm, "");
}

function FloatPanel(id, x, y, w, title, helpAction, titleAction){
    // 半透明パネルを開く
    var elm = document.getElementById(id);
    if (!elm){
        alert(id + " がないのでパネルを表示できません");
        return null;
    }
    window.onmousemove = getMouseXY;
    setFloatPanel(elm);
    
    this.base = elm; // 外部からコントロールできる
    elm.style.padding = "5px";
    elm.style.borderRadius = "10px";
    elm.style.left = x; // 表示するx座標
    elm.style.top = y; // 表示するy座標
    elm.style.width = w;
    elm.style.backgroundColor = "#eee";
    //elm.style.opacity = "0.8";
    elm.style.boxShadow = "2px 2px 10px 2px #555";
    elm.style.visibility = "visible";
    elm.innerHTML = "";

    // === HEADER =============
    var div = newDIV(elm, "/clearfix");
    div.setAttribute("onmousedown", "cursorLock(this)"); // マウスで掴み可動にする
    div.setAttribute("onmouseup", "cursorUnlock()"); // マウスで掴み可動にする
    var rightWidth = 20; // RIGHT SIDE WIDTH
    // --- LEFT SIDE
    // CLOSE BUTTON
    var dv = newDIV(div, "/left-side");
    var ary = elm.style.width.split("px"); // elm.style.width は "200px" 形式
    var width = ary[0] * 1;
    dv.style.width = (width - 25) + "px";
    dv.style.padding = "0"; // CSS を上書き
    var bt = newDIV(dv, "/closeButton");
    bt.style.fontSize = "10pt";
    bt.style.fontWeight = "bold";
    bt.innerHTML = "x";
    bt.setAttribute("onclick", "closeFloatPanel('" + id + "')");
    // TITLE
    this.title = newSPAN(dv, ""); // 外部から取得するための ID
    this.title.style.fontSize = "9pt";
    if (title){
        //var sp = newSPAN(dv, "seeThroughPanelTitle"); // 外部から取得するための ID
        this.title.innerHTML = title;
    }
    // タイトルをクリックすると action を実行
    if (titleAction){
        this.title.setAttribute("onclick", titleAction);
        this.title.setAttribute("class", "record");
        this.title.style.padding = "0 10px";
        this.title.style.borderRadius = "10px";
    }
    // --- RIGHT SIDE
    var dv = newDIV(div, "/right-side");
    dv.style.width = rightWidth + "px";
    dv.style.padding = "0"; // CSS を上書き
    dv.style.position = "relative";
    dv.style.top = "3px";
    dv.style.padding = "0"; // CSS を上書き
    // HELP
    if (helpAction){
        var img = newIMAGE(dv, "", "help.png", "help");
        img.style.height = "15px";
        img.setAttribute("onclick", helpAction);
        img.setAttribute("class", "expandIcon");
    }
    
    // === CONTENTS ===============
    this.contents = newDIV(elm, "");
    this.contents.style.marginTop = "5px";
}

