[Night Light] CL5: Schedule Settings

chrome/browser/resources/settings/device_page/display.html

 <link rel="import" href="chrome://resources/html/polymer.html">
 
 <link rel="import" href="chrome://resources/html/assert.html">
 <link rel="import" href="chrome://resources/html/cr/ui/focus_without_ink.html">
 <link rel="import" href="chrome://resources/html/i18n_behavior.html">
 <link rel="import" href="chrome://resources/html/md_select_css.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/iron-flex-layout/iron-flex-layout-classes.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-button.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button-light.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-tabs/paper-tabs.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-toggle-button/paper-toggle-button.html">
 <link rel="import" href="display_layout.html">
 <link rel="import" href="display_overscan_dialog.html">
+<link rel="import" href="night_light_slider.html">
+<link rel="import" href="../controls/settings_dropdown_menu.html">
 <link rel="import" href="../controls/settings_slider.html">
 <link rel="import" href="../prefs/prefs_behavior.html">
 <link rel="import" href="../settings_shared_css.html">
 <link rel="import" href="../settings_vars_css.html">
 
 <dom-module id="settings-display">
   <template>
     <style include="settings-shared md-select iron-flex iron-flex-alignment">
      .settings-box.embedded {
        -webkit-margin-start: 20px;
@@ skipping 24 matching lines @@
        -webkit-padding-start: 0
      }
 
      paper-tab {
        text-transform: uppercase;
      }
 
      #controlsDiv > .settings-box:first-of-type {
        border-top: none;
      }
+
+     #nightLightSlider {
+       margin-top: 20px;
+     }
     </style>
     <div class="settings-box first layout vertical self-stretch">
       <h2 class="layout self-start">
         $i18n{displayArrangementTitle}
       </h2>
       <div class="secondary layout self-start"
           hidden="[[!hasMultipleDisplays_(displays)]]">
         $i18n{displayArrangementText}
       </div>
       <display-layout id="displayLayout"
@@ skipping 153 matching lines @@
           <div class="start textarea" id="colorTemperatureLabel">
             $i18n{displayNightLightTemperatureLabel}
           </div>
           <settings-slider id="colorTemperatureSlider"
               aria-labelledby="colorTemperatureLabel" min="0" max="100"
               scale="100" label-min="$i18n{displayNightLightTempSliderMinLabel}"
               label-max="$i18n{displayNightLightTempSliderMaxLabel}"
               pref="{{prefs.ash.night_light.color_temperature}}">
           </settings-slider>
         </div>
+        <!-- Schedule settings -->
+        <div class="settings-box embedded">
+          <div id="nightLightScheduleLabel" class="start textarea">
+            $i18n{displayNightLightScheduleLabel}
+          </div>
+          <settings-dropdown-menu
+              id="nightLightScheduleTypeDropDown"
+              lable="$i18n{displayNightLightScheduleLabel}"

[stevenjb, 2017/06/09 22:51:45]

label= (it doesn't like this is needed/used?)

[afakhry, 2017/06/12 18:07:08]

Done.

+              aria-labelledby="nightLightScheduleLabel"
+              pref="{{prefs.ash.night_light.schedule_type}}"
+              menu-options="[[scheduleTypesList_]]">
+          </settings-dropdown-menu>
+        </div>
+        <!-- Custom schedule slider -->
+        <div class="settings-box embedded continuation">
+          <iron-collapse id="nightLightCustomScheduleCollapse"
+              class="start textarea layout vertical"
+              opened="[[shouldOpenCustomScheduleCollapse_]]">
+            <div class="settings-box embedded continuation">
+              <night-light-slider id="nightLightSlider" prefs="{{prefs}}">
+              </night-light-slider>
+            </div>
+          </iron-collapse>
+        </div>
       </div>
     </template>
 
   </template>
   <script src="display.js"></script>
 </dom-module>