Lesktop open-source WebIM Update-adds group chat and other functions

Source: Internet
Author: User

After more than a month of development, Lesktop open-source WebIM has finally released a new version 2.0.2.7, which is mainly updated as follows:

1. added the group function;

2. added user and group management;

3. Simplified embedding methods;

4. added the function of displaying user portraits.

Lesktop demo and download [good news, I do not know]

Lesktop 2.0.2.7 features:

Chat Window (private chat and group chat supported)

File Transfer:

Modify personal data:

Manage friends and groups:

Embed Lesktop into your website

If you need to use WebIM in your website, you can embed Lesktop into your website to become part of the website. The new Lesktop version simplifies the embedding method. The specific method is as follows:

1. Download the source code, copy the three folders Lesktop, App_Data, and Bin in source \ wwwroot to the root directory of the website that will be embedded in WEBIM (Note: copy it, virtual directories are not required );

2. Add the following code to the page where you want to embed WebIM:

<script language="javascript" type="text/javascript">    document.writeln('<script type="text/javascript" src="/Lesktop/embed.js.aspx?'+(new Date()).getTime()+'"><'+'/script>');    window.onload = function()    {        StartService();    }</script>

Lesktop source code analysis-Window

The above section briefly introduces the new features of Lesktop and how to embed Lesktop into a website. Next, we will introduce the Internal principles of Lesktop. Because many technologies are involved, we will first introduce the Lesktop UI section.

As shown on the Lesktop homepage (www.luchuncheng.com), the Windows created by Lesktop can run on the Windows desktop in client window mode or floating on the page in floating layer mode. This article will illustrate how to create such a window. The next article will introduce how Lesktop is implemented.

In Lesktop, the Core. CreateWindow function is used to create Windows. The Windows created by this function can run simultaneously on webpages and Windows desktops. Core. CreateWindow has only one parameter, which specifies the features of the window to be created. The complete parameters are as follows:

Var config = {Left: X coordinate in the upper Left corner of the window, Top: Y coordinate in the upper Left corner of the window, Width: window Width, Height: window Height, MinWidth: Minimum window Width, MinHeight: Minimum window Height, title: {InnerHTML: Title}, HasMaxButton: whether there is a maximization button, HasMinButton: whether there is a minimization button, OnClose: function (form) {// This function is called when the window is closed, to close the window, call form. close (). If you want to Close the organizational unit window, you do not need to call it }};

After defining the window configuration, you can call Core. createWindow (config) is created. After the window is created, Core. createWindow returns a window control interface through which you can modify and obtain window properties to process window events. The window control interface supports the following methods:

Show (isTop) Display window, isTop indicates whether to stick to the top
Hide () Hide the window. Note that the Hide is only hidden and the window still exists.
Close () Close and destroy the window
ShowDialog (parent, pos, left, top, relativeParent, callback) Displayed as a modal window:

Parent-parent window, which will be temporarily invalid until the modal window is closed

Pos-position displayed in the window, center indicates Center

Left-x coordinate in the upper left corner of the window

Top-y coordinate in the upper left corner of the window

Relativeparent-if true, left, top is relative to the parent window

Callback-callback function when the modal window is closed

GetClientWidth () Obtain the width of the client area of the window (excluding the border and title bar)
GetClientHeight () Obtain the height of the client area of the window (excluding the border and title bar)
Move (left, top) Move window
MoveEx (position, x, y, relativeParent) Move window:

Position-position displayed in the window, CENTER indicates CENTER

X-x coordinate in the upper left corner of the window

Y-Y coordinate in the upper left corner of the window

Relativeparent-if true, X and Y are relative to the parent window

Resize (width, height) Adjust the window size:

Width-new window width

Height-new window height

Settitle (title) Set window title
Gettitle () Get window title
Istop () Whether the window is the top
Isvisible () Visible window
Load (URL, callback) Load a webpage in the window. Note that this webpage is not any webpage. The specific specifications are described below.
Gethtmlwindow () Obtain the window of the loaded webpage

Note: When calling these methods, you do not need to consider whether the current window is running on the webpage or on the client desktop. to be compatible with the client window, the parameters of the method are indispensable when the preceding method is called.

For example, run the following code to create a window and display it:

Var config = {Left: 0, Top: 0, Width: 700, Height: 550, MinWidth: 700, MinHeight: 550, Title: {InnerHTML: "Message Management "}, resizable: true, HasMaxButton: ClientMode, HasMinButton: true, AnchorStyle: Core. windowAnchorStyle. left | Core. windowAnchorStyle. bottom} var form = Core. createWindow (config); form. moveEx ('Middle | BOTTOM ', 0,-30, true); form. show ();

However, after creating a window, the content of the window is blank and there is no control in the window. You can use the load method to load a page as the content of the window. Of course, this page is not arbitrary, certain standards must be followed (reference necessary scripts). The following is a standard page:

<% @ Page Language = "C #" autoeventwireup = "true" codefile = "demo. aspx. CS "inherits =" lesktop_demo "%> <% @ register src =" script/subscript. ascx "tagname =" subscript "tagprefix =" uc1 "%> <! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <HTML xmlns = "http://www.w3.org/1999/xhtml"> 

After the page is loaded, you can use the CurrentWindow method (Show, Hide, GetClientWidth, and so on) to control the window. For example, CurrentWindow. Move (0, 0) can Move the window to the upper left corner of the desktop.
Lesktop demo and download [good news, I do not know]

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.