<commit_before><link rel="import" href="popcorn.html">
<polymer-element name="ceci-media" attributes="url autoplay starttime volume" volume=".5" extends="ceci-element">
  <ceci-definition>
    {
      "tags": ["media", "audio", "video", "youtube", "popcorn", "soundcloud"],
      "name": "Media Player",
      "thumbnail": "./thumbnail.png",
      "description": "Plays HTML5 media using the PopcornJS library.",
      "broadcasts": {
        "tick": {
          "label": "Tick",
          "description": "Media time progressed."
        },
        "ready": {
          "label": "Ready",
          "description": "Media is ready to play."
        },
        "ended": {
          "label": "Ended",
          "description": "Media reached its end."
        },
        "playing": {
          "label": "Playing",
          "description": "Media started to play."
        }
      },
      "listeners": {
        "play": {
          "label": "Start",
          "description": "Starts the selected media"
        },
        "pause": {
          "label": "Stop",
          "description": "Stops the selected media"
        },
        "rewind": {
          "label": "Rewind",
          "description": "Starts media from the beginning."
        }
      },
      "attributes": {
        "starttime": {
          "label": "Start Time",
          "description": "The desired starting point in the selected media.",
          "editable": "number",
          "listener": true
        },
        "url": {
          "label": "Media URL",
          "description": "Web URL for the desired media.",
          "editable": "text",
          "listener": true
        },
        "volume": {
          "label": "Volume",
          "editable": "range",
          "min" : 0,
          "max" : 1,
          "step" : ".01"
        },
        "autoplay": {
          "label": "Play Automatically",
          "description": "Play the media as soon as its ready",
          "editable": "boolean"
        }
      }
    }
  </ceci-definition>
  <template>
    <style>
      :host {
        display: block;
        min-height: 50px;
      }
      :host #mediaContainer {
        line-height: 0px;
      }
    </style>
    <div id="mediaContainer"></div>
    <shadow></shadow>
    <content></content>
  </template>
  <script>
    var popcornEvents = ['canplay', 'currentTime', 'ended', 'playing'];

    Polymer('ceci-media', {
      // some Beethoven
      url: 'https://www.youtube.com/watch?v=zucBfXpCA6s',
      starttime: 0,
      volume: 1,
      autoplay: 'false',
      ready: function () {
        this.super();

        // Make sure `this` scope never changes for these handlers...
        this.onPopcornCanplay = function () { this.broadcast('ready'); }.bind(this);
        this.onPopcornCurrentTime = function (e) { this.broadcast('tick', e.currentTime); }.bind(this);
        this.onPopcornEnded = function (e) { this.broadcast('ended'); }.bind(this);
        this.onPopcornPlaying = function (e) { this.broadcast('playing'); }.bind(this);

        if (this.url) {
          this.initPopcorn();
        }

      },
      urlChanged: function () {
        this.initPopcorn();
      },<commit_msg>Fix #2353-Media Player brick shows double video<commit_after><link rel="import" href="popcorn.html">
<polymer-element name="ceci-media" attributes="url autoplay starttime volume" volume=".5" extends="ceci-element">
  <ceci-definition>
    {
      "tags": ["media", "audio", "video", "youtube", "popcorn", "soundcloud"],
      "name": "Media Player",
      "thumbnail": "./thumbnail.png",
      "description": "Plays HTML5 media using the PopcornJS library.",
      "broadcasts": {
        "tick": {
          "label": "Tick",
          "description": "Media time progressed."
        },
        "ready": {
          "label": "Ready",
          "description": "Media is ready to play."
        },
        "ended": {
          "label": "Ended",
          "description": "Media reached its end."
        },
        "playing": {
          "label": "Playing",
          "description": "Media started to play."
        }
      },
      "listeners": {
        "play": {
          "label": "Start",
          "description": "Starts the selected media"
        },
        "pause": {
          "label": "Stop",
          "description": "Stops the selected media"
        },
        "rewind": {
          "label": "Rewind",
          "description": "Starts media from the beginning."
        }
      },
      "attributes": {
        "starttime": {
          "label": "Start Time",
          "description": "The desired starting point in the selected media.",
          "editable": "number",
          "listener": true
        },
        "url": {
          "label": "Media URL",
          "description": "Web URL for the desired media.",
          "editable": "text",
          "listener": true
        },
        "volume": {
          "label": "Volume",
          "editable": "range",
          "min" : 0,
          "max" : 1,
          "step" : ".01"
        },
        "autoplay": {
          "label": "Play Automatically",
          "description": "Play the media as soon as its ready",
          "editable": "boolean"
        }
      }
    }
  </ceci-definition>
  <template>
    <style>
      :host {
        display: block;
        min-height: 50px;
      }
      :host #mediaContainer {
        line-height: 0px;
      }
    </style>
    <div id="mediaContainer"></div>
    <shadow></shadow>
    <content></content>
  </template>
  <script>
    var popcornEvents = ['canplay', 'currentTime', 'ended', 'playing'];

    Polymer('ceci-media', {
      // some Beethoven
      url: 'https://www.youtube.com/watch?v=zucBfXpCA6s',
      starttime: 0,
      volume: 1,
      autoplay: 'false',
      ready: function () {
        this.super();

        // Make sure `this` scope never changes for these handlers...
        this.onPopcornCanplay = function () { this.broadcast('ready'); }.bind(this);
        this.onPopcornCurrentTime = function (e) { this.broadcast('tick', e.currentTime); }.bind(this);
        this.onPopcornEnded = function (e) { this.broadcast('ended'); }.bind(this);
        this.onPopcornPlaying = function (e) { this.broadcast('playing'); }.bind(this);

        if (this.url === 'https://www.youtube.com/watch?v=zucBfXpCA6s') {
          this.initPopcorn();
        }

      },
      urlChanged: function () {
        this.initPopcorn();
      },
{'fraction_non_alphanumeric': 0.16505911636589918, 'fraction_numerical': 0.004511512134411947, 'mean_word_length': 1.8816674137158225, 'pattern_counts': {'":': 90, '<': 33, '<?xml version=': 0, '>': 33, 'https://': 3, 'lorem ipsum': 0, 'www.': 3, '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': '5213950', 'n_tokens_mistral': 1956, 'n_tokens_neox': 1887, 'n_words': 455}