zeus.ugent.be/content/cammie.erb
2019-06-07 11:39:08 +02:00

82 lines
2.8 KiB
Text

---
navigable: true
title: Cammie
---
<% content_for :scripts do %>
<script src="https://code.jquery.com/jquery-3.0.0.min.js" charset="utf-8"></script>
<%= asset :js, :cammie %>
<%= asset :js, :message %>
<% end %>
<section id="cammie-section">
<div id="cammie-body">
<figure class="image is-16by9">
<img id="cammie-feed" alt="cammie" src="https://kelder.zeus.ugent.be/webcam/video/mjpg.cgi?profileid=2" onerror="cammie_error()">
</figure>
<div id="cammie-ctrls">
<div class="columns is-mobile">
<div class="column is-1 ctrl diag left" data-command="set_relative_pos" data-x="-10" data-y="10">
<%= fa 'chevron-circle-left' %>
</div>
<div class="column ctrl center" data-command="set_relative_pos" data-x="0" data-y="10">
<%= fa 'chevron-circle-up' %>
</div>
<div class="column is-1 ctrl diag right" data-command="set_relative_pos" data-x="10" data-y="10">
<%= fa 'chevron-circle-up' %>
</div>
</div>
<div class="columns center is-mobile">
<div class="column is-1 ctrl left" data-command="set_relative_pos" data-x="-10" data-y="0">
<%= fa 'chevron-circle-left' %>
</div>
<div class="column">
<!-- blank space -->
</div>
<div class="column is-1 ctrl right" data-command="set_relative_pos" data-x="10" data-y="0">
<%= fa 'chevron-circle-right' %>
</div>
</div>
<div class="columns is-mobile">
<div class="column is-1 ctrl diag left" data-command="set_relative_pos" data-x="-10" data-y="-10">
<%= fa 'chevron-circle-down' %>
</div>
<div class="column ctrl center" data-command="set_relative_pos" data-x="0" data-y="-10">
<%= fa 'chevron-circle-down' %>
</div>
<div class="column is-1 ctrl diag right" data-command="set_relative_pos" data-x="10" data-y="-10">
<%= fa 'chevron-circle-right' %>
</div>
</div>
</div>
</div>
<nav class="nav columns">
<div class="column">
<button class="button ctrl" data-command="set_pos" data-x="24" data-y="16">
Kleine tafel
</button>
</div>
<div class="column">
<button class="button ctrl" data-command="set_pos" data-x="61" data-y="10">
Grote tafel
</button>
</div>
<div class="column">
<button class="ctrl button" data-command="set_pos" data-x="10" data-y="12">
Zetel
</button>
</div>
</nav>
<div class="columns">
<p id="chat-response"></p>
<div class="field has-addons ">
<div class="field control">
<input class="input chatbox" type="text" placeholder="Zeus is de max!">
</div>
<a class="button send control">
Send to kelder
</a>
</div>
</div>
</section>