summaryrefslogtreecommitdiff
path: root/yaksh/templates
diff options
context:
space:
mode:
authorCruiseDevice2019-06-07 16:55:08 +0530
committerCruiseDevice2019-06-07 16:55:08 +0530
commit22b7131f930bcb43f0f0fec238260c63ff3fd39a (patch)
treeb4c752f2ac682b0c86a1b600747fb2a7f87e4028 /yaksh/templates
parentec55273fcc0c374dbaf213910f760660fb1419a6 (diff)
downloadonline_test-22b7131f930bcb43f0f0fec238260c63ff3fd39a.tar.gz
online_test-22b7131f930bcb43f0f0fec238260c63ff3fd39a.tar.bz2
online_test-22b7131f930bcb43f0f0fec238260c63ff3fd39a.zip
Improve UI in offline Yaksh
Diffstat (limited to 'yaksh/templates')
-rw-r--r--yaksh/templates/yaksh/index.html54
-rw-r--r--yaksh/templates/yaksh/quiz.html103
-rw-r--r--yaksh/templates/yaksh/unit.html151
3 files changed, 200 insertions, 108 deletions
diff --git a/yaksh/templates/yaksh/index.html b/yaksh/templates/yaksh/index.html
index 9bd28d5..05ade47 100644
--- a/yaksh/templates/yaksh/index.html
+++ b/yaksh/templates/yaksh/index.html
@@ -27,32 +27,36 @@
{% endblock %}
</center>
</h1>
- {% block content %}
- <table class="table">
- {% for module in modules %}
- <tr>
- <td>
- {{module.name}}
- <div id="{{module.id}}" class="collapse">
- <ul class="list">
- {% for lesson in module.get_lesson_units %}
- <li>{{lesson.name}}</li>
+ <div class="row justify-content-md-center">
+ <div class="col-md-10">
+ {% block content %}
+ <table class="table">
+ {% for module in modules %}
+ <tr>
+ <td>
+ {{module.name}}
+ <div id="{{module.id}}" class="collapse">
+ <ul class="list">
+ {% for lesson in module.get_lesson_units %}
+ <li>{{lesson.name}}</li>
+ {% endfor %}
+ </ul>
+ </div>
+ </td>
+ <td>
+ <button class="btn btn-info" data-toggle="collapse" data-target="#{{module.id}}">
+ View Lessons
+ </button>
+ </td>
+ <td>
+ <a href="{{module.name|replace_spaces}}/{{module.name|replace_spaces}}.html" target="_blank" class="btn btn-primary">Go to Module</a>
+ </td>
+ </tr>
{% endfor %}
- </ul>
- </div>
- </td>
- <td>
- <button class="btn btn-info" data-toggle="collapse" data-target="#{{module.id}}">
- View Lessons
- </button>
- </td>
- <td>
- <a href="{{module.name|replace_spaces}}/{{module.name|replace_spaces}}.html" target="_blank" class="btn btn-primary">Go to Module</a>
- </td>
- </tr>
- {% endfor %}
- </table>
- {% endblock %}
+ </table>
+ {% endblock %}
+ </div>
+ </div>
</div>
<footer class="footer" id="footer_div">
<div class="container">
diff --git a/yaksh/templates/yaksh/quiz.html b/yaksh/templates/yaksh/quiz.html
index fd52e7d..256b282 100644
--- a/yaksh/templates/yaksh/quiz.html
+++ b/yaksh/templates/yaksh/quiz.html
@@ -4,12 +4,14 @@
<link rel="stylesheet" href="../../static/css/bootstrap.min.css">
<link rel="stylesheet" href="../../static/css/offline.css">
<link rel="stylesheet" href="../../static/css/video-js.css">
+ <link rel="stylesheet" href="../../static/css/yakshcustom.css" type="text/css" />
+
<title>
{% block pagetitle %} {{course.name}} {% endblock %}
</title>
</head>
<body>
-<nav class="navbar bg-dark navbar-dark">
+<nav class="navbar bg-dark navbar-dark fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="#">
@@ -20,40 +22,75 @@
</div>
</nav>
<div class="container" style="margin-top:50px">
- <center>
- <h1>
- {% block subtitle %}
- {{course.name}}
- {% endblock %}
- </h1>
- <hr>
- </center>
- {% block content %}
- <center><h2>{{module.name}}</h2></center>
- <hr>
- <div id="status"></div>
- <hr>
- <h3>{{unit.description}}</h3>
- <a href="http://127.0.0.1:8000/exam/start/{{quiz.questionpaper_set.get.id}}/{{module.id}}/{{course.id}}" target="_blank">{{quiz.description}}</a>
- <br>
-
- {% if unit.type == 'lesson' %}
- <a href="{{unit.lesson.name|replace_spaces}}/{{unit.lesson.name|replace_spaces}}.html" target="_blank" class="list-group-item">
- {{unit.lesson.name}}
- </a>
- {% else %}
- <a href="{{unit.quiz.description|replace_spaces}}/{{unit.quiz.description|replace_spaces}}.html" target="_blank" class="list-group-item">
- {{unit.quiz.description}}
- </a>
- {% endif %}
+
+ <div class="row">
+ <nav class="col-md-2 d-none d-md-block bg-light sidebar">
+ <div class="sidebar-sticky">
+ <ul class="nav flex-column">
+ <li class="nav-item">
+ <a class="nav-link active" href="#">
+ {{ module.name }}
+ </a>
+ </li>
+ <!-- loop -->
+ {% for unit in module.get_learning_units %}
+ {% if unit.type == 'lesson' %}
+ <li class="nav-item">
+ <a class="nav-link" href="../{{unit.lesson.name|replace_spaces}}/{{unit.lesson.name|replace_spaces}}.html">
+ {{unit.lesson.name}}
+ </a>
+ </li>
+ {% else %}
+ <li class="nav-item">
+ <a class="nav-link" href="../{{unit.quiz.description|replace_spaces}}/{{unit.quiz.description|replace_spaces}}.html">
+ {{unit.quiz.description}}
+ </a>
+ </li>
+ {% endif %}
+ {% endfor %}
+ <!-- End of loop -->
+ </ul>
+ </div>
+ </nav>
+ <main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-4">
+ <div class="col-md-10">
+ <center>
+ <h1>
+ {% block subtitle %}
+ {{course.name}}
+ {% endblock %}
+ </h1>
+ <hr>
+ </center>
+ {% block content %}
+ <center><h2>{{module.name}}</h2></center>
+ <hr>
+ <div id="status"></div>
+ <hr>
+ <br>
+ <div class="text-center">
+ <!-- Change Yaksh TODO -->
+ <a class="btn btn-success" href="http://127.0.0.1:8000/exam/start/{{quiz.questionpaper_set.get.id}}/{{module.id}}/{{course.id}}" target="_blank">{{quiz.description}}</a>
+ {% if next_unit.type == 'lesson' %}
+ <a class="btn btn-info" href="../{{next_unit.lesson.name|replace_spaces}}/{{next_unit.lesson.name|replace_spaces}}.html">
+ Next
+ </a>
+ {% else %}
+ <a class="btn btn-info" href="../{{next_unit.quiz.description|replace_spaces}}/{{next_unit.quiz.description|replace_spaces}}.html" target="_blank">
+ Next
+ </a>
+ {% endif %}
+ </div>
- {% endblock %}
-</div>
-<footer class="footer" id="footer_div">
- <div class="container">
- <p align="center">Developed by FOSSEE group, IIT Bombay</p>
+ {% endblock %}
+ </div>
+ </main>
</div>
-</footer>
+ <footer class="footer" id="footer_div">
+ <p align="center">Developed by FOSSEE group, IIT Bombay</p>
+ </footer>
+</div>
+
</body>
<script src="../../static/js/jquery-3.3.1.min.js"></script>
<script src="../../static/js/bootstrap.min.js"></script>
diff --git a/yaksh/templates/yaksh/unit.html b/yaksh/templates/yaksh/unit.html
index c5bb1e5..1526454 100644
--- a/yaksh/templates/yaksh/unit.html
+++ b/yaksh/templates/yaksh/unit.html
@@ -4,12 +4,14 @@
<link rel="stylesheet" href="../../static/css/bootstrap.min.css">
<link rel="stylesheet" href="../../static/css/offline.css">
<link rel="stylesheet" href="../../static/css/video-js.css">
+ <link rel="stylesheet" href="../../static/css/yakshcustom.css" type="text/css" />
+
<title>
{% block pagetitle %} {{module.name}} {% endblock %}
</title>
</head>
<body>
-<nav class="navbar bg-dark navbar-dark">
+<nav class="navbar bg-dark navbar-dark fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="#">
@@ -20,57 +22,106 @@
</div>
</nav>
<div class="container" style="margin-top:50px">
- <center>
- <h1>
- {% block subtitle %}
- {{course.name}}
- {% endblock %}
- </h1>
- <hr>
- </center>
- {% block content %}
- <center><h2>{{module.name}}</h2></center>
- <hr>
- <h3>{{lesson.name}}</h3>
- {% if lesson.video_file %}
- <video id="lesson_video" height="500" class="video-js" controls preload="auto" data-setup='{"playbackRates": [0.5, 1, 1.5, 2]}'>
- <source src="{{lesson.video_file.name|file_title}}">
- </video>
- {% endif %}
- <br>
- <table class="table">
- <tr>
- <td>
- {{lesson.html_data|safe}}
- </td>
- <td>
- {% if lesson_files %}
- <h4><strong>Lesson Files (Click on lesson file to download)
- </strong></h4>
- <ul class="list-group">
- {% for file in lesson_files %}
- <a href="{{file.file.name|file_title}}" class="list-group-item">
- {{file.file.name|file_title}}
+
+ <div class="row">
+ <nav class="col-md-2 d-none d-md-block bg-light sidebar">
+ <div class="sidebar-sticky">
+ <ul class="nav flex-column">
+ <li class="nav-item">
+ <a class="nav-link active" href="#">
+ {{ module.name }}
+ </a>
+ </li>
+ <!-- loop -->
+ {% for unit in module.get_learning_units %}
+ {% if unit.type == 'lesson' %}
+ <li class="nav-item">
+ <a class="nav-link" href="../{{unit.lesson.name|replace_spaces}}/{{unit.lesson.name|replace_spaces}}.html">
+ {{unit.lesson.name}}
+ </a>
+ </li>
+ {% else %}
+ <li class="nav-item">
+ <a class="nav-link" href="../{{unit.quiz.description|replace_spaces}}/{{unit.quiz.description|replace_spaces}}.html">
+ {{unit.quiz.description}}
+ </a>
+ </li>
+ {% endif %}
+ {% endfor %}
+ <!-- End of loop -->
+ </ul>
+ </div>
+ </nav>
+
+ <main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-4">
+ <div class="col-md-10">
+ <center>
+ <h1>
+ {% block subtitle %}
+ {{course.name}}
+ {% endblock %}
+ </h1>
+ <hr>
+ </center>
+ {% block content %}
+ <center><h2>{{module.name}}</h2></center>
+ <hr>
+ <h3>{{lesson.name}}</h3>
+ {% if lesson.video_file %}
+ <video id="lesson_video" height="500" class="video-js" controls preload="auto" data-setup='{"playbackRates": [0.5, 1, 1.5, 2]}'>
+ <source src="{{lesson.video_file.name|file_title}}">
+ </video>
+ {% endif %}
+ <br>
+ <table class="table">
+ <tr>
+ <td>
+ {{lesson.html_data|safe}}
+ </td>
+ </tr>
+ <tr>
+ <td>
+ {% if lesson_files %}
+ <h4><strong>Lesson Files (Click on lesson file to download)
+ </strong></h4>
+ <ul class="list-group">
+ {% for file in lesson_files %}
+ <a href="{{file.file.name|file_title}}" class="list-group-item">
+ {{file.file.name|file_title}}
+ </a>
+ {% endfor %}
+ </ul>
+ {% else %}
+ <ul class="list-group">
+ <li class="list-group-item">
+ <h4>No files for {{lesson.name}}</h4>
+ </li>
+ </ul>
+ {% endif %}
+ </td>
+ </tr>
+ </table>
+ <div class="text-center">
+ <!-- Change Yaksh TODO -->
+ {% if next_unit.type == 'lesson' %}
+ <a class="btn btn-info" href="../{{next_unit.lesson.name|replace_spaces}}/{{next_unit.lesson.name|replace_spaces}}.html">
+ Next
</a>
- {% endfor %}
- </ul>
- {% else %}
- <ul class="list-group">
- <li class="list-group-item">
- <h4>No files for {{lesson.name}}</h4>
- </li>
- </ul>
- {% endif %}
- </td>
- </tr>
- </table>
- {% endblock %}
-</div>
-<footer class="footer" id="footer_div">
- <div class="container">
- <p align="center">Developed by FOSSEE group, IIT Bombay</p>
+ {% else %}
+ <a class="btn btn-info" href="../{{next_unit.quiz.description|replace_spaces}}/{{next_unit.quiz.description|replace_spaces}}.html" target="_blank">
+ Next
+ </a>
+ {% endif %}
+ </div>
+ {% endblock %}
+ </div>
+ </main>
</div>
-</footer>
+ <footer class="footer" id="footer_div">
+ <p align="center">Developed by FOSSEE group, IIT Bombay</p>
+ </footer>
+</div>
+
</body>
<script src="../../static/js/jquery-3.3.1.min.js"></script>
<script src="../../static/js/bootstrap.min.js"></script>