Implement the MSN message box function in C #

A recent task is to implement the MSN message box function.

There are three versions in total:
1. Use Asp.net to bring up a message box on the webpage
I used one. net third-party controls (this control can be found on the Internet), but this control can only be displayed in the webpage area, that is, it cannot truly implement the same message box function as MSN. No renewal, so I had to give up. However, you can use it if you only need to display it in the webpage area.

2. Use JavaScript to implement this function
This is implemented using JavaScript. The Code is as follows:

 

<Script language = "JavaScript">

<! --

/*
* Message structure
*/
Function class_msn_message (ID, width, height, caption, title, message, target, Action ){
This. ID = ID;
This. Title = title;
This. Caption = Caption;
This. Message = message;
This.tar get = target;
This. Action = action;
This. width = width? Width: 200;
This. Height = height? Height: 120;
This. Timeout = 150;
This. speed = 20;
This. Step = 1;
This. Right = screen. Width-1;
This. Bottom = screen. height;
This. Left = this. Right-This. width;
This. Top = This. Bottom-This. height;
This. Timer = 0;
This. Pause = false;
This. Close = false;
}

/*
* Message hiding method
*/
Class_msn_message.prototype.hide = function (){
If (this. onUnload ()){

VaR offset = This. Height> This. bottom-this.top? This. Height: This. bottom-this.top;
VaR me = this;
 
If (this. Timer> 0 ){
Window. clearinterval (Me. Timer );
}
 
VaR fun = function (){
If (Me. Pause = false | me. Close ){
VaR x = me. Left;
Var y = 0;
VaR width = me. width;
VaR Height = 0;
If (Me. Offset> 0 ){
Height = me. offset;
}

Y = me. Bottom-height;

If (Y> = me. Bottom ){
Window. clearinterval (Me. Timer );
Me. Pop. Hide ();
} Else {
Me. offset = me. offset-me. Step; // if it is equal to 0, it disappears immediately; otherwise, it disappears gradually.
}
Me. Pop. Show (X, Y, width, height );
}
}
 
This. Timer = Window. setinterval (fun, this. Speed)
}
}

/*
* Message uninstallation event, which can be rewritten
*/
Class_msn_message.prototype.onunload = function (){
Return true;
}
/*
* Message command event. to implement your own connection, rewrite it.
*
*/
Class_msn_message.prototype.oncommand = function (){
This. Hide ();
Window. Open ('HTTP: // www.google.com ');
}

/*
* Message Display Method
*/
Class_msn_message.prototype.show = function (){

VaR opopup = Window. createpopup (); // ie5.5 +

This. Pop = opopup;

VaR W = This. width;
VaR H = This. height;

VaR STR = "<Div style = 'border-Right: #455690 1px solid; border-top: # a6b4cf 1px solid; Z-INDEX: 99999; left: 0px; border-left: # a6b4cf 1px solid; width: "+ W +" PX; border-bottom: #455690 1px solid; position: absolute; top: 0px; Height: "+ H +" PX; background-color: # c9d3f3 '>"
STR + = "<Table Style = 'border-top: # ffffff 1px solid; border-left: # ffffff 1px solid 'cellspacing = 0 cellpadding = 0 width = '000000' bgcolor = # cfdef4 border = 0>"
STR + = "<tr>"
STR + = "<TD style = 'font-size: 12px; color: # 0f2c8c' width = 30 Height = 24> </TD>"
STR + = "<TD style = 'padding-left: 4px; font-weight: normal; font-size: 12px; color: # 1f336b; padding-top: 4px 'valign = center width = '000000'> "+ this. caption + "</TD>"
STR + = "<TD style = 'padding-Right: 2px; padding-top: 2px 'valign = center align = right width = 19>"
STR + = "<span Title = close style = 'font-weight: bold; font-size: 12px; cursor: hand; color: red; margin-right: 4px 'id = 'btsysclose'> × </span> </TD>"
STR + = "</tr>"
STR + = "<tr>"
STR + = "<TD style = 'padding-Right: 1px; padding-bottom: 1px 'colspan = 3 Height =" + (h-28) + ">"
STR + = "<Div style = 'border-Right: # b9c9ef 1px solid; padding-Right: 8px; border-top: #728eb8 1px solid; padding-left: 8px; font-size: 12px; padding-bottom: 8px; border-left: #728eb8 1px solid; width: 100%; color: # 1f336b; padding-top: 8px; border-bottom: # b9c9ef 1px solid; Height: 100% '> "+ this. title + "<br>"
STR + = "<Div style = 'word-break: Break-all 'align = left> <a href = 'javascript: void (0) 'hidefocus = false ID = 'btcommand'> <font color = # ff0000> "+ this. message + "</font> </a> </div>"
STR + = "</div>"
STR + = "</TD>"
STR + = "</tr>"
STR + = "</table>"
STR + = "</div>"

Opopup.doc ument. Body. innerhtml = STR;

 
 
This. offset = 0;
VaR me = this;

Opopup.doc ument. Body. onmouseover = function () {me. Pause = true ;}
Opopup.doc ument. Body. onmouseout = function () {me. Pause = false ;}

VaR fun = function (){
VaR x = me. right;
Var y = 0;
VaR width = me. width;
VaR Height = me. height;
 
If (Me. Offset> me. Height ){
Height = me. height;
} Else {
Height = me. offset;
}
 
Y = me. Bottom-Me. offset;
If (Y <= me. Top) // make the message box disappear
{
Me. Timeout --;
If (Me. Timeout = 0) // when the message box is displayed on the page, hide the message box
{
// Alert (Me. Timer );
Window. clearinterval (Me. Timer );
Me. Hide ();
}
}
Else
{
Me. offset = me. Offset + me. Step;
}
Me. Pop. Show (X, Y, width, height );
// Opopup. Show (100,100,180, 25, STR );
 
}

This. Timer = Window. setinterval (fun, this. Speed)



VaR btclose = opopup.doc ument. getelementbyid ("btsysclose ");

Btclose. onclick = function (){
Me. Close = true;
Me. Hide ();
}

VaR btcommand = opopup.doc ument. getelementbyid ("btcommand ");
Btcommand. onclick = function (){
Me. oncommand ();
}
}

/*
** Speed Setting Method
**/
Class_msn_message.prototype.speed = function (s ){
VaR T = 20;
Try {
T = praseint (s );
} Catch (e ){}
This. speed = T;
}
/*
** Step size setting method
**/
Class_msn_message.prototype.step = function (s ){
VaR T = 1;
Try {
T = praseint (s );
} Catch (e ){}
This. Step = T;
}

Class_msn_message.prototype.rect = function (left, right, top, bottom ){
Try {
This. Left = left! = NULL? Left: This. right-this.width;
This. Right = right! = NULL? Right: This. Left + this. width;
This. Bottom = bottom! = NULL? (Bottom> screen. Height? Screen. Height: Bottom): screen. height;
This. Top = Top! = NULL? Top: This. Bottom-This. height;
} Catch (e ){}
}

Function BB (INI)
{

If (INI <= 1)
{
 
// Alert (window. form1.tetitle. value );
VaR msg1 = new class_msn_message (INI, 200,120, "<image src?'oicq.gif '> message prompt:", window. form1.tetitle. Value, window. form1.teshow. value );
Msg1.rect (null, screen. availheight); // screen indicates the taskbar, and availheight indicates the height of the current taskbar.
// Alert (screen. availheight );
Msg1.speed = 10;
Msg1.step = 5;
// Alert (msg1.top );
// Msg1.hide ();
// Window. setTimeout ('ktime () ', 120 );
Msg1.show ();
}
 
Else if (INI> 1)
{
For (I = 1; I <= ini; I ++)
{
VaR msg1 = new class_msn_message (I, 200,120, "<image src?'oicq.gif '> message prompt:", window. form1.tetitle. Value, window. form1.teshow. value );
VaR popheight;
If (I = 1)
Popheight = screen. availheight;
Else
Popheight = popheight-120;


Msg1.rect (null, popheight); // screen indicates the taskbar, and availheight indicates the height of the current taskbar
Msg1.speed = 10;
Msg1.step = 5;
// Alert (msg1.top );
// Msg1.hide ();
Window. setTimeout ('ktime () ', 1000 );
Msg1.show ();
}
}

}
Function ktime ()
{
Window. setTimeout ('ktime () ', 1000 );
}
// Two flashes at the same time, which can only be replaced by a layer, but the layer does not span the framework.
// Var msg2 = new class_msn_message ("AA", 200,120, "Short Message prompt:", "you have two messages", "OK ");
// Msg2.rect (100, null, null, screen. Height );
// Msg2.show ();
// -->
</SCRIPT>
<Form ID = "form1" method = "Post" runat = "server">
& Nbsp;
<Table id = "Table2" style = "Z-INDEX: 101; left: 8px; position: absolute; top: 8px" cellspacing = "0"
Cellpadding = "0" width = "100%" border = "0">
<Tr>
<TD valign = "TOP"> <asp: Panel id = "Panel1" runat = "server"> <font face = "">
<Table id = "Table1" style = "width: 783px; Height: 64px" cellspacing = "0" cellpadding = "0" width = "783"
Border = "0">
<Tbody>
<Tr>
<TD style = "width: 94px">
<Asp: Label id = "label3" runat = "server"> question </ASP: Label> </TD>
<TD> <input id = "tetitle" style = "width: 336px; Height: 22px" type = "text" size = "50" value = "MSN message"
Runat = "server"> </TD>
</Tr>
<Tr>
<TD style = "width: 94px">
<Asp: Label id = "label1" runat = "server"> display text </ASP: Label> </TD>
<TD> <font face = ""> <input id = "teshow" style = "width: 336px; height: 22px "type =" text "size =" 50 "value =" click to View Details! "> </Font> </TD>
</Tr>
<Tr>
<TD style = "width: 94px">
<Asp: Label id = "label2" runat = "server"> display Times </ASP: Label> </TD>
<TD> <input id = "cou" style = "width: 336px; Height: 22px" type = "text" size = "50">
</ASP: Panel> </TD>
</Tr>
</Table>
</Font> </TD> </tr>
<Tr>
<TD valign = "TOP"> <input style = "width: 432px; Height: 56px" onclick = "BB (COU. value) "type =" button "value =" click it "> </TD>
</Tr>
</Tbody> </table> </form>

This method can implement the MSN function. But there is still a problem, that is, two or more message boxes cannot appear at the same time, otherwise the refresh will be very serious. In this case, what should we do?

Finally, I have no way to implement it. I have to use C # To implement this function.

3. Use the window form to implement the MSN message box function
This example is based on an example on msdn. I only provide one website here, because the example contained in this website is better, I won't mention the program that I can't handle here.

Http://www.microsoft.com/china/MSDN/library/netFramework/netframework/WindowsForms.mspx

Summary:

Here, I provide three methods. You can use it for personal purposes. However, note that, for example, the second method must be used to overcome the shortcomings that keep flashing. If you know how to get rid of this error, ask the instructor! Thank you!