MyBB Community Forums

(2021-11-03, 01:44 PM)Hammer45 Wrote: [ -> ]@Devilshakerz Yes I am all new to this and had it installed once before... I had to redo the entire site and forgot where to place the {$dvz_shoutbox} lol.... I read the readme and it says the index template... cannot for the life of me remember which one.. been a long week for me...

You should be able to find index under Index Page Templates in Admin CP's Templates & Style → Templates → your theme.

thank you for the plugin, currently i using it.

is there anyway we can add bbcode button in this shoutbox?

(2022-02-18, 02:18 AM)lkop Wrote: [ -> ]is there anyway we can add bbcode button in this shoutbox?

Have been looking for a solution for a long time. So far I found that under 'dvz_shoutbox_panel' - <script>

var input = $('#dvz_input');
input.val(input.val() + '[b]Bold text[/b]');
...more bbcode...

can insert. But that doesn't look nice and doesn't work very well.

A perfect solution would be cool...

A question and an issue:

How do I allow users to moderate their own shouts?

Shouts from other users aren't showing up without refreshing the page. Intermittently, a user's own shouts don't show up without a refresh as well.

Thanks!

Nevermind. I am just blind.

(2022-02-18, 02:18 AM)lkop Wrote: [ -> ]is there anyway we can add bbcode button in this shoutbox?

1) Open dvz_shoutbox_panel ( Template Sets » Global Templates » Edit Template: dvz_shoutbox_panel )

<div class="panel">
<form>
<input type="text" class="text" placeholder="{$lang->dvz_sb_default}" maxlength="{$maxlength}" autocomplete="off" />
<input type="submit" style="display:none" />
</form>
</div>'

edit to

<div class="panel">
<form>
<input type="text" id="shout_text" class="text" placeholder="{$lang->dvz_sb_default}" maxlength="{$maxlength}" autocomplete="off" />
<input type="submit" style="display:none" />
<a href="#" id="shout_format" data-format-id="1">Bold</a>
<a href="#" id="shout_format" data-format-id="2">Italic</a>
<a href="#" id="shout_format" data-format-id="3">Strike</a>
<a href="#" id="shout_format" data-format-id="4">Under</a>
<a href="#" id="shout_format" data-format-id="5">URL</a>
</form>
</div>

2) Open dvz_shoutbox.js (/jscripts/dbz_shoutbox.js) and at the bottom add 

$('#shoutbox').on('click', '#shout_format', function()
{
	Add_Styling( $(this).attr('data-format-id') );
	return false;
});

function getCursorPos(el)
{
	if (el.selectionStart){ return el.selectionStart; }
	else if (document.selection)
	{ 
		el.focus();
		var r = document.selection.createRange();
		
		if (r == null) { return 0; }
	
		var re = el.createTextRange(),
		rc = re.duplicate();
		re.moveToBookmark(r.getBookmark());
		rc.setEndPoint('EndToStart', re);

		return rc.text.length;
	}
	return 0;
}

function Add_Styling(type)
{
	var message = $('#shoutbox input.textbox').val();
	var text_field = $('#shoutbox input.textbox');
	var currentPos = getCursorPos(document.getElementById("shout_text"));
	
	var s_start = text_field.prop('selectionStart');
	var s_end = text_field.prop('selectionEnd');
	
	var m_mid = "";
	var m_mid2 = "";
	var pos = 0;
	var extra_pos = 0;
	
	var final_msg = '';
	
	if( type == 1 ) // BOLD
	{
		m_mid = "[b][/b]";
		m_mid2 = "[b]"+message.substring(s_start, s_end)+"[/b]"
		extra_post = 3;
	}
	else if( type == 2 ) // ITALIC
	{
		m_mid = "[i][/i]";
		m_mid2 = "[i]"+message.substring(s_start, s_end)+"[/i]"
		extra_post = 3;
	}
	else if( type == 3 ) // STRIKETHROUGH
	{
		m_mid = "[s][/s]";
		m_mid2 = "[s]"+message.substring(s_start, s_end)+"[/s]"
		extra_post = 3;		
	}
	else if( type == 4 ) // UNDERLINE
	{
		m_mid = "[u][/u]";
		m_mid2 = "[u]"+message.substring(s_start, s_end)+"[/u]"
		extra_post = 3;
	}
	else if( type == 5 ) // URL
	{
		m_mid = "[url=] Press here [/url]";
		m_mid2 = "[url="+message.substring(s_start, s_end)+"] Press here [/url]"
		extra_post = 5;
	}
	
	if( s_start == s_end )
	{
		m_start = message.substring(0, currentPos);
		m_end = message.substring(currentPos, message.length );
		final_msg = m_start+m_mid+m_end;
		pos = currentPos+extra_post;
	}
	else
	{
		m_start = message.substring(0, s_start);
		m_end = message.substring(s_end, message.length );
		final_msg = m_start+m_mid2+m_end;
		pos = 10000;
	}
	

	$('#shoutbox input.textbox').val(final_msg);
	$("#shoutbox input.textbox").focus();
	
	$("#shoutbox input.textbox").prop('selectionStart', pos);
	$("#shoutbox input.textbox").prop('selectionEnd', pos);
}

This includes Bold, Italic, Strikethrough, Underline, URL tags and you can format selected range of text ( if selected )

NOTE: you might need to edit css to work with your theme


https://i.imgur.com/d5AQIYs.gif

(2014-07-15, 12:57 PM)Devilshakerz Wrote: [ -> ]The lightweight MyBB AJAX-based chat.



Major features:
- smileys and MyCode parsing,
- away mode (turn off autorefreshing when user is inactive for a specified period of time),
- antiflood time control,
- minimum forum posts to shout,
- blocking specified users from shouting,
- advanced group permissions system,
- unread messages marking,
- "lazy load",
- archive mode with users' IP addresses visible to moderators.


http://community.mybb.com/mods.php?action=view&pid=63

Legacy version (for MyBB 1.6.x): http://mods.mybb.com/view/dvz-shoutbox

Looks good so far however in my opinion the shoutbox is too small (after using inspect elements, i noticed it's the height of 160px which i want to increase however i did not found where i can do so. 160px is nowhere set in the style.txt provided. Please help me with this case

Sincerely,
Infinimonster

I followed all the steps and when ever i try and use it none of the messages go thrugh could anyone help me please.

@vidme

Thanks for that! However, I found an error in your instructions.

Uncaught ReferenceError: shoutbox_type is not defined
    at Add_Styling (dvz_shoutbox.js:664:18)
    at HTMLAnchorElement.<anonymous> (dvz_shoutbox.js:640:2)
    at HTMLDivElement.dispatch (jquery.js?ver=1823:2:43090)
    at v.handle (jquery.js?ver=1823:2:41074)
Add_Styling @ dvz_shoutbox.js:664
(anonym) @ dvz_shoutbox.js:640
dispatch @ jquery.js?ver=1823:2
v.handle @ jquery.js?ver=1823:2

How to fix this?
LG

(2023-01-23, 09:40 AM)deNewbie Wrote: [ -> ]@vidme

Thanks for that! However, I found an error in your instructions.

Uncaught ReferenceError: shoutbox_type is not defined
    at Add_Styling (dvz_shoutbox.js:664:18)
    at HTMLAnchorElement.<anonymous> (dvz_shoutbox.js:640:2)
    at HTMLDivElement.dispatch (jquery.js?ver=1823:2:43090)
    at v.handle (jquery.js?ver=1823:2:41074)
Add_Styling @ dvz_shoutbox.js:664
(anonym) @ dvz_shoutbox.js:640
dispatch @ jquery.js?ver=1823:2
v.handle @ jquery.js?ver=1823:2

How to fix this?
LG

Remove all shoutbox_type+ in Add_Styling function. Forgot to remove it as my themes is responsive and has two styles.


e.g

var message = $(shoutbox_type+'#shoutbox input.textbox').val();

-->

var message = $('#shoutbox input.textbox').val();

---

(2023-01-11, 09:11 AM)Infinimonster Wrote: [ -> ]Looks good so far however in my opinion the shoutbox is too small (after using inspect elements, i noticed it's the height of 160px which i want to increase however i did not found where i can do so. 160px is nowhere set in the style.txt provided. Please help me with this case

Sincerely,
Infinimonster

Admin CP -> Configuration -> DVZ Shoutbox (Plugin Settings) -> Shoutbox height



http://i.imgur.com/jL48GJg.png

Somehow managed to add Emojis to message styling


https://i.imgur.com/ueWkhKu.gif