<commit_before><!--
@license
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
-->

<link rel="import" href="../bower_components/polymer/polymer.html">
<link rel="import" href="../bower_components/paper-styles/typography.html">
<script src="../scripts/data-service.js"></script>

<dom-module id="ooyala-campaigns">
  <template>
    <style>
      :host {
        display: block;
        padding: 10px;
      }
      #data-selection {
        margin-left: 25px;
        margin-right: 25px;

        @apply(--layout-horizontal);
        @apply(--layout-justified);
      }

      #campaign-selection, #goal-selection {
        margin-right: 20px;
      }

      #type-selection {
        margin-top: 20px;
      }

      h1 { margin-left: 25px; }

      .card .instruction { text-align: center; }

    </style>

    <h1>Campaigns</h1>

    <div id="data-selection">
      <div>
        <paper-dropdown-menu label="Select Campaign" id="campaign-selection" disabled="{{isCampaignSelectionDisabled}}">
          <paper-listbox class="dropdown-content">
            <template is="dom-repeat" items="{{campaignNames}}">
              <paper-item>{{item}}</paper-item>
            </template>
          </paper-listbox>
        </paper-dropdown-menu>

        <paper-dropdown-menu label="Select Goal" id="goal-selection" disabled="{{isGoalSelectionDisabled}}">
          <paper-listbox class="dropdown-content">
            <template is="dom-repeat" items="{{goalNames}}">
              <paper-item>{{item}}</paper-item>
            </template>
          </paper-listbox>
        </paper-dropdown-menu>
      </div>

      <paper-radio-group id="type-selection">
        <paper-radio-button name="daily" disabled="{{isDataSelectionDisabled}}">Daily Totals</paper-radio-button>
        <paper-radio-button name="running" disabled="{{isDataSelectionDisabled}}">Running Totals</paper-radio-button>
      </paper-radio-group>
    </div>

    <div class="card" hidden$="{{hideInstruction}}">
      <p class="instruction">Please make your selection from above...</p>
    </div>

    <ooyala-bar-chart data-points="{{dataPoints}}"></ooyala-bar-chart>

  </template>

  <script>
    (function() {
      'use strict';

      Polymer({
        is: 'ooyala-campaigns',

        properties: {
          campaignDataUrl: String,
        },

        hideInstruction: false,

        ready: function() {

          let dataService = new window.OOYALA.DataService(this.campaignDataUrl);

          var that = this;

          that.isCampaignSelectionDisabled = true;
          that.isGoalSelectionDisabled = true;
          that.isDataSelectionDisabled = true;

          that.selectedCampaign = null;
          that.selectedGoal = null;
          that.selectedDataType = null;

          dataService.getCampaigns()
              .then(function (campaigns) {
                  that.campaignNames = campaigns.map(c => c.name);

                  let campaignSelection = document.getElementById("campaign-selection"),
                      goalSelection = document.getElementById("goal-selection"),
                      dataSelection = document.getElementById("type-selection");

                  campaignSelection.addEventListener("iron-select", function (e) {
                    let selectedCampaignName = e.detail.item.innerText;

                    that.selectedCampaign = campaigns.find(c => c.name === selectedCampaignName);

                    that.goalNames = that.selectedCampaign["goals"].map(g => g.name);
                    that.isGoalSelectionDisabled = false;
                    goalSelection.contentElement.selected = null;
                    that.isDataSelectionDisabled = true;
                    dataSelection.selected = null;
                  });

                  goalSelection.addEventListener("iron-select", function (e) {
                    let selectedGoalName = e.detail.item.innerText;

                    that.selectedGoal = that.selectedCampaign["goals"].find(c => c.name === selectedGoalName);
                    that.isDataSelectionDisabled = false;
                    dataSelection.selected = null;

                  });

                  dataSelection.addEventListener("iron-select", function (e) {
                    that.selectedDataType = e.detail.item.name === "daily" ?  "dailyDataPoints" : "runningDataPoints";
                    that.dataPoints = that.selectedGoal[that.selectedDataType];
                    that.hideInstruction = true;
                    that.hideChart = false;
                  });<commit_msg>made default data point selection when campaign selection has changed<commit_after><!--
@license
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
-->

<link rel="import" href="../bower_components/polymer/polymer.html">
<link rel="import" href="../bower_components/paper-styles/typography.html">
<script src="../scripts/data-service.js"></script>

<dom-module id="ooyala-campaigns">
  <template>
    <style>
      :host {
        display: block;
        padding: 10px;
      }
      #data-selection {
        margin-left: 25px;
        margin-right: 25px;

        @apply(--layout-horizontal);
        @apply(--layout-justified);
      }

      #campaign-selection, #goal-selection {
        margin-right: 20px;
      }

      #type-selection {
        margin-top: 20px;
      }

      h1 { margin-left: 25px; }

      .card .instruction { text-align: center; }

    </style>

    <h1>Campaigns</h1>

    <div id="data-selection">
      <div>
        <paper-dropdown-menu label="Select Campaign" id="campaign-selection" disabled="{{isCampaignSelectionDisabled}}">
          <paper-listbox class="dropdown-content">
            <template is="dom-repeat" items="{{campaignNames}}">
              <paper-item>{{item}}</paper-item>
            </template>
          </paper-listbox>
        </paper-dropdown-menu>

        <paper-dropdown-menu label="Select Goal" id="goal-selection" disabled="{{isGoalSelectionDisabled}}">
          <paper-listbox class="dropdown-content">
            <template is="dom-repeat" items="{{goalNames}}">
              <paper-item>{{item}}</paper-item>
            </template>
          </paper-listbox>
        </paper-dropdown-menu>
      </div>

      <paper-radio-group id="type-selection">
        <paper-radio-button name="daily" disabled="{{isDataSelectionDisabled}}">Daily Totals</paper-radio-button>
        <paper-radio-button name="running" disabled="{{isDataSelectionDisabled}}">Running Totals</paper-radio-button>
      </paper-radio-group>
    </div>

    <div class="card" hidden$="{{hideInstruction}}">
      <p class="instruction">Please make your selection from above...</p>
    </div>

    <ooyala-bar-chart data-points="{{dataPoints}}"></ooyala-bar-chart>

  </template>

  <script>
    (function() {
      'use strict';

      Polymer({
        is: 'ooyala-campaigns',

        properties: {
          campaignDataUrl: String,
        },

        hideInstruction: false,

        ready: function() {

          let dataService = new window.OOYALA.DataService(this.campaignDataUrl);

          var that = this;

          that.isCampaignSelectionDisabled = true;
          that.isGoalSelectionDisabled = true;
          that.isDataSelectionDisabled = true;

          that.selectedCampaign = null;
          that.selectedGoal = null;
          that.selectedDataType = null;

          dataService.getCampaigns()
              .then(function (campaigns) {
                  that.campaignNames = campaigns.map(c => c.name);

                  let campaignSelection = document.getElementById("campaign-selection"),
                      goalSelection = document.getElementById("goal-selection"),
                      dataSelection = document.getElementById("type-selection");

                  campaignSelection.addEventListener("iron-select", function (e) {
                    let selectedCampaignName = e.detail.item.innerText;

                    that.selectedCampaign = campaigns.find(c => c.name === selectedCampaignName);

                    that.goalNames = that.selectedCampaign["goals"].map(g => g.name);
                    that.isGoalSelectionDisabled = false;
                    goalSelection.contentElement.selected = null;
                    that.isDataSelectionDisabled = true;
                    dataSelection.selected = null;
                  });

                  goalSelection.addEventListener("iron-select", function (e) {
                    let selectedGoalName = e.detail.item.innerText;

                    that.selectedGoal = that.selectedCampaign["goals"].find(c => c.name === selectedGoalName);

                    if (dataSelection.selected) {
                      that.selectedDataType = dataSelection.selected === "daily" ?  "dailyDataPoints" : "runningDataPoints";

                      that.dataPoints = that.selectedGoal[that.selectedDataType];

                    } else {
                      that.isDataSelectionDisabled = false;
                    }

                  });

                  dataSelection.addEventListener("iron-select", function (e) {
                    that.selectedDataType = e.detail.item.name === "daily" ?  "dailyDataPoints" : "runningDataPoints";
                    that.dataPoints = that.selectedGoal[that.selectedDataType];
                    that.hideInstruction = true;
                  });
{'fraction_non_alphanumeric': 0.12568252730109206, 'fraction_numerical': 0.0037051482059282373, 'mean_word_length': 2.1863932898415657, 'pattern_counts': {'":': 0, '<': 93, '<?xml version=': 0, '>': 101, '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': '2743993', 'n_tokens_mistral': 2822, 'n_tokens_neox': 2615, 'n_words': 537}