<?php

#ini_set('display_errors', 'On');
#error_reporting(E_ALL);

$_SERVER["DOCUMENT_ROOT"] = "/home/jb/public_html/Builds/360";

$title = "VLC goes 360°";
$new_design = true;
/* Actual Webpage */
$show_donate = true;
$additional_css = array("styles/vlc_360.css");

require($_SERVER["DOCUMENT_ROOT"]."/include/header.php");
require($_SERVER["DOCUMENT_ROOT"] . "/include/os-specific.php");
?>

<script language="javascript">
$(function() {
       var s = skrollr.init();
       if (s.isMobile()) { s.destroy(); }
    });

    $(document).scroll(function () {
        var y = $(this).scrollTop();
        if (y > 1132) {
            $(".navbar-default").removeClass("navbar-dark");
        } else {
            $(".navbar-default").addClass("navbar-dark");
        }
    });
$(function() {
  $('a[href*=#]:not([href=#])').click(function() {
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
      var target = $(this.hash);
      target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
      if (target.length) {
        $('html,body').stop(true, true).animate({
          scrollTop: target.offset().top
        }, 2000);
        return false;
      }
    }
  });
});
$('.navbar-default').toggleClass('navbar-dark');
</script>

<div class="main-container" id="vlc-360">
    <section class="parallax-video" data-start="transform: translateY(0px);" data-1440="transform: translateY(-500px)">
        <div class="backdrop"></div>
        <video autoplay muted loop>
            <source src="http://streams.videolan.org/streams/360/eagle.mp4" type="video/mp4">
        </video>
        <div class="content" data-start="opacity:1;" data-100="opacity: 0;">
            <div class="container">
                <div class="row">
                    <div class="col-md-8 col-md-offset-2">
                        <h1>VLC 360° Technical Preview</h1>
                        <h2 style="color: white;">
                        Play all your 360° videos and images directly with VLC!
                        </h2>
                        <p></p>

                            <div class="inner center-xs">
                                <div class="btn-group" style="z-index: 99;">
                                    <a id='downloadButton2' class="btn btn-default btn-lg btn-dl" href='#download'>
                                        <span class='downloadText'>
                                            <?php
                                            if (!is_null($alternativeTitle))
                                                echo _($alternativeTitle);
                                            else
                                                echo _("Download")." <b>VLC 360</b>";
                                            ?>
                                        </span>
                                    </a>
                                </div>
                            </div>

                    </div>
                </div>
            </div>
        </div>
    </section>

    <section class="bg-cover">
        <div class="backdrop"></div>
        <div class="content" data-500="opacity:1;" data-700="opacity: 0;">
        <div class="container">
            <div class="col-md-8 col-md-offset-2">
                <h1>VLC & 360°</h1>
                <p class="valign">
                    With the help of <a href="http://giroptic.com/">Giroptic</a>, VLC becomes the first major video player app to play 360° videos out of the box.
<br />
                    <b>VLC 3.0</b> final release will merge those features on all platforms.

                </p>
            </div>
        </div>
</div>
    </section>
    <section class="features bg-gray">
        <div class="container">
            <div class="row">
                <div class="col-lg-5 col-lg-offset-1 col-sm-push-6 col-sm-6">
                    <div class="clearfix"></div>
                    <h2 class="section-heading">360 Features</h2>
                    <p class="lead">
                        <ul>
                               <li>Playback of <b>360 Videos</b> following the <a href="https://github.com/google/spatial-media">Spatial Video spec</a></li>
                               <li>Playback of <b>360 Photos</b> and Panoramas following the <a href="https://developers.google.com/streetview/spherical-metadata">Spherical spec</a></li>
                               <li>Display modes with <b>Zoom</b>, <b>Little planet</b> and Reverse little planet
                               <li>Control it with your Mouse and Keyboard</li>
                               <li>Open Source and Cross-platform, accelerated with OpenGL and Direct3D11</li>
                        </ul>
                    </p>
                </div>
                <div class="col-lg-5 col-sm-pull-6 col-sm-6">
                    <img class="center-sm center-xs img-responsive" src="360_images/windows10.jpg">
                </div>
            </div>
        </div>
    </section>
    <section class="features" id="download">
        <div class="container">
            <div class="row">
                <div class="col-lg-5 col-lg-offset-1 col-sm-push-6 col-sm-6">
                    <img class="center-sm center-xs img-responsive" src="360_images/mac.jpg">
                </div>
                <div class="col-lg-5 col-sm-pull-6 col-sm-6">
                    <div class="clearfix"></div>
                    <h2 class="section-heading">Downloads</h2>
                    <p class="lead">Windows 7 (and later)</p>
    <div class="inner center-xs">
        <div class="btn-group">
            <a id='downloadButton2' class="btn btn-default btn-lg btn-dl" href='https://downloads.videolan.org/videolan/testing/360/vlc-3.0.0-git-win32.exe'>
                <span class='downloadText'>
                    <?php
                    if (!is_null($alternativeTitle))
                        echo _($alternativeTitle);
                    else
                        echo " <b>VLC 360</b> Windows";
                    ?>
                </span>
            </a>
        </div>
<p></p>
<p></p>

                    <p class="lead">macOS 10.10 (and later)
    <div class="inner center-xs">
        <div class="btn-group">
            <a id='downloadButton2' class="btn btn-default btn-lg btn-dl" href='https://downloads.videolan.org/videolan/testing/360/vlc-3.0.0-git.dmg'>
                <span class='downloadText'>
                    <?php
                    if (!is_null($alternativeTitle))
                        echo _($alternativeTitle);
                    else
                        echo " <b>VLC 360</b> macOS";
                    ?>
                </span>
            </a>
        </div>
</p>
<p style="font-size: 11px; line-height: 14px;">Note that this build is not signed with our GateKeeper certificate. Therefore, you need to right-click on the application to select Open to launch them for the first time after download.</p>
<p></p>
<p></p>
<h2>360 Test Samples</h2>
<p><a href="http://streams.videolan.org/streams/360/eagle_360.mp4">Eagle video</a> - 
<a href="http://streams.videolan.org/streams/360/surfers_360.mp4">Surfers video</a></p>
<p><a href="http://streams.videolan.org/streams/360/Mountain_360.jpg">Mountain panorama</a> (photo).</p>

                </div>
            </div>
        </div>
    </section>
    <section class="features bg-gray">
        <div class="container bg-gray">
            <div class="row">
                <div class="col-lg-5 col-lg-offset-1 col-sm-push-6 col-sm-6">
                    <div class="clearfix"></div>
                    <img src="360_images/Giroptic.png" style="float: right; height: 40px;" />
                    <h2 class="section-heading">Thanks to Giroptic</h2>
                    <p class="lead">
                        This project wouldn't have been possible without the help of <a href="http://giroptic.com/">Giroptic</a>, who has provided samples, cameras, code and expertise on those features.
                    </p>
                    <p class="lead">
                       "VLC is one of the video players most widely used in the world. We are very proud to contribute our expertise in 360° to this open source player.<br />
                        This will allow the millions of VLC users to take full advantage of a promising new technology and be widely involved in its democratization.", said Richard Ollier, co-founder and CEO of <a href="http://giroptic.com">Giroptic</a>.
                    </p>
                </div>
                <div class="col-lg-5 col-sm-pull-6 col-sm-6">
                    <img class="center-sm center-xs img-responsive" src="360_images/mac2.jpg">
                </div>
            </div>
        </div>
    </section>
    <section class="features">
        <div class="container">
            <div class="row">
                <div class="col-lg-6 col-lg-offset-1 col-sm-push-6 col-sm-6">
                    <img class="center-sm center-xs img-responsive" src="360_images/VLC_VR.png" style="max-width: 400px;" />
                </div>
                <div class="col-lg-5 col-sm-pull-6 col-sm-6">
                    <div class="clearfix"></div>
                    <h2 class="section-heading">VLC-VR</h2>
                    <p class="lead">
                        Future releases of VLC with <b>360 features</b> will be available for Android, iOS and Xbox One.<br />
                        Mobile versions will use the phone sensors to navigate inside the videos.
                    </p>
                    <p class="lead">
                        VLC will probably support <b>VR headsets</b> like Vive, Daydream, Oculus or OSVR, in 2017.
                    </p>
                    <p class="lead">
                        VLC will also get <b>3D audio</b> playback, including head tracking headphones. We'll keep you posted.
                    </p>
                 </div>
            </div>
        </div>
    </section>
</div>
<!-- Do not remove: nagios check -->
<?php footer('$Id: contribute.php 6882 2011-04-25 12:17:24Z jb $'); ?>
<script src="js/skrollr.min.js" type="text/javascript"></script>
