diff --git a/common/lib/xmodule/xmodule/course_module.py b/common/lib/xmodule/xmodule/course_module.py
index 681c231c43..f00a22782c 100644
--- a/common/lib/xmodule/xmodule/course_module.py
+++ b/common/lib/xmodule/xmodule/course_module.py
@@ -127,6 +127,10 @@ class CourseDescriptor(SequenceDescriptor):
     def grade_cutoffs(self):
         return self._grading_policy['GRADE_CUTOFFS']
 
+    @property
+    def show_calculator(self):
+        return self.metadata.get("show_calculator", None) == "Yes"
+
     @lazyproperty
     def grading_context(self):
         """
diff --git a/lms/static/coffee/src/calculator.coffee b/lms/static/coffee/src/calculator.coffee
index 18e7fba4ec..788081ebd6 100644
--- a/lms/static/coffee/src/calculator.coffee
+++ b/lms/static/coffee/src/calculator.coffee
@@ -8,12 +8,15 @@ class @Calculator
 
   toggle: (event) ->
     event.preventDefault()
-    $('li.calc-main').toggleClass 'open'
-    $('#calculator_wrapper #calculator_input').focus()
+    $('div.calc-main').toggleClass 'open'
     if $('.calc.closed').length
       $('.calc').attr 'aria-label', 'Open Calculator'
     else
       $('.calc').attr 'aria-label', 'Close Calculator'
+      # TODO: Investigate why doing this without the timeout causes it to jump
+      # down to the bottom of the page. I suspect it's because it's putting the
+      # focus on the text field before it transitions onto the page.
+      setTimeout (-> $('#calculator_wrapper #calculator_input').focus()), 100
 
     $('.calc').toggleClass 'closed'
 
diff --git a/lms/static/images/info-icon.png b/lms/static/images/info-icon.png
new file mode 100644
index 0000000000..736b2f2374
Binary files /dev/null and b/lms/static/images/info-icon.png differ
diff --git a/lms/static/sass/course.scss b/lms/static/sass/course.scss
index 6c63c17f1f..a8d93c4410 100644
--- a/lms/static/sass/course.scss
+++ b/lms/static/sass/course.scss
@@ -20,6 +20,7 @@
 @import 'course/courseware/courseware';
 @import 'course/courseware/sidebar';
 @import 'course/courseware/amplifier';
+@import 'course/layout/calculator';
 
 
 // course-specific courseware (all styles in these files should be gated by a
diff --git a/lms/static/sass/course/layout/_calculator.scss b/lms/static/sass/course/layout/_calculator.scss
index 117f5a78be..2819546f9f 100644
--- a/lms/static/sass/course/layout/_calculator.scss
+++ b/lms/static/sass/course/layout/_calculator.scss
@@ -1,4 +1,4 @@
-li.calc-main {
+div.calc-main {
   bottom: -126px;
   left: 0;
   position: fixed;
@@ -9,10 +9,6 @@ li.calc-main {
 
   &.open {
     bottom: -36px;
-
-    div#calculator_wrapper form div.input-wrapper div.help-wrapper dl {
-      display: block;
-    }
   }
 
   a.calc {
@@ -27,7 +23,7 @@ li.calc-main {
     margin-right: 10px;
     padding: 8px 12px;
     position: relative;
-    top: -36px;
+    top: -45px;
     width: 16px;
 
     &:hover {
@@ -36,6 +32,7 @@ li.calc-main {
 
     &.closed {
       background-image: url("../images/close-calc-icon.png");
+      top: -36px;
     }
   }
 
@@ -61,6 +58,7 @@ li.calc-main {
         float: left;
         font-size: 30px;
         font-weight: bold;
+        height: 35px;
         margin: 0 (flex-gutter() / 2);
         padding: 0;
         text-shadow: none;
@@ -73,7 +71,7 @@ li.calc-main {
       }
 
       input#calculator_output {
-        background: #222;
+        background: #111;
         border: 0;
         @include box-shadow(none);
         @include box-sizing(border-box);
@@ -111,14 +109,14 @@ li.calc-main {
 
         div.help-wrapper {
           position: absolute;
-          right: 8px;
-          top: 15px;
+          right: 0;
+          top: 0;
 
           a {
             background: url("../images/info-icon.png") center center no-repeat;
-            height: 17px;
+            height: 35px;
             @include hide-text;
-            width: 17px;
+            width: 35px;
           }
 
           dl {
@@ -127,28 +125,30 @@ li.calc-main {
             @include box-shadow(0 0 3px #999);
             color: #333;
             display: none;
+            line-height: lh();
             opacity: 0;
             padding: 10px;
             position: absolute;
             right: -40px;
-            top: -110px;
+            top: -122px;
             @include transition();
-            width: 500px;
+            width: 600px;
 
             &.shown {
+              display: block;
               opacity: 1;
-              top: -115px;
             }
 
             dt {
               clear: both;
               float: left;
               font-weight: bold;
-              padding-right: lh(.5);
+              padding-right: 12px;
             }
 
             dd {
               float: left;
+              margin-left: 0;
             }
           }
         }
diff --git a/lms/templates/courseware/courseware.html b/lms/templates/courseware/courseware.html
index 2950aa827e..0d390d83a2 100644
--- a/lms/templates/courseware/courseware.html
+++ b/lms/templates/courseware/courseware.html
@@ -72,3 +72,39 @@
     </section>
   </div>
 </section>
+
+
+% if course.show_calculator:
+    <div class="calc-main">
+        <a aria-label="Open Calculator" href="#" class="calc">Calculator</a>
+
+        <div id="calculator_wrapper">
+            <form id="calculator">
+                <div class="input-wrapper">
+                    <input type="text" id="calculator_input" />
+
+                    <div class="help-wrapper">
+                        <a href="#">Hints</a>
+                        <dl class="help">
+                            <dt>Suffixes:</dt>
+                            <dd> %kMGTcmunp</dd>
+                            <dt>Operations:</dt>
+                            <dd>^ * / + - ()</dd>
+                            <dt>Functions:</dt>
+                            <dd>sin, cos, tan, sqrt, log10, log2, ln, arccos, arcsin, arctan, abs </dd>
+                            <dt>Constants</dt>
+                            <dd>e, pi</dd>
+
+                            <!-- Students won't know what parallel means at this time.  Complex numbers aren't well tested in the courseware, so we would prefer to not expose them.  If you read the comments in the source, feel free to use them. If you run into a bug, please let us know. But we can't officially support them right now.
+
+                            <dt>Unsupported:</dt> <dd>||, j </dd>  -->
+                        </dl>
+                    </div>
+                </div>
+                <input id="calculator_button" type="submit" value="="/>
+                <input type="text" id="calculator_output"  readonly />
+            </form>
+
+        </div>
+    </div>
+% endif
diff --git a/lms/urls.py b/lms/urls.py
index 21d434272e..8659a282aa 100644
--- a/lms/urls.py
+++ b/lms/urls.py
@@ -111,7 +111,7 @@ if settings.COURSEWARE_ENABLED:
             name='change_setting'),
 
         # TODO: These views need to be updated before they work
-        # url(r'^calculate$', 'util.views.calculate'),
+        url(r'^calculate$', 'util.views.calculate'),
         # TODO: We should probably remove the circuit package. I believe it was only used in the old way of saving wiki circuits for the wiki
         # url(r'^edit_circuit/(?P<circuit>[^/]*)$', 'circuit.views.edit_circuit'),
         # url(r'^save_circuit/(?P<circuit>[^/]*)$', 'circuit.views.save_circuit'),