0

Hi can you help me please,how to make a Message just like in this in the daniweb that have text formatting, attachment, wrap code tags...and etc...i have no idea on this.can you help me please.

2
Contributors
2
Replies
3
Views
6 Years
Discussion Span
Last Post by jemz
0

Hi!

About a year ago I was working on a text editor which included highlighting and such, but also offered the functionality to insert BB-code, just like at DaniWeb. The basic idea of this is to retrieve the position of selected text, retrieve the text, embody it with BB-code and then save the changes in the value of the textarea. Here is the function I created:

*** EDIT: Due to the annoying fact that BB-code within the CODE tags is also parsed on DaniWeb, I added forward-slashes to prevent that. Remove them in order for the code to function properly. ***

/*
 *
 * Function: InsertBBCode
 * Parameters:
 
       [0] TXT_Element: The textarea element in which BBCode needs to be inserted
	   [1] Variable: Contains the variable name of the BBCode
	   [2] Value: Contains the variable value of the BBCode
	   
 * Notes: inserts bbcode into the textarea
 * Last edit: 2010-10-10 13:08
 * Author: Graphix
 * Contact: http://www.webdevproject.com
 * Distributed under the GNU Free Documentation License
 *
*/

function InsertBBCode( TXT_Element, Variable, Value )
{
  
  var Open_Tag = "";
  var Close_Tag = "";
  
  switch ( Variable ) {
  
   case "bold" :
     Open_Tag = "\[b\]";
	 Close_Tag = "\[/b\]";
   break;
   
   case "underline" :
     Open_Tag = "\[u\]";
	 Close_Tag = "\[/u\]";
   break;
   
   case "italic" :
     Open_Tag = "\[i\]";
	 Close_Tag = "\[/i\]";
   break;
   
   case "justifyleft" :
     Open_Tag = "[align=left]";
	 Close_Tag = "[/align]";
   break;
   
   case "justifycenter" :
     Open_Tag = "[align=center]";
	 Close_Tag = "[/align]";
   break;
   
   case "justifyright" :
     Open_Tag = "[align=right]";
	 Close_Tag = "[/align]";
   break;
   
   case "insertorderedlist" :
     Open_Tag = "[list=1][*]";
	 Close_Tag = "[/*][/list]";
   break;
   
   case "insertunorderedlist" :
     Open_Tag = "[list][*]";
	 Close_Tag = "[/*][/list]";
   break;
   
   case "indent" :
     Open_Tag = "[indent]";
	 Close_Tag = "[/indent]";
   break;
   
   case "outdent" :
     /* Outdent is removing the indent tags, which the user can do by himself. */
   break;
   
   case "CreateLink" :
     Open_Tag = "\[url=" + Value + "\]";
	 Close_Tag = "\[/url\]";
   break;
   
   case "FontSize" :
     Open_Tag = "\[size=" + Value + "\]";
	 Close_Tag = "\[/size\]";
   break;
   
  }

  if ( typeof(TXT_Element) != "undefined") {

    /* Length of the selection: */
	var Length = parseInt(TXT_Element.value.length);
	
	/* Open position of the selection: */
    var SelectionStart = TXT_Element.selectionStart;
	
	/* End position of the selection: */
    var SelectionEnd = TXT_Element.selectionEnd;
    
	/* Value of the new textarea: */
	var NewValueTextArea = "";
	
	/* Updating textarea value: */
    NewValueTextArea = TXT_Element.value.substring(0,SelectionStart); // Beginning text
	NewValueTextArea += Open_Tag; // Open tag
	NewValueTextArea += TXT_Element.value.substring(SelectionStart,SelectionEnd); // Text between tags
	NewValueTextArea += Close_Tag; // Close tag
	NewValueTextArea += TXT_Element.value.substring(SelectionEnd,Length); // Ending text
    
	/* Updating textarea content: */
    TXT_Element.value = NewValueTextArea;
  
  } else {
    
	/* If nothing is supported, put it on the end: */
    TXT_Element.value += Open_Tag + Close_Tag;
	
  }
  
  //alert("Value of the hidden input:\n\n" + TXT_Element.value);
  
  /* Focussing element: */
  TXT_Element.focus();
  
}

The above function is written in JavaScript, and all the steps are obviously clearly explained. If you have any questions, post a reply!

~G

Edited by Graphix: n/a

0

Hi!

About a year ago I was working on a text editor which included highlighting and such, but also offered the functionality to insert BB-code, just like at DaniWeb. The basic idea of this is to retrieve the position of selected text, retrieve the text, embody it with BB-code and then save the changes in the value of the textarea. Here is the function I created:

*** EDIT: Due to the annoying fact that BB-code within the CODE tags is also parsed on DaniWeb, I added forward-slashes to prevent that. Remove them in order for the code to function properly. ***

/*
 *
 * Function: InsertBBCode
 * Parameters:
 
       [0] TXT_Element: The textarea element in which BBCode needs to be inserted
	   [1] Variable: Contains the variable name of the BBCode
	   [2] Value: Contains the variable value of the BBCode
	   
 * Notes: inserts bbcode into the textarea
 * Last edit: 2010-10-10 13:08
 * Author: Graphix
 * Contact: http://www.webdevproject.com
 * Distributed under the GNU Free Documentation License
 *
*/

function InsertBBCode( TXT_Element, Variable, Value )
{
  
  var Open_Tag = "";
  var Close_Tag = "";
  
  switch ( Variable ) {
  
   case "bold" :
     Open_Tag = "\[b\]";
	 Close_Tag = "\[/b\]";
   break;
   
   case "underline" :
     Open_Tag = "\[u\]";
	 Close_Tag = "\[/u\]";
   break;
   
   case "italic" :
     Open_Tag = "\[i\]";
	 Close_Tag = "\[/i\]";
   break;
   
   case "justifyleft" :
     Open_Tag = "[align=left]";
	 Close_Tag = "[/align]";
   break;
   
   case "justifycenter" :
     Open_Tag = "[align=center]";
	 Close_Tag = "[/align]";
   break;
   
   case "justifyright" :
     Open_Tag = "[align=right]";
	 Close_Tag = "[/align]";
   break;
   
   case "insertorderedlist" :
     Open_Tag = "[list=1][*]";
	 Close_Tag = "[/*][/list]";
   break;
   
   case "insertunorderedlist" :
     Open_Tag = "[list][*]";
	 Close_Tag = "[/*][/list]";
   break;
   
   case "indent" :
     Open_Tag = "[indent]";
	 Close_Tag = "[/indent]";
   break;
   
   case "outdent" :
     /* Outdent is removing the indent tags, which the user can do by himself. */
   break;
   
   case "CreateLink" :
     Open_Tag = "\[url=" + Value + "\]";
	 Close_Tag = "\[/url\]";
   break;
   
   case "FontSize" :
     Open_Tag = "\[size=" + Value + "\]";
	 Close_Tag = "\[/size\]";
   break;
   
  }

  if ( typeof(TXT_Element) != "undefined") {

    /* Length of the selection: */
	var Length = parseInt(TXT_Element.value.length);
	
	/* Open position of the selection: */
    var SelectionStart = TXT_Element.selectionStart;
	
	/* End position of the selection: */
    var SelectionEnd = TXT_Element.selectionEnd;
    
	/* Value of the new textarea: */
	var NewValueTextArea = "";
	
	/* Updating textarea value: */
    NewValueTextArea = TXT_Element.value.substring(0,SelectionStart); // Beginning text
	NewValueTextArea += Open_Tag; // Open tag
	NewValueTextArea += TXT_Element.value.substring(SelectionStart,SelectionEnd); // Text between tags
	NewValueTextArea += Close_Tag; // Close tag
	NewValueTextArea += TXT_Element.value.substring(SelectionEnd,Length); // Ending text
    
	/* Updating textarea content: */
    TXT_Element.value = NewValueTextArea;
  
  } else {
    
	/* If nothing is supported, put it on the end: */
    TXT_Element.value += Open_Tag + Close_Tag;
	
  }
  
  //alert("Value of the hidden input:\n\n" + TXT_Element.value);
  
  /* Focussing element: */
  TXT_Element.focus();
  
}

The above function is written in JavaScript, and all the steps are obviously clearly explained. If you have any questions, post a reply!

~G

hi graphics,Thank you so much for the reply....

I will try this and i will write again to you if i get doubt.more power to you always.

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.