<style>
div.ex3 {
    width: 100%;
    height: 300px;
    overflow: auto;
}
</style>

[% if $popup %]
    <script type="text/javascript" src="includes/js/ajax.js"></script>
    <script type="text/javascript" src="modules/start/bs_js/shoutbox.js"></script>
[% /if %]

<style>

</style>
<div class="card panel-info shadow-sm rounded">
    <div class="card-header handle">    
        <div class="row">
            <div class="col-6">
        <h3 class="card-title">[% $user->gettext('Shoutbox') %] </h3>        
            </div>
            <div class="col-6 text-end">                
                    <a href="Javascript:void(0);" class="btn btn-outline-primary btn-sm pull-right" data-toggle="tooltip" title="[% $user->gettext('Shoutbox in separaten Fenster öffnen') %]" onclick="window.open('index.php?module=start&class=shoutbox&event=popupshout', 'Shoutbox', 'width=290,height=430,dependent=yes,location=no,menubar=no,scrollbars=no,status=no,toolbar=no,resizable=no');">
                        <span class="fa fa-window-maximize"></span>
                    </a>
            </div>            
        </div>
        
    </div>
    <div class="card-body">
        <div class="card panel-info shadow-sm rounded">
            <div class="card-body ex3" id="shoutbox">
                
            </div>
        </div> 
        <div id="shoutboxform">
            <form method="post" class="form form-inline">
                <div class="row">
                    <div class="col-sm-12">
                <div class="form-group row mb-3" style="width: 100%;">
                    <div class="input-group" style="width: 100%;">
                        <input type="text" name="shoutmessage" id="shoutmessage" placeholder="[% $user->gettext('Ihre Nachricht') %]" class="form-control" onkeyup="shoutboxEvent(event)" />    
                            <button class="btn btn-outline-secondary" type="button" onclick="sendShoutboxMessage();">[% $user->gettext('Senden') %]</button>
                            [% if $smarty.const.BOTACTIVE == 1 %]
                            <button class="btn btn-outline-success" type="button" onclick="askTheBot();">[% $user->gettext('Frag den Bot') %]</button>
                            [% /if %]
                    </div>
                </div>
                [% if false && $user->inGroup(1) %]
                    
                        <button class="btn btn-outline-primary pull-right" onclick="$('#shoutmessage').val(':clear:');sendShoutboxMessage();">[% $user->gettext('Shoutbox leeren') %]</button>
                    
                [% /if %]     
                </div>
                </div>
            </form>
        </div>
    </div>
</div> 

<script>
    getShoutboxEntries();
    var shoutbox = window.setInterval("getShoutboxEntries(\"\")", 9000);
</script>

