work on player
This commit is contained in:
		@ -999,7 +999,10 @@ class Sound(Nameable):
 | 
			
		||||
            return None
 | 
			
		||||
 | 
			
		||||
        import mutagen
 | 
			
		||||
        meta = mutagen.File(self.path)
 | 
			
		||||
        try:
 | 
			
		||||
            meta = mutagen.File(self.path)
 | 
			
		||||
        except:
 | 
			
		||||
            meta = {}
 | 
			
		||||
 | 
			
		||||
        def get_meta(key, cast=str):
 | 
			
		||||
            value = meta.get(key)
 | 
			
		||||
 | 
			
		||||
@ -550,7 +550,7 @@ class DiffusionPage(Publication):
 | 
			
		||||
        sound = self.diffusion.get_archives() \
 | 
			
		||||
                    .filter(public = True).first()
 | 
			
		||||
        if sound:
 | 
			
		||||
            sound.detail_url = self.detail_url
 | 
			
		||||
            sound.detail_url = self.url
 | 
			
		||||
        return sound
 | 
			
		||||
 | 
			
		||||
    def get_podcasts(self):
 | 
			
		||||
@ -682,6 +682,11 @@ class LogsPage(DatedListPage):
 | 
			
		||||
        help_text = _('maximum days in the past allowed to be shown. '
 | 
			
		||||
                      '0 means no limit')
 | 
			
		||||
    )
 | 
			
		||||
    reverse = models.BooleanField(
 | 
			
		||||
        _('reverse list'),
 | 
			
		||||
        default=False,
 | 
			
		||||
        help_text = _('print logs in ascending order by date'),
 | 
			
		||||
    )
 | 
			
		||||
 | 
			
		||||
    class Meta:
 | 
			
		||||
        verbose_name = _('Logs')
 | 
			
		||||
@ -691,6 +696,7 @@ class LogsPage(DatedListPage):
 | 
			
		||||
        MultiFieldPanel([
 | 
			
		||||
            FieldPanel('station'),
 | 
			
		||||
            FieldPanel('age_max'),
 | 
			
		||||
            FieldPanel('reverse'),
 | 
			
		||||
        ], heading=_('Configuration')),
 | 
			
		||||
    ]
 | 
			
		||||
 | 
			
		||||
@ -718,7 +724,9 @@ class LogsPage(DatedListPage):
 | 
			
		||||
        for date in context['nav_dates']['dates']:
 | 
			
		||||
            items = [ SectionLogsList.as_item(item)
 | 
			
		||||
                        for item in self.station.on_air(date = date) ]
 | 
			
		||||
            logs.append((date, items))
 | 
			
		||||
            logs.append(
 | 
			
		||||
                (date, reversed(items) if self.reverse else items)
 | 
			
		||||
            )
 | 
			
		||||
        return logs
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@ -323,6 +323,14 @@ ul.list {
 | 
			
		||||
        display: inline;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    .player .playlist .duration {
 | 
			
		||||
       text-align: right;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    .player .playlist progress {
 | 
			
		||||
        width: 100%;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
.player .item[selected] {
 | 
			
		||||
    border-left: 1px #007EDF solid;
 | 
			
		||||
@ -345,7 +353,6 @@ ul.list {
 | 
			
		||||
        max-height: 2.0em;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
    .player:not([state]) .item[selected] .button > img:not(.play),
 | 
			
		||||
    .player[state="paused"] .item[selected] .button > img:not(.play),
 | 
			
		||||
    .player[state="playing"] .item[selected] .button > img:not(.pause),
 | 
			
		||||
 | 
			
		||||
@ -36,6 +36,7 @@ Sound.prototype = {
 | 
			
		||||
    on_air: false,
 | 
			
		||||
 | 
			
		||||
    item: undefined,
 | 
			
		||||
    position_item: undefined,
 | 
			
		||||
 | 
			
		||||
    get seekable() {
 | 
			
		||||
        return this.duration != undefined;
 | 
			
		||||
@ -59,6 +60,7 @@ Sound.prototype = {
 | 
			
		||||
 | 
			
		||||
        item.sound = this;
 | 
			
		||||
        this.item = item;
 | 
			
		||||
        this.position_item = item.querySelector('.position');
 | 
			
		||||
 | 
			
		||||
        // events
 | 
			
		||||
        var self = this;
 | 
			
		||||
@ -164,9 +166,9 @@ Playlist.prototype = {
 | 
			
		||||
        sound.item.setAttribute('selected', 'true');
 | 
			
		||||
 | 
			
		||||
        if(!sound.on_air)
 | 
			
		||||
            sound.item.querySelector('.content').insertBefore(
 | 
			
		||||
                this.player.progress.item,
 | 
			
		||||
                sound.item.querySelector('.content .duration')
 | 
			
		||||
            sound.item.querySelector('.content').parentNode.appendChild(
 | 
			
		||||
                this.player.progress.item //,
 | 
			
		||||
                // sound.item.querySelector('.content .duration')
 | 
			
		||||
            )
 | 
			
		||||
 | 
			
		||||
        if(sound.seekable)
 | 
			
		||||
@ -217,6 +219,7 @@ Playlist.prototype = {
 | 
			
		||||
    },
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
var ActivePlayer = null;
 | 
			
		||||
 | 
			
		||||
function Player(id, on_air_url, show_cover) {
 | 
			
		||||
    this.id = id;
 | 
			
		||||
@ -253,6 +256,10 @@ Player.prototype = {
 | 
			
		||||
    sound: undefined,
 | 
			
		||||
    on_air_url: undefined,
 | 
			
		||||
 | 
			
		||||
    get sound() {
 | 
			
		||||
        return this.playlist.sound;
 | 
			
		||||
    },
 | 
			
		||||
 | 
			
		||||
    init_events: function() {
 | 
			
		||||
        var self = this;
 | 
			
		||||
 | 
			
		||||
@ -265,19 +272,20 @@ Player.prototype = {
 | 
			
		||||
        function update_info() {
 | 
			
		||||
            var progress = self.progress;
 | 
			
		||||
            var pos = self.audio.currentTime;
 | 
			
		||||
            var position = self.sound.position_item;
 | 
			
		||||
 | 
			
		||||
            // progress
 | 
			
		||||
            if(!self.sound || !self.sound.seekable ||
 | 
			
		||||
            if(!self.audio || !self.audio.seekable ||
 | 
			
		||||
                    !pos || self.audio.duration == Infinity)
 | 
			
		||||
            {
 | 
			
		||||
                progress.duration.innerHTML = '';
 | 
			
		||||
                position.innerHTML = '';
 | 
			
		||||
                progress.bar.value = 0;
 | 
			
		||||
                return;
 | 
			
		||||
            }
 | 
			
		||||
 | 
			
		||||
            progress.bar.value = pos;
 | 
			
		||||
            progress.bar.max = self.audio.duration;
 | 
			
		||||
            progress.duration.innerHTML = duration_str(pos);
 | 
			
		||||
            position.innerHTML = duration_str(pos);
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        // audio
 | 
			
		||||
@ -302,7 +310,7 @@ Player.prototype = {
 | 
			
		||||
        this.audio.addEventListener('ended', function() {
 | 
			
		||||
            self.player.removeAttribute('state');
 | 
			
		||||
            if(!self.controls.single.checked)
 | 
			
		||||
                self.next(true);
 | 
			
		||||
                self.playlist.next(true);
 | 
			
		||||
        }, false);
 | 
			
		||||
 | 
			
		||||
        // progress
 | 
			
		||||
@ -318,7 +326,8 @@ Player.prototype = {
 | 
			
		||||
               return;
 | 
			
		||||
 | 
			
		||||
            var pos = time_from_progress(event);
 | 
			
		||||
            self.progress.duration.innerHTML = duration_str(pos);
 | 
			
		||||
            var position = self.sound.position_item;
 | 
			
		||||
            position.innerHTML = duration_str(pos);
 | 
			
		||||
        }, false);
 | 
			
		||||
    },
 | 
			
		||||
 | 
			
		||||
@ -368,6 +377,11 @@ Player.prototype = {
 | 
			
		||||
    },
 | 
			
		||||
 | 
			
		||||
    play: function() {
 | 
			
		||||
        if(ActivePlayer && ActivePlayer != this) {
 | 
			
		||||
            ActivePlayer.stop();
 | 
			
		||||
        }
 | 
			
		||||
        ActivePlayer = this;
 | 
			
		||||
 | 
			
		||||
        if(this.audio.paused)
 | 
			
		||||
            this.audio.play();
 | 
			
		||||
        else
 | 
			
		||||
 | 
			
		||||
@ -7,7 +7,7 @@
 | 
			
		||||
</div>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
var player = new Player('player', '{% url 'aircox.on_air' %}');
 | 
			
		||||
var player = new Player('player', '{% url 'aircox.on_air' %}', true);
 | 
			
		||||
var sound = player.playlist.add(
 | 
			
		||||
    new Sound(
 | 
			
		||||
        '{{ self.live_title }}',
 | 
			
		||||
 | 
			
		||||
@ -22,6 +22,7 @@
 | 
			
		||||
        <div class="flex_item">
 | 
			
		||||
            <h3 class="title flex_item">{{ self.live_title }}</h3>
 | 
			
		||||
            <div class="content flex_row">
 | 
			
		||||
                <span class="info position flex_item"></span>
 | 
			
		||||
                <span class="info duration flex_item"></span>
 | 
			
		||||
                <span class="actions">
 | 
			
		||||
                    <a class="action add" title="{% trans "add to the player" %}">+</a>
 | 
			
		||||
@ -34,10 +35,10 @@
 | 
			
		||||
</div>
 | 
			
		||||
 | 
			
		||||
<div class="controls">
 | 
			
		||||
    <span class="progress">
 | 
			
		||||
        <span class="info duration"></span>
 | 
			
		||||
    <div class="progress">
 | 
			
		||||
        <!-- <div class="info duration"></span> -->
 | 
			
		||||
        <progress class="flex_item progress" value="0" max="1"></progress>
 | 
			
		||||
    </span>
 | 
			
		||||
    </div>
 | 
			
		||||
 | 
			
		||||
    <input type="checkbox" class="single" id="player_single_mode">
 | 
			
		||||
    <label for="player_single_mode" class="info"
 | 
			
		||||
 | 
			
		||||
		Reference in New Issue
	
	Block a user