Правильно ли написан код?

Question

[Тимафей Садовых]

Здравствуйте, изучал около месяца Javascript и решил попробовать на практике.
Прошу Вас посмотреть правильно ли все написано.

JS

console.log('loadstart');
audio.setAttribute("src", "http://radio.at.aknet.kg:8008/radio_record.aac"); 
audio.setAttribute("type", "audio/mpeg"); 

var init = function () {
    var playing = 0; 
    var playpause = document.getElementById('playpause'); 
    playpause.addEventListener('click', function () {
        if (playing == 2) {
            audio.pause();
            document.getElementById('playpause').innerHTML = "Воспроизвести";
            playing = 1;
        } else if (playing == 1) {
            audio.play();
            document.getElementById('playpause').innerHTML = "Остановить";
            playing = 2;
        } else {
            audio.play();
            document.getElementById('playpause').innerHTML = "Остановить"; 
            playing = 2;
        }
    }, false);

    var volume = document.getElementById('volume');
    volume.addEventListener('change', function () {
        audio.volume = parseFloat(this.value / 100);
    }, false);
}

    function UpdateTrack()
{
            $(document).ready(function(){
                
$.getJSON('http://www.radiorecord.ru/xml/record_online_v3.txt', {}, function(json){
$('#track').html('');
$('#track').append('Сейчас играет: ' + json.ARTIST + ' - ' + json.NAME);
$('#sg').html('<img src="img/google-logo.png"/>');
$('#sg').attr('href', 'https://www.google.ru/search?q='  + json.ARTIST + ' - ' + json.NAME);
$('#sn').html('<img src="img/namba-logo.png"/>');
$('#sn').attr('href', 'http://namba.kg/#!/search/mp3/' + json.ARTIST + ' - ' + json.NAME);
                    });                
               
            });
console.log('UpdateTrack');
}
setInterval(UpdateTrack, 5000);

window.onload = init;

HTML

<button id="playpause">Воспроизвести</button>
<input id="volume" type="range" min="0" max="100" value="80" />
<span id="track">loading</span></br>
<a target="blank" id="sg" href="#"></a>
<a target="blank" id="sn" href="#"></a>

Прошу сильно не ругать меня.

Comments

[killmeslow]

Главное чтобы работало =) На js новички обычно пишут Индусский код)

Answer 1

[Константин Величко]

Для проверки кода существуют линтеры, тесты, встроенные средства редактора
Вот один из них www.jslint.com

Честно говоря немогу понять зачем использовать document.getElementById, когда у вас уже используется Jquery

Answer 2

[Александр Кит]

После рефакторинга

window.onload = init;

// === private
function init() {
    var audio = $('#myplayer').get(0);
    audio.src = 'http://radio.at.aknet.kg:8008/radio_record.aac';

    $('#playpause').click(function() {
        if (audio.paused) {
            this.textContent = 'Остановить';
            audio.play();
            return;
        }

        this.textContent = 'Воспроизвести';
        audio.pause();
    });

    $('#volume').change(function() {
        audio.volume = this.value / 100;
    });

    setInterval(updateTrack, 5000);
}
function updateTrack() {
    var url = 'http://www.radiorecord.ru/xml/record_online_v3.txt';

    $.getJSON(url, function(json) {
        var key = json.ARTIST + ' - ' + json.NAME;

        $('#track').text('Сейчас играет: ' + key);
        $('#sg').attr('href', 'https://www.google.ru/search?q=' + key);
        $('#sn').attr('href', 'http://namba.kg/#!/search/mp3/' + key)
    });
}

Answer 3

[Константин Китманов]

UpdateTrack — с большой буквы называются только конструкторы.

Видно, что отсутствует понимание, что такое $(document).ready(function(){ и window.onload, что общего и в чем различие.

$('#sg').html(''); — Непонятно, зачем чисто статический HTML вставлять динамически. И вообще хочется заюзать шаблонизатор в таких местах.

К остальному придираться не хочется, но как-то все неаккуратно…(