Demo+Videos+Images
###################

The Webpage
***********

    The figure below shows the QR-Code website with currently three available drinks.

    .. image:: images/demo_page.png
        :alt: alternative text
        :align: center
        :width: 1200

CPEE in Action
**************

    The video below shows the CPEE in action. The instance is started, then two new orders are ordered.

    .. raw:: html

        <video width="600" height="500" controls>
          <source src="_static/videos/cpee.mp4" type="video/mp4">
          Your browser does not support the video tag.
        </video>


Website in Action
*****************

    This video below shows the website in action. The website is opened, then two new orders are ordered. One can see the status change as well as the shoutout at the end of the video. Sound on!!!

    .. raw:: html

        <video width="600" height="500" controls>
          <source src="_static/videos/website.mp4" type="video/mp4">
          Your browser does not support the video tag.
        </video>


User Perspective
****************

    This video shows the persepective of a user scanning the QR-Code and ordering a drink. The user scans the QR-Code, then orders a drink. The user can see the status changes appear on the website.

    .. raw:: html

        <video width="600" height="500" controls>
          <source src="_static/videos/user.mp4" type="video/mp4">
          Your browser does not support the video tag.
        </video>