From 4a296d512568a9e05f3d7981d02b95ee6c9f7f73 Mon Sep 17 00:00:00 2001
From: Luke Pulverenti <luke.pulverenti@gmail.com>
Date: Sun, 21 Aug 2016 14:40:38 -0400
Subject: [PATCH] remove more paper inputs

---
 dashboard-ui/dlnasettings.html    | 95 ++++++++++++++++---------------
 dashboard-ui/librarysettings.html | 32 +++++------
 dashboard-ui/scripts/site.js      |  2 +-
 3 files changed, 66 insertions(+), 63 deletions(-)

diff --git a/dashboard-ui/dlnasettings.html b/dashboard-ui/dlnasettings.html
index 8dd653117c..be27b1d398 100644
--- a/dashboard-ui/dlnasettings.html
+++ b/dashboard-ui/dlnasettings.html
@@ -1,54 +1,59 @@
-<div id="dlnaSettingsPage" data-role="page" class="page type-interior withTabs" data-helpurl="https://github.com/MediaBrowser/Wiki/wiki/Play%20to" data-require="jqmlistview,scripts/dlnasettings,paper-input,paper-checkbox,emby-button">
+<div id="dlnaSettingsPage" data-role="page" class="page type-interior withTabs" data-helpurl="https://github.com/MediaBrowser/Wiki/wiki/Play%20to" data-require="scripts/dlnasettings,emby-select,emby-input,paper-checkbox,emby-button">
 
     <div data-role="content">
         <div class="content-primary">
 
             <form class="dlnaSettingsForm">
 
-                <ul data-role="listview" class="ulForm">
-                    <li>
-                        <paper-checkbox type="checkbox" id="chkEnablePlayTo">${LabelEnableDlnaPlayTo}</paper-checkbox>
-                        <div class="fieldDescription paperCheckboxFieldDescription">${LabelEnableDlnaPlayToHelp}</div>
-                    </li>
-                    <li>
-                        <paper-checkbox type="checkbox" id="chkEnableDlnaDebugLogging">${LabelEnableDlnaDebugLogging}</paper-checkbox>
-                        <div class="fieldDescription paperCheckboxFieldDescription">${LabelEnableDlnaDebugLoggingHelp}</div>
-                    </li>
-                    <li>
-                        <paper-input type="number" id="txtClientDiscoveryInterval" min="1" max="300" label="${LabelEnableDlnaClientDiscoveryInterval}"></paper-input>
-                        <div class="fieldDescription">${LabelEnableDlnaClientDiscoveryIntervalHelp}</div>
-                    </li>
-                </ul>
-                <ul data-role="listview" class="ulForm">
-                    <li>
-                        <paper-checkbox id="chkEnableServer">${LabelEnableDlnaServer}</paper-checkbox>
-                        <div class="fieldDescription paperCheckboxFieldDescription">${LabelEnableDlnaServerHelp}</div>
-                    </li>
-                    <li>
-                        <paper-checkbox id="chkBlastAliveMessages">${LabelEnableBlastAliveMessages}</paper-checkbox>
-                        <div class="fieldDescription paperCheckboxFieldDescription">${LabelEnableBlastAliveMessagesHelp}</div>
-                    </li>
-                    <li>
-                        <paper-input type="number" id="txtBlastInterval" min="1" max="300" label="${LabelBlastMessageInterval}"></paper-input>
-                        <div class="fieldDescription">${LabelBlastMessageIntervalHelp}</div>
-                    </li>
-                    <li>
-                        <label for="selectUser" class="selectLabel">${LabelDefaultUser}</label>
-                        <select id="selectUser" data-mini="true"></select>
-                        <div class="fieldDescription">${LabelDefaultUserHelp}</div>
-                    </li>
-                    <li>
-                        <paper-checkbox id="chkEnableMovieFolders">${LabelEnableEnhancedMovies}</paper-checkbox>
-                        <div class="fieldDescription paperCheckboxFieldDescription">${LabelEnableEnhancedMoviesHelp}</div>
-                    </li>
-                </ul>
-                <ul data-role="listview" class="ulForm">
-                    <li>
-                        <button is="emby-button" type="submit" class="raised submit block">
-                            <i class="md-icon">check</i><span>${ButtonSave}</span>
-                        </button>
-                    </li>
-                </ul>
+                <div>
+                    <paper-checkbox type="checkbox" id="chkEnablePlayTo">${LabelEnableDlnaPlayTo}</paper-checkbox>
+                    <div class="fieldDescription paperCheckboxFieldDescription">${LabelEnableDlnaPlayToHelp}</div>
+                </div>
+                <br />
+                <br />
+                <div>
+                    <paper-checkbox type="checkbox" id="chkEnableDlnaDebugLogging">${LabelEnableDlnaDebugLogging}</paper-checkbox>
+                    <div class="fieldDescription paperCheckboxFieldDescription">${LabelEnableDlnaDebugLoggingHelp}</div>
+                </div>
+                <br />
+                <br />
+                <div class="inputContainer">
+                    <input is="emby-input" type="number" id="txtClientDiscoveryInterval" min="1" max="300" label="${LabelEnableDlnaClientDiscoveryInterval}"/>
+                    <div class="fieldDescription">${LabelEnableDlnaClientDiscoveryIntervalHelp}</div>
+                </div>
+                <br />
+                <div>
+                    <paper-checkbox id="chkEnableServer">${LabelEnableDlnaServer}</paper-checkbox>
+                    <div class="fieldDescription paperCheckboxFieldDescription">${LabelEnableDlnaServerHelp}</div>
+                </div>
+                <br />
+                <div>
+                    <paper-checkbox id="chkBlastAliveMessages">${LabelEnableBlastAliveMessages}</paper-checkbox>
+                    <div class="fieldDescription paperCheckboxFieldDescription">${LabelEnableBlastAliveMessagesHelp}</div>
+                </div>
+                <br />
+                <br />
+                <div class="inputContainer">
+                    <input is="emby-input" type="number" id="txtBlastInterval" min="1" max="300" label="${LabelBlastMessageInterval}"/>
+                    <div class="fieldDescription">${LabelBlastMessageIntervalHelp}</div>
+                </div>
+                <br />
+                <div class="selectContainer">
+                    <select is="emby-select" id="selectUser" data-mini="true" label="${LabelDefaultUser}"></select>
+                    <div class="fieldDescription">${LabelDefaultUserHelp}</div>
+                </div>
+                <br />
+                <div>
+                    <paper-checkbox id="chkEnableMovieFolders">${LabelEnableEnhancedMovies}</paper-checkbox>
+                    <div class="fieldDescription paperCheckboxFieldDescription">${LabelEnableEnhancedMoviesHelp}</div>
+                </div>
+                <br />
+                <br />
+                <div>
+                    <button is="emby-button" type="submit" class="raised submit block">
+                        <i class="md-icon">check</i><span>${ButtonSave}</span>
+                    </button>
+                </div>
             </form>
 
         </div>
diff --git a/dashboard-ui/librarysettings.html b/dashboard-ui/librarysettings.html
index 8cbc3074b8..253de3a1ca 100644
--- a/dashboard-ui/librarysettings.html
+++ b/dashboard-ui/librarysettings.html
@@ -4,9 +4,8 @@
         <div class="content-primary">
             <form class="librarySettingsForm">
 
-                <div class="fldLibraryMonitor hide">
-                    <label for="selectEnableRealtimeMonitor" class="selectLabel">${LabelEnableRealtimeMonitor}</label>
-                    <select id="selectEnableRealtimeMonitor" data-mini="true">
+                <div class="selectContainer fldLibraryMonitor hide">
+                    <select is="emby-select" id="selectEnableRealtimeMonitor" data-mini="true" label="${LabelEnableRealtimeMonitor}">
                         <option value="Auto">${OptionAuto}</option>
                         <option value="Enabled">${OptionYes}</option>
                         <option value="Disabled">${OptionNo}</option>
@@ -15,23 +14,22 @@
                         ${LabelEnableRealtimeMonitorHelp}
                     </div>
                 </div>
-                <br /><br />
-                <div>
-                    <label for="selectDateAdded" class="selectLabel">${LabelDateAddedBehavior}</label>
-                    <select id="selectDateAdded" data-mini="true">
+                <div class="selectContainer">
+                    <select is="emby-select" id="selectDateAdded" data-mini="true" label="${LabelDateAddedBehavior}">
                         <option value="0">${OptionDateAddedImportTime}</option>
                         <option value="1">${OptionDateAddedFileTime}</option>
                     </select>
                     <div class="fieldDescription">${LabelDateAddedBehaviorHelp}</div>
                 </div>
-                <br />
-                <div>
-                    <paper-input id="txtMetadataPath" label="${LabelMetadataPath}" style="width: 85%; display: inline-block;"></paper-input>
-                    <button type="button" is="paper-icon-button-light" id="btnSelectMetadataPath" title="${ButtonSelectDirectory}" class="autoSize"><i class="md-icon">search</i></button>
+                <div class="inputContainer">
+                    <div style="display: flex; align-items: center;">
+                        <div style="flex-grow:1;">
+                            <input is="emby-input" id="txtMetadataPath" label="${LabelMetadataPath}" required="required" autocomplete="off" />
+                        </div>
+                        <button type="button" is="paper-icon-button-light" id="btnSelectMetadataPath" title="${ButtonSelectDirectory}"><i class="md-icon">search</i></button>
+                    </div>
                     <div class="fieldDescription">${LabelMetadataPathHelp}</div>
-                    <br/>
                 </div>
-                <br />
                 <div>
                     <paper-checkbox id="chkSaveMetadataHidden">${OptionSaveMetadataAsHidden}</paper-checkbox>
                     <div class="fieldDescription paperCheckboxFieldDescription">${OptionSaveMetadataAsHiddenHelp}</div>
@@ -88,16 +86,16 @@
 
                 <div is="emby-collapse" title="${HeaderTV}">
                     <div class="collapseContent">
-                        <div>
-                            <paper-input type="text" id="txtSeasonZeroName" label="${LabelSeasonZeroDisplayName}" required></paper-input>
+                        <div class="inputContainer">
+                            <input is="emby-input" type="text" id="txtSeasonZeroName" label="${LabelSeasonZeroDisplayName}" required />
                         </div>
                     </div>
                 </div>
 
                 <div is="emby-collapse" title="Fanart.tv">
                     <div class="collapseContent">
-                        <div>
-                            <paper-input type="text" id="txtFanartApiKey" label="${LabelFanartApiKey}"></paper-input>
+                        <div class="inputContainer">
+                            <input is="emby-input" type="text" id="txtFanartApiKey" label="${LabelFanartApiKey}" />
                             <div class="fieldDescription">${LabelFanartApiKeyHelp}</div>
                             <div class="fieldDescription"><a href="https://fanart.tv/2015/01/personal-api-keys" target="_blank">${ButtonLearnMore}</a></div>
                         </div>
diff --git a/dashboard-ui/scripts/site.js b/dashboard-ui/scripts/site.js
index a7fe7b3832..bb3566360f 100644
--- a/dashboard-ui/scripts/site.js
+++ b/dashboard-ui/scripts/site.js
@@ -2168,7 +2168,7 @@ var AppInfo = {};
 
         defineRoute({
             path: '/librarysettings.html',
-            dependencies: ['emby-collapse', 'emby-input', 'paper-checkbox', 'emby-button'],
+            dependencies: ['emby-collapse', 'emby-input', 'paper-checkbox', 'emby-button', 'emby-select'],
             autoFocus: false,
             roles: 'admin',
             controller: 'scripts/librarysettings'