<commit_before><link rel="import" href="/bower_components/polymer/polymer-element.html">
<link rel="import" href="/bower_components/polymer/lib/elements/dom-repeat.html">

<link rel="import" href="/bower_components/iron-icon/iron-icon.html">
<link rel="import" href="/bower_components/iron-icons/iron-icons.html">

<link rel="import" href="/bower_components/paper-styles/paper-styles.html">
<link rel="import" href="/bower_components/paper-input/paper-input.html">
<link rel="import" href="/bower_components/paper-item/paper-item.html">
<link rel="import" href="/bower_components/paper-item/paper-icon-item.html">
<link rel="import" href="/bower_components/paper-item/paper-item-body.html">

<link rel="import" href="ycons.html">
<link rel="import" href="app-localize-behavior-mixin.html">

<script src="/bower_components/moment/min/moment.min.js"></script>

<dom-module id="yta-search-page">
  <template>
    <style>
      
      :host {
        overflow-y: scroll;
      }

      @media (min-width: 480px) and (max-width: 960px) and (orientation: landscape), (min-width: 0px) and (max-width: 600px) and (orientation: portrait) {
        /* Phone styles */
        
        #search, #results {
          @apply --layout-flex;
          padding: 15px;
          background-color: white;
        }

        .result-card {
          @apply --layout-flex;
          border-bottom: 1px solid var(--divider-color);
          height: 72px;
          padding: 0;
        }
      }

      @media (min-width: 961px) and (orientation: landscape), (min-width: 601px) and (orientation: portrait) {
        /* Other than phone */

        #search, #results {
          margin: 15px auto;
          max-width: 800px;
        }

        .result-card {
          @apply --shadow-elevation-2dp;
          margin: 4px;
          width: 189px;
          height: 100px;
          display: inline-block;
        }
      }

      #search {
        padding-bottom: 24px;
      }

      .result-card {
        background-color: white;
      }

      .paper-secondary-text {
        opacity: var(--dark-secondary-opacity);
      }

      paper-icon-item iron-icon {
        opacity: var(--dark-secondary-opacity);
      }
    
    </style>
    
    <div id="search">
      <paper-input placeholder="[[localize('search')]]" type="search" no-label-float
                   on-change="searchEvent"></paper-input>
    </div>
    <div id="results">
      <template is="dom-repeat" items="[[_results]]">
        <template is="dom-if" if="[[item.isEvent]]">
          <paper-icon-item class="result-card">
            <iron-icon icon="ycons:event" slot="item-icon"></iron-icon>
            <paper-item-body two-line>
              <span>name</span>
              <span secondary>day, hours</span>
            </paper-item-body>
          </paper-icon-item>
        </template>
        <template is="dom-if" if="[[!item.isEvent]]">
          <paper-item class="result-card">
            <paper-item-body three-line>
              <span>
                <span class="paper-secondary-text">[[_readIndex(item.lesson)]]. </span>
                <span>[[item.name]]</span>
              </span>
              <span secondary>[[_displayReadable(item.day, item.startTime, item.endTime)]]</span>
              <span secondary>
                <template is="dom-if" if="[[item.classroom]]">
                  [[localize('setup_in')]] [[item.classroom]] 
                </template>
                <template is="dom-if" if="[[item.teacher]]">
                  [[localize('setup_with')]] [[item.teacher]]
                </template> 
              </span>
            </paper-item-body>
          </paper-item>
        </template>
      </template>
    </div>

  </template>
  
  <script>
    class SearchPage extends Polymer.AppLocalizeBehaviorMixin(Polymer.Element) {
      static get is() { return 'yta-search-page'; }
      static get properties() {
        return {
          
          // Inherited from MainView
          data: {
            type: Object,
            notify: true
          },

          _results: Object
          
        };
      }
      
      constructor() {
        super();
      }

      searchEvent(e) {
        if (this._runningSearch) clearTimeout(this._runningSearch);
        this._runningSearch = setTimeout(() => {
          const data = this.data
          const query = this.shadowRoot.querySelector('#search paper-input').value;
          if (query === '') {
            this._results = [];
            return;
          };
          const results = [];
          data.timetable.forEach((day, dayIndex) => {
            if (day) {
              day.forEach((lesson, lessonIndex) => {
                if (lesson.name.includes(query) || (lesson.teacher && lesson.teacher.includes(query)) || (lesson.classroom && lesson.classroom.includes(query))) {
                  results.push(Object.assign(lesson, {
                    day: dayIndex,
                    lesson: lessonIndex
                  }));
                }
              });
            }
          });
          if (data.events) {
            data.calendar.forEach(event => {
              if (event.name.inlcudes(query)) {
                results.unshift(Object.assign(event, { isEvent: true }));
              }
            });
          }
          this._results = results;
        }, 0);
      }

      _displayReadable(day, startTime, endTime) {
        const firstDayOfWeek = this.parentElement.parentElement.parentNode.host.data.settings.firstDayOfWeek;
        let output = new String();
        switch (firstDayOfWeek) {
          case 1:
            day = day == 6 ? 0 : day + 1;
            break;
          case 6:
            day = day == 0 ? 6 : day - 1;
        }
        return moment().day(day).format('dddd, ') + this._readTime(startTime) + ' - ' + this._readTime(endTime);
      }

      _readTime(time, use12hoursClock = false) {
        const ampm = this.data.settings.use12hoursClock;
        return moment(time).utcOffset(0)
          .format(`${ampm ? 'hh' : 'HH'}:mm${ampm ? ' a' : ''}`);
      }
<commit_msg>Now you can also search through events<commit_after><link rel="import" href="/bower_components/polymer/polymer-element.html">
<link rel="import" href="/bower_components/polymer/lib/elements/dom-repeat.html">

<link rel="import" href="/bower_components/iron-icon/iron-icon.html">
<link rel="import" href="/bower_components/iron-icons/iron-icons.html">

<link rel="import" href="/bower_components/paper-styles/paper-styles.html">
<link rel="import" href="/bower_components/paper-input/paper-input.html">
<link rel="import" href="/bower_components/paper-item/paper-item.html">
<link rel="import" href="/bower_components/paper-item/paper-icon-item.html">
<link rel="import" href="/bower_components/paper-item/paper-item-body.html">

<link rel="import" href="ycons.html">
<link rel="import" href="app-localize-behavior-mixin.html">

<script src="/bower_components/moment/min/moment.min.js"></script>

<dom-module id="yta-search-page">
  <template>
    <style>
      
      :host {
        overflow-y: scroll;
      }

      @media (min-width: 480px) and (max-width: 960px) and (orientation: landscape), (min-width: 0px) and (max-width: 600px) and (orientation: portrait) {
        /* Phone styles */
        
        #search, #results {
          @apply --layout-flex;
          padding: 15px;
          background-color: white;
        }

        .result-card {
          @apply --layout-flex;
          border-bottom: 1px solid var(--divider-color);
          height: 72px;
          padding: 0;
        }
      }

      @media (min-width: 961px) and (orientation: landscape), (min-width: 601px) and (orientation: portrait) {
        /* Other than phone */

        #search, #results {
          margin: 15px auto;
          max-width: 800px;
        }

        .result-card {
          @apply --shadow-elevation-2dp;
          margin: 4px;
          width: 189px;
          height: 100px;
          display: inline-block;
        }
      }

      #search {
        padding-bottom: 24px;
      }

      .result-card {
        background-color: white;
      }

      .paper-secondary-text {
        opacity: var(--dark-secondary-opacity);
      }

      paper-icon-item iron-icon {
        opacity: var(--dark-secondary-opacity);
      }
    
    </style>
    
    <div id="search">
      <paper-input placeholder="[[localize('search')]]" type="search" no-label-float
                   on-change="searchEvent"></paper-input>
    </div>
    <div id="results">
      <template is="dom-repeat" items="[[_results]]">
        <template is="dom-if" if="[[item.isEvent]]">
          <paper-icon-item class="result-card">
            <iron-icon icon="ycons:event" slot="item-icon"></iron-icon>
            <paper-item-body two-line>
              <span>[[item.name]]</span>
              <span secondary>[[_readDate(item.date)]], [[_readLesson(item)]]</span>
            </paper-item-body>
          </paper-icon-item>
        </template>
        <template is="dom-if" if="[[!item.isEvent]]">
          <paper-item class="result-card">
            <paper-item-body three-line>
              <span>
                <span class="paper-secondary-text">[[_readIndex(item.lesson)]]. </span>
                <span>[[item.name]]</span>
              </span>
              <span secondary>[[_displayReadable(item.day, item.startTime, item.endTime)]]</span>
              <span secondary>
                <template is="dom-if" if="[[item.classroom]]">
                  [[localize('setup_in')]] [[item.classroom]] 
                </template>
                <template is="dom-if" if="[[item.teacher]]">
                  [[localize('setup_with')]] [[item.teacher]]
                </template> 
              </span>
            </paper-item-body>
          </paper-item>
        </template>
      </template>
    </div>

  </template>
  
  <script>
    class SearchPage extends Polymer.AppLocalizeBehaviorMixin(Polymer.Element) {
      static get is() { return 'yta-search-page'; }
      static get properties() {
        return {
          
          // Inherited from MainView
          data: {
            type: Object,
            notify: true
          },

          _results: Object
          
        };
      }
      
      constructor() {
        super();
      }

      searchEvent(e) {
        if (this._runningSearch) clearTimeout(this._runningSearch);
        this._runningSearch = setTimeout(() => {
          const data = this.data
          const query = this.shadowRoot.querySelector('#search paper-input').value;
          if (query === '') {
            this._results = [];
            return;
          };
          const results = [];
          data.timetable.forEach((day, dayIndex) => {
            if (day) {
              day.forEach((lesson, lessonIndex) => {
                if (lesson.name.includes(query) || (lesson.teacher && lesson.teacher.includes(query)) || (lesson.classroom && lesson.classroom.includes(query))) {
                  results.push(Object.assign(lesson, {
                    day: dayIndex,
                    lesson: lessonIndex
                  }));
                }
              });
            }
          });
          if (data.events) {
            Object.keys(data.events).forEach(key => {
              if (data.events[key].name.includes(query))
                results.unshift(Object.assign(data.events[key], { isEvent: true }));
            });
          }
          this._results = results;
        }, 0);
      }

      _displayReadable(day, startTime, endTime) {
        const firstDayOfWeek = this.parentElement.parentElement.parentNode.host.data.settings.firstDayOfWeek;
        let output = new String();
        switch (firstDayOfWeek) {
          case 1:
            day = day == 6 ? 0 : day + 1;
            break;
          case 6:
            day = day == 0 ? 6 : day - 1;
        }
        return moment().day(day).format('dddd, ') + this._readTime(startTime) + ' - ' + this._readTime(endTime);
      }

      _readTime(time, use12hoursClock = false) {
        const ampm = this.data.settings.use12hoursClock;
        return moment(time).utcOffset(0)
          .format(`${ampm ? 'hh' : 'HH'}:mm${ampm ? ' a' : ''}`);
      }

      _readDate(date) {
        date = moment(date);
        return date.format('ddd, MMM D YYYY');
      }

      _readLesson(event) {
        const day = moment(event.date).day(),
              index = event.lesson,
              timetable = this.data.timetable[day];
        return timetable ? `${index + 1}. ${timetable[index].name}`
                         : this.localize('add_all-day');
      }

{'fraction_non_alphanumeric': 0.153391167192429, 'fraction_numerical': 0.008123028391167193, 'mean_word_length': 1.818, 'pattern_counts': {'":': 0, '<': 121, '<?xml version=': 0, '>': 129, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3192993', 'n_tokens_mistral': 3890, 'n_tokens_neox': 3717, 'n_words': 652}