Interview question bank - preliminary version

requirements.txt

@@ -2,3 +2,5 @@ Django==1.7
 Pillow==2.4.0
 psycopg2==2.5.3
 pystache==0.5.4
+django-markdown==0.8.4
+django-mathjax==0.0.5

upe/settings.py

@@ -37,6 +37,8 @@
     'django.contrib.sessions',
     'django.contrib.messages',
     'django.contrib.staticfiles',
+    'django_markdown',
+    'django_mathjax',
     'website',
     'upe_calendar',
     'users'
@@ -105,3 +107,16 @@
 EMAIL_USE_TLS   = False
 DEFAULT_FROM_EMAIL  = 'Do-Not-Reply <[email protected]>'
 
+MATHJAX_ENABLED=True
+
+MATHJAX_CONFIG_DATA = {
+  "tex2jax": {
+    "inlineMath":
+      [
+          ['\\(','\\)']
+      ]
+  }
+}
+
+MARKDOWN_EXTENSIONS = ['extra']
+

upe/urls.py

@@ -38,5 +38,5 @@
     url(r'^static/(?P<path>.*)$', 'django.views.static.serve', {
         'document_root': settings.STATIC_ROOT,
     }),
-
+    url('^markdown/', include( 'django_markdown.urls')),
 )

website/admin.py

@@ -1 +1,5 @@
 from django.contrib import admin
+from website.models import *
+
+admin.site.register(QuestionTag)
+admin.site.register(Question)

website/models.py

@@ -1,2 +1,25 @@
 from django.db import models
+from django_markdown.models import MarkdownField
+
+class QuestionTag(models.Model):
+    tag = models.CharField(max_length=100)
+    def __str__(self):
+        return self.tag
+
+class Question(models.Model):
+    tags = models.ManyToManyField(QuestionTag)
+    title = models.CharField(max_length=100)
+    text = MarkdownField()
+    solution = MarkdownField()
+    difficulty = models.PositiveSmallIntegerField()
+
+    def __str__(self):
+        return self.title
+
+
+
+
+
+
+
 

website/static/website/css/interview.css

@@ -0,0 +1,50 @@
+#questions-sidebar {
+	height: 700px;
+	overflow: auto;
+	padding: 0;
+	margin: 0;
+}
+#questions-table {
+	cursor: pointer;
+}
+#targ-question {
+	height: 700px;
+	padding: 0;
+	margin: 0;
+	position: relative;
+}
+
+#targ-question iframe {
+    height: 700px;
+    width: 100%;
+    padding: 0;
+    margin: 0;
+}
+
+
+#question-soln {
+	margin-top: 10px;
+}
+#nav-questions {
+	margin-top: 10px;
+	margin-bottom: 20px;
+}
+
+#question-wrapper {
+    padding-left: 16px;
+    padding-right: 16px;
+}
+
+.tag {
+    display: inline;
+    padding: .2em .6em .3em;
+    font-size: 75%;
+    font-weight: bold;
+    line-height: 1;
+    color: #fff;
+    text-align: center;
+    white-space: nowrap;
+    vertical-align: baseline;
+    background: #43ACC5;
+    margin-right: .2em;
+}

website/templates/website/header_footer.html

@@ -45,6 +45,7 @@
             <a href="#">Student Services</a>
             <ul id="subnav-2" class="subnav">
                 <li><a href="/oh">Office Hours</a></li>
+                <li><a href="/interview">Interview Question Bank</a></li>
             </ul>
           </li>
           <li class="header-section pull-right">

website/templates/website/interview.html

@@ -0,0 +1,57 @@
+{% extends "website/header_footer.html" %}
+{% load staticfiles %}
+{% block javascript %}
+  <link rel="shortcut icon" href="{% static "website/favicon.ico" %}" type="image/x-icon">
+  <link rel=icon href="{% static "website/favicon.ico" %}" type="image/x-icon">
+  <link href="{% static "website/css/bootstrap.min.css" %}" rel="stylesheet">
+  <link href="{% static "website/css/header_style.css" %}" rel="stylesheet">
+  <link href="{% static "website/css/interview.css" %}" rel="stylesheet">
+
+  	<script src="{% static "website/js/jquery_1.11.0.min.js" %}"></script>
+	<script src="{% static "website/js/modernizr_custom_79639.js" %}"></script>
+  	<script src="{% static "website/js/ba_cond.min.js" %}"></script>
+  	<!-- <script src="{% static "website/js/landingpage_banner_custom.js" %}"></script> -->
+  	<script src="{% static "website/js/landingpage_main_custom.js" %}"></script>
+  	<script src="{% static "website/js/isotope.min.js" %}"></script>
+  	<script src="{% static "website/js/office_hours.json" %}"></script>
+  	<script src="{% static "website/js/office_hours.js" %}"></script>
+ 	<script src="{% static "website/js/bootstrap.min.js" %}"></script>
+{% endblock %}
+{% block content %}
+<div class="container-fluid">
+	<div class="row">
+		<div class="col-xs-2" id="questions-sidebar">
+			<table class="table table-hover" id="questions-table">
+				{% for q in questions %}
+                <tr><td class="question" id="{{q.id}}">
+                    <b>{{q.title}}</b><br>
+                    {% for tag in q.tags.all %}
+                    <span class="tag">{{tag}}</span>
+                    {% endfor %}
+                </td></tr>
+                {% endfor %}
+			</table>
+		</div>
+		<div class="col-xs-10" id="targ-question">
+			<iframe id="question_frame" frameborder="0"></iframe>
+		</div>
+	</div>
+</div>
+<script>
+	$(".question").click(function(event) {
+	    var elements = document.getElementsByClassName("question")
+        for (var i = 0; i < elements.length; i++) {
+            elements[i].style.backgroundColor= "#fff";
+        }
+	    event.target.style.backgroundColor = "#eee";
+	    var id = event.target.id;
+	    var container = $("#targ-question");
+	    container.empty();
+	    container.append("<iframe src='/interview/question/" + id + "' frameborder='0'/>");
+	});
+	$(".tag").click(function(event) {
+	    var name = event.target.innerHTML;
+	    window.location.href = window.location.href.split("/interview/")[0] + "/interview/tagged/" + name;
+	});
+</script>
+{% endblock %}

website/templates/website/interview_question.html

@@ -0,0 +1,37 @@
+{% load staticfiles %}
+{% load mathjax %}
+{% load django_markdown %}
+{% block javascript %}
+  <link href="{% static "website/css/bootstrap.min.css" %}" rel="stylesheet">
+  <link href="{% static "website/css/header_style.css" %}" rel="stylesheet">
+  <link href="{% static "website/css/interview.css" %}" rel="stylesheet">
+
+  	<script src="{% static "website/js/jquery_1.11.0.min.js" %}"></script>
+	<script src="{% static "website/js/modernizr_custom_79639.js" %}"></script>
+  	<script src="{% static "website/js/ba_cond.min.js" %}"></script>
+  	<!-- <script src="{% static "website/js/landingpage_banner_custom.js" %}"></script> -->
+  	<script src="{% static "website/js/landingpage_main_custom.js" %}"></script>
+  	<script src="{% static "website/js/isotope.min.js" %}"></script>
+  	<script src="{% static "website/js/office_hours.json" %}"></script>
+  	<script src="{% static "website/js/office_hours.js" %}"></script>
+ 	<script src="{% static "website/js/bootstrap.min.js" %}"></script>
+    {% mathjax_scripts %}
+{% endblock %}
+<div id="question-wrapper">
+<h2 id="question-title">{{question.title}}</h2>
+<p id="question-txt">{{question.text|markdown}}</p>
+<div id="soln-handler">
+	<button class="btn btn-primary" id="toggle-soln" type="button" data-toggle="collapse" data-target="#question-soln" aria-expanded="false">Show Solution</button>
+	<div class="collapse" id="question-soln">
+		<div class="well">{{question.solution|markdown}}</div>
+	</div>
+</div>
+</div>
+<!--
+ADD SUPPORT FOR THESE LATER
+<div id="nav-questions">
+	<button class="btn btn-primary" id="prev-question">Previous Question</button>
+	<button class="btn btn-primary" id="next-question">Next Question</button>
+</div>-->
+<script>
+</script>

website/urls.py

@@ -10,4 +10,7 @@
 
     url(r'^$', 'website.views.index', name='index'),
     url(r'^oh/$', 'website.views.oh', name='oh'),
+    url(r'^interview/$', 'website.views.interview', name='interview'),
+    url(r'^interview/question/(?P<ident>\d+)/$', 'website.views.interview_question', name='interview_question'),
+    url(r'^interview/tagged/(?P<tag>.+)/$', 'website.views.interview_tagged', name='interview_tagged')
 )

website/views.py

@@ -8,6 +8,7 @@
 from django.core.serializers.json import DjangoJSONEncoder
 import json, re
 from users.models import *
+from website.models import *
 
 def index(request):
     template = loader.get_template('website/index.html')
@@ -21,3 +22,16 @@ def index(request):
 
 def oh(request):
     return render(request, 'website/oh.html', {})
+
+def interview(request):
+    questions = Question.objects.order_by('difficulty')
+    return render(request, 'website/interview.html', { 'questions': questions})
+
+def interview_question(request, ident):
+    question = Question.objects.get(id=int(ident))
+    return render(request, 'website/interview_question.html', {'question': question})
+
+def interview_tagged(request, tag):
+    tagObj = QuestionTag.objects.get(tag=tag)
+    questions = Question.objects.filter(tags=tagObj).order_by('difficulty')
+    return render(request, 'website/interview.html', {'questions': questions})