Freetextbox is a popular richtext editor in the. NET environment.ArticleIs used.
A recent project requires that you can publish a movie when publishing an article. Of course, you cannot write HTMLCodeNow,
Therefore, we decided to expand the freetextbox function by adding a toolbar button for it to publish online movies.
Did not read related articles, open freetextbox directlySource codeProject, found that the project structure is better organized,
Note that the toolbarcontrols directory contains toolbaritem. CS, toolbaritems. CS, and
Toolbarbutton. CS, it must be here. A rough look at the code,
It is found that there are many static attributes in toolbaritems. CS, and many toolbarbuttons are returned respectively.
Some of them are very familiar:
///
// returns a toolbarbutton with insertimagefromgallery JavaScript Functions builtin
///
Public static toolbarbutton insertimagefromgallery {
get {
toolbarbutton button = new toolbarbutton ("insert an image (from the Image Library) "," insertimagefromgallery "," ftb_insertimagefromgallery_clientid ");
button. scriptblock = @ "
OBJ = ftb_getrangereference (editor );
If (obj. tagname = 'img '){
Editor.document.exe ccommand ('insertimage', 1 ,'');
Return;
}
VaR folder = 'imagegallerypath ';
VaR galleryscript = ftb_helperfilespath + 'ftb. imagegallery. aspx? Rif = '+ folder +' & CIF = '+ folder;
If (ftb_helperfilesparameters! = '') Galleryscript + = '&' + ftb_helperfilesparameters;
Imgarr = showmodaldialog (galleryscript, window, 'dialogwidth: 560px; dialogheight: 500px; help: 0; Status: 0; resizeable: 1 ;');
If (imgarr! = NULL) {
imagestring = ' ';
sel = editor.doc ument. selection. createRange ();
SEL. pastehtml (imagestring);
}else {
alert ("" You have not selected an image. "");
}< BR >}< br> ";
return button;
}< BR >}
That's right. This code is why you press the insert image (from Image Library) button to display a webpage
Dialog box, let you select the reason for the image. Pay attention to
VaR galleryscript = ftb_helperfilespath + 'ftb. imagegallery. aspx? Rif = '+ folder +' & CIF = '+ folder;
If (ftb_helperfilesparameters! = '') Galleryscript + = '&' + ftb_helperfilesparameters;
Imgarr = showmodaldialog (galleryscript, window, 'dialogwidth: 560px; dialogheight: 500px; help: 0; Status: 0; resizeable: 1 ;');
The entire freetextbox editing operation is almost completed on the client, which is brilliant, otherwise it will not move
The server cannot handle PostBack, and the users who write articles cannot.
Now that you have found out how the button function is implemented, draw a gourd based on the sample and add the following code:
Public static toolbarbutton insertmovie
{
Get
{
Toolbarbutton button = new toolbarbutton ("insert movie", "insertmovie", "ftb_insertmovie_clientid ");
Button. scriptblock = @ "<script language =" "JavaScript" ">
Function ftb_insertmovie_clientid (Editor, htmlmode ){
If (htmlmode) return;
Editor. Focus ();
VaR filmurl = Window. Prompt ('movie formats are Avi, mpg, MPEG, ASF, WMV, Ra, and ram. \ N enter the movie address ', 'HTTP ://');
If (filmurl! = NULL) {
filmstring = ' ';
filmstring + = ' ';
filmstring + = ' ';
filmstring + = '';
filmstring + = ' ';
sel = editor.doc ument. selection. createRange ();
SEL. pastehtml (F Ilmstring);
}else {
// alert ("" You have not selected an image. "");
}< BR >}< br> ";
return button;
}< BR >}
VaR filmurl = Window. Prompt ('movie formats are Avi, mpg, MPEG, ASF, WMV, Ra, and ram. \ N enter the movie address ', 'HTTP ://');
Get the movie address entered by the user. Considering the project progress requirement, you do not use the image library method, but directly enter the movie URL.
The button is ready. How can I make it appear on the toolbar? Easy to handle.
Search for insertimagefromgallery. I can add it if I find out how people add it.
Only 13 results are displayed, and several of them are support \ toolbargenerator. cs. You can be sure that this is the case.
Click the search result to see the following code:
Public class toolbargenerator {
// Toolbar layouts
Public static string defaultconfigstring = "bold, italic, underline, strikethrough; superscript, subscript, removeformat | fontfacesmenu, fontsizesmenu,
Fontforecolorsmenu | justifyleft, justifyright, justifycenter, justifyfull; bulletedlist, numberedlist, indent, outdent;
CreateLink, unlink, insertimagefromgallery, inserttable, insertrule | cut, copy, paste; UNDO, redo, print, iespellcheck ";
Public static string alternateconfigstring = "Save, print, undo, redo, wordclean, inserttable | paragraphmenu, fontfacesmenu, delimiter, fontforecolorpicker,
delimiter, symbolsmenu | bold, italic, underline, strikethrough; superscript, subscript, removeformat |
justifyleft, justifyright, justifycenter, justifyfull; bulletedlist, numberedlist, indent, outdent; CreateLink, unlink,
average, insertrule | cut, copy, paste, iespellcheck ";
Public static string enableallconfigstring = "paragraphmenu, fontfacesmenu, fontsizesmenu | fontforecolorsmenu, fontforecolorpicker, fontbackcolorsmenu,
Fontbackcolorpicker | bold, italic, underline, strikethrough, superscript, subscript; insertimagefromgallery, CreateLink,
Unlink, removeformat | justifyleft, justifyright, justifycenter, justifyfull; bulletedlist, numberedlist, indent, outdent |
Cut, copy, paste, delete; UNDO, redo, print, save | stylemenu, symbolsmenu, inserthtmlmenu | insertrule, insertdate,
Inserttime, wordcount, iespellcheck, wordclean, inserttable ";
Public static string minimalconfigstring = "bold, italic, underline ";?
Anyone who has used freetextbox knows that freetextbox has several toolbar modes. Obviously, this is where different buttons appear in different toolbar, except for the last mode with few buttons, all others have insertimagefromgallery, And the csdn toolbar does not include the image button from the image library. It seems that our csdn developers have also changed the code :)
The code above only defines some strings, and there must be some parsing points. In the search results, there is such a section:
Case "insertimagefromgallery ":
Return toolbaritems. insertimagefromgallery;
Yes, it is resolved here. Add the following code to draw the gourd again
Case "insertmovie ":
Return toolbaritems. insertmovie;
At the same time, the definition of the modification is as follows:
Public static string enableallconfigstring = "paragraphmenu, fontfacesmenu, fontsizesmenu | fontforecolorsmenu, fontforecolorpicker,
Fontbackcolorsmenu, fontbackcolorpicker | bold, italic, underline, strikethrough, superscript, subscript;
Insertmovie, insertimagefromgallery, CreateLink, unlink, removeformat | justifyleft, justifyright, justifycenter,
Justifyfull; bulletedlist, numberedlist, indent, outdent | cut, copy, paste, delete; UNDO, redo, print, save | stylemenu,
Symbolsmenu, inserthtmlmenu | insertrule, insertdate, inserttime, wordcount, iespellcheck, wordclean, inserttable ";
Insertmovie is added to insertimagefromgallery,
Compile and run the command once. Copy the generated freetextbox. DLL to the project folder and publish an article!
The effect is as follows:
In the figure, the button circled in yellow is the movie publishing function we added. You can also add a variety of features for freetextbox to develop a unique product :)