I have created a custom button to display a dialog box to let people type latex which I convert to an image for insertion into the documnt (see code below). The code works fine when entering html for the image. What I want is when a user has selected an image to retrieve the html for the image and display it. I cannot get this to work.
<%@ page language="C#" inherits="CuteEditor.Dialogs.FileBrowserPage" %>
<%@ register tagprefix="CE" assembly="CuteEditor" namespace="CuteEditor" %>
<!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">
<head>
<title>Insert Latex Equation</title>
<script type="text/javascript">
function Window_GetDialogArguments(win) {
var top = win.top;
try {
var opener = top.opener;
if (opener && opener.document._dialog_arguments)
return opener.document._dialog_arguments;
}
catch (x) {
}
if (top.document._dialog_arguments)
return top.document._dialog_arguments;
if (top.dialogArguments)
return top.dialogArguments;
return top.document._dialog_arguments;
}
function getSelectedHTML() {
var rng = null, html = "";
var editWin = Window_GetDialogArguments(window);
var editdoc = editWin.GetDocument();
if (document.selection && document.selection.createRange) {
rng = editdoc.selection.createRange();
html = rng.htmlText || "";
} else if (window.getSelection) {
rng = editwin.getSelection();
if (rng.rangeCount > 0 && window.XMLSerializer) {
rng = rng.getRangeAt(0);
html = new XMLSerializer().serializeToString(rng.cloneContents());
}
}
return html;
}
</script>
</head>
<body>
<form runat="server" id="Form1">
<textarea id="latex" cols="42" rows="10"></textarea><br />
<br />
<button onclick="button_click()" id="Button1">Insert Equation</button>
<button onclick="window.top.close();" id="Button2">Cancel</button>
</form>
<script type="text/javascript">
document.getElementById('latex').innerHTML = getSelectedHTML();
function button_click() {
var editor = Window_GetDialogArguments(window);
var ta = document.getElementById("latex");
editor.PasteHTML(ta.value);
window.top.close();
}
</script>
</body>
</html>
A typical image url is:
<img class="wikiEquation" src="http://cutesoft.net/Eq?$\large f(t) = \mathcal{L}^{-1} \{ F(s) \} $" alt="" />
The user will only work with the text between the $ signs and I will build up the full html before inserting (logic omitted from above) and this displays equations on the site. If the user has made a msitake I would like him to be able to click on the image to edit it, hence my need to get the html for the image. I will manipulate the html to show only the bit between the $ signs in the dialog (logic omitted from above).
Any help in somehow extracting the html for a selected image would be really appreciated.