// 註冊名稱空間 Type.registerNamespace("Daedalus"); /************************************* Object *************************************/ // 建構物件 Daedalus.MsnMessageBox = function(width, height) { this._popupWinWidth = width; this._popupWinHeight = height; // 物件 this._popupWin = null; this._popupWinHeader = null; this._popupWinHeaderTitle = null; this._popupWinHeaderX = null; this._popupWinContent = null; this._popupWinContentText = null; // gloab var this._isResetTimer = true; this._isAllowDragDrop = false; this._popupWinOffsetX; this._popupWinOffsetY; this._popupWinOldLeft; this._popupWinPopupBottom; this._popupWinActualHeight; this._popupWinHideAfter = 5000; this._popupWinTitleHeight; this._popupWinChangeDelta; this._popupWinShowBy; this._animate; this._isFirstShow = true; this._TitleText; this._ContentText; // TimerId this._popupWinTimerHideId = -1; this._popupWinTmrShowId = -1; // Handler this._pageLoadHandler = null; this._popupWinSelectStartHandler = null; this._popupWinMouseDownHandler = null; this._popupWinMouseMoveHandler = null; this._popupWinMouseUpHandler = null; this._popupWinHeaderXClickHandler = null; this._popupWinHeaderXMouseDownHandler = null; this._popupWinHeaderXMouseOverHandler = null; this._popupWinHeaderXMouseOutHandler = null; this._repositionHandler = null; this._ContentTextClickHandler = null; } // 屬性, 事件, 方法 Daedalus.MsnMessageBox.prototype = { initialize: function(style) { // ===================== MsnPopupWin 主要外框 物件建立 ===================== if (style == "" || style == null) style = "Blue"; this._popupWinStyle = this.GetStyle(style); this._popupWin = document.createElement('div'); this._popupWin.id = 'popupWin'; this._popupWin.style.display = 'none'; this._popupWin.style.background = this._popupWinStyle.popupBackground; this._popupWin.style.borderRight = "1px solid " + this._popupWinStyle.popupBorderDark; this._popupWin.style.borderBottom = "1px solid " + this._popupWinStyle.popupBorderDark; this._popupWin.style.borderLeft = "1px solid " + this._popupWinStyle.popupBorderLight; this._popupWin.style.borderTop = "1px solid " + this._popupWinStyle.popupBorderLight; this._popupWin.style.position = 'absolute'; this._popupWin.style.zIndex = 1001; this._popupWin.style.width = this._popupWinWidth + "px"; //'216px'; this._popupWin.style.height = this._popupWinHeight + "px"; //'100px'; //this._popupWin.style.top = (parseInt(this._getClientBounds().height) - parseInt(this._popupWinHeight)) + "px"; this._popupWin.style.right = '1px'; this._popupWin.style.bottom = '1px'; this._popupWinSelectStartHandler = Function.createDelegate(this, this._popupWin_OnSelectStart); $addHandler(this._popupWin, 'selectstart', this._popupWinSelectStartHandler); // ===================== MsnPopupWin Header外框 物件建立 ===================== this._popupWinHeader = document.createElement('div'); this._popupWinHeader.id = 'popupWin_header'; this._popupWinHeader.style.cursor = ''; this._popupWinHeader.style.display = 'none'; this._popupWinHeader.style.position = 'absolute'; this._popupWinHeader.style.left = '2px'; this._popupWinHeader.style.top = '2px'; this._popupWinHeader.style.width = this._popupWinWidth - 6 + "px"; //'210px'; //-6 this._popupWinHeader.style.height = '14px'; this._popupWinHeader.style.filter = "progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=" + this._popupWinStyle.gradientStart + ", EndColorStr=" + this._popupWinStyle.gradientEnd + ")"; this._popupWinHeader.style.font = '12px arial,sans-serif'; this._popupWinHeader.style.color = this._popupWinStyle.textColor; this._popupWinHeader.style.textDecoration = 'none'; // ===================== MsnPopupWin 標題文字 物件建立 ===================== this._popupWinHeaderTitle = document.createElement('span'); this._popupWinHeaderTitle.id = '_popupWinHeaderTitle'; this._popupWinHeaderTitle.appendChild(document.createTextNode(this.get_TitleText())); // ===================== MsnPopupWin 標題'X'按鈕 物件建立 ===================== this._popupWinHeaderX = document.createElement('span'); this._popupWinHeaderX.style.position = 'absolute'; this._popupWinHeaderX.style.right = '0px'; this._popupWinHeaderX.style.top = '0px'; this._popupWinHeaderX.style.cursor = 'pointer'; this._popupWinHeaderX.style.color = this._popupWinStyle.xButton; this._popupWinHeaderX.style.font = 'bold 12px arial,sans-serif'; this._popupWinHeaderX.appendChild(document.createTextNode("X")); // ===================== MsnPopupWin 標題'X'按鈕 事件建立 ===================== this._popupWinHeaderXClickHandler = Function.createDelegate(this, this._popupWinHeaderX_OnClick); $addHandler(this._popupWinHeaderX, 'click', this._popupWinHeaderXClickHandler); this._popupWinHeaderXMouseDownHandler = Function.createDelegate(this, this._popupWinHeaderX_OnMouseDown); $addHandler(this._popupWinHeaderX, 'mousedown', this._popupWinHeaderXMouseDownHandler); this._popupWinHeaderXMouseOverHandler = Function.createDelegate(this, this._popupWinHeaderX_OnMouseOver); $addHandler(this._popupWinHeaderX, 'mouseover', this._popupWinHeaderXMouseOverHandler); this._popupWinHeaderXMouseOutHandler = Function.createDelegate(this, this._popupWinHeaderX_OnMouseOut); $addHandler(this._popupWinHeaderX, 'mouseout', this._popupWinHeaderXMouseOutHandler); // ===================== MsnPopupWin 標題加入 Header外框 ===================== this._popupWinHeader.appendChild(this._popupWinHeaderTitle); this._popupWinHeader.appendChild(this._popupWinHeaderX); // [內容] _popupWinContent 建立內容外框 this._popupWinContent = document.createElement('div'); this._popupWinContent.style.display = 'none'; this._popupWinContent.style.borderLeft = "1px solid " + this._popupWinStyle.cntBorderDark; this._popupWinContent.style.borderTop = "1px solid " + this._popupWinStyle.cntBorderDark; this._popupWinContent.style.borderBottom = "1px solid " + this._popupWinStyle.cntBorderLight; this._popupWinContent.style.borderRight = "1px solid " + this._popupWinStyle.cntBorderLight; this._popupWinContent.style.background = this._popupWinStyle.cntBackground; this._popupWinContent.style.padding = '2px'; this._popupWinContent.style.overflow = 'hidden'; this._popupWinContent.style.textAlign = 'center'; this._popupWinContent.style.filter = "progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=" + this._popupWinStyle.gradientStart + ", EndColorStr=" + this._popupWinStyle.gradientEnd + ")"; this._popupWinContent.style.position = 'absolute'; this._popupWinContent.style.left = '2px'; this._popupWinContent.style.top = '20px'; this._popupWinContent.style.width = this._popupWinWidth - 10 + "px"; //'206px'; //-10 this._popupWinContent.style.height = this._popupWinHeight - 24 + "px"; //'76px'; // [內容] 內容外框的超連結文字 this._popupWinContentText = document.createElement('a'); this._popupWinContentText.id = '_popupWinContentText'; this._popupWinContentText.style.font = '12px arial,sans-serif'; this._popupWinContentText.style.color = this._popupWinStyle.textColor; this._popupWinContentText.style.textDecoration = 'none'; this._popupWinContentText.appendChild(document.createTextNode(this.get_ContentText())); this._popupWinContent.appendChild(this._popupWinContentText); // 1.將表頭加入主框架 this._popupWin.appendChild(this._popupWinHeader); // 2.將內容加入主框架 this._popupWin.appendChild(this._popupWinContent); // 3.將主框架輸出 this._pageLoadHandler = Function.createDelegate(this, this._Page_OnLoad); $addHandler(window, 'load', this._pageLoadHandler); // === 初始化變數 === this._popupWinOldLeft = this._popupWin.style.left; this._popupWinPopupBottom = this._popupWin.style.bottom.substr(0, this._popupWin.style.bottom.length - 2); this._popupWinPopupHgt = this._popupWin.style.height.substr(0, this._popupWin.style.height.length - 2); this._popupWinTitleHeight = this._popupWinHeader.style.height.substr(0, this._popupWinHeader.style.height.length - 2); this._popupWinChangeDelta = this._popupWinPopupHgt - (this._popupWinContent.style.height.substr(0, this._popupWinContent.style.height.length - 2)); //================================================================================================================================================= var element = this._popupWin; // Create the resposition handler used to place the element this._repositionHandler = Function.createDelegate(this, this._reposition); // Determine whether or not to use animations (i.e. whether or not the browser // supports CSS position: fixed). All major browsers except IE 6 or earlier support it. // Don't animate if we're running a version of IE greater than 6 this._animate = (Sys.Browser.agent == Sys.Browser.InternetExplorer && Sys.Browser.version < 7); if (this._animate) { // Initialize the animations to use the actual properties // this._animation = new AjaxControlToolkit.Animation.MoveAnimation( // element, this._scrollEffectDuration, 25, 0, 0, false, 'px'); // Make the control use absolute positioning to hover // appropriately and move it to its new home element.style.position = 'absolute'; } else { // Make the control use fixed positioning to keep it from moving // while the content behind it slides around element.style.position = 'fixed'; } // Attach the onResize handler //$addHandler(window, 'resize', this._repositionHandler); // Attach the onscroll event handler for the animations if (this._animate) { $addHandler(window, 'scroll', this._repositionHandler); } // Move to the initial position this._reposition(); }, _Page_OnLoad: function() { document.body.appendChild(this._popupWin); }, set_TitleText: function(value) { this._TitleText = value; }, get_TitleText: function() { return this._TitleText; }, set_ContentText: function(value) { this._ContentText = value; }, get_ContentText: function() { return this._ContentText; }, Show: function(popupWinTitle, popupWinContent) { // === Register DragDrop === if (this._isAllowDragDrop) { this._popupWinHeader.style.cursor = 'move'; this._popupWinMouseDownHandler = Function.createDelegate(this, this._popupWin_OnMouseDown); $addHandler(this._popupWin, 'mousedown', this._popupWinMouseDownHandler); } var show = null; if ((this._popupWinTimerHideId != -1) && ((show != null) && (show == this._popupWinShowBy))) { clearInterval(this._popupWinTimerHideId); this._popupWinTimerHideId = setInterval(Function.createDelegate(this, this._popupWinespopup_tmrHideTimer), this._popupWinHideAfter); return; } //if (this._popupWinTimerHideId == -1) return; this._popupWinshowBy = show; this._popupWin.style.left = this._popupWinOldLeft; this._popupWin.style.top = ''; this._popupWin.style.filter = ''; if (this._popupWinTimerHideId != -1) clearInterval(this._popupWinTimerHideId); this._popupWinTimerHideId = -1; this._popupWinHeader.style.display = 'none'; this._popupWinContent.style.display = 'none'; if (navigator.userAgent.indexOf('Opera') != -1) this._popupWin.style.bottom = (document.body.scrollHeight * 1 - document.body.scrollTop * 1 - document.body.offsetHeight * 1 + 1 * this._popupWinPopupBottom) + 'px'; if (popupWinTitle != null && popupWinContent != null) { this._popupWinContentText.innerHTML = popupWinContent; this._popupWinHeaderTitle.innerHTML = popupWinTitle; } else { this._popupWinHeaderTitle.innerHTML = this._TitleText; this._popupWinContentText.innerHTML = this._ContentText; } this._popupWinActualHeight = 0; this._popupWin.style.height = this._popupWinActualHeight + 'px'; this._popupWin.style.visibility = ''; if (!this._isResetTimer) this._popupWin.style.display = ''; this._popupWinTmrShowId = setInterval(Function.createDelegate(this, this._popupWinEspopup_tmrTimer), (this._isResetTimer ? 1000 : 20)); //this.Show(popupWinTitle, popupWinContent); }, _popupWinEspopup_tmrTimer: function() { if (this._isResetTimer) { this._popupWin.style.display = ''; clearInterval(this._popupWinTmrShowId); this._isResetTimer = false; this._popupWinTmrShowId = setInterval(Function.createDelegate(this, this._popupWinEspopup_tmrTimer), 20); } this._popupWinActualHeight += 5; if (this._popupWinActualHeight >= this._popupWinPopupHgt) { this._popupWinActualHeight = this._popupWinPopupHgt; clearInterval(this._popupWinTmrShowId); this._popupWinTmrShowId = -1; this._popupWinContent.style.display = ''; if (this._popupWinHideAfter != -1) this._popupWinTimerHideId = setInterval(Function.createDelegate(this, this._popupWinEspopup_tmrHideTimer), this._popupWinHideAfter); } if (this._popupWinTitleHeight < this._popupWinActualHeight - 6) this._popupWinHeader.style.display = ''; if ((this._popupWinActualHeight - this._popupWinChangeDelta) > 0) { this._popupWinContent.style.display = ''; this._popupWinContent.style.height = (this._popupWinActualHeight - this._popupWinChangeDelta) + 'px'; } this._popupWin.style.height = this._popupWinActualHeight + 'px'; }, _popupWinEspopup_tmrHideTimer: function() { clearInterval(this._popupWinTimerHideId); this._popupWinTimerHideId = -1; if (Sys.Browser.agent == Sys.Browser.InternetExplorer && Sys.Browser.version <= 6) { this._popupWin.style.visibility = 'hidden'; } else { var backCnt = this._popupWinContent.innerHTML; var backTit = this._popupWinHeader.innerHTML; this._popupWinContent.innerHTML = ''; this._popupWinHeader.innerHTML = ''; this._popupWin.style.filter = 'blendTrans(duration=1)'; this._popupWin.filters.blendtrans.apply(); this._popupWin.style.visibility = 'hidden'; this._popupWin.filters.blendtrans.play(); this._popupWinContent.innerHTML = backCnt; this._popupWinHeader.innerHTML = backTit; } }, _popupWin_OnSelectStart: function() { return false; }, _popupWin_OnMouseDown: function(e) { var ox = (e.offsetX == null) ? e.layerX : e.offsetX; var oy = (e.offsetY == null) ? e.layerY : e.offsetY; this._popupWinOffsetX = ox; this._popupWinOffsetY = oy; this._popupWinMouseMoveHandler = Function.createDelegate(this, this._popupWin_OnMouseMove); $addHandler(document.body, 'mousemove', this._popupWinMouseMoveHandler); this._popupWinMouseUpHandler = Function.createDelegate(this, this._popupWin_OnMouseUp); $addHandler(document.body, 'mouseup', this._popupWinMouseUpHandler); if (this._popupWinTimerHideId != -1) clearInterval(this._popupWinTimerHideId); }, _popupWin_OnMouseMove: function(e) { if (e == null && event != null) { this._popupWin.style.left = (event.clientX * 1 + document.body.scrollLeft - this._popupWinOffsetX) + 'px'; this._popupWin.style.top = (event.clientY * 1 + document.body.scrollTop - this._popupWinOffsetY) + 'px'; event.cancelBubble = true; } else { this._popupWin.style.left = (e.clientX * 1 - this._popupWinOffsetX) + 'px'; this._popupWin.style.top = (e.clientY * 1 - this._popupWinOffsetY) + 'px'; e.cancelBubble = true; } if ((event.button & 1) == 0) this._popupWin_OnMouseUp(); }, _popupWin_OnMouseUp: function() { if (this._popupWinMouseMoveHandler != null) $removeHandler(document.body, 'mousemove', this._popupWinMouseMoveHandler); if (this._popupWinMouseUpHandler != null) $removeHandler(document.body, 'mouseup', this._popupWinMouseUpHandler); }, _popupWinHeaderX_OnClick: function() { //this._popupWin.style.filter = ''; //this._popupWin.style.display = 'none'; if (this._popupWinTmrShowId == -1) { this._popupWin.style.filter = ''; this._popupWin.style.display = 'none'; if (this._popupWinTimerHideId != -1) clearInterval(this._popupWinTimerHideId); this._popupWinTimerHideId = -1; } }, _popupWinHeaderX_OnMouseDown: function() { event.cancelBubble = true; }, _popupWinHeaderX_OnMouseOver: function() { this._popupWinHeaderX.style.color = this._popupWinStyle.xButtonOver; }, _popupWinHeaderX_OnMouseOut: function() { this._popupWinHeaderX.style.color = +this._popupWinStyle.xButton; }, get_HideAfter: function() { return this._popupWinHideAfter; }, set_HideAfter: function(millisecond) { if (millisecond == null || millisecond == "") millisecond = 5000; this._popupWinHideAfter = millisecond; }, get_AllowDragDrop: function() { return this._isAllowDragDrop; }, set_AllowDragDrop: function(isAllow) { this._isAllowDragDrop = isAllow; }, get_zIndex: function(){ return this._popupWin.style.zIndex; }, set_zIndex: function(zIndex){ this._popupWin.style.zIndex = zIndex; }, GetStyle: function(type) { var styleObject = new Object(); switch (type) { case "Blue": styleObject.textColor = "#1F336B"; styleObject.xButtonOver = styleObject.popupBorderDark = "#455690"; styleObject.xButton = styleObject.cntBorderDark = "#728EB8"; styleObject.popupBorderLight = styleObject.cntBorderLight = "#B9C9EF"; styleObject.popupBackground = styleObject.cntBackground = styleObject.gradientStart = "#E0E9F8"; styleObject.gradientEnd = "#FFFFFF"; break; case "Red": styleObject.textColor = "#400000"; styleObject.xButtonOver = styleObject.popupBorderDark = "#800000"; styleObject.xButton = styleObject.cntBorderDark = "#A05A5A"; styleObject.popupBorderLight = styleObject.cntBorderLight = "#C8AAAA"; styleObject.popupBackground = styleObject.cntBackground = styleObject.gradientStart = "#DCC8C8"; styleObject.gradientEnd = "#FFFFFF"; break; case "Green": styleObject.textColor = "#004000"; styleObject.xButtonOver = styleObject.popupBorderDark = "#008000"; styleObject.xButton = styleObject.cntBorderDark = "#5AA05A"; styleObject.popupBorderLight = styleObject.cntBorderLight = "#AAC8AA"; styleObject.popupBackground = styleObject.cntBackground = styleObject.gradientStart = "#C8DCC8"; styleObject.gradientEnd = "#FFFFFF"; break; case "Violet": styleObject.textColor = "#200040"; styleObject.xButtonOver = styleObject.popupBorderDark = "#400080"; styleObject.xButton = styleObject.cntBorderDark = "#7D5AA0"; styleObject.popupBorderLight = styleObject.cntBorderLight = "#B9AAC8"; styleObject.popupBackground = styleObject.cntBackground = styleObject.gradientStart = "#D2C8DC"; styleObject.gradientEnd = "#FFFFFF"; break; } return styleObject; }, _reposition: function(eventObject) { /// /// Handler to reposition the element and place it where it actually belongs /// whenever the browser is scrolled or resized /// /// /// Event info /// /// if (this._popupWin.style.visibility == 'hidden') return; var element = this._popupWin; //if (!element) return; //this.raiseRepositioning(Sys.EventArgs.Empty); var x = 0; var y = 0; // Compute the initial offset if we're animating if (this._animate) { if (document.documentElement && document.documentElement.scrollTop) { x = document.documentElement.scrollLeft; y = document.documentElement.scrollTop; } else { x = document.body.scrollLeft; y = document.body.scrollTop; } } // Compute the width and height of the client var clientBounds = this._getClientBounds(); var width = clientBounds.width; var height = clientBounds.height; // Compute the horizontal coordinate x = Math.max(0, x + width - element.offsetWidth); // Compute the vertical coordinate y = Math.max(0, y + height - element.offsetHeight); // Move the element to its new position element.style.left = x + 'px'; element.style.top = y + 'px'; //this.raiseRepositioned(Sys.EventArgs.Empty); }, set_ContentTextClickFunction: function(functionName) { this._popupWinContentText.href = "javascript:" + functionName; this._popupWinContentText.style.textDecoration = 'none'; // this._popupWinContentText.onmouseover = "this.style.textDecoration = 'underline';"; // this._popupWinContentText.onmouseout = "this.style.textDecoration = 'none';"; }, _getClientBounds: function() { /// /// Gets the width and height of the browser client window (excluding scrollbars) /// /// /// Browser's client width and height /// var clientWidth; var clientHeight; switch (Sys.Browser.agent) { case Sys.Browser.InternetExplorer: clientWidth = document.documentElement.clientWidth; clientHeight = document.documentElement.clientHeight; break; case Sys.Browser.Safari: clientWidth = window.innerWidth; clientHeight = window.innerHeight; break; case Sys.Browser.Opera: clientWidth = Math.min(window.innerWidth, document.body.clientWidth); clientHeight = Math.min(window.innerHeight, document.body.clientHeight); break; default: // Sys.Browser.Firefox, etc. clientWidth = Math.min(window.innerWidth, document.documentElement.clientWidth); clientHeight = Math.min(window.innerHeight, document.documentElement.clientHeight); break; } return new Sys.UI.Bounds(0, 0, clientWidth, clientHeight); }, dispose: function() { // TimerId this._popupWinTimerHideId = -1; this._popupWinTmrShowId = -1; // Handler this._pageLoadHandler = null; this._popupWinSelectStartHandler = null; this._popupWinMouseDownHandler = null; this._popupWinMouseMoveHandler = null; this._popupWinMouseUpHandler = null; this._popupWinHeaderXClickHandler = null; this._popupWinHeaderXMouseDownHandler = null; this._popupWinHeaderXMouseOverHandler = null; this._popupWinHeaderXMouseOutHandler = null; } } // 註冊類別 Daedalus.MsnMessageBox.registerClass('Daedalus.MsnMessageBox', null, Sys.IDisposable); if (typeof (Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();