1

Тема: Розробка аудіоплеєра

Я знаю що сайти які грають музику на своїх сторінках не питаючи чи ви хотіли цю музику - це повне лайно, але часом з замовником важко сперечатись, навіть якщо за це гроші не дають. Крім того є інша мотивація - показати всім що і без Flash можна жити якщо є HTML5. І навчитись робити щось цікаве з JavaScript.

Задача - відтворювати музику на сайті. Сторінки змінюються, плеєр залишається. Проблема перша - це не односторінковий сайт.

Я вирішив проблему з тим що якщо користувач вимкнув плеєр на одній сторінці, то він повинен бути вимкненим на іншій за допомогою localStorage.

Коли спробував вирішити проблему того що композиція щоразу грає з початку, мені сказали:

InvalidStateError: An attempt was made to use an object that is not, or is no longer, usable
http://localhost/wp-content/themes/origin/main.js Line 26

main.js

var local_storage_present = function() {
    try {
        return 'localStorage' in window && window['localStorage'] !== null;
    } catch (e) {
        return false;
    };
};
(function($){
    var audioplayer = function() {
        if(!local_storage_present()) return;
        $('#audioplayer').html(
            '<audio controls id="audioplayerelement" style="position: fixed; top: 30px; right: 10px;">' + 
                '<source src="/wp-content/themes/origin/Uprising.mp3" type="audio/mpeg">' + 
                '<source src="/wp-content/themes/origin/Uprising.ogg" type="audio/ogg">' +
                "your browser doesn't support audio" + 
            '</audio>'
        );
        var player = $('#audioplayerelement')[0];
        player.onpause = function() {
            localStorage.playing = 'false';
        };
        player.onplay = function() {
            localStorage.playing = 'true';
        };
        if(localStorage.playing!=='false'){
            player.currentTime = localStorage.play_time;
            player.play();
        };
        $(window).unload(function() {
            localStorage.play_time = player.currentTime;
            return true;
        });
        
    };
    $(function(){
        audioplayer();
    });
})(jQuery);

Хтось щось знає про таку помилку?
Може краще зробити плеєр в окремому фреймі внизу?
Що думаєте про мій код, чи про погоду на вулиці?

2 Востаннє редагувалося bunyk (28.02.2013 20:08:40)

Re: Розробка аудіоплеєра

Чорт, я щойно прозрів! Як vk.com робить так що плеєр не перериває роботу при змінах сторінок?

3

Re: Розробка аудіоплеєра

Кажуть там термоядерний Аякс. Напевне так і є. Але як вони змінюють адресу до хеша (window.location) без перезавантаження сторінки?

Ах, HTML5 - чудовий!

Може б це написати якусь круту Wordpress тему на HTML5, Ajax і всьому гарному що на даний момент для вебу придумали?

4

Re: Розробка аудіоплеєра

термоядерний аджакс? :D

Прихований текст
деплоймент вк.ком:
дозапускова перевірка. - все в нормі. запуск. пчшшш. плеєр запуститься через 5, 4, 3, 2, 1. пелеєр запущено. всі датчики показують нормальну температуру :D
pew pew :D
Блоґ