<div class="monks-tokenbar flexcol">
    <div class="dialog-content">
        <form style="height:100%;">
            <div class="flexcol">
                <div class="form-group">
                    <label>{{localize 'MonksTokenBar.RollMode'}}</label>
                    <select id="contestedroll-rollmode">
                        <option value="roll" selected="">{{localize 'MonksTokenBar.PublicRoll'}}</option>
                        <option value="gmroll">{{localize 'MonksTokenBar.PrivateGMRoll'}}</option>
                        <option value="blindroll">{{localize 'MonksTokenBar.BlindGMRoll'}}</option>
                        <option value="selfroll">{{localize 'MonksTokenBar.SelfRoll'}}</option>
                    </select>
                </div>
                <div class="form-group">
                    <label>{{localize 'MonksTokenBar.HideNPCName'}}</label>
                    <input id="contestedroll-hidenpc" type="checkbox" {{#if hidenpcname}}checked{{/if}} />
                </div>
                <div class="form-group sheet">
                    <ol class="items-list inventory-list">
                        <li class="items-header flexrow">
                            <h3 class="item-name flexrow">{{localize 'MonksTokenBar.Actors'}}</h3>
                        </li>

                        <ol class="item-list">
                            <li class="item flexrow " data-item-id="{{item0.token.id}}" draggable="true">
                                <div class="item-name flexrow rollable">
                                    <div class="item-image" style="background-image: url('{{item0.token.data.img}}')"><video width="30" height="30"><source src="{{item0.token.data.img}}" /></video></div>
                                    <h4>
                                        {{item0.token.name}}
                                    </h4>
                                </div>
                                <select class="request-roll" data-type="item0" style="flex:0 0 150px;">
                                    {{#each options}}
                                    {{#if this.groups}}
                                    <optgroup label="{{localize this.text}}">
                                        {{#each this.groups as |name key|}}
                                        <option value="{{../id}}:{{key}}">{{localize name}}</option>
                                        {{/each}}
                                    </optgroup>
                                    {{else}}
                                    <option value="{{this.id}}">{{localize this.text}}</option>
                                    {{/if}}
                                    {{/each}}
                                </select>
                                <div class="item-controls flexrow">
                                    <a class="item-control item-delete" title="{{localize 'MonksTokenBar.DeleteItem'}}" data-type="item0"><i class="fas fa-trash"></i></a>
                                </div>
                            </li>
                        </ol>
                    </ol>
                </div>
                <div class="form-group sheet">
                    <ol class="items-list inventory-list">
                        <li class="items-header flexrow">
                            <h3 class="item-name flexrow">{{localize 'MonksTokenBar.Vs'}}</h3>
                        </li>

                        <ol class="item-list">
                            <li class="item flexrow " data-item-id="{{item1.token.id}}" draggable="true">
                                <div class="item-name flexrow rollable">
                                    <div class="item-image" style="background-image: url('{{item1.token.data.img}}')"><video width="30" height="30"><source src="{{item1.token.data.img}}" /></video></div>
                                    <h4>
                                        {{item1.token.name}}
                                    </h4>
                                </div>
                                <select class="request-roll" data-type="item1" style="flex:0 0 150px;">
                                    {{#each options}}
                                    {{#if this.groups}}
                                    <optgroup label="{{localize this.text}}">
                                        {{#each this.groups as |name key|}}
                                        <option value="{{../id}}:{{key}}">{{localize name}}</option>
                                        {{/each}}
                                    </optgroup>
                                    {{else}}
                                    <option value="{{this.id}}">{{localize  this.text}}</option>
                                    {{/if}}
                                    {{/each}}
                                </select>
                                <div class="item-controls flexrow">
                                    <a class="item-control item-delete" title="{{localize 'MonksTokenBar.DeleteItem'}}" data-type="item1"><i class="fas fa-trash"></i></a>
                                </div>
                            </li>
                        </ol>
                    </ol>
                </div>
            </div>
        </form>
    </div>
    <div class="dialog-buttons">
        <button class="dialog-buttons request" data-button="request">{{localize 'MonksTokenBar.Request'}}</button>
    </div>
</div>
