Using quick reply on nonvb page

[cinq]

Just how can this be done ?

I took a look at showthread.php ( it calls the template showthread_quickreply )
and the template itself.

Seems relatively straightforward.

but including it in a non vb page, i keep getting ( in standard toolbar mode as i set WYSIWYG as 1. ) the page going to the top of the page ( with the URL having an appended # ) upon clicking on any of the buttons, like B, I or U etc.

My template for the non vb page for the part calling the 'quick reply bit':

<tr>
<td class="panelsurround" align="center">
<div>$usernamecode</div><br>
$quickreply
</td>
</tr>


In the php file that has the quick reply code

require_once('./includes/functions_editor.php');
$istyles_js = construct_editor_styles_js();
$onload .= " editInit();";

$headinclude .= "
<!-- set up CSS for the editor -->
<link rel=\"stylesheet\" type=\"text/css\" href=\"clientscript/vbulletin_editor.css\" />
<style type=\"text/css\">
<!--
#vBulletin_editor {
background: {$istyles[pi_button_normal][0]};
padding: $stylevar[cellpadding]px;
}
#controlbar, .controlbar {
background: {$istyles[pi_button_normal][0]};
}
.imagebutton {
background: {$istyles[pi_button_normal][0]};
color: {$istyles[pi_button_normal][1]};
padding: {$istyles[pi_button_normal][2]};
border: {$istyles[pi_button_normal][3]};
}
-->
</style>
";

eval('$usernamecode = "' . fetch_template('newpost_usernamecode') . '";');
eval('$quickreply = "' . fetch_template('myquickreply') . '";');


My template for myquickreply

<script type="text/javascript">
<!--
var istyles = new Array(); istyles = { $istyles_js };
//-->
</script>

<form action="articles.php" method="post" name="vbform">
<table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0" width="100%" align="center">
<tr>
<td class="panelsurround" align="center">
<div class="panel">
<table cellpadding="0" cellspacing="0" border="0" align="center">
<tr>
<td id="vBulletin_editor" align="$stylevar[left]">
<!-- <<<< indent back for ease of reading -->


<div id="controlbar">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<if condition="$vboptions[allowedbbcodes] & ALLOW_BBCODE_BASIC">
<td><div class="imagebutton"><a href="#" onclick="return vbcode('B', '')"><img src="$stylevar[imgdir_editor]/bold.gif" alt="$vbphrase[bold]" width="21" height="20" border="0" /></a></div></td>
<td><div class="imagebutton"><a href="#" onclick="return vbcode('I', '')"><img src="$stylevar[imgdir_editor]/italic.gif" alt="$vbphrase[italic]" width="21" height="20" border="0" /></a></div></td>
<td><div class="imagebutton"><a href="#" onclick="return vbcode('U', '')"><img src="$stylevar[imgdir_editor]/underline.gif" alt="$vbphrase[underline]" width="21" height="20" border="0" /></a></div></td>
<td><img src="$stylevar[imgdir_editor]/separator.gif" alt="" width="6" height="20" /></td>
</if>
<td><div class="imagebutton"><a href="#" onclick="return vbcode('QUOTE', '')"><img src="$stylevar[imgdir_editor]/quote.gif" alt="$vbphrase[wrap_quote_tags]" title="$vbphrase[wrap_quote_tags]" width="21" height="21" border="0" /></a></div></td>
</tr>
</table>
</div>

<div class="controlbar">
<textarea name="message" id="qr_message" class="bginput" style="width:600px; height:100px" cols="60" rows="5" tabindex="1"></textarea>
</div>

<script type="text/javascript" src="clientscript/vbulletin_editor.js"></script>
<script type="text/javascript" src="clientscript/vbulletin_stdedit.js"></script>

<!-- >>>> outdent back to normal -->
</td>
</tr>
</table>
</div>

<div style="margin-top:$stylevar[cellpadding]px">
<input type="hidden" name="do" value="postthereply" />
<input type="submit" class="button" value="$vbphrase[post_quick_reply]" accesskey="s" title="(Alt + S)" name="sbutton" tabindex="2" />
</div>
</td>
</tr>
</table>

</form>
<script type="text/javascript" src="clientscript/vbulletin_quickreply.js"></script>

[sabret00the]

is this inside the forums directory?

here's a snippet of mine


// build quick reply if appropriate
if ($SHOWQUICKREPLY)
{
require_once('./includes/functions_editor.php');

$WYSIWYG = is_wysiwyg_compatible();
$istyles_js = construct_editor_styles_js();

// set quick reply initial id
$qrpostid = $post[postid];
$QRrequireclick = 0;

if (!$QRrequireclick AND $WYSIWYG >= 1)
{
$onload .= " editInit();";
}

// append some CSS to the headinclude template
$headinclude .= "
<!-- set up CSS for the editor -->
<link rel=\"stylesheet\" type=\"text/css\" href=\"../forums/clientscript/vbulletin_editor.css\" />
<style type=\"text/css\">
<!--
#vBulletin_editor {
background: {$istyles[pi_button_normal][0]};
padding: $stylevar[cellpadding]px;
}
#controlbar, .controlbar {
background: {$istyles[pi_button_normal][0]};
}
.imagebutton {
background: {$istyles[pi_button_normal][0]};
color: {$istyles[pi_button_normal][1]};
padding: {$istyles[pi_button_normal][2]};
border: {$istyles[pi_button_normal][3]};
}
-->
</style>
";
$vbphrase['click_quick_reply_icon'] = addslashes_js($vbphrase['click_quick_reply_icon']);
eval('$quickreply = "' . fetch_template('groups_viewthread_quickreply') . '";');
}



<script type="text/javascript">
<!--
var WYSIWYG = $WYSIWYG;
var threadedmode = $threadedmode;
var minchars = $vboptions[postminchars];
var maxchars = $vboptions[postmaxchars];
var require_click = $QRrequireclick;
var must_click_message = "$vbphrase[click_quick_reply_icon]";
var istyles = new Array(); istyles = { $istyles_js };
var normalmode = false;
var vbphrase = {
// wysiwyg only
"wysiwyg_please_wait" : "$vbphrase[wysiwyg_please_wait]",
"wysiwyg_initialized" : "$vbphrase[wysiwyg_initialized]",
"wysiwyg_command_invalid" : "$vbphrase[wysiwyg_command_invalid]",
"moz_must_select_text" : "$vbphrase[moz_must_select_text]",
"moz_edit_config_file" : "$vbphrase[moz_edit_config_file]",
"enter_tag_option" : "$vbphrase[enter_tag_option]",
"must_select_text_to_use" : "$vbphrase[must_select_text_to_use]",
"browser_is_safari_no_wysiwyg" : "$vbphrase[browser_is_safari_no_wysiwyg]",
// standard only
"enter_text_to_be_formatted" : "$vbphrase[enter_text_to_be_formatted]",
"enter_link_text" : "$vbphrase[enter_link_text]",
"enter_list_type" : "$vbphrase[enter_list_type]",
"enter_list_item" : "$vbphrase[enter_list_item]",
// both
"must_enter_subject" : "$vbphrase[must_enter_subject]",
"message_too_short" : "$vbphrase[message_too_short]",
"enter_link_url" : "$vbphrase[enter_link_url]",
"enter_image_url" : "$vbphrase[enter_image_url]",
"enter_email_link" : "$vbphrase[enter_email_link]"
};
//-->
</script>
<a name="lastpost"></a>
<form action="reply.php" method="post" name="vbform" onsubmit="return checkQR(this);">

<table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0" width="100%" align="center">
<thead>
<tr>
<td class="tcat" colspan="2">
<a style="float:$stylevar[right]" href="#top" onclick="return <if condition="$WYSIWYG == 2 AND !is_browser('ie')">editor_loaded ? false : </if> toggle_collapse('quickreply');"><img id="collapseimg_quickreply" src="$stylevar[imgdir_button]/collapse_tcat$vbcollapse[collapseimg_quickreply].gif" alt="" border="0" /></a>
<!--<img class="inlineimg" src="$stylevar[imgdir_button]/quickreply.gif" alt="" title="$vbphrase[quick_reply]" border="0" <if condition="$debug">onclick="infoQR();"</if> />-->
$vbphrase[quick_reply]
</td>
</tr>
</thead>
<tbody id="collapseobj_quickreply" style="$vbcollapse[collapseobj_quickreply]">
<tr>
<td class="panelsurround" align="center">
<div class="panel">
<table cellpadding="0" cellspacing="0" border="0" align="center">
<tr>
<td class="smallfont" align="$stylevar[left]">$vbphrase[message]:</td>
</tr>
<tr>
<td id="vBulletin_editor" align="$stylevar[left]">
<!-- <<<< indent back for ease of reading -->

<if condition="$WYSIWYG == 2">
<!-- wysiwyg quick reply -->

<div id="controlbar">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td><div class="imagebutton" id="cmd_removeformat"><img src="$stylevar[imgdir_editor]/removeformat.gif" alt="$vbphrase[remove_text_formatting]" width="21" height="20" /></div></td>
<td><img src="$stylevar[imgdir_editor]/separator.gif" alt="" width="6" height="20" /></td>
<if condition="$vboptions[allowedbbcodes] & ALLOW_BBCODE_BASIC">
<td><div class="imagebutton" id="cmd_bold"><img src="$stylevar[imgdir_editor]/bold.gif" alt="$vbphrase[bold]" width="21" height="20" /></div></td>
<td><div class="imagebutton" id="cmd_italic"><img src="$stylevar[imgdir_editor]/italic.gif" alt="$vbphrase[italic]" width="21" height="20" /></div></td>
<td><div class="imagebutton" id="cmd_underline"><img src="$stylevar[imgdir_editor]/underline.gif" alt="$vbphrase[underline]" width="21" height="20" /></div></td>
<td><img src="$stylevar[imgdir_editor]/separator.gif" alt="" width="6" height="20" /></td>
</if>
<td><div class="imagebutton" id="cmd_wrap0_quote"><img src="$stylevar[imgdir_editor]/quote.gif" alt="$vbphrase[wrap_quote_tags]" width="21" height="20" /></div></td>
</tr>
</table>
</div>

<div class="controlbar">
<if condition="is_browser('ie')">
<div id="htmlbox" class="wysiwyg" style="width:600px; height:100px; padding:8px" tabindex="1"><p></p></div>
<else />
<iframe id="htmlbox" style="width:600px; height:100px" tabindex="1"></iframe>
</if>
<input type="hidden" name="message" id="qr_message" value="" />
<input type="hidden" name="WYSIWYG_HTML" value="" />
</div>

<script type="text/javascript" src="$vboptions[bburl]/clientscript/vbulletin_editor.js"></script>
<script type="text/javascript" src="$vboptions[bburl]/clientscript/vbulletin_wysiwyg.js"></script>
<if condition="!is_browser('ie')"><script type="text/javascript" src="$vboptions[bburl]/clientscript/vbulletin_moziwyg.js"></script></if>

<!-- / wysiwyg quick reply -->
</if>


<if condition="$WYSIWYG == 1">
<!-- standard quick reply -->

<div id="controlbar">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<if condition="$vboptions[allowedbbcodes] & ALLOW_BBCODE_BASIC">
<td><div class="imagebutton"><a href="#" onclick="return vbcode('B', '')"><img src="$stylevar[imgdir_editor]/bold.gif" alt="$vbphrase[bold]" width="21" height="20" border="0" /></a></div></td>
<td><div class="imagebutton"><a href="#" onclick="return vbcode('I', '')"><img src="$stylevar[imgdir_editor]/italic.gif" alt="$vbphrase[italic]" width="21" height="20" border="0" /></a></div></td>
<td><div class="imagebutton"><a href="#" onclick="return vbcode('U', '')"><img src="$stylevar[imgdir_editor]/underline.gif" alt="$vbphrase[underline]" width="21" height="20" border="0" /></a></div></td>
<td><img src="$stylevar[imgdir_editor]/separator.gif" alt="" width="6" height="20" /></td>
</if>
<td><div class="imagebutton"><a href="#" onclick="return vbcode('QUOTE', '')"><img src="$stylevar[imgdir_editor]/quote.gif" alt="$vbphrase[wrap_quote_tags]" title="$vbphrase[wrap_quote_tags]" width="21" height="21" border="0" /></a></div></td>
</tr>
</table>
</div>

<div class="controlbar">
<textarea name="message" id="qr_message" class="bginput" style="width:600px; height:100px" cols="60" rows="5" tabindex="1"></textarea>
</div>

<script type="text/javascript" src="$vboptions[bburl]/clientscript/vbulletin_editor.js"></script>
<script type="text/javascript" src="$vboptions[bburl]/clientscript/vbulletin_stdedit.js"></script>

<!-- / standard quick reply -->
</if>


<if condition="$WYSIWYG == 0">
<!-- no-toolbar quick reply -->

<div class="controlbar">
<textarea name="message" id="qr_message" class="bginput" style="width:600px; height:100px;" rows="5" cols="60" tabindex="1"></textarea>
</div>

<!-- / no-toolbar quick reply -->
</if>


<!-- >>>> outdent back to normal -->
</td>
</tr>
<tr>
<td align="$stylevar[left]">

<fieldset class="fieldset" style="margin:$stylevar[formspacer]px 0px 0px 0px">
<legend>$vbphrase[options]</legend>
<div>
<if condition="$bbuserinfo['signature']">
<div style="float:$stylevar[right]">
<label for="cb_signature"><input type="checkbox" name="signature" value="1" id="cb_signature" tabindex="5" checked="checked" />$vbphrase[show_your_signature]</label>
</div>
</if>
<label for="qr_quickreply"><input type="checkbox" name="quickreply" value="1" id="qr_quickreply" accesskey="w" tabindex="4" checked="checked" />$vbphrase[quote_message_in_reply]</label>
</div>
</fieldset>

</td>
</tr>
</table>
</div>

<div style="margin-top:$stylevar[cellpadding]px">
<input type="hidden" name="fromquickreply" value="1" />
<input type="hidden" name="s" value="$session[sessionhash]" />
<input type="hidden" name="do" value="postreply" />
<input type="hidden" name="g" value="$groupid" id="qr_threadid" />
<input type="hidden" name="p" value="$qrpostid" id="qr_postid" />
<input type="hidden" name="parseurl" value="1" />
<input type="hidden" name="clickedelm" value="" />
<input type="submit" class="button" value="$vbphrase[post_quick_reply]" accesskey="s" title="(Alt + S)" name="sbutton" tabindex="2" onclick="this.form.clickedelm.value=this.value" />
<input type="submit" class="button" value="$vbphrase[go_advanced]" accesskey="x" title="(Alt + X)" name="preview" tabindex="3" id="qr_preview" onclick="this.form.clickedelm.value = this.value" />
</div>
</td>
</tr>
</tbody>
</table>

</form>
<br />

<if condition="!is_browser('ie') AND $WYSIWYG == 2">
<!-- Mozilla work around for focusing on QR in WYSIWYG mode -->
<div id="qr_scroll"></div>
</if>

<script type="text/javascript" src="$vboptions[bburl]/clientscript/vbulletin_quickreply.js"></script>
<!-- END WYSWIWYG QUICK REPLY -->

yours sounds like a javascript issue.

[cinq]

Nope doesn't work.

I am wondering if we can just take out unneeded variables, and hidden tags stuff.
Or must everything be intact ?

But I am not quoting any post or anything.
I am merely trying to use it to replace a normal textarea with a standard toolbar editor box instead.

[sabret00the]

in your script you've got $SHOWQUICKREPLY = TRUE; right?

the variables don't really matter depending on how you're processing the data afterwords.

is this inside or outside of the forums directory?

[cinq]

I removed the $SHOWQUICKREPLY = TRUE
because it is not in the template code anyways.

The quick reply box shows, just that clicking on B, or I, U etc. doesnt do anything but bring me to the top of the page, and appends a # to the URL.
I am quite sure the vbcode() function is not executed ( the onclick event ), so yeah, it's something to do with the js.

Everything is in the forums dir.

[sabret00the]

i just noticed i have the same problem lol

ok let me check the js references.

[cinq]

Woot, I got it to work :)

just for future reference in case others need to use this.

Php code here :

require_once('./includes/functions_editor.php');
$WYSIWYG = 1;
$istyles_js = construct_editor_styles_js();
$showsig=0;
$threadedmode = 0;
$qrpostid = 'who cares';
$QRrequireclick = 0;
if (!$QRrequireclick AND $WYSIWYG >= 1)
{ $onload .= " editInit();"; }

$headinclude .= "
<!-- set up CSS for the editor -->
<link rel=\"stylesheet\" type=\"text/css\" href=\"clientscript/vbulletin_editor.css\" />
<style type=\"text/css\">
<!--
#vBulletin_editor {
background: {$istyles[pi_button_normal][0]};
padding: $stylevar[cellpadding]px;
}
#controlbar, .controlbar {
background: {$istyles[pi_button_normal][0]};
}
.imagebutton {
background: {$istyles[pi_button_normal][0]};
color: {$istyles[pi_button_normal][1]};
padding: {$istyles[pi_button_normal][2]};
border: {$istyles[pi_button_normal][3]};
}
-->
</style>
";
eval('$usernamecode = "' . fetch_template('newpost_usernamecode') . '";');
eval('$quickreply = "' . fetch_template('your_quickreply_template') . '";');

Of course some values above are hardcoded, like the $WYSIWYG, $showsig etc. You can customize to your needs.

The 'your_quickreply_template' template :

<script type="text/javascript">
<!--
var WYSIWYG = $WYSIWYG;
var threadedmode = $threadedmode;
var require_click = $QRrequireclick;
var istyles = new Array(); istyles = { $istyles_js };
var normalmode = false;
//-->
</script>

<form action="articles.php" method="post" name="vbform">
<div >
<table cellpadding="0" cellspacing="0" border="0" align="center">
<tr>
<td id="vBulletin_editor" align="$stylevar[left]">
<!-- <<<< indent back for ease of reading -->

<if condition="$WYSIWYG == 1">
<!-- standard quick reply -->

<div id="controlbar">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<if condition="$vboptions[allowedbbcodes] & ALLOW_BBCODE_BASIC">
<td><div class="imagebutton"><a href="#" onclick="return vbcode('B', '')"><img src="$stylevar[imgdir_editor]/bold.gif" alt="$vbphrase[bold]" width="21" height="20" border="0" /></a></div></td>
<td><div class="imagebutton"><a href="#" onclick="return vbcode('I', '')"><img src="$stylevar[imgdir_editor]/italic.gif" alt="$vbphrase[italic]" width="21" height="20" border="0" /></a></div></td>
<td><div class="imagebutton"><a href="#" onclick="return vbcode('U', '')"><img src="$stylevar[imgdir_editor]/underline.gif" alt="$vbphrase[underline]" width="21" height="20" border="0" /></a></div></td>
<td><img src="$stylevar[imgdir_editor]/separator.gif" alt="" width="6" height="20" /></td>
</if>
<td><div class="imagebutton"><a href="#" onclick="return vbcode('QUOTE', '')"><img src="$stylevar[imgdir_editor]/quote.gif" alt="$vbphrase[wrap_quote_tags]" title="$vbphrase[wrap_quote_tags]" width="21" height="21" border="0" /></a></div></td>
</tr>
</table>
</div>

<div class="controlbar">
<textarea name="message" id="qr_message" class="bginput" style="width:600px; height:100px" cols="60" rows="5" tabindex="1"></textarea>
</div>

<script type="text/javascript" src="clientscript/vbulletin_editor.js"></script>
<script type="text/javascript" src="clientscript/vbulletin_stdedit.js"></script>

<!-- / standard quick reply -->
</if>

<!-- >>>> outdent back to normal -->
</td>
</tr>

<tr>
<td align="center">
<input type="hidden" name="do" value="postreply" />
<!-- hidden stuff to pass here -->
<input type="submit" class="button" value="Submit" />
</td>
</tr>

</table>
</div>

</form>
<script type="text/javascript" src="clientscript/vbulletin_quickreply.js"></script>

I enabled WYSIWYG mode 1 only, so all other irrelevant code in the template has been removed.

Hope this comes in handy :)

[sabret00the]

nice one, i'll definately have to play with thsi tonight.

[alster]

Nice post but my question still remains.

I?m trying to make a forum with several threads showing as well as posts. The thing is below every thread there is a WYSIWYG, so a quick reply box can be written. Several javascripts define the WYSIWYG. As there are several WYSIWYG there are several JS repeating themselves. Well, my problem lies in between.
Bump....


We made this in a non vb area because I found the vBulletin's data manager with a 2000 lines and I can?t just repeat them. Anyway, I?m still studing the
http://www.vbulletin.com/docs/html/data_managers

See what we made in a non vb area while I?m trying to figure out the vbulletin?s data manager:

<script type="text/javascript">
<!--
var WYSIWYG = $WYSIWYG;
var threadedmode = $threadedmode;
var require_click = $QRrequireclick;
var istyles = new Array(); istyles = { $istyles_js };
var normalmode = false;
//-->
</script>