The Artima Developer Community
Sponsored Link

Java Answers Forum
WYSIWYG Html Editor with JEditorPane and HTMLEditorKit

35 replies on 3 pages. Most recent reply: May 7, 2012 2:29 AM by Joe Ridener

Welcome Guest
  Sign In

Go back to the topic listing  Back to Topic List Click to reply to this topic  Reply to this Topic Click to search messages in this forum  Search Forum Click for a threaded view of the topic  Threaded View   
Previous Topic   Next Topic
Flat View: This topic has 35 replies on 3 pages [ « | 1 2 3 | » ]
Jochen Staerk

Posts: 1
Nickname: marvin80
Registered: Sep, 2002

Re: WYSIWYG Html Editor with JEditorPane and HTMLEditorKit Posted: Sep 13, 2002 6:29 AM
Reply to this message Reply
Advertisement
Charles (or anyone else),

there seems to be a misbehaviour with custom documents, i attached a sample -- if you place your caret in the "And a font"-section and press backspace to delete the heading, the caret will hang - but it will go on to delete.

A behaviour I'd expect is that it deletes the end-tag of the heading, this making the And a font-section to a part of the same heading.

Does anybody know how one gets to such a result?

--------------snip------------------
<html>
<head>

</head>
<body>
This is a
<h1>
Heading
</h1>
<p>
<font size="5">And a Font</font>

And the rest
</p>
</body>
</html>

Craig Lotter

Posts: 2
Nickname: clotter
Registered: Sep, 2002

Re: WYSIWYG Html Editor with JEditorPane and HTMLEditorKit Posted: Sep 26, 2002 7:49 AM
Reply to this message Reply
Hi all.

I am having a problem with creating a WYSIWYG HTML editor for a honours project of mine. I need to insert various HTML tags into the page. The problem is that I need to know whether or not the caret is currently in a paragraph or not. The idea would be to end the current paragraph and then insert my tags and then create a new paragraph (e.g. if I was inserting a <H1> tag).

Does anyone know how I can do this?

Thanks,
Craig Lotter

Craig Lotter

Posts: 2
Nickname: clotter
Registered: Sep, 2002

Re: WYSIWYG Html Editor with JEditorPane and HTMLEditorKit Posted: Sep 26, 2002 11:00 AM
Reply to this message Reply
Another question.

Does anyone know how to set a HTMLDocument's Title (using a WYSIWYG editor)?

Thanks

Craig Lotter

Sharan RM

Posts: 6
Nickname: regalla
Registered: Sep, 2002

Re: WYSIWYG Html Editor with JEditorPane and HTMLEditorKit Posted: Oct 1, 2002 5:13 AM
Reply to this message Reply
Hi Charles Bell,
Thank you for the WYSIWYG Html Editor. It was really very helpful to me.
Now, I am creating a html editor using JTextPane and HTMLEditorKit & HTMLDocument. User will select form elements from the toolbar and drop on to the JTextPane to create a html page.
I am inserting form elements using the following statement.
void btnButton_actionPerformed(ActionEvent e) {
javax.swing.text.html.HTMLDocument doc = (HTMLDocument)jtextpaneDesigner.getDocument();
javax.swing.text.Element html = doc.getRootElements()[0];
javax.swing.text.Element body = html.getElement(0);
int pos = jtextpaneDesigner.getCaretPosition();
javax.swing.text.Element elem = doc.getCharacterElement(pos);
JOptionPane.showMessageDialog(cmbComboBox,elem.ge tName());
doc.setParser(new javax.swing.text.html.parser.ParserDelegator());
 
try {
doc.insertAfterEnd(elem, "<input type=\"Submit\" value=\"Button" + buttonCount + "\" " + "id=button name=\"Button"+ buttonCount + "\" >");
System.out.println("<INPUT type=\"Submit\" value=\"Button" + buttonCount + "\" " + "id=button name=\"Button"+ buttonCount + "\" >");
} catch (Exception ex) {
System.err.println("error in insertAfterEnd");
ex.printStackTrace(System.err);
}
jtextpaneDesigner.setText(jtextpaneDesigner.getText());
buttonCount++;
}

But, I have problem with capturing events generated at mouse click or press on inserted form field elements in a JTextPane.
What exactly want to do is, when a user selects this checkbox (or any other element like button textbox etc)
I want to retrieve and display properties of the element for modifying and applying back to that selected element.
At present I am able to recognize and retrieve element properties by its absolute position with the page (by caret position like following).
void btnProperties_actionPerformed(ActionEvent e) {
String mess=null;
try
{
javax.swing.text.html.HTMLDocument doc = (HTMLDocument)jtextpaneDesigner.getDocument();
javax.swing.text.Element html = doc.getRootElements()[0];
javax.swing.text.Element body = html.getElement(0);
int pos = jtextpaneDesigner.getCaretPosition();
javax.swing.text.Element elem = doc.getCharacterElement(pos);
 
int i;
Enumeration enum = elem.getAttributes().getAttributeNames();
AttributeSet attributes = elem.getAttributes();
for(i=0;i<elem.getAttributes().getAttributeCount();i++)
{
Object name = enum.nextElement();
Object value = elem.getAttributes().getAttribute(name);
}
}catch (Exception ex){}
//display all the properties
JOptionPane.showMessageDialog(cmbComboBox,mess);
}

Please suggest some means to select provide selection of elements from within JTextPane. At present I am able to do all the actions on the text selection.
It's very urgent!!!

Thanks in advance.

Satish

Posts: 1
Nickname: satishkk
Registered: Oct, 2002

Re: WYSIWYG Html Editor with JEditorPane and HTMLEditorKit Posted: Oct 4, 2002 3:28 AM
Reply to this message Reply
Did somebody tried inserting a flash file inside an HTML file and launching it through JEditorPane??

If yes, can you please share that information.

Thanx in advance.

Satish K Kumar

Arvind

Posts: 2
Nickname: cooltinku
Registered: Oct, 2002

Re: WYSIWYG Html Editor with JEditorPane and HTMLEditorKit Posted: Oct 14, 2002 2:50 AM
Reply to this message Reply
Hello,
Friend i am searching the saME THING ,DID U GET .
If u find please help me out.
This is very urgent for me.

Arvind
Mail me at arvind@shop24seven.tv

Arvind

Posts: 2
Nickname: cooltinku
Registered: Oct, 2002

Re: WYSIWYG Html Editor with JEditorPane and HTMLEditorKit Posted: Oct 22, 2002 4:46 AM
Reply to this message Reply
Hello
Friend i just gone through this . i find u can solve my problem .
i am just explaning my requirment to u.i want to made component just like ur comopose mail of yahoo with graphics option.
Same thing i am developing in applet because i think this is only solution to get same facality in Netscape browser also.
The thing is that i made one applet to get textEditor on webpage .

i have send u code in your mail ,so just go through this and just explain how i will add bullet facality to it.

please revert me back soon.

This is very urgent , i have already spend 20 days.

Regards
Arvind

Charles Bell

Posts: 519
Nickname: charles
Registered: Feb, 2002

Re: WYSIWYG Html Editor with JEditorPane and HTMLEditorKit Posted: Oct 23, 2002 2:30 PM
Reply to this message Reply
The following code has the basics for an html editor applet as requested by someone recently.


/* BasicEditorApplet.java
* @author Charles Bell
* @version Oct 23, 2002
*/

import java.awt.*;
import java.net.*;
import javax.swing.*;
import javax.swing.text.*;
import javax.swing.text.html.*;


public class BasicEditorApplet extends JApplet{
private JTextPane editor;

public void init(){

try{
JPanel buttonPanel = new JPanel();

editor = new JTextPane();
editor.setContentType("text/html");

JButton cutButton = new JButton();
Action cutAction = new DefaultEditorKit.CutAction();
cutAction.putValue(Action.SMALL_ICON, new ImageIcon(new URL(getDocumentBase(), "cut.gif")));
cutButton.setAction(cutAction);
cutButton.setText("");

JButton copyButton = new JButton();
Action copyAction = new DefaultEditorKit.CopyAction();
copyAction.putValue(Action.SMALL_ICON, new ImageIcon(new URL(getCodeBase(), "copy.gif")));
copyButton.setAction(copyAction);
copyButton.setText("");

JButton pasteButton = new JButton();
Action pasteAction = new DefaultEditorKit.PasteAction();
pasteAction.putValue(Action.SMALL_ICON, new ImageIcon(new URL(getCodeBase(), "paste.gif")));
pasteButton.setAction(pasteAction);
pasteButton.setText("");

JButton boldButton = new JButton();
Action boldAction = new StyledEditorKit.BoldAction();
boldAction.putValue(Action.SMALL_ICON, new ImageIcon(new URL(getCodeBase(), "bold.gif")));
boldButton.setAction(boldAction);
boldButton.setText("");

JButton italicButton = new JButton();
Action italicAction = new StyledEditorKit.ItalicAction();
italicAction.putValue(Action.SMALL_ICON, new ImageIcon(new URL(getCodeBase(), "italic.gif")));
italicButton.setAction(italicAction);
italicButton.setText("");

JButton underLineButton = new JButton();
Action underlineAction = new StyledEditorKit.UnderlineAction();
underlineAction.putValue(Action.SMALL_ICON, new ImageIcon(new URL(getCodeBase(), "underline.gif")));
underLineButton.setAction(underlineAction);
underLineButton.setText("");

JButton alignLeftButton = new JButton();
Action alignLeftAction = new StyledEditorKit.AlignmentAction("Left Align",StyleConstants.ALIGN_LEFT);
alignLeftAction.putValue(Action.SMALL_ICON, new ImageIcon(new URL(getCodeBase(), "left.gif")));
alignLeftButton.setAction(alignLeftAction);
alignLeftButton.setText("");

JButton centerButton = new JButton();
Action centerAction = new StyledEditorKit.AlignmentAction("Center",StyleConstants.ALIGN_CENTER);
centerAction.putValue(Action.SMALL_ICON, new ImageIcon(new URL(getCodeBase(), "center.gif")));
centerButton.setAction(centerAction);
centerButton.setText("");

JButton alignRightButton = new JButton();
Action alignRightAction = new StyledEditorKit.AlignmentAction ("Right Align",StyleConstants.ALIGN_RIGHT);
alignRightAction.putValue(Action.SMALL_ICON, new ImageIcon(new URL(getCodeBase(), "right.gif")));
alignRightButton.setAction(alignRightAction);
alignRightButton.setText("");
JButton bulletButton = new JButton();
String INSERT_UL_HTML = "<ul><li></li></ul>";
HTMLEditorKit.InsertHTMLTextAction bulletAction = new HTMLEditorKit.InsertHTMLTextAction("Bullets", INSERT_UL_HTML,
HTML.Tag.UL, HTML.Tag.LI,
HTML.Tag.BODY, HTML.Tag.UL);
bulletAction.putValue(Action.SMALL_ICON, new ImageIcon(new URL(getCodeBase(), "list.gif")));
bulletButton.setAction(bulletAction);
bulletButton.setText("");

buttonPanel.setLayout(new FlowLayout());
buttonPanel.add(cutButton);
buttonPanel.add(copyButton);
buttonPanel.add(pasteButton);
buttonPanel.add(boldButton);
buttonPanel.add(italicButton);
buttonPanel.add(underLineButton);
buttonPanel.add(alignLeftButton);
buttonPanel.add(centerButton);
buttonPanel.add(alignRightButton);
buttonPanel.add(bulletButton);

JScrollPane scrollPane = new JScrollPane(editor);
scrollPane.setPreferredSize(new Dimension(getSize().width*7/8,getSize().height*5/8));

getContentPane().add(buttonPanel, BorderLayout.NORTH);
getContentPane().add(scrollPane, BorderLayout.CENTER);
setVisible(true);
}catch(MalformedURLException murle){
System.err.println("MalformedURLException: "+ murle.getMessage());
}

}

}


Charles Bell

Posts: 519
Nickname: charles
Registered: Feb, 2002

Re: WYSIWYG Html Editor with JEditorPane and HTMLEditorKit Posted: Oct 23, 2002 2:35 PM
Reply to this message Reply
I forgot to add that you can download the above code at:
http://www.quantumhyperspace.com/SourceBank/BasicEditorApplet.java

You can see some source code in the HTMLEditorKit.java available in your src.zip that is usually under your j2sdk1.x.x install directory.

It will give clues to adding your own custom features.


private static final Action[] defaultActions = {
new InsertHTMLTextAction("InsertTable", INSERT_TABLE_HTML,
HTML.Tag.BODY, HTML.Tag.TABLE),
new InsertHTMLTextAction("InsertTableRow", INSERT_TABLE_HTML,
HTML.Tag.TABLE, HTML.Tag.TR,
HTML.Tag.BODY, HTML.Tag.TABLE),
new InsertHTMLTextAction("InsertTableDataCell", INSERT_TABLE_HTML,
HTML.Tag.TR, HTML.Tag.TD,
HTML.Tag.BODY, HTML.Tag.TABLE),
new InsertHTMLTextAction("InsertUnorderedList", INSERT_UL_HTML,
HTML.Tag.BODY, HTML.Tag.UL),
new InsertHTMLTextAction("InsertUnorderedListItem", INSERT_UL_HTML,
HTML.Tag.UL, HTML.Tag.LI,
HTML.Tag.BODY, HTML.Tag.UL),
new InsertHTMLTextAction("InsertOrderedList", INSERT_OL_HTML,
HTML.Tag.BODY, HTML.Tag.OL),
new InsertHTMLTextAction("InsertOrderedListItem", INSERT_OL_HTML,
HTML.Tag.OL, HTML.Tag.LI,
HTML.Tag.BODY, HTML.Tag.OL),
new InsertHRAction(),
new InsertHTMLTextAction("InsertPre", INSERT_PRE_HTML,
HTML.Tag.BODY, HTML.Tag.PRE),
nextLinkAction, previousLinkAction, activateLinkAction
};

Charles Bell

Posts: 519
Nickname: charles
Registered: Feb, 2002

Re: WYSIWYG Html Editor with JEditorPane and HTMLEditorKit Posted: Nov 12, 2002 1:04 PM
Reply to this message Reply
The following html src can be used as an online editor in a web page for possibly submitting a formatted text message
or a whole range of things.


<html>
<head>
<title>Editor</title>
</head>
<body>
<form action="" action="post">
<center>
<img src="Cut16.gif" alt="Cut" onclick="document.execCommand('Cut')" >
<img src="Copy16.gif" alt="Copy" onclick="document.execCommand('Copy')">
<img src="Paste16.gif" alt="Paste" onclick="document.execCommand('Paste')">
<img src="icon_select_all.gif" alt="SelectAll" onclick="document.execCommand('SelectAll')">
<img src="Bold16.gif" alt="Bold" onclick="document.execCommand('bold')">
<img src="Italic16.gif" alt="Italic" onclick="document.execCommand('italic')">
<img src="Underline16.gif" alt="Underline" onclick="document.execCommand('underline')">
<img src="icon_ins_sub.gif" alt="sub" onclick="document.execCommand('subscript')">
<img src="icon_ins_sup.gif" alt="sup" onclick="document.execCommand('superscript')">
<img src="icon_rem_formatting.gif" alt="RemoveFormat" onclick="document.execCommand('RemoveFormat')">
<img src="icon_left.gif" alt="Align Left" onclick="document.execCommand('JustifyLeft')">
<img src="icon_center.gif" alt="Center" onclick="document.execCommand('JustifyCenter')">
<img src="icon_right.gif" alt="Align Right" onclick="document.execCommand('JustifyRight')">
<img src="icon_block.gif" alt="Align Block" onclick="document.execCommand('JustifyFull')">
<img src="icon_bullist.gif" alt="Bulleted List" onclick="document.execCommand('InsertUnorderedList')">
<img src="icon_numlist.gif" alt="Numbered List" onclick="document.execCommand('InsertOrderedList')">
<img src="icon_indent.gif" alt="Indent" onclick="document.execCommand('Indent')">
<img src="icon_outdent.gif" alt="Outdent" onclick="document.execCommand('Outdent')">
<img src="icon_src.gif" alt="View Source" onclick="location='view-source:' + window.location.href">
</center>
</form>
<div class=document id=doc name="editor" contentEditable="true"
style="OVERFLOW: auto; WIDTH: 100%; HEIGHT: 75%;border-style: solid;border-width: 1"
width="100%"
height="75%">
</div>
<form action="submitData.jsp" method="post">
<input type="submit" value="Submit">
</form>
</body>
</html>

Paul

Posts: 10
Nickname: tb303
Registered: Aug, 2002

Re: WYSIWYG Html Editor with JEditorPane and HTMLEditorKit Posted: Nov 13, 2002 2:26 AM
Reply to this message Reply
Hello everyone there is a free javascript based editor at

http://www.interactivetools.com/products/htmlarea/

The only catch to free is that you include their about box in your editor (a fair price to pay id say)

V

Posts: 1
Nickname: vm
Registered: Nov, 2002

Re: WYSIWYG Html Editor with JEditorPane and HTMLEditorKit Posted: Nov 15, 2002 5:33 PM
Reply to this message Reply
Hi,

Is it possible to have parts of text in a line *not editable*
while others *editable* in the editor ?


Would really appreciate any inputs/code...

-Thanks

Guermoule

Posts: 1
Nickname: guermoule
Registered: Dec, 2002

Re: WYSIWYG Html Editor with JEditorPane and HTMLEditorKit Posted: Dec 18, 2002 5:03 AM
Reply to this message Reply
Hi Every body,

I have some problems with "StyledEditorKit.AlignmentAction"

The alignment of the text doesn't work of which several cases,

Can I have a help ??

Thanks

Charles Bell

Posts: 519
Nickname: charles
Registered: Feb, 2002

Re: WYSIWYG Html Editor with JEditorPane and HTMLEditorKit Posted: Mar 3, 2004 10:39 AM
Reply to this message Reply
The link to my code is now:
http://www.quantumhyperspace.com/JavaProgramming/JavaSourceBank/javasource/HTMLDocumentEditor.java

or
http://www.quantumhyperspace.com/JavaProgramming/JavaSourceBank/viewCode.jsp?javaFile=HTMLDocumentEditor.java

Charles Bell

Posts: 519
Nickname: charles
Registered: Feb, 2002

Re: WYSIWYG Html Editor with JEditorPane and HTMLEditorKit Posted: Mar 3, 2004 10:48 AM
Reply to this message Reply
You are very correct to point at that the html code produced by the microsoft web browser internet explorer is not well formed xml code.

There are lots of problems with it to the point that you will have to write code to correct the code it generates for it to be useable in a real application.

Code that does won't come free of charge.

Charles

Flat View: This topic has 35 replies on 3 pages [ « | 1  2  3 | » ]
Topic: Event Driven Programming Previous Topic   Next Topic Topic: what is the need of Constructor in Interface

Sponsored Links



Google
  Web Artima.com   

Copyright © 1996-2019 Artima, Inc. All Rights Reserved. - Privacy Policy - Terms of Use