{% extends "global/Page.html" %}
{% load otree static %}

{% block title %}
    Scenario
{% endblock %}

{% block scripts %}

<script src="{% static 'back_button_v1/js/prev_next_button.js' %}"></script>

{% endblock %}


{% block styles %}

<link href="{% static 'back_button_v1/css/custom.css' %}" rel="stylesheet">

{% endblock %}


{% block content %}
<img src="{% static 'global/meetingRoomPink.jpg' %}" width="500"/>

<p>

    <b>Some more information: </b>
    You are part of the marketing department within the publishing company <em>"Zebra-Readerz"</em>. <br>
    When you heard that a new project with a new author just came in, you applied to be a part of it.<br><br>
    For a new author, a variety of roles are needed within the company in order to fulfill tasks such as:<br>
    - edit his or her new book <br>
    - plan a book tour for publicity <br>
    - create marketing material for the release and the tour <br>
    - and more...<br>
    <br>
    For the application process, <em>Zebra-Readerz</em> created a new process during which you had to fill out an online portfolio.<br>
    This is supposed to help with an effective team formation. <br>
    <br>
    You just heard back from the Project Manager: <b>Congratulations, you successfully applied for the new project!</b><br>
    Below, you can find some of the <b>most important information</b> from the portfolios of your new teammates.<br><br>

    <b><em>Please read them carefully.</em></b>

</p>

<!-- Tab navigation -->
<ul class="nav nav-tabs   fixed-center navbar-light bg-light justify-content-center" id="myTab" role="tablist">


  <li class="nav-item">
    <a class="nav-link active"
       id="part1-tab"
       data-toggle="tab"
       href="#part1" role="tab"
       aria-controls="part1"
       onclick="topFunction()"> Team Member: Editor
    </a>
  </li>


  <li class="nav-item">
    <a class="nav-link"
       id="part2-tab"
       data-toggle="tab"
       href="#part2"
       role="tab"
       aria-controls="part2"
       onclick="topFunction()">Team Member: Designer
    </a>
  </li>

  <li class="nav-item">
    <a class="nav-link"
       id="part3-tab"
       data-toggle="tab"
       href="#part3"
       role="tab"
       aria-controls="part3"
       onclick="topFunction()">Team Member: Data Analyst
    </a>
  </li>

  <li class="nav-item">
    <a class="nav-link"
       id="part4-tab"
       data-toggle="tab"
       href="#part4"
       role="tab"
       aria-controls="part4"
       onclick="topFunction()">Team Member: Financial Advisor
    </a>
  </li>

</ul>
<br>
<br>


<!-- Tab content -->
<div class="tab-content" id="myTabContent">

  <div class="tab-pane show active" id="part1" role="tabpanel" aria-labelledby="part1-tab">


    <div class="card-header bg-transparent mainheader" >
        <h3 class="card-title  mt-3 mb-3"> Team Member: Editor</h3>
    </div>
    <br>
    <p>
        <b>Name:</b> Nina Johnson<br>
        <b>Title:</b> Senior Editor <br>
        <br>
        <b>My top three qualities:</b><br>
        (1) I am very well-read<br>
        (2) I am a critical thinker<br>
        (3) I love to work with other people, so I'd say I have social competence.<br>
        <br>
        <b>What others in the company should know about you:</b><br>
        I often work with authors that cover topics regarding fairness, discrimination and humanity-centered aspects.<br>
        I like to work with authors who speak up for equality and justice. <br>
        <br>
        <i>
            <b>What some of your co-workers told you about Nina:</b><<br>
            She is known for her amazing work with authors and for the professional way she treats them.
            She has already published some very well-known authors.<br>
             <br>
            <b>Additional information that you noticed:</b><br>
            From her profile picture you know that she also loves to travel. <br>
            This is something you two have in common.
        </i>

    </p>

 <!--    <button onclick="topFunction()" type="button" class="nexttab btn-primary btn next">Next</button>-->
    </div>


  <div class="tab-pane" id="part2" role="tabpanel" aria-labelledby="part2-tab">


    <div class="card-header bg-transparent mainheader" >
        <h3 class="card-title  mt-3 mb-3"> Team Member: Designer </h3>
    </div>
    <br>
    <p>
        <b>Name:</b> Daniel De Luca<br>
        <b>Title:</b> Book Cover and Marketing Material Designer<br>
        <br>
        <b>My top three qualities:</b><br>
        (1) I am very creative<br>
        (2) I come to work with enthusiasm<br>
        (3) I am good at taking criticism and turning it into something beautiful.<br>
        <br>
        <b>Certifications:</b> Certificate for best Design<br>
        <br>
        <b>What others in the company should know about you:</b><br>
        I am very open minded and enthusiastic in nature. <br>
        I have fun at work and like to bring as many diverse design-options as possible to a meeting.<br>
        <br>
        <i>
            <b>What some of your co-workers told you about Daniel:</b><br>
            Some of his cover-designs can be seen on canvases throughout the office.<br>
            From the diversity of those covers, you know that he is super creative.<br>
            <br>
             <b>Additional information that you noticed:</b><br>
            From the company-profile you know that Daniel grew up in the same home town as you.

        </i>
    </p>


 <!--    <button onclick="topFunction()" type="button" class="prevtab btn-primary btn back">Back</button>
    <button onclick="topFunction()" type="button" class="nexttab btn-primary btn next">Next</button>-->
    </div>


  <div class="tab-pane" id="part3" role="tabpanel" aria-labelledby="part3-tab">


    <div class="card-header bg-transparent mainheader" >
        <h3 class="card-title  mt-3 mb-3">Team Member: Data Analyst </h3>
    </div>
    <br>
    <p>
        <b>Name:</b> Stefanie Brown<br>
        <b>Title:</b> Data Analyst <br>
        <br>
        <b>My top three qualities:</b><br>
        (1) Others say I am smart.<br>
        (2) I am an analytical thinker and like to approach problems in a logical way<br>
        (3) I am good at retrieving the important information from an overload of information/data.<br>
        <br>
        <b>Skills:</b> Programming in Java, C++, Python, R and DAX<br>
        <br>
        <b>What others in the company should know about you:</b><br>
        Most people don't really know what I do. I am responsible for the creation of Business Intelligence tools to aggregate and visualize the company's data. <br>
        To give an example: I have created the tool editors, marketers and sales people use in order to look up where (geographically) a certain genre, book or author receives more attention than others.<br>
        <br>
        <i>
            <b>What some of your co-workers told you about Stefanie:</b><br>
            She is very consistent with his work, all her tools are very user-friendly and do what they're supposed to do. <br>
             Additionally, other employees have gushed about her ability to keep promises and deadlines regarding e.g. new features of tools.<br>
            <br>
            <b>Additional information that you noticed:</b><br>
            You know the tool she talks about, as you yourself use it for a couple of projects.
            Like Stefanie, you also like to solve problems with an analytical approach.
        </i>
    </p>



 <!--    <button onclick="topFunction()" type="button" class="prevtab btn-primary btn back">Back</button>
    <button onclick="topFunction()" type="button" class="nexttab btn-primary btn next">Next</button> -->
  </div>

    <div class="tab-pane" id="part4" role="tabpanel" aria-labelledby="part4-tab">


    <div class="card-header bg-transparent mainheader" >
        <h3 class="card-title  mt-3 mb-3">Team Member: Financial Advisor </h3>
    </div>
    <br>
    <p>
        <b>Name:</b> Robert Nolen<br>
        <b>Title:</b> Finance Advisor <br>
        <br>
        <b>My top three qualities:</b><br>
        (1) I am very good with numbers<br>
        (2) I value punctuality<br>
        (3) My rational approach to projects has always led to a good estimation of the budget needed.<br>
        <br>
        <i>
            <b>What others in the company should know about you:</b><br>
             I have graduated with honours from one of the top Finance and Accounting Schools in the world.<br><br>
            <b>What some of your co-workers told you about Robert:</b><br>
            He seems to be very reliable and accurate in his calculations. No one that has worked with him before has ever had problems concerning the budget.<br>
            <br>
            <b>Additional information that you noticed:</b><br>
            You like that Robert is a person that values punctuality. It bothers you when people are late for a meeting.
        </i>
    </p>



 <!--    <button onclick="topFunction()" type="button" class="prevtab btn-primary btn back">Back</button>
    <button class="nexttab btn-primary btn next">Next</button> -->
         {% next_button %}
  </div>


</div>




</div>

</body>


{% endblock %}