Permalink
Find file
Fetching contributors…
Cannot retrieve contributors at this time
212 lines (197 sloc) 8.83 KB
<section class="container-fluid" id="section1">
<h1 class="text-center v-center">OpenAL</h1>
<div class="container">
<div class="row">
<div class="col-sm-4">
<div class="row">
<div class="col-sm-10 col-sm-offset-2 text-center"><h3>Efficient</h3><p>OpenAL renders 3D sound quickly. Your buffer will be perfectly filled.</p><i class="fa fa-rocket fa-5x"></i></div>
</div>
</div>
<div class="col-sm-4 text-center">
<div class="row">
<div class="col-sm-10 col-sm-offset-1 text-center"><h3>Simple</h3><p>Ever written OpenGL code? You already know how to work with OpenAL.</p><i class="fa fa-heart fa-5x"></i></div>
</div>
</div>
<div class="col-sm-4 text-center">
<div class="row">
<div class="col-sm-10 text-center"><h3>Open API</h3><p>Remember EAX and A3D? Forget them. OpenAL is vendor neutral.</p><i class="fa fa-code fa-5x"></i></div>
</div>
</div>
</div><!--/row-->
</div><!--/container-->
</section>
<section class="container-fluid" id="section2">
<div class="row">
<div class="col-sm-8 col-sm-offset-2 text-left">
<h1>What is OpenAL?</h1>
<br>
<p class="lead">OpenAL is a cross-platform 3D audio API appropriate for use with gaming applications and many other types of audio applications.<br /><br/>
The library models a collection of audio sources moving in a 3D space that are heard by a single listener somewhere in that space. The basic OpenAL objects are a Listener, a Source, and a Buffer. There can be a large number of Buffers, which contain audio data. Each buffer can be attached to one or more Sources, which represent points in 3D space which are emitting audio. There is always one Listener object (per audio context), which represents the position where the sources are heard -- rendering is done from the perspective of the Listener.</p>
<a class="btn btn-lg btn-primary" href="/documentation/" role="button">Get started developing today.</a>
</div>
</div>
</section>
<!-- ZWARNING: I don't think we want this.
<section class="container-fluid" id="section3">
<h1 class="text-center">Bootstrap is Responsive</h1>
<div class="row">
<div class="col-sm-6 col-sm-offset-3">
<h3 class="text-center">Vertical scrolling has become a popular and lasting trend in Web design.</h3>
<div class="row">
<div class="col-xs-4 col-xs-offset-1">Some brand-tacular designs even have home page content that is taller that 12,000 pixels. That's a lotta content.</div>
<div class="col-xs-2"></div>
<div class="col-xs-4 text-right">Anyhoo, this is just some random blurb of text, and Bootply.com is a playground and code editor for Bootstrap.</div>
</div>
<p class="text-center">
<img src="/assets/example/img_mtnpeople.png" class="img-responsive center-block ">
</p>
</div>
</div>
</section>
<section class="container-fluid" id="section4">
<h2 class="text-center">Change this Content. Change the world.</h2>
<div class="row">
<div class="col-sm-8 col-sm-offset-2">
<img src="/assets/example/bg_smartphones.jpg" class="img-responsive center-block ">
<p class="text-center">Images will scale down proportionately as browser width narrows.</p>
</div>
</div>
</section>
<section class="container-fluid" id="section5">
<div class="col-sm-10 col-sm-offset-1">
<div class="container">
<div class="row">
<div class="col-sm-4 col-xs-12">
<div class="list-group">
<a href="#" class="list-group-item active">
<h2 class="list-group-item-heading">Basic</h2>
<h6>Free to get started</h6>
</a>
<a href="#" class="list-group-item">
<p class="list-group-item-text">Option 100 - more about this</p>
</a>
<a href="#" class="list-group-item">
<p class="list-group-item-text">Option 2 - this is more about this</p>
</a>
<a href="#" class="list-group-item">
<p class="list-group-item-text">Option 3 GB</p>
</a>
<a href="#" class="list-group-item">
<p class="list-group-item-text">Option 4</p>
</a>
<a href="#" class="list-group-item">
<p class="list-group-item-text">Feature</p>
</a>
<a href="#" class="list-group-item">
<p class="list-group-item-text">Feature</p>
</a>
<a href="#" class="list-group-item">
<button class="btn btn-primary btn-lg btn-block">Get Started</button>
</a>
</div>
</div>
<div class="col-sm-4 col-xs-12">
<div class="list-group text-center">
<a href="#" class="list-group-item active">
<h2 class="list-group-item-heading">Better</h2>
<h6>Most popular plan</h6>
</a>
<a href="#" class="list-group-item">
<p class="list-group-item-text">Option 200 - more about this</p>
</a>
<a href="#" class="list-group-item">
<p class="list-group-item-text">Option 2 - this is more about this</p>
</a>
<a href="#" class="list-group-item">
<p class="list-group-item-text">Option 5 GB</p>
</a>
<a href="#" class="list-group-item">
<p class="list-group-item-text">Option 6</p>
</a>
<a href="#" class="list-group-item">
<p class="list-group-item-text">Feature</p>
</a>
<a href="#" class="list-group-item">
<p class="list-group-item-text">Feature</p>
</a>
<a href="#" class="list-group-item">
<button class="btn btn-default btn-lg btn-block">$10 per month</button>
</a>
</div>
</div>
<div class="col-sm-4 col-xs-12">
<div class="list-group text-right">
<a href="#" class="list-group-item active">
<h2 class="list-group-item-heading">Best</h2>
<h6>For enterprise grade</h6>
</a>
<a href="#" class="list-group-item">
<p class="list-group-item-text">Option 100 - more about this</p>
</a>
<a href="#" class="list-group-item">
<p class="list-group-item-text">Option 2 - this is more about this</p>
</a>
<a href="#" class="list-group-item">
<p class="list-group-item-text">Option 8 GB</p>
</a>
<a href="#" class="list-group-item">
<p class="list-group-item-text">Option 10</p>
</a>
<a href="#" class="list-group-item">
<p class="list-group-item-text">Unlimited</p>
</a>
<a href="#" class="list-group-item">
<p class="list-group-item-text">Unlimited</p>
</a>
<a href="#" class="list-group-item">
<button class="btn btn-default btn-lg btn-block">$20 per month</button>
</a>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="container-fluid" id="section6">
<h2 class="text-center">Do you see what I mean?</h2>
<p class="text-center lead">Add some compelling information here</p>
<img src="/assets/example/bg_iphone.png" class="img-responsive center-block ">
</section>
<section class="container" id="section7">
<h1 class="text-center">Social Media Fascination</h1>
<div class="row">
<div class="col-sm-1 col-sm-offset-2 col-xs-4 text-center">
<i class="fa fa-github fa-4x"></i>
</div>
<div class="col-sm-1 col-xs-4 text-center">
<i class="fa fa-foursquare fa-4x"></i>
</div>
<div class="col-sm-1 col-xs-4 text-center">
<i class="fa fa-facebook fa-4x"></i>
</div>
<div class="col-sm-1 col-xs-4 text-center">
<i class="fa fa-pinterest fa-4x"></i>
</div>
<div class="col-sm-1 col-xs-4 text-center">
<i class="fa fa-google-plus fa-4x"></i>
</div>
<div class="col-sm-1 col-xs-4 text-center">
<i class="fa fa-twitter fa-4x"></i>
</div>
<div class="col-sm-1 col-xs-4 text-center">
<i class="fa fa-dribbble fa-4x"></i>
</div>
<div class="col-sm-1 col-xs-4 text-center">
<i class="fa fa-instagram fa-4x"></i>
</div>
</div>
<div class="row">
<div class="col-md-12 text-center">
<br><br>
<p>
<a href="http://www.bootstrapzero.com/bootstrap-template/sectionalize">Get the code for this template.</a>
</p>
</div>
</div>
</section>
-->