MyBB Community Forums

Full Version: Advanced Quickreply Advice.
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Pages: 1 2
Hi,
I'm trying to get the quick reply form to auto resize itself depending on the size of the thread in both width and height.
I'm able to get the width right for when the site is in mini mode but not the height.
And when I put the site in HD mode it gets all out of whack.
Here's what's happening:
Mini mode: [attachment=26318]
Max mode: [attachment=26319]

Here's my table code in the quick reply template:
<tbody style="{$collapsed['quickreply_e']}" id="quickreply_e">
			<tr>
				<td class="trow1" valign="top" width="140px">
					<strong>{$lang->message}</strong><br />
					<span class="smalltext">{$lang->message_note}<br /><br />
					<label><input type="checkbox" class="checkbox" name="postoptions[signature]" value="1" {$postoptionschecked['signature']} />&nbsp;<strong>{$lang->signature}</strong></label><br />
					<label><input type="checkbox" class="checkbox" name="postoptions[disablesmilies]" value="1" />&nbsp;<strong>{$lang->disable_smilies}</strong></label>{$closeoption}
					</span>
                                        {$clickablesmilies}
				</td>
				<td class="trow1" valign="top">
					<div style="width: 95%">
						<textarea style="width: 100%; padding: 4px; margin: 0;" rows="12" cols="80" name="message" id="message" tabindex="1"></textarea>{$codebuttons}
					</div>
					<div class="editor_control_bar" style="width: 97%; padding: 4px; margin-top: 3px; display: none;" id="quickreply_multiquote">
						<span class="smalltext">
							{$lang->quickreply_multiquote_selected} <a href="./newreply.php?tid={$tid}&amp;load_all_quotes=1" onclick="return Thread.loadMultiQuoted();">{$lang->quickreply_multiquote_now}</a> {$lang->or} <a href="javascript:Thread.clearMultiQuoted();">{$lang->quickreply_multiquote_deselect}</a>.
						</span>
					</div>
				</td>
			</tr>
			{$captcha}
			
		</tbody>

I'm using the new advanced quick reply plugin and had to manually past in the smilie insert code for it to show up, it varies in size so it's hard for me trying to figure out how to make this look good.

What do you think?

Side note:
Also I tried disabling that annoying manual resize thing in the bottom right corner of the editor with advice from this 2 year old thread but it didn't work, if you know how to disable via css/html please share too.
Rather than having your clickable smilies like that, try putting a get smilies link in, it looks a lot neater.

<span class="smalltext">
<strong>
[
<a href="javascript:clickableEditor.openGetMoreSmilies('clickableEditor');">get smilies</a>
]
</strong>
</span>

To get rid of the resize thing you can disable it

in your css

textarea#message {resize:none;}
(2012-05-18, 10:13 PM)Leefish Wrote: [ -> ]Rather than having your clickable smilies like that, try putting a get smilies link in, it looks a lot neater.

<span class="smalltext">
<strong>
[
<a href="javascript:clickableEditor.openGetMoreSmilies('clickableEditor');">get smilies</a>
]
</strong>
</span>

To get rid of the resize thing you can disable it

in your css

textarea#message {resize:none;}

OMG I LOVE YOU!
+1 rep!
(2012-05-18, 11:35 PM)GunnerAIO Wrote: [ -> ]OMG I LOVE YOU!
+1 rep!

awwwww (Blush)

Thank you for the rep - please can you mark the thread as solved as well
Well, there was still one thing... the auto resizing of the text field.. OH BTW! Here's what I did with your advice! :
<span class="smalltext">
[
<a href="javascript:clickableEditor.openGetMoreSmilies('clickableEditor')"><img src="{$mybb->settings['bburl']}/images/smilies/smile.gif" alt="{$lang->smilieinsert}" align="top" /></a><input type="button" value="{$lang->smilieinsert}" onclick="javascript:clickableEditor.openGetMoreSmilies('clickableEditor')" style="cursor:pointer;" />
]
</span>

Isn't this Damn sexy?! :
[attachment=26320]
(I took the above screen shot before disabling the editor resize in CSS)


SO now all that's left is this???
[attachment=26321]
Ohhh. I thought you meant the dots. Hmm. I will have to think about that.

And yes, that smilie button looks lots nicer. You might want to consider swapping the gifs for pngs for a nicer finish on the edges. I have a smilie set in the resources section that I use on leefish (we have a black theme available) because the mybb smilie gifs don't look as nice on a dark background.

http://mods.mybb.com/view/mybb-smilies-as-png
Thank you, I was using Google Speed Page and it recommended I use sprites which am in process of learning how to use, but for now PNG should be used for that image yes!, will do that now. Most of my smilies are insane animated gifs like the onion head .gif library and since animated png never happened.. we're stuck with gifs since 1985. lol.
Yea, I have almost no images in the theme on leefish for that reason. CSS buttons only, etc etc. I see that Xenforo are using a sprite for the smilies - I think it would need a plugin or core file edit for MYBB though.

I was looking at the quickreply - I don't have the plugin, but you could try this code in the tbody area of the quickreply template:

<tbody style="{$collapsed['quickreply_e']}" id="quickreply_e">
			<tr>
				<td class="trow1" valign="top" width="22%">
					<strong>{$lang->message}</strong><br />
					<span class="smalltext">{$lang->message_note}<br /><br />
					<label><input type="checkbox" class="checkbox" name="postoptions[signature]" value="1" {$postoptionschecked['signature']} />&nbsp;<strong>{$lang->signature}</strong></label><br />
					<label><input type="checkbox" class="checkbox" name="postoptions[disablesmilies]" value="1" />&nbsp;<strong>{$lang->disable_smilies}</strong></label>{$closeoption}</span>
				</td>
				<td class="trow1">
					<div style="width: 100%;text-align:center;">
						<textarea style="width: 100%; text-align:left; padding: 1px; margin: 0;" rows="8" cols="80" name="message" id="message" tabindex="1"></textarea>
					</div><div style="width:100%;">{$codebuttons}</div>
					<div class="editor_control_bar" style="width: 95%; padding: 4px; margin-top: 3px; display: none;" id="quickreply_multiquote">
						<span class="smalltext">
							{$lang->quickreply_multiquote_selected} <a href="./newreply.php?tid={$tid}&amp;load_all_quotes=1" onclick="return Thread.loadMultiQuoted();">{$lang->quickreply_multiquote_now}</a> {$lang->or} <a href="javascript:Thread.clearMultiQuoted();">{$lang->quickreply_multiquote_deselect}</a>.
						</span>
					</div>
				</td>
			</tr>
			{$captcha}
			<tr>
				<td colspan="2" align="center" class="tfoot"><input type="submit" class="button" value="{$lang->post_reply}" tabindex="2" accesskey="s" id="quick_reply_submit" /> <input type="submit" class="button" name="previewpost" value="{$lang->preview_post}" tabindex="3" /></td>
			</tr>
		</tbody>

whoops, small typo in style - missed a comma. Hence edit.
Well gave it a try:
		<tbody style="{$collapsed['quickreply_e']}" id="quickreply_e">
			<tr>
                                <td class="trow1" valign="top" width="22%">
                                        <strong>{$lang->message}</strong><br />
                                        <span class="smalltext">{$lang->message_note}<br /><br />
                                        <label><input type="checkbox" class="checkbox" name="postoptions[signature]" value="1" {$postoptionschecked['signature']} />&nbsp;<strong>{$lang->signature}</strong></label><br />
					<label><input type="checkbox" class="checkbox" name="postoptions[disablesmilies]" value="1" />&nbsp;<strong>{$lang->disable_smilies}</strong></label>{$closeoption}<br />
                                        <a href="javascript:clickableEditor.openGetMoreSmilies('clickableEditor')"><img src="{$mybb->settings['bburl']}/images/smilies/smile.png" alt="{$lang->smilieinsert}" align="top" /></a><input type="button" value="{$lang->smilieinsert}" onclick="javascript:clickableEditor.openGetMoreSmilies('clickableEditor')" style="cursor:pointer;" />
                                        </span>
 				</td>
				<td class="trow1" valign="top">
                                        <div style="width: 100%; text-align: center;">
					<textarea style="width: 100%; text-align:left; padding: 4px; margin: 0;" rows="18" cols="80" name="message" id="message" tabindex="1"></textarea></div>
					<div style="width:100%">{$codebuttons}</div>
					<div class="editor_control_bar" style="width: 97%; padding: 4px; margin-top: 3px; display: none;" id="quickreply_multiquote">
						<span class="smalltext">
						{$lang->quickreply_multiquote_selected} <a href="./newreply.php?tid={$tid}&amp;load_all_quotes=1" onclick="return Thread.loadMultiQuoted();">{$lang->quickreply_multiquote_now}</a> {$lang->or} <a href="javascript:Thread.clearMultiQuoted();">{$lang->quickreply_multiquote_deselect}</a>.
						</span>
					</div>
				</td>
			</tr>
			{$captcha}
		</tbody>

And so far no go, lol:
[attachment=26323]
I am sorry I cannot help further as I do not really want to install the plugin. The template for the codebuttons is partly in the js, partly in the HTML. You could try looking inside the plugin to see if any styling is being applied there
Pages: 1 2