<!DOCTYPE html>
<html>
<head>
    <title>Jelen Naša Stvar</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="Zapevajmo zajedno Našu stvar! Ovde možete da preuzmete pesmu, spot i melodije za mobilne telefone!">

    <meta property="og:title" content="Jelen Pivo - Naša stvar!"/>
    <meta property="og:site_name" content="Jelen Pivo - Naša stvar!"/>
    <meta property="og:type" content="website"/>
    <meta property="og:url" content="http://nasastvar-jelenpivo.rs/"/>
    <meta property="og:description" content="Zapevajmo zajedno Našu stvar! Ovde možete da preuzmete pesmu, spot i melodije za mobilne telefone!"/>
    <meta property="og:image" content="http://nasastvar-jelenpivo.rs/assets/img/facebook-nasastvar-jelenpivo.jpg"/>
	
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon">
    <link rel="icon" href="/favicon.ico" type="image/x-icon">


    <link href="assets/css/reset.css" rel="stylesheet" type="text/css">
    <link href="assets/css/style.css" rel="stylesheet" type="text/css">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
     <script src="assets/js/buzz.js"></script>
    <?php require_once('google-analytics.php'); ?>
</head>

<body>
<div id="project-wrapper">
    <img src="assets/img/jelen-logo.png" class="img-logo">


    <div id="screen1">
        <div id="video">
            <iframe width="790" height="444" src="//www.youtube.com/embed/gLJi_4QwvME?rel=0&amp;showinfo=0" frameborder="0" allowfullscreen></iframe>
        </div>
        <div id="navigation">
            <h3>DOWNLOAD</h3>

            <div class="nav-btn">
                <a href="https://www.dropbox.com/s/wxmti0m7w5agrz2/nasa-stvar.mp4?dl=1" class="btn-round video" download>VIDEO</a>
                <a href="https://www.dropbox.com/s/tx1gwipmbyaqsjm/jelen-pivo-nasa-stvar.mp3?dl=1" class="btn-round song" download>PESMA</a>
                <div class="btn-round ringtone" id="selectRington">RINGTONE</div>
            </div>
        </div>
    </div>

    <div id="screen2">
        <button id="screen2-close">Close</button>
        <div id="ringtone-area">
            <h2>RINGTONE</h2>
                <div class="row">
                    <button class="btn-play btn-elipse play-music"  data-info="ringtone1">PLAY</button>
                    <span>ZVONO 1</span>
                    <a class="btn-download btn-elipse" href="https://www.dropbox.com/s/14d1e69p45442y2/ringtone1.mp3?dl=1" download>DOWNLOAD</a>
                </div>
                <div class="row">
                    <button class="btn-play btn-elipse play-music"  data-info="ringtone2">PLAY</button>
                    <span>ZVONO 2</span>
                    <a class="btn-download btn-elipse" href="https://www.dropbox.com/s/876hjaqt8p1jx46/ringtone2.mp3?dl=1" download>DOWNLOAD</a>
                </div>
                <div class="row">
                    <button class="btn-play btn-elipse play-music"  data-info="ringtone3">PLAY</button>
                    <span>ZVONO 3</span>
                    <a class="btn-download btn-elipse" href="https://www.dropbox.com/s/3jynfc5wlhy79my/ringtone3.mp3?dl=1" download>DOWNLOAD</a>
                </div>
                <div class="row">
                    <button class="btn-play btn-elipse play-music"  data-info="ringtone4">PLAY</button>
                    <span>ZVONO 4</span>
                    <a class="btn-download btn-elipse" href="https://www.dropbox.com/s/w6h1spss5p8iskl/ringtone4.mp3?dl=1" download>DOWNLOAD</a>
                </div>
                <div class="row">
                    <button class="btn-play btn-elipse play-music"  data-info="ringtone5">PLAY</button>
                    <span>ZVONO 5</span>
                    <a class="btn-download btn-elipse" href="https://www.dropbox.com/s/2tuz1zsb2xp7qww/ringtone5.mp3?dl=1" download>DOWNLOAD</a>
                </div>
        </div>

        <div id="sms-area">
            <h2>SMS</h2>

                <div class="row2">
                    <button class="btn-play btn-elipse play-music"  data-info="sms1">PLAY</button>
                    <span>SMS 1</span>
                    <a class="btn-download btn-elipse" href="https://www.dropbox.com/s/pkf3usj8yme0b7z/sms1.mp3?dl=1" data-info="sms1" download>DOWNLOAD</a>
                </div>

            <div class="row2">
                <button class="btn-play btn-elipse play-music"  data-info="sms1">PLAY</button>
                <span>SMS 2</span>
                <a class="btn-download btn-elipse" href="https://www.dropbox.com/s/0c20inkdj5rk2dn/sms2.mp3?dl=1" data-info="sms1" download>DOWNLOAD</a>
            </div>

        </div>
    </div><!-- END screen2 -->
</div><!-- ENDS project-wrapper -->


<script>
    $(document).ready(function(){
        window.isPlayingObject = 1;

        $("#selectRington").on('click', function(){
            $('#screen1').hide();
            $('#screen2').show();
        });

        $('#screen2-close').on('click', function(){
            $('#screen2').hide();
            $('#screen1').show();
        });

        $('.play-music').on('click', function(){

            var song = $(this).attr('data-info');

            if($(this).hasClass('btn-pause')){
                window.isPlayingObject.stop();
                $(this).removeClass('btn-pause').addClass('btn-play').html('PLAY');
            }else{
                window.isPlayingObject = new buzz.sound( "assets/sound/" + song + ".mp3").play();
                $(this).removeClass('btn-play').addClass('btn-pause').html('STOP');

                //Google analytics for play button
                ga('send', 'event', 'PLAY MUSIC', 'listen', song);
            }
        });


        //Google analytics events
        $('.btn-round').on('click', function(){
            if($(this).hasClass('video')){
                ga('send', 'event', 'DOWNLOAD FILE', 'download', 'video');
            }
            if($(this).hasClass('song')){
                ga('send', 'event', 'DOWNLOAD FILE', 'download', 'song');
            }
        });

        $('.btn-download').on('click', function(){
            var fileName = $(this).attr('data-info');
            ga('send', 'event', 'DOWNLOAD FILE', 'download', fileName);
        });
    });
</script>

</body>
</html>
