Result Preview - how can I separate the 'expand' icon from the box where the preview is shown? (C#, VB.NET)
https://keyoti.com/kb/Default.aspx?ToDo=view&questId=214&catId=54
The result preview ASPX (in the ResultItem template) is by default
<span class='sew_previewResultWrapper'>...<img alt="Click to preview the document text"
onclick="sew_toggleResultPreview(this, '<%# Container.UriAsStored %>', '<%# Container.ResultPreview_Expander_ClosedUrl %>', '<%# Container.ResultPreview_Expander_OpenedUrl %>')"
src="<%# Container.ResultPreview_Expander_ClosedUrl %>" /><span class='sew_previewResultContent'>Loading
document...</span></span>
For simplicity this groups the expander image with the span where the result is shown. However, to have the image located elsewhere in the template, here's what you need to do.
1. Add this to the page
<script runat="server">
int count = 0;
</script>
<script>
var sew_currentPreviewDIV = null;
var sew_indexDirectory = "";
function sew_toggleResultPreview2(button, target, url, closedImgURL,
openedImgURL) {
sew_currentPreviewDIV = KSQ(target);
if (button.sew_opened == true) {
sew_currentPreviewDIV.hide("fast");
button.src = closedImgURL;
button.sew_opened = false;
} else {
button.src = openedImgURL;
button.sew_opened = true;
sew_currentPreviewDIV.show("slow");
KSQ.get("Keyoti.SearchEngine.Web.CallBackHandler.ashx?cl=SRP&u="
+ escape(url) + "&id=" + sew_indexDirectory, function(data) {
if (sew_currentPreviewDIV != null) {
var text = data.replace(/</g, "<");
text = text.replace(/>/g, ">");
text = text.replace(/\n/g, "<br /><br />");
//highlight
for (var k = 0; k < sew_keywords.length; k++) {
text = text.replace(new RegExp("\\b(" +
sew_keywords[k] + ")\\b", "gi"), sew_keyword_highlightPattern.replace("{0}",
"$1"));
}
sew_currentPreviewDIV.html(text);
sew_currentPreviewDIV = null;
}
});
}
}
</script>
This includes a server side counter which we use to identify the correct span to open the preview in.
2. Change the ResultItem template like this
<ResultItemTemplate>
<div class='SEResultItem'>
<table border="0" width="100%" style="font-family: sans-serif, Verdana, Arial,
Helvetica; font-size: 9pt;">
<tr style="height: 5px">
<td style="width: 15%; font-family: sans-serif, Verdana, Arial, Helvetica;">
<asp:Label ID="DocNumber" runat="server" Text=""></asp:Label>
</td>
<td style="width: 85%; font-family: sans-serif, Verdana, Arial, Helvetica;
font-size: 9pt;">
<asp:LinkButton ID="LinkButton1" runat="server" OnClick="linkClick"
CommandArgument="<%# Container.Uri %>"><%#Container.Title%></asp:LinkButton>
<%--Add --%>
<img alt="Click to preview the document text" src="<%#
Container.ResultPreview_Expander_ClosedUrl %>"
onclick="sew_toggleResultPreview2(this,
document.getElementById('sew_target<%=count %>'), '<%# Container.Uri %>', '<%#
Container.ResultPreview_Expander_ClosedUrl %>', '<%#
Container.ResultPreview_Expander_OpenedUrl %>')" />
</td>
</tr>
<tr>
<td colspan='2' style='width: 100%'>
<%-- Add --%>
<span class='sew_previewResultWrapper'>
<span class='sew_previewResultContent' style='width: 100%'
id='sew_target<%=count++ %>'>Loading document...</span> </span>
<%-- End add --%>
</td>
</tr>
</table>
</div>
</ResultItemTemplate> |
|
|