jellyfin-plugin-webhook/Jellyfin.Plugin.Webhook/Configuration/Web/config.html

376 lines
16 KiB
HTML

<div data-role="page" id="webhookConfigurationPage" class="page type-interior pluginConfigurationPage fullWidthContent"
data-controller="__plugin/Webhook.js">
<div class="content-primary">
<div class="verticalSection">
<div class="sectionTitleContainer">
<h2 class="sectionTitle">Webhook</h2>
<a is="emby-linkbutton" class="raised raised-mini" style="margin-left: 2em;" target="_blank"
href="https://github.com/crobibero/jellyfin-plugin-webhook">
<i class="md-icon button-icon button-icon-left secondaryText"></i>
<span>Help</span>
</a>
</div>
</div>
<form class="webhookConfigurationForm">
<div class="inputContainer">
<input is="emby-input" type="text" id="txtServerUrl" required="required" label="Server Url:" />
<span>For linking to content. Include base url.</span>
</div>
<button id="btnAddDiscord" is="emby-button" type="button" class="raised button block">
<span>Add Discord Destination</span>
</button>
<button id="btnAddGeneric" is="emby-button" type="button" class="raised button block">
<span>Add Generic Destination</span>
</button>
<button id="btnAddGenericForm" is="emby-button" type="button" class="raised button block">
<span>Add Generic Form Destination</span>
</button>
<button id="btnAddGotify" is="emby-button" type="button" class="raised button block">
<span>Add Gotify Destination</span>
</button>
<button id="btnAddPushbullet" is="emby-button" type="button" class="raised button block">
<span>Add Pushbullet Destination</span>
</button>
<button id="btnAddPushover" is="emby-button" type="button" class="raised button block">
<span>Add Pushover Destination</span>
</button>
<button id="btnAddSlack" is="emby-button" type="button" class="raised button block">
<span>Add Slack Destination</span>
</button>
<button id="btnAddSmtp" is="emby-button" type="button" class="raised button block">
<span>Add SMTP Destination</span>
</button>
<button id="btnAddMqtt" is="emby-button" type="button" class="raised button block">
<span>Add MQTT Destination</span>
</button>
<br />
<div id="configurationWrapper"></div>
<br />
<button id="saveConfig" is="emby-button" type="submit" class="raised button-submit block">
<span>Save</span>
</button>
</form>
</div>
<template id="template-notification-type">
<label class="checkboxContainer">
<input is="emby-checkbox" type="checkbox" data-name="notificationTypeValue"/>
<span data-name="notificationTypeName"></span>
</label>
</template>
<template id="template-user-filter">
<label class="checkboxContainer">
<input is="emby-checkbox" type="checkbox" data-name="userFilterValue"/>
<span data-name="userFilterName"></span>
</label>
</template>
<template id="template-base">
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtWebhookName" required="required" label="Webhook Name:"/>
<span>The webhook name (for display only)</span>
</div>
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtWebhookUri" required="required" label="Webhook Url:"/>
<span>The webhook destination url</span>
</div>
<div class="inputContainer">
<label>Status:</label>
<label class="checkboxContainer">
<input is="emby-checkbox" type="checkbox" data-name="chkEnableWebhook"/>
<span>Enable</span>
</label>
</div>
<div>
<label>Notification Type:</label>
<div data-name="notificationTypeContainer">
</div>
</div>
<div>
<label>User Filter:</label>
<div data-name="userFilterContainer">
</div>
</div>
<div>
<label>Item Type:</label>
<label class="checkboxContainer">
<input is="emby-checkbox" type="checkbox" data-name="chkEnableMovies"/>
<span>Movies</span>
</label>
<label class="checkboxContainer">
<input is="emby-checkbox" type="checkbox" data-name="chkEnableEpisodes"/>
<span>Episodes</span>
</label>
<label class="checkboxContainer">
<input is="emby-checkbox" type="checkbox" data-name="chkEnableSeasons"/>
<span>Season</span>
</label>
<label class="checkboxContainer">
<input is="emby-checkbox" type="checkbox" data-name="chkEnableSeries"/>
<span>Series</span>
</label>
<label class="checkboxContainer">
<input is="emby-checkbox" type="checkbox" data-name="chkEnableAlbums"/>
<span>Albums</span>
</label>
<label class="checkboxContainer">
<input is="emby-checkbox" type="checkbox" data-name="chkEnableSongs"/>
<span>Songs</span>
</label>
<label class="checkboxContainer">
<input is="emby-checkbox" type="checkbox" data-name="chkEnableVideos"/>
<span>Videos</span>
</label>
<label class="checkboxContainer">
<input is="emby-checkbox" type="checkbox" data-name="chkSendAllProperties"/>
<span>Send All Properties (ignores template)</span>
</label>
<label class="checkboxContainer">
<input is="emby-checkbox" type="checkbox" data-name="chkTrimWhitespace"/>
<span>Trim leading and trailing whitespace from message body before sending</span>
</label>
<label class="checkboxContainer">
<input is="emby-checkbox" type="checkbox" data-name="chkSkipEmptyMessageBody"/>
<span>Do not send when message body is empty</span>
</label>
</div>
<div class="inputContainer">
<label>Template:</label>
<div>
<textarea data-name="txtTemplate" style="width: 100%; height: 400px"></textarea>
</div>
</div>
</template>
<template id="template-discord">
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtAvatarUrl" label="Avatar Url:"/>
</div>
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtUsername" label="Webhook Username:"/>
</div>
<div class="selectContainer">
<select is="emby-select" data-name="ddlMentionType" label="Mention Type:">
<option value="Everyone">@everyone</option>
<option value="Here">@here</option>
<option value="None">None</option>
</select>
</div>
<div class="inputContainer">
<label>Embed Color</label>
<input type="color" data-name="EmbedColor" is="emby-input" style="height: 2.2em;"/>
<input type="text" is="emby-input" data-name="txtEmbedColor"/>
</div>
</template>
<template id="template-gotify">
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtToken" label="Token:"/>
</div>
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtPriority" label="Priority:"/>
</div>
</template>
<template id="template-pushover">
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtToken" label="Token:"/>
</div>
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtUserToken" label="User Token:"/>
</div>
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtDevice" label="Device:"/>
</div>
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtTitle" label="Title:"/>
</div>
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtMessageUrl" label="Message Url:"/>
</div>
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtMessageUrlTitle" label="Message Url Title:"/>
</div>
<div class="selectContainer">
<select is="emby-select" data-name="ddlMessagePriority" label="Message Priority:">
<option value="-2">Lowest Priority</option>
<option value="-1">Low Priority</option>
<option value="0">Normal</option>
<option value="1">High Priority</option>
<option value="2">Emergency Priority</option>
</select>
</div>
<div class="selectContainer">
<select is="emby-select" data-name="ddlNotificationSound" label="Notification Sound:">
<option value="">User default</option>
<option value="pushover">Pushover (default)</option>
<option value="bike">Bike</option>
<option value="bugle">Bugle</option>
<option value="cashregister">Cash Register</option>
<option value="classical">Classical</option>
<option value="cosmic">Cosmic</option>
<option value="falling">Falling</option>
<option value="gamelan">Gamelan</option>
<option value="incoming">Incoming</option>
<option value="intermission">Intermission</option>
<option value="magic">Magic</option>
<option value="mechanical">Mechanical</option>
<option value="pianobar">Piano Bar</option>
<option value="siren">Siren</option>
<option value="spacealarm">Space Alarm</option>
<option value="tugboat">Tug Boat</option>
<option value="alien">Alien Alarm (long)</option>
<option value="climb">Climb (long)</option>
<option value="persistent">Persistent (long)</option>
<option value="echo">Pushover Echo (long)</option>
<option value="updown">Up Down (long)</option>
<option value="vibrate">Vibrate Only</option>
<option value="none">None (silent)</option>
</select>
</div>
</template>
<template id="template-generic">
<button data-name="btnAddHeader" is="emby-button" type="button" class="raised button block">
<span>Add Request Header</span>
</button>
<div data-name="header-wrapper"></div>
<button data-name="btnAddField" is="emby-button" type="button" class="raised button block">
<span>Add Field</span>
</button>
<div data-name="field-wrapper"></div>
</template>
<template id="template-generic-form">
<button data-name="btnAddHeader" is="emby-button" type="button" class="raised button block">
<span>Add Request Header</span>
</button>
<div data-name="header-wrapper"></div>
<button data-name="btnAddField" is="emby-button" type="button" class="raised button block">
<span>Add Field</span>
</button>
<div data-name="field-wrapper"></div>
</template>
<template id="template-generic-value">
<div class="inputContainer" data-name="value">
<input is="emby-input" type="text" data-name="txtKey" label="Key:"/>
<input is="emby-input" type="text" data-name="txtValue" label="Value:"/>
</div>
</template>
<template id="template-generic-form-value">
<div class="inputContainer" data-name="value">
<input is="emby-input" type="text" data-name="txtKey" label="Key:"/>
<input is="emby-input" type="text" data-name="txtValue" label="Value:"/>
</div>
</template>
<template id="template-smtp">
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtSenderAddress" label="Sender Address:"/>
</div>
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtReceiverAddress" label="Receiver Address:"/>
</div>
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtSmtpServer" label="SMTP Server Address:"/>
</div>
<div class="inputContainer">
<input is="emby-input" type="number" data-name="txtSmtpPort" label="SMTP Port:"/>
</div>
<label class="checkboxContainer">
<input is="emby-checkbox" type="checkbox" data-name="chkUseCredentials"/>
<span>Use Credentials</span>
</label>
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtUsername" label="Username:"/>
</div>
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtPassword" label="Password:"/>
</div>
<label class="checkboxContainer">
<input is="emby-checkbox" type="checkbox" data-name="chkUseSsl"/>
<span>Use SSL</span>
</label>
<label class="checkboxContainer">
<input is="emby-checkbox" type="checkbox" data-name="chkIsHtml"/>
<span>Is Html Body</span>
</label>
<div class="inputContainer">
<label>Subject Template:</label>
<div>
<textarea data-name="txtSubjectTemplate" style="width: 100%; height: 400px"></textarea>
</div>
</div>
</template>
<template id="template-mqtt">
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtMqttServer" label="MQTT Server:" />
</div>
<div class="inputContainer">
<input is="emby-input" type="number" data-name="txtMqttPort" label="MQTT Port (default is 1883):" />
</div>
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtTopic" label="Topic:" />
</div>
<label class="checkboxContainer">
<input is="emby-checkbox" type="checkbox" data-name="chkUseCredentials" />
<span>Use Credentials</span>
</label>
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtUsername" label="Username:" />
</div>
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtPassword" label="Password:" />
</div>
<label class="checkboxContainer">
<input is="emby-checkbox" type="checkbox" data-name="chkUseTls" />
<span>Use TLS</span>
</label>
<div class="selectContainer">
<select is="emby-select" data-name="ddlQosLevel" label="Quality of Service:">
<option value="AtMostOnce">At Most Once</option>
<option value="AtLeastOnce">At Least Once</option>
<option value="ExactlyOnce">Exactly Once</option>
</select>
</div>
</template>
<template id="template-pushbullet">
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtToken" label="Token:"/>
</div>
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtDeviceId" label="Device Id:"/>
</div>
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtChannel" label="Channel:"/>
</div>
</template>
<template id="template-slack">
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtUsername" label="Display Name:"/>
</div>
<div class="inputContainer">
<input is="emby-input" type="text" data-name="txtIconUrl" label="Icon Url:"/>
</div>
</template>
<style>
.checkboxContainer {
max-width: fit-content;
}
#embedColor:hover {
cursor: pointer;
}
</style>
</div>