Skip to content

Commit

Permalink
UI Fixes
Browse files Browse the repository at this point in the history
  • Loading branch information
@chefbennyj1
chefbennyj1 committed Oct 10, 2020
1 parent cb5b195 commit f8507a7
Show file tree
Hide file tree
Showing 5 changed files with 65 additions and 93 deletions.
24 changes: 5 additions & 19 deletions MessageUsers/Api/MessageApi.cs
View file

Large diffs are not rendered by default.

87 changes: 47 additions & 40 deletions MessageUsers/Configuration/MessageConfigPage.html
View file
@@ -1,44 +1,51 @@

<div data-role="page" class="type-interior pluginConfigurationPage MessageConfigPage" data-require="emby-button,emby-input,emby-select,emby-checkbox" data-controller="__plugin/messagePluginConfigurationPageJS">

<div data-role="page" class="type-interior pluginConfigurationPage MessageConfigPage" data-require="emby-button,emby-input,emby-select,emby-checkbox" data-controller="__plugin/messagePluginConfigurationPageJS">
<div class="content-primary">

<form id="mainFormConfig" style="padding-top:8%">

<div class="paperlist" id="pluginThumb" style="display: flex;align-items: center;background: white;height: 41vh; border-radius: 10px; background-size: cover;background-repeat: no-repeat;"></div>

<div class="row">
<h2>Headline:</h2>
<input type="text" is="emby-input" id="header" />
</div>

<div class="row">
<h2>Text:</h2>
<textarea rows="5" style="width:100%" type="text" is="emby-input" id="text" spellcheck="true"></textarea>
<div class="verticalSection verticalSection">
<div class="sectionTitleContainer sectionTitleContainer-cards align-items-center">
<div class="sectionTitleContainer sectionTitleContainer-cards align-items-center">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="55" height="55" viewBox="0 0 25 25" style="fill: lightblue;">
<path d="M20 2H4C2.9 2 2 2.9 2 4V22L6 18H20C21.11 18 22 17.11 22 16V4C22 2.9 21.11 2 20 2M20 16H6L4 18V4H20M17 11H15V9H17M13 11H11V9H13M9 11H7V9H9" ></path>
</svg>
<h2 class="sectionTitle sectionTitle-cards" style="padding-bottom: 2em;">Message</h2>
<hr/>
<div style="padding-top: 2em">

<div class="" style="padding: 2em;">
<div class="detailSectionHeader" style="padding-bottom: 2em">
<h2 style="margin: .6em 0; vertical-align: middle; display: inline-block;">Headline</h2>
<input type="text" class="emby-input" id="header"/>
</div>
</div>
<hr/>
<div class="" style="padding: 2em;">
<div class="detailSectionHeader" style="padding-bottom: 2em">
<h2 style="margin: .6em 0; vertical-align: middle; display: inline-block;">Text</h2>
<textarea rows="5" style="width: 100%" type="text" is="emby-input" id="text" spellcheck="true"></textarea>
</div>
</div>
<hr/>
<div class="" style="padding: 2em;">
<div class="detailSectionHeader" style="padding-bottom: 2em">
<h2 style="margin: .6em 0; vertical-align: middle; display: inline-block;">Recipients:</h2>
<div id="recipients" class="checkboxList paperList checkboxList-paperList">

</div>
</div>
</div>
<hr/>
<div style="padding-top: 2em">
<div class="" style="padding: 2em;">
<button is="emby-button" class="btnTry raised button-submit block emby-button" style="margin: 2em auto; width: 50%;" id="createMessage">Create message</button>
</div>
<h2>Saved Messages:</h2>
<h3>These are messages which have yet to be delivered to users. You can delete these messages.</h3>
<div class="paperlist" data-role="listview" data-inset="true" data-split-icon="delete" id="savedMessages"></div>
</div>

</div>
</div>
</div>


<h2>Recipients:</h2>

<div id="recipients" class="checkboxList paperList checkboxList-paperList">

</div>


<div class="row">
<h2 id="messageId">Message ID:</h2>

</div>

<div class="row">
<button is="emby-button" id="createMessage" type="button" data-theme="b" class="raised button-submit block">Retain Message Until User Login</button>
</div>

<h2>Saved Messages:</h2>
<h3>These are messages which have yet to be delivered to users. You can delete these messages.</h3>
<div class="paperlist" data-role="listview" data-inset="true" data-split-icon="delete" id="savedMessages"></div>
</form>

</div>
</div>
</div>

</div>
45 changes: 13 additions & 32 deletions MessageUsers/Configuration/messagePluginConfigurationPage.js
View file
@@ -1,25 +1,17 @@
define(['loading'],
function (loading) {
define(["require", "loading", "dialogHelper", "formDialogStyle", "emby-checkbox", "emby-select", "emby-toggle"],
function(require, loading, dialogHelper) {

var pluginId = "80c81cfd3a484f6ca146cce1ad31ffd8";



function getUserRecipientHtml(user) {
var html = "";

html += '<div class="listItem sortableOption" >';
html += '<label class="listItemCheckboxContainer emby-checkbox-label" > ';
html += '<input name="' + user.Name + '" type="checkbox" is="emby-checkbox" class="emby-checkbox" data-embycheckbox="true" >';
html += '<span class="checkboxLabel" > ' + user.Name + '</span >';
html += '<span class="emby-checkbox-focushelper" ></span >';
html += '<span class="checkboxOutline" > ';
html += '<i class="md-icon checkboxIcon checkboxIcon-checked" ></i >';
html += '<i class="md-icon checkboxIcon checkboxIcon-unchecked" ></i >';
html += '</span>';
html += '</label> ';

html += '</div></div>';


html += '<div class="inputContainer" style="display: flex;">';
html += '<label style="width: auto;" class="emby-toggle-label">';
html += '<input is="emby-toggle" type="checkbox" id="' + user.Name + '" class="noautofocus emby-toggle emby-toggle-focusring">';
html += '<span class="toggleLabel">' + user.Name + '</span>';
html += '</label>';
html += '</div>';

return html;
};
Expand All @@ -44,25 +36,17 @@
var userListItems = view.querySelectorAll('#recipients input');
for (var i = 0; i < userListItems.length; i++) {
if (userListItems[i].checked)
r.push(userListItems[i].name);
r.push(userListItems[i].id);
}
return r;
}

function loadPageData(view) {

ApiClient.getJSON(ApiClient.getUrl("/MessageHeader")).then(
(imgInfo) => {
view.querySelector("#pluginThumb").style.backgroundImage =
"url('data:image/png;base64," + imgInfo.Image + "')";
});


ApiClient.getPluginConfiguration(pluginId).then(function (config) {

ApiClient.getUsers().then(function (users) {
users.forEach(function (user) {

view.querySelector('#recipients').innerHTML += getUserRecipientHtml(user);
});
});
Expand Down Expand Up @@ -92,8 +76,7 @@
config.Messages.forEach((m) => {
if (m.Id !== e.target.parentElement.id)
messages.push(m);
});

});

config.Messages = messages;

Expand All @@ -108,9 +91,7 @@

});

}


}
});

view.querySelector('#createMessage').addEventListener('click', () => {
Expand Down
2 changes: 0 additions & 2 deletions MessageUsers/Plugin.cs
View file
Expand Up @@ -28,8 +28,6 @@ public Stream GetThumbImage()
var type = GetType();
return type.Assembly.GetManifestResourceStream(type.Namespace + ".thumb.png");
}



public IEnumerable<PluginPageInfo> GetPages() => new[]
{
Expand Down
Binary file added MessageUsers/Thumbs.db
View file
Binary file not shown.

0 comments on commit f8507a7

Please sign in to comment.