mqttpublish_navbar.jinja2

<a href="javascript:void(0)" title="MQTTPublish" class="dropdown-toggle" data-toggle="dropdown" data-bind="visible: loginStateViewModel.loggedIn()"><i class="icon fa" data-bind="css: settingsViewModel.settings.plugins.mqttpublish.icon()"></i><span class="caret" data-bind="visible: loginStateViewModel.loggedIn()" style="display: none;"></span></a>
<div id="mqttpublishbuttonpanel" class="dropdown-menu">
	<div class="row-fluid" data-bind="foreach: groupedTopics">
		<div class="row-fluid">
			<div class="btn-group" data-bind="foreach: $data" style="padding: 3px 7px;">
					<button type="button" class="btn btn-default" data-bind="click: $root.mqttpublishClick,  attr: {title: topic}"><span class="icon fa" style="vertical-align: middle; width: 20px;" aria-hidden="true" data-bind="css: [icon(),(($root.processing().indexOf(topic() + '|' + publishcommand()) > -1 ) ? 'icon-spin' : '')].join(' ')"></span> <!--ko text: label()--><!--/ko--></button>
			</div>
		</div>
	</div>
</div>
<div id="mqttpublish_confirm" data-bind="with: selectedTopic" class="modal hide fade">
    <div class="modal-header">
        <a href="#" class="close" data-dismiss="modal" aria-hidden="true">&times;</a>
        <h3>MQTTPublish</h3>
    </div>
    <div class="modal-body">
        <p>
            Continue sending message <i data-bind="text: publishcommand"></i> to topic <i data-bind="text: topic()"></i>? 
        </p>
    </div>
    <div class="modal-footer">
        <a href="#" class="btn" data-dismiss="modal" aria-hidden="true" data-bind="click: $root.cancelClick">{{ _('Cancel') }}</a>
        <a href="#" class="btn btn-danger" data-bind="click: $root.sendMQTTmessage">{{ _('Proceed') }}</a>
    </div>
</div>