Bunch of new theory pages

admin/css/base.css

@@ -424,7 +424,8 @@ textarea {
     vertical-align: top !important;
 }
 
-input[type=text], input[type=password], textarea, select, .vTextField {
+input[type=text], input[type=password], input[type=email], input[type=url], input[type=number],
+textarea, select, .vTextField {
     border: 1px solid #ccc;
 }
 

admin/css/changelists.css

@@ -32,6 +32,10 @@
     padding-right: 1em;
 }
 
+#changelist-form .results {
+  overflow-x: auto;
+}
+
 #changelist .toplinks {
     border-bottom: 1px solid #ccc !important;
 }

admin/css/dashboard.css

@@ -23,8 +23,8 @@ ul.actionlist li {
     list-style-type: none;
 }
 
-ul.actionlist li.changelink {
+ul.actionlist li {
     overflow: hidden;
     text-overflow: ellipsis;
     -o-text-overflow: ellipsis;
-}
+}

admin/css/forms.css

@@ -65,6 +65,7 @@ form ul.inline li {
     padding: 3px 10px 0 0;
     float: left;
     width: 8em;
+    word-wrap: break-word;
 }
 
 .aligned ul label {

admin/css/login.css

@@ -29,17 +29,20 @@ body.login {
 }
 
 .login .form-row label {
-    float: left;
-    width: 9em;
     padding-right: 0.5em;
     line-height: 2em;
-    text-align: right;
     font-size: 1em;
+    clear: both;
     color: #333;
 }
 
 .login .form-row #id_username, .login .form-row #id_password {
-    width: 14em;
+    clear: both;
+    padding: 6px;
+    width: 100%;
+    -webkit-box-sizing: border-box;
+       -moz-box-sizing: border-box;
+            box-sizing: border-box;
 }
 
 .login span.help {

admin/css/widgets.css

@@ -1,18 +1,18 @@
 /* SELECTOR (FILTER INTERFACE) */
 
 .selector {
-    width: 580px;
+    width: 840px;
     float: left;
 }
 
 .selector select {
-    width: 270px;
+    width: 400px;
     height: 17.2em;
 }
 
 .selector-available, .selector-chosen {
     float: left;
-    width: 270px;
+    width: 400px;
     text-align: center;
     margin-bottom: 5px;
 }
@@ -48,7 +48,7 @@
 }
 
 .selector .selector-available input {
-    width: 230px;
+    width: 360px;
 }
 
 .selector ul.selector-chooser {

admin/js/actions.js

@@ -9,7 +9,7 @@
 			} else {
 				reset();
 			}
-			$(actionCheckboxes).attr("checked", checked)
+			$(actionCheckboxes).prop("checked", checked)
 				.parent().parent().toggleClass(options.selectedClass, checked);
 		},
 		updateCounter = function() {
@@ -19,7 +19,7 @@
 				sel: sel,
 				cnt: _actions_icnt
 			}, true));
-			$(options.allToggle).attr("checked", function() {
+			$(options.allToggle).prop("checked", function() {
 				if (sel == actionCheckboxes.length) {
 					value = true;
 					showQuestion();
@@ -64,7 +64,7 @@
 			}
 		});
 		$(options.allToggle).show().click(function() {
-			checker($(this).attr("checked"));
+			checker($(this).prop("checked"));
 			updateCounter();
 		});
 		$("div.actions span.question a").click(function(event) {
@@ -74,7 +74,7 @@
 		});
 		$("div.actions span.clear a").click(function(event) {
 			event.preventDefault();
-			$(options.allToggle).attr("checked", false);
+			$(options.allToggle).prop("checked", false);
 			clearAcross();
 			checker(0);
 			updateCounter();
@@ -85,14 +85,14 @@
 			var target = event.target ? event.target : event.srcElement;
 			if (lastChecked && $.data(lastChecked) != $.data(target) && event.shiftKey === true) {
 				var inrange = false;
-				$(lastChecked).attr("checked", target.checked)
+				$(lastChecked).prop("checked", target.checked)
 					.parent().parent().toggleClass(options.selectedClass, target.checked);
 				$(actionCheckboxes).each(function() {
 					if ($.data(this) == $.data(lastChecked) || $.data(this) == $.data(target)) {
 						inrange = (inrange) ? false : true;
 					}
 					if (inrange) {
-						$(this).attr("checked", target.checked)
+						$(this).prop("checked", target.checked)
 							.parent().parent().toggleClass(options.selectedClass, target.checked);
 					}
 				});

admin/js/actions.min.js

@@ -1,6 +1,6 @@
-(function(a){a.fn.actions=function(n){var b=a.extend({},a.fn.actions.defaults,n),e=a(this),g=false,k=function(c){c?i():j();a(e).attr("checked",c).parent().parent().toggleClass(b.selectedClass,c)},f=function(){var c=a(e).filter(":checked").length;a(b.counterContainer).html(interpolate(ngettext("%(sel)s of %(cnt)s selected","%(sel)s of %(cnt)s selected",c),{sel:c,cnt:_actions_icnt},true));a(b.allToggle).attr("checked",function(){if(c==e.length){value=true;i()}else{value=false;l()}return value})},i=
+(function(a){a.fn.actions=function(n){var b=a.extend({},a.fn.actions.defaults,n),e=a(this),g=false,k=function(c){c?i():j();a(e).prop("checked",c).parent().parent().toggleClass(b.selectedClass,c)},f=function(){var c=a(e).filter(":checked").length;a(b.counterContainer).html(interpolate(ngettext("%(sel)s of %(cnt)s selected","%(sel)s of %(cnt)s selected",c),{sel:c,cnt:_actions_icnt},true));a(b.allToggle).prop("checked",function(){if(c==e.length){value=true;i()}else{value=false;l()}return value})},i=
 function(){a(b.acrossClears).hide();a(b.acrossQuestions).show();a(b.allContainer).hide()},m=function(){a(b.acrossClears).show();a(b.acrossQuestions).hide();a(b.actionContainer).toggleClass(b.selectedClass);a(b.allContainer).show();a(b.counterContainer).hide()},j=function(){a(b.acrossClears).hide();a(b.acrossQuestions).hide();a(b.allContainer).hide();a(b.counterContainer).show()},l=function(){j();a(b.acrossInput).val(0);a(b.actionContainer).removeClass(b.selectedClass)};a(b.counterContainer).show();
-a(this).filter(":checked").each(function(){a(this).parent().parent().toggleClass(b.selectedClass);f();a(b.acrossInput).val()==1&&m()});a(b.allToggle).show().click(function(){k(a(this).attr("checked"));f()});a("div.actions span.question a").click(function(c){c.preventDefault();a(b.acrossInput).val(1);m()});a("div.actions span.clear a").click(function(c){c.preventDefault();a(b.allToggle).attr("checked",false);l();k(0);f()});lastChecked=null;a(e).click(function(c){if(!c)c=window.event;var d=c.target?
-c.target:c.srcElement;if(lastChecked&&a.data(lastChecked)!=a.data(d)&&c.shiftKey===true){var h=false;a(lastChecked).attr("checked",d.checked).parent().parent().toggleClass(b.selectedClass,d.checked);a(e).each(function(){if(a.data(this)==a.data(lastChecked)||a.data(this)==a.data(d))h=h?false:true;h&&a(this).attr("checked",d.checked).parent().parent().toggleClass(b.selectedClass,d.checked)})}a(d).parent().parent().toggleClass(b.selectedClass,d.checked);lastChecked=d;f()});a("form#changelist-form table#result_list tr").find("td:gt(0) :input").change(function(){g=
+a(this).filter(":checked").each(function(){a(this).parent().parent().toggleClass(b.selectedClass);f();a(b.acrossInput).val()==1&&m()});a(b.allToggle).show().click(function(){k(a(this).prop("checked"));f()});a("div.actions span.question a").click(function(c){c.preventDefault();a(b.acrossInput).val(1);m()});a("div.actions span.clear a").click(function(c){c.preventDefault();a(b.allToggle).prop("checked",false);l();k(0);f()});lastChecked=null;a(e).click(function(c){if(!c)c=window.event;var d=c.target?
+c.target:c.srcElement;if(lastChecked&&a.data(lastChecked)!=a.data(d)&&c.shiftKey===true){var h=false;a(lastChecked).prop("checked",d.checked).parent().parent().toggleClass(b.selectedClass,d.checked);a(e).each(function(){if(a.data(this)==a.data(lastChecked)||a.data(this)==a.data(d))h=h?false:true;h&&a(this).prop("checked",d.checked).parent().parent().toggleClass(b.selectedClass,d.checked)})}a(d).parent().parent().toggleClass(b.selectedClass,d.checked);lastChecked=d;f()});a("form#changelist-form table#result_list tr").find("td:gt(0) :input").change(function(){g=
 true});a('form#changelist-form button[name="index"]').click(function(){if(g)return confirm(gettext("You have unsaved changes on individual editable fields. If you run an action, your unsaved changes will be lost."))});a('form#changelist-form input[name="_save"]').click(function(){var c=false;a("div.actions select option:selected").each(function(){if(a(this).val())c=true});if(c)return g?confirm(gettext("You have selected an action, but you haven't saved your changes to individual fields yet. Please click OK to save. You'll need to re-run the action.")):
 confirm(gettext("You have selected an action, and you haven't made any changes on individual fields. You're probably looking for the Go button rather than the Save button."))})};a.fn.actions.defaults={actionContainer:"div.actions",counterContainer:"span.action-counter",allContainer:"div.actions span.all",acrossInput:"div.actions input.select-across",acrossQuestions:"div.actions span.question",acrossClears:"div.actions span.clear",allToggle:"#action-toggle",selectedClass:"selected"}})(django.jQuery);

admin/js/admin/DateTimeShortcuts.js

@@ -6,6 +6,8 @@ var DateTimeShortcuts = {
     calendars: [],
     calendarInputs: [],
     clockInputs: [],
+    dismissClockFunc: [],
+    dismissCalendarFunc: [],
     calendarDivName1: 'calendarbox', // name of calendar <div> that gets toggled
     calendarDivName2: 'calendarin',  // name of <div> that contains calendar
     calendarLinkName: 'calendarlink',// name of the link that is used to toggle
@@ -39,6 +41,7 @@ var DateTimeShortcuts = {
     addClock: function(inp) {
         var num = DateTimeShortcuts.clockInputs.length;
         DateTimeShortcuts.clockInputs[num] = inp;
+        DateTimeShortcuts.dismissClockFunc[num] = function() { DateTimeShortcuts.dismissClock(num); return true; };
 
         // Shortcut links (clock icon and "Now" link)
         var shortcuts_span = document.createElement('span');
@@ -76,7 +79,7 @@ var DateTimeShortcuts = {
         clock_box.className = 'clockbox module';
         clock_box.setAttribute('id', DateTimeShortcuts.clockDivName + num);
         document.body.appendChild(clock_box);
-        addEvent(clock_box, 'click', DateTimeShortcuts.cancelEventPropagation);
+        addEvent(clock_box, 'click', cancelEventPropagation);
 
         quickElement('h2', clock_box, gettext('Choose a time'));
         var time_list = quickElement('ul', clock_box, '');
@@ -118,11 +121,11 @@ var DateTimeShortcuts = {
 
         // Show the clock box
         clock_box.style.display = 'block';
-        addEvent(window.document, 'click', function() { DateTimeShortcuts.dismissClock(num); return true; });
+        addEvent(document, 'click', DateTimeShortcuts.dismissClockFunc[num]);
     },
     dismissClock: function(num) {
        document.getElementById(DateTimeShortcuts.clockDivName + num).style.display = 'none';
-       window.document.onclick = null;
+       removeEvent(document, 'click', DateTimeShortcuts.dismissClockFunc[num]);
     },
     handleClockQuicklink: function(num, val) {
        DateTimeShortcuts.clockInputs[num].value = val;
@@ -134,6 +137,7 @@ var DateTimeShortcuts = {
         var num = DateTimeShortcuts.calendars.length;
 
         DateTimeShortcuts.calendarInputs[num] = inp;
+        DateTimeShortcuts.dismissCalendarFunc[num] = function() { DateTimeShortcuts.dismissCalendar(num); return true; };
 
         // Shortcut links (calendar icon and "Today" link)
         var shortcuts_span = document.createElement('span');
@@ -174,7 +178,7 @@ var DateTimeShortcuts = {
         cal_box.className = 'calendarbox module';
         cal_box.setAttribute('id', DateTimeShortcuts.calendarDivName1 + num);
         document.body.appendChild(cal_box);
-        addEvent(cal_box, 'click', DateTimeShortcuts.cancelEventPropagation);
+        addEvent(cal_box, 'click', cancelEventPropagation);
 
         // next-prev links
         var cal_nav = quickElement('div', cal_box, '');
@@ -241,11 +245,11 @@ var DateTimeShortcuts = {
         cal_box.style.top = Math.max(0, findPosY(cal_link) - 75) + 'px';
 
         cal_box.style.display = 'block';
-        addEvent(window.document, 'click', function() { DateTimeShortcuts.dismissCalendar(num); return true; });
+        addEvent(document, 'click', DateTimeShortcuts.dismissCalendarFunc[num]);
     },
     dismissCalendar: function(num) {
         document.getElementById(DateTimeShortcuts.calendarDivName1+num).style.display = 'none';
-        window.document.onclick = null;
+        removeEvent(document, 'click', DateTimeShortcuts.dismissCalendarFunc[num]);
     },
     drawPrev: function(num) {
         DateTimeShortcuts.calendars[num].drawPreviousMonth();
@@ -277,11 +281,6 @@ var DateTimeShortcuts = {
        DateTimeShortcuts.calendarInputs[num].value = d.strftime(get_format('DATE_INPUT_FORMATS')[0]);
        DateTimeShortcuts.calendarInputs[num].focus();
        DateTimeShortcuts.dismissCalendar(num);
-    },
-    cancelEventPropagation: function(e) {
-        if (!e) e = window.event;
-        e.cancelBubble = true;
-        if (e.stopPropagation) e.stopPropagation();
     }
 }
 

admin/js/admin/RelatedObjectLookups.js

@@ -32,9 +32,9 @@ function showRelatedObjectLookupPopup(triggeringLink) {
     name = id_to_windowname(name);
     var href;
     if (triggeringLink.href.search(/\?/) >= 0) {
-        href = triggeringLink.href + '&pop=1';
+        href = triggeringLink.href + '&_popup=1';
     } else {
-        href = triggeringLink.href + '?pop=1';
+        href = triggeringLink.href + '?_popup=1';
     }
     var win = window.open(href, name, 'height=500,width=800,resizable=yes,scrollbars=yes');
     win.focus();

admin/js/calendar.js

@@ -1,26 +1,8 @@
 /*
 calendar.js - Calendar functions by Adrian Holovaty
+depends on core.js for utility functions like removeChildren or quickElement
 */
 
-function removeChildren(a) { // "a" is reference to an object
-    while (a.hasChildNodes()) a.removeChild(a.lastChild);
-}
-
-// quickElement(tagType, parentReference, textInChildNode, [, attribute, attributeValue ...]);
-function quickElement() {
-    var obj = document.createElement(arguments[0]);
-    if (arguments[2] != '' && arguments[2] != null) {
-        var textNode = document.createTextNode(arguments[2]);
-        obj.appendChild(textNode);
-    }
-    var len = arguments.length;
-    for (var i = 3; i < len; i += 2) {
-        obj.setAttribute(arguments[i], arguments[i+1]);
-    }
-    arguments[1].appendChild(obj);
-    return obj;
-}
-
 // CalendarNamespace -- Provides a collection of HTML calendar-related helper functions
 var CalendarNamespace = {
     monthsOfYear: gettext('January February March April May June July August September October November December').split(' '),

admin/js/collapse.js

@@ -10,15 +10,15 @@
 			}
 		});
 		// Add toggle to anchor tag
-		$("fieldset.collapse a.collapse-toggle").toggle(
-			function() { // Show
+		$("fieldset.collapse a.collapse-toggle").click(function(ev) {
+			if ($(this).closest("fieldset").hasClass("collapsed")) {
+				// Show
 				$(this).text(gettext("Hide")).closest("fieldset").removeClass("collapsed").trigger("show.fieldset", [$(this).attr("id")]);
-				return false;
-			},
-			function() { // Hide
+			} else {
+				// Hide
 				$(this).text(gettext("Show")).closest("fieldset").addClass("collapsed").trigger("hide.fieldset", [$(this).attr("id")]);
-				return false;
 			}
-		);
+			return false;
+		});
 	});
 })(django.jQuery);

admin/js/collapse.min.js

@@ -1,2 +1,2 @@
-(function(a){a(document).ready(function(){a("fieldset.collapse").each(function(c,b){a(b).find("div.errors").length==0&&a(b).addClass("collapsed").find("h2").first().append(' (<a id="fieldsetcollapser'+c+'" class="collapse-toggle" href="#">'+gettext("Show")+"</a>)")});a("fieldset.collapse a.collapse-toggle").toggle(function(){a(this).text(gettext("Hide")).closest("fieldset").removeClass("collapsed").trigger("show.fieldset",[a(this).attr("id")]);return false},function(){a(this).text(gettext("Show")).closest("fieldset").addClass("collapsed").trigger("hide.fieldset",
-[a(this).attr("id")]);return false})})})(django.jQuery);
+(function(a){a(document).ready(function(){a("fieldset.collapse").each(function(c,b){0==a(b).find("div.errors").length&&a(b).addClass("collapsed").find("h2").first().append(' (<a id="fieldsetcollapser'+c+'" class="collapse-toggle" href="#">'+gettext("Show")+"</a>)")});a("fieldset.collapse a.collapse-toggle").click(function(){a(this).closest("fieldset").hasClass("collapsed")?a(this).text(gettext("Hide")).closest("fieldset").removeClass("collapsed").trigger("show.fieldset",[a(this).attr("id")]):a(this).text(gettext("Show")).closest("fieldset").addClass("collapsed").trigger("hide.fieldset",
+[a(this).attr("id")]);return!1})})})(django.jQuery);

admin/js/core.js

@@ -29,6 +29,12 @@ function removeEvent(obj, evType, fn) {
     }
 }
 
+function cancelEventPropagation(e) {
+    if (!e) e = window.event;
+    e.cancelBubble = true;
+    if (e.stopPropagation) e.stopPropagation();
+}
+
 // quickElement(tagType, parentReference, textInChildNode, [, attribute, attributeValue ...]);
 function quickElement() {
     var obj = document.createElement(arguments[0]);
@@ -44,6 +50,11 @@ function quickElement() {
     return obj;
 }
 
+// "a" is reference to an object
+function removeChildren(a) {
+    while (a.hasChildNodes()) a.removeChild(a.lastChild);
+}
+
 // ----------------------------------------------------------------------------
 // Cross-browser xmlhttp object
 // from http://jibbering.com/2002/4/httprequest.html

admin/js/inlines.js

@@ -22,8 +22,8 @@
     var updateElementIndex = function(el, prefix, ndx) {
       var id_regex = new RegExp("(" + prefix + "-(\\d+|__prefix__))");
       var replacement = prefix + "-" + ndx;
-      if ($(el).attr("for")) {
-        $(el).attr("for", $(el).attr("for").replace(id_regex, replacement));
+      if ($(el).prop("for")) {
+        $(el).prop("for", $(el).prop("for").replace(id_regex, replacement));
       }
       if (el.id) {
         el.id = el.id.replace(id_regex, replacement);
@@ -32,9 +32,9 @@
         el.name = el.name.replace(id_regex, replacement);
       }
     };
-    var totalForms = $("#id_" + options.prefix + "-TOTAL_FORMS").attr("autocomplete", "off");
+    var totalForms = $("#id_" + options.prefix + "-TOTAL_FORMS").prop("autocomplete", "off");
     var nextIndex = parseInt(totalForms.val(), 10);
-    var maxForms = $("#id_" + options.prefix + "-MAX_NUM_FORMS").attr("autocomplete", "off");
+    var maxForms = $("#id_" + options.prefix + "-MAX_NUM_FORMS").prop("autocomplete", "off");
     // only show the add button if we are allowed to add more items,
         // note that max_num = None translates to a blank string.
     var showAddButton = maxForms.val() === '' || (maxForms.val()-totalForms.val()) > 0;
@@ -43,7 +43,7 @@
     });
     if ($this.length && showAddButton) {
       var addButton;
-      if ($this.attr("tagName") == "TR") {
+      if ($this.prop("tagName") == "TR") {
         // If forms are laid out as table rows, insert the
         // "add" button in a new table row:
         var numCols = this.eq(-1).children().length;

admin/js/inlines.min.js

@@ -1,5 +1,5 @@
-(function(b){b.fn.formset=function(d){var a=b.extend({},b.fn.formset.defaults,d),c=b(this),d=c.parent(),i=function(a,e,g){var d=RegExp("("+e+"-(\\d+|__prefix__))"),e=e+"-"+g;b(a).attr("for")&&b(a).attr("for",b(a).attr("for").replace(d,e));a.id&&(a.id=a.id.replace(d,e));a.name&&(a.name=a.name.replace(d,e))},f=b("#id_"+a.prefix+"-TOTAL_FORMS").attr("autocomplete","off"),g=parseInt(f.val(),10),e=b("#id_"+a.prefix+"-MAX_NUM_FORMS").attr("autocomplete","off"),f=""===e.val()||0<e.val()-f.val();c.each(function(){b(this).not("."+
-a.emptyCssClass).addClass(a.formCssClass)});if(c.length&&f){var h;"TR"==c.attr("tagName")?(c=this.eq(-1).children().length,d.append('<tr class="'+a.addCssClass+'"><td colspan="'+c+'"><a href="javascript:void(0)">'+a.addText+"</a></tr>"),h=d.find("tr:last a")):(c.filter(":last").after('<div class="'+a.addCssClass+'"><a href="javascript:void(0)">'+a.addText+"</a></div>"),h=c.filter(":last").next().find("a"));h.click(function(d){d.preventDefault();var f=b("#id_"+a.prefix+"-TOTAL_FORMS"),d=b("#"+a.prefix+
+(function(b){b.fn.formset=function(d){var a=b.extend({},b.fn.formset.defaults,d),c=b(this),d=c.parent(),i=function(a,e,g){var d=RegExp("("+e+"-(\\d+|__prefix__))"),e=e+"-"+g;b(a).prop("for")&&b(a).prop("for",b(a).prop("for").replace(d,e));a.id&&(a.id=a.id.replace(d,e));a.name&&(a.name=a.name.replace(d,e))},f=b("#id_"+a.prefix+"-TOTAL_FORMS").prop("autocomplete","off"),g=parseInt(f.val(),10),e=b("#id_"+a.prefix+"-MAX_NUM_FORMS").prop("autocomplete","off"),f=""===e.val()||0<e.val()-f.val();c.each(function(){b(this).not("."+
+a.emptyCssClass).addClass(a.formCssClass)});if(c.length&&f){var h;"TR"==c.prop("tagName")?(c=this.eq(-1).children().length,d.append('<tr class="'+a.addCssClass+'"><td colspan="'+c+'"><a href="javascript:void(0)">'+a.addText+"</a></tr>"),h=d.find("tr:last a")):(c.filter(":last").after('<div class="'+a.addCssClass+'"><a href="javascript:void(0)">'+a.addText+"</a></div>"),h=c.filter(":last").next().find("a"));h.click(function(d){d.preventDefault();var f=b("#id_"+a.prefix+"-TOTAL_FORMS"),d=b("#"+a.prefix+
 "-empty"),c=d.clone(true);c.removeClass(a.emptyCssClass).addClass(a.formCssClass).attr("id",a.prefix+"-"+g);c.is("tr")?c.children(":last").append('<div><a class="'+a.deleteCssClass+'" href="javascript:void(0)">'+a.deleteText+"</a></div>"):c.is("ul")||c.is("ol")?c.append('<li><a class="'+a.deleteCssClass+'" href="javascript:void(0)">'+a.deleteText+"</a></li>"):c.children(":first").append('<span><a class="'+a.deleteCssClass+'" href="javascript:void(0)">'+a.deleteText+"</a></span>");c.find("*").each(function(){i(this,
 a.prefix,f.val())});c.insertBefore(b(d));b(f).val(parseInt(f.val(),10)+1);g=g+1;e.val()!==""&&e.val()-f.val()<=0&&h.parent().hide();c.find("a."+a.deleteCssClass).click(function(d){d.preventDefault();d=b(this).parents("."+a.formCssClass);d.remove();g=g-1;a.removed&&a.removed(d);d=b("."+a.formCssClass);b("#id_"+a.prefix+"-TOTAL_FORMS").val(d.length);(e.val()===""||e.val()-d.length>0)&&h.parent().show();for(var c=0,f=d.length;c<f;c++){i(b(d).get(c),a.prefix,c);b(d.get(c)).find("*").each(function(){i(this,
 a.prefix,c)})}});a.added&&a.added(c)})}return this};b.fn.formset.defaults={prefix:"form",addText:"add another",deleteText:"remove",addCssClass:"add-row",deleteCssClass:"delete-row",emptyCssClass:"empty-row",formCssClass:"dynamic-form",added:null,removed:null};b.fn.tabularFormset=function(d){var a=b(this),c=function(){b(a.selector).not(".add-row").removeClass("row1 row2").filter(":even").addClass("row1").end().filter(":odd").addClass("row2")};a.formset({prefix:d.prefix,addText:d.addText,formCssClass:"dynamic-"+

admin/js/jquery.init.js

@@ -3,6 +3,5 @@
  * namespace (i.e. this preserves pre-existing values for both window.$ and
  * window.jQuery).
  */
-var django = {
-    "jQuery": jQuery.noConflict(true)
-};
+var django = django || {};
+django.jQuery = jQuery.noConflict(true);

three_d_viewer/admin.py

@@ -3,6 +3,8 @@ Configuration for the Django admin site
 """
 
 from django.contrib import admin
+from django.db import models
+from django.forms import TextInput, Textarea
 from three_d_viewer.models import Category, Sample, Question, Answer, Mineral, GlossaryEntry
 
 admin.site.register(Category)
@@ -10,4 +12,12 @@ admin.site.register(Sample)
 admin.site.register(Question)
 admin.site.register(Answer)
 admin.site.register(Mineral)
-admin.site.register(GlossaryEntry)
+#admin.site.register(GlossaryEntry)
+
+
+class GlossaryEntryAdmin(admin.ModelAdmin):
+    formfield_overrides = {
+        models.TextField: {'widget': Textarea(attrs={'rows':4, 'cols':40})},
+    }
+
+admin.site.register(GlossaryEntry, GlossaryEntryAdmin)

three_d_viewer/css/styles.css

@@ -133,10 +133,15 @@ body {
 }
 
 #footer {
+	left: 0;
+	right: 0;
+	bottom: 0;
+	display: block;
+	position: fixed;
 	width: 100%;
-	margin-left: auto;
+	/*margin-left: auto;*/
 	background-color: #CCCCCC;
-	z-index: 900;
+	z-index: 1000;
 }
 
 #footer ul {
@@ -197,13 +202,18 @@ body {
 }
 
 #logo {
-	width: 10%;
+	width: 20%;
 	height: 44px;
-	background-color: #FFFFFF;
-	text-align: center;
+	background-color: #CCCCCC;
+	text-align: left;
 	float: left;
 }
 
+.logoImage {
+	width: auto;
+	height: 44px;
+}
+
 #logo p {
 	padding-top: 5%;
 }
@@ -270,8 +280,18 @@ body {
 }
 
 
+
 /* TEXT STYLES */
 
+ul.introList {
+    list-style-type: none;
+    }
+    
+td.term {
+
+padding-right: 100px;
+}
+
 #mainText p {
 	font-size: 12pt;
 	font-family: 'quicksandregular', Helvetica, sans-serif;
@@ -280,6 +300,14 @@ body {
 	color: #000;
 }
 
+#theoryText p {
+	font-size: 12pt;
+	font-family: 'quicksandregular', Helvetica, sans-serif;
+	line-height: 16pt;
+	text-align: left;
+	color: #000;
+}
+
 #mineralContainer p {
 	font-size: 12pt;
 	font-family: 'quicksandregular', Helvetica, sans-serif;
@@ -311,6 +339,17 @@ h2.theoryHeadings {
 
 }
 
+h3.headings {
+	font-size: 14pt;
+	font-family: 'quicksandbold', Helvetica, sans-serif;
+	line-height: 18pt;
+	text-align: left;
+	color: #000;
+	padding-top: 5px;
+	padding-bottom: 5px;
+
+}
+
 img.example {
 	width: 100%;
 	height: auto;
@@ -628,7 +667,7 @@ img.example {
   margin: 0;
   padding: 0;
 }
-/*CUSTOM CLASS TEST*/
+																			/*CUSTOM CLASS TEST*/
 #mineralMenu > ul > li.mainitem {
   width: 100%;
 }
@@ -644,7 +683,7 @@ img.example {
   font-size: 14px;
   font-weight: bold;
   padding: 15px 20px;
-  color: #7a8189;
+  color: #7a8189 ;
   text-transform: uppercase;
   -webkit-transition: color 0.25s ease-out;
   -moz-transition: color 0.25s ease-out;
@@ -706,6 +745,7 @@ img.example {
   z-index: -2;
 }
 #mineralMenu ul ul {
+  width: 84.5%;							/* TESTING HERE!!!!!!!!!!!!!! */
   position: absolute;
   left: -9999px;
   top: 70px;
@@ -720,9 +760,11 @@ img.example {
 #mineralMenu ul ul ul {
   top: 37px;
   padding-left: 5px;
+  width: 100%;
 }
 #mineralMenu ul ul li {
   position: relative;
+  width: 100%;
 }
 #mineralMenu > ul > li:hover > ul {
   left: auto;
@@ -735,7 +777,7 @@ img.example {
   opacity: 1;
 }
 #mineralMenu ul ul li a {
-  width: 130px;
+  width: 100%;							
   border-bottom: 1px solid #eee;
   padding: 10px 20px;
   font-size: 10px;
@@ -783,6 +825,7 @@ img.example {
   -o-transform: rotateY(180deg);
   transform: rotateY(180deg);
 }
+
 @media all and (max-width: 800px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {
   #mineralMenu {
     width: auto;

three_d_viewer/templates/three_d_viewer/base.html

@@ -32,9 +32,13 @@
                      <li class='has-sub'><a><span>Theory</span></a>
                         <ul>
                            {% block theory %}
+                           <li><a href="{% url 'three_d_viewer:theory_fd' %}"><span>Formation and differentiation of Earth</span></a></li>
                            <li><a href="{% url 'three_d_viewer:theory_structure' %}"><span>Structure of Earth</span></a></li>
                            <li><a href="{% url 'three_d_viewer:theory_pt' %}"><span>Pressure and temperature</span></a></li>
-                           <li class='last'><a href="{% url 'three_d_viewer:theory_bowen' %}"><span>Bowen's reaction series</span></a></li>
+                           <li><a href="{% url 'three_d_viewer:theory_bowen' %}"><span>Bowen's reaction series</span></a></li>
+                           <li><a href="{% url 'three_d_viewer:theory_classification' %}"><span>Classification of minerals</span></a></li>
+                           <li><a href="{% url 'three_d_viewer:theory_silicates' %}"><span>Silicates</span></a></li>
+                           <li class='last'><a href="{% url 'three_d_viewer:theory_crystals' %}"><span>Crystals</span></a></li>
                            {% endblock %}
                         </ul>
                      </li>

three_d_viewer/templates/three_d_viewer/erb101/base.html

@@ -17,9 +17,13 @@
 {% endblock %}
 
 {% block theory %}
+<li><a href="{% url 'three_d_viewer:erb101_theory_fd' %}"><span>Formation and differentiation of Earth</span></a></li>
 <li><a href="{% url 'three_d_viewer:erb101_theory_structure' %}"><span>Structure of Earth</span></a></li>
 <li><a href="{% url 'three_d_viewer:erb101_theory_pt' %}"><span>Pressure and temperature</span></a></li>
-<li class='last'><a href="{% url 'three_d_viewer:erb101_theory_bowen' %}"><span>Bowen's reaction series</span></a></li>
+<li><a href="{% url 'three_d_viewer:erb101_theory_bowen' %}"><span>Bowen's reaction series</span></a></li>
+<li><a href="{% url 'three_d_viewer:theory_classification' %}"><span>Classification of minerals</span></a></li>
+<li><a href="{% url 'three_d_viewer:erb101_theory_silicates' %}"><span>Silicates</span></a></li>
+<li class='last'><a href="{% url 'three_d_viewer:erb101_theory_crystals' %}"><span>Crystals</span></a></li>
 {% endblock %}
 
 <script type="text/javascript">

three_d_viewer/templates/three_d_viewer/glossary.html

@@ -8,7 +8,7 @@
 	{% for entry in entries %}
 		<tr>
 			<td class="term"><p>{{ entry.name }}</p></td>
-			<td><p>{{ entry.definition }}</p></td>
+			<td><p>{{ entry.definition|safe }}</p></td>
 		</tr>
 	{% endfor %}
 	</table>

three_d_viewer/templates/three_d_viewer/theory/bowen.html

@@ -7,17 +7,25 @@
         <h1 class="subHeadings">Theory</h1>
         <h2 class="theoryHeadings" id="bowensreactionseries">Bowen's Reaction Series</h2>
         <p>
-	Bowen's Reaction Series arranges the silicate minerals in the order that they crystallise from a magma. The minerals at the top of the series crystallise from the melt at higher temperature than those 
-	lower down. It contains a continuous series, (right hand limb), discontinuous series (left hand limb), and the residual phases that describe the reaction pathway of different silicate minerals. 
-	The discontinuous series crystallises different minerals, with abrupt changes separating the different minerals due to a mineral reacting with the melt to form a different mineral (eg. Olivine reacting to crystallise pyroxene). 
-	The continuous series always crystallises plagioclase,  but the composition of the plagioclase varies from more calcic at higher temperatures and more sodic as the temperature decreases. 
-	with the minerals at the bottom of the series being more stable, and less susceptible to weathering. 
-	The residual phases are the minerals at the bottom and crystallise last. Bowen's reaction series also predicts the stability of minerals in the low pressure conditions at the Earth's surface, 
+	Bowen's Reaction Series arranges the silicate minerals (? Silicate minerals) in the order that they crystallize from magma. The minerals at the 
+    top of the series crystallize from the melt at higher temperature than those lower down. It contains a continuous series, (right hand limb), a 
+    discontinuous series (left hand limb), and the residual phases, which are listed in their relative sequence of crystallization. The discontinuous 
+    series describes the sequence of minerals that crystallize as the temperature of the magma decreases. The discontinuity of each of the 
+    crystallization sequences reflects the different melting/crystallization temperatures of the minerals, and the change in composition of the 
+    residual magma, as the early crystallizing phases are being fractionated from the melt. The continuous series always crystallizes plagioclase, 
+    but the composition of the plagioclase changes from more calcic (i.e. anorthite) at higher temperatures to more sodic (i.e. albite) as the 
+    temperature decreases. The compositional change during mineral growth can be recorded in compositional zoning of plagioclase 
+    crystals (see ? Solid-solution series). The minerals at the bottom of Bowen’s reaction series crystallize last and are more stable, 
+    and less susceptible to weathering. Thus, Bowen's reaction series also predicts the stability of minerals (? Stability of minerals) in the 
+    low pressure conditions at the Earth's surface.
 	<br /><br />
-	It should be noted that all reactions do not start crystallising olivine/anorthite-rich plagioclase and continue through until they crystallise quartz. 
-	The actual reactions depend on many factors, such as the chemical composition of the melt, temperature, pressure, and amount of fractional crystallisation. 
-	For example, basalts form from the crystallisation of olivine, pyroxene and calcic plagioclase meaning that crystallisation stopped without the series progressing. 
-	If more fractional crystallisation were to occur, more intermediate and felsic minerals can crystallise.
+	It should be noted that all reactions do not start crystallizing olivine/anorthite-rich plagioclase and continue through until they 
+    crystallize quartz (? Quartz). Which minerals actually form, depend on many factors, such as the chemical composition of the melt, temperature, 
+    pressure, and amount of fractional crystallization. For example, basalts form from the crystallization of olivine, pyroxene and 
+    calcic plagioclase, meaning that crystallization stopped without the series progressing. If more fractional crystallization 
+    (? Fractional crystallization) were to occur, more intermediate and felsic minerals can crystallize. Such a differentiation path is 
+    illustrated in the TAS diagram, where primitive igneous rocks (i.e. basaltic) evolve to more felsic 
+    (SiO2-rich; i.e. rhyolite) ones (? TAS diagram).
             <br/>
 	<img src="{% static "three_d_viewer/images/bowen.jpg" %}" style="padding-top:20px; text-align: left;" width="600px" height="auto">
 	</p>

three_d_viewer/templates/three_d_viewer/theory/classification.html

@@ -0,0 +1,32 @@
+{% extends base_template %}
+{% load static %}
+
+{% block content %}
+    <div id="pushDownTwo"></div>
+        <div id="mainText">
+        <h1 class="subHeadings">Theory</h1>
+        <h2 class="theoryHeadings" id="classification">Classification of Minerals</h2>
+        <p>
+        The classification of minerals is based on their chemistry. The following mineral classes are based on the character of their common anions:</p>
+        <li><p>Silicates (SiO<sub>4</sub><sup>4-</sup>)</p></li>
+        <li><p>Oxides (O<sup>2-</sup>)</p></li>
+        <li><p>Sulfides (S<sup>2-</sup>)</p></li>
+        <li><p>Sulfates (SO<sub>4</sub><sup>2-</sup>)</p></li>
+        <li><p>Halides (Cl<sup>-</sup>)</p></li>
+        <li><p>Fluorites (F<sup>-</sup>)</p></li>
+        <li><p>Phosphates (PO<sub>4</sub><sup>3-</sup>)</p></li>
+        <li><p>Carbonates (CO<sub>3</sub><sup>2-</sup>)</p></li>
+        <li><p>Native elements, e.g. Au.</p></li>
+        <p><br />
+        The relative abundance of elements in the Earth’s crust (? Composition and structure of Earth) determines which minerals form. 
+        As we can see in table x, oxygen is the most abundant anion in the Earth’s crust. 
+        Thus, the crust can be seen as a tight package of oxygen anions (O<sup>2-</sup>), which are bonded by larger cations, 
+        such as Si<sup>4+</sup>, Mg<sup>2+</sup>, or Al<sup>3+</sup>.
+        The way atoms are packed together depends on the cation to anion radius ratio (Rx/Rz). 
+        With oxygen as the major anion, specific coordination and coordination polyhedra can be expected for different cations.
+        <br /><br /><br />
+        <a href="{% url 'three_d_viewer:theory_silicates' %}"><span>Silicate minerals</span></a>
+        </p>
+        <div id="pushDownThree"></div>
+        </div>
+{% endblock %}

three_d_viewer/templates/three_d_viewer/theory/crystals.html

@@ -0,0 +1,32 @@
+{% extends base_template %}
+{% load static %}
+
+{% block content %}
+    <div id="pushDownTwo"></div>
+        <div id="mainText">
+        <h1 class="subHeadings">Theory</h1>
+        <h2 class="theoryHeadings" id="classification">Crystals</h2>
+        <p>
+        <a href="{% static "three_d_viewer/images/crystal axes.png" %}"><img width="300" height="300" src="{% static "three_d_viewer/images/crystal axes.png" %}" align="right"></a>
+        An important characteristic of minerals is their crystallinity that is defined by the 3-dimensional, periodic structure of their atomic/ionic 
+        components. (Note that some substances, e.g. opal or obsidian, do not form crystals, but are amorphous. 
+        We sometimes refer to them as mineraloids)
+        <br /><br />
+        <a href="{% static "three_d_viewer/images/crystal systems.png" %}"><img height="450" width="305" src="{% static "three_d_viewer/images/crystal systems.png" %}" align="left"></a>
+        The smallest translatable unit cell of a crystal is defined by the crystal axes a, b and c and corresponding angles a, ß and γ. 
+        There are seven systems of crystal axes called the seven crystal systems.
+        There are 14 crystal lattices, called the Bravais lattices that describe different possibilities of 
+        distributing lattice points in the unit cells of the seven crystal systems. Among the seven crystal systems, 32 crystallographic 
+        point groups (or crystal classes) are distinguished based on the possible combination of symmetry operations, such as reflection, 
+        rotation, inversion and rotoinversion (? Crystal symmetry), within 3-dimensional space. Combination of the 14 Bravais lattices and the 32 point groups result in 230 space groups, when further glide plane and screw axes symmetry elements are included. The space groups describe all possibly existing crystal and 3-dimensional structures.
+        <a href="{% static "three_d_viewer/images/bravais lattices.png" %}"><img height="600" width="326" src="{% static "three_d_viewer/images/bravais lattices.png" %}" align="right"></a>
+
+        <a href="{% static "three_d_viewer/images/crystal morphology.png" %}"><img height="300" width="817" src="{% static "three_d_viewer/images/crystal morphology.png" %}" align="right"></a>
+        The crystal form (? Crystal morphology) arises from the symmetry elements that define the shape of the unit cell. Length and angle of the 
+        unit vectors describe the shape of the unit cell for each crystal system. The external shape of a particular crystal is called crystal 
+        habit (? Habit) and essentially dependent on the physical-chemical framework conditions during crystal growth.
+        <a href="{% static "three_d_viewer/images/bravais lattices.png" %}"><img height="600" width="326" src="{% static "three_d_viewer/images/bravais lattices.png" %}" align="right"></a>
+        </p>
+        <div id="pushDownThree"></div>
+        </div>
+{% endblock %}

three_d_viewer/templates/three_d_viewer/theory/formationdiff.html

@@ -0,0 +1,30 @@
+{% extends base_template %}
+{% load static %}
+
+{% block content %}
+    <div id="pushDownTwo"></div>
+    	<div id="mainText">
+        <h1 class="subHeadings">Theory</h1>
+        <h2 class="theoryHeadings" id="formationdiff">Formation and differentiation of Earth</h2>
+        <p>
+        Earth, like the Sun and the other planets of our Solar System formed around 4.6 billion years ago from part of a giant molecular 
+        cloud - the cosmic debris of a massive supernova. Out of matter that coalesced in the center of the molecular cloud due to 
+        gravitational collapse emerged the proto-Sun and a surrounding disk of dust and gas. Attraction forces within this rotating 
+        protoplanetary disk that fed the young Sun, led to the accretion of progressively growing objects and planetesimals. 
+        Increasing mass and gravitational forces of the growing planetary bodies resulted in interactions and disturbance in their orbits, 
+        ultimately giving rise to larger collisions. Earth, as a terrestrial inner planet formed relatively close to the Sun through the 
+        accumulation of rather heavier matter, whereas the outer planets formed from gas that had been blown away in more distal 
+        regions of the solar system (solar wind). Continuous bombardment and larger impacts – including one that led to the 
+        formation of the Moon -, and the radioactive decay within the Earth heated the planet resulting in partial melting. 
+        Different melting temperatures and density contrasts led to gravitational segregation of a heavier iron core and a lighter 
+        silicate mantle. Further chemical differentiation by partial melting of the mantle led to the formation of Earth’s proto-crust. 
+        The Earth’s layering into core, mantle and crust due to this early differentiation remains an essential 
+        feature of the Earth’s structure.
+        </p>
+        <figure>
+        <a href="{% static "three_d_viewer/images/earth differentiation.png" %}"><img width=600 height=350 src="{% static "three_d_viewer/images/earth differentiation.png" %}">
+        <figcaption>Differentiation of minerals within the earth</figcaption>
+        </figure>
+    <div id="pushDownThree"></div>
+    </div>
+{% endblock %}

three_d_viewer/templates/three_d_viewer/theory/pressure_temp.html

@@ -7,49 +7,57 @@
         <h1 class="subHeadings">Theory</h1>
         <h2 class="theoryHeadings" id="pressureandtemp">Pressure and Temperature</h2>
         <p>
-        The heat contained within the Earth is generated by two main sources: the formation of the Earth,
-        and the decay of radioactive isotopes. The Earth was formed by the accretion of a large number of
-        planitesimals as it cleared its orbit. The impact of those planitesimals generated a large amount
-        of heat which is still being lost from the Earth’s core today. The other source of heat comes
-        from the radioactive decay of elements within the crust and mantle of the Earth.
-        The primary radioactive isotopes in the Earth are uranium-235, uranium-238, thorium-232,
-        and potassium-40. Radioactive decay is the dominant form of heat flow at the surface of the Earth,
-        providing approximately 80% of the heat budget.
+        The heat contained within the Earth is generated by two main sources: the formation of the Earth, and the decay of radioactive isotopes. 
+        The Earth was formed by the accretion of a large number of planetesimals as it cleared its orbit. 
+        The impact of those planetesimals generated a large amount of heat which is still being lost from the Earth’s core today. 
+        The other source of heat comes from the radioactive decay of elements within the crust and mantle of the Earth. 
+        The primary radioactive isotopes in the Earth are uranium-235, uranium-238, thorium-232, and potassium-40. 
+        Radioactive decay is the dominant form of heat flow at the surface of the Earth, providing approximately 80% of the heat budget. 
         <br /><br />
-        The temperature of the Earth changes from around 0°C at the surface to over 5000°C in the core.
-        The geothermal gradient in the crust is approximately 30°C per kilometre in the crust on average,
-        however there is significant local variation due to things such as the conductive abilities of the
-        rocks at particular locations, as well as the presence of nearby magmatic intrusions.
-        The geothermal gradient in the mantle reduces significantly, down to approximately 0.3°C/km.
-        The base of the lithosphere is defined by the 1000°C isotherm. The base of the mantle is at
-        approximately 2800°C.
+        </p>
+        <figure>
+        <a href='{% static "three_d_viewer/images/seismic earth.png" %}'><img height=300 width=300 src='{% static "three_d_viewer/images/seismic earth.png" %}'></a>
+        <figcaption>The seismic profile of the earth</figcaption>
+        </figure>
+        <p>
+        <br />
+        The temperature of the Earth changes from around 0°C at the surface to over 5000°C in the core. 
+        The geothermal gradient in the crust is approximately 30°C per kilometre in the crust on average, however there is significant local 
+        variation due to things such as the conductive abilities of the rocks at particular locations, as well as the presence of nearby magmatic 
+        intrusions. The geothermal gradient in the mantle reduces significantly, down to approximately 0.3°C/km. The base of the lithosphere 
+        is defined by the 1000°C isotherm. The base of the mantle is at approximately 2800°C. 
         <br /><br />
-        The method of heat transfer changes throughout the Earth. There are three main mechanisms for
-        heat transfer in the Earth: conduction, convection, and radiation. Starting in the inner core,
-        the main method of heat transfer is by conduction through the solid material. In the liquid,
-        outer core heat transfer is by both conduction and convection. The mantle is dominated by convection,
-        which is the driver of plate tectonics. The crust is again dominated by conduction, and finally
-        energy escapes the Earth to the atmosphere by radiation.
+        The method of heat transfer changes throughout the Earth. There are three main mechanisms for heat transfer in the Earth: 
+        conduction, convection, and radiation. Starting in the inner core, the main method of heat transfer is by conduction through the 
+        solid material. In the liquid, outer core heat transfer is by both conduction and convection. The mantle is dominated by convection, 
+        which is the driver of plate tectonics (? Plate tectonics). The crust is again dominated by conduction, and finally energy escapes the 
+        Earth to the atmosphere by radiation. 
         <br /><br />
-        Pressure in the Earth continually increases with depth, according to the formula P = gρz,
-        where g is the gravitation field strength, ρ is the density and z is the depth. The main
-        difference in the pressure gradient is cause by the different lithologies in the layers
-        of the Earth. The average density of continental crust is approximately 2.7g/cm3 and
-        is ~3.0 g/cm3 in oceanic crust, and increases to about 3.3 g/cm3 in the mantle.
-        The increase of pressure with depth in the Earth affects the dominant mineralogy, as
-        well as the increase of the melting point of different minerals.
+        Pressure in the Earth continually increases with depth, according to the formula P = gρz, where g is the gravitation field strength, 
+        ρ is the density and z is the depth. The main difference in the pressure gradient is cause by the different lithologies in the layers 
+        of the Earth. The average density of continental crust is approximately 2.7g/cm<sup>3</sup> and is ~3.0 g/cm<sup>3</sup> in oceanic crust, 
+        and increases to about 3.3 g/cm<sup>3</sup> in the mantle. The increase of pressure with depth in the Earth affects the dominant mineralogy, 
+        as well as the increase of the melting point of different minerals. 
         <br /><br />
-        The structure of minerals, such as olivine becomes unstable as pressure increases.
-        Below about 410km olivine becomes unstable and transforms into wadsleyite, which has the
-        same chemical composition as olivine, but has a different crystal structure. As depth
-        increases, wadsleyite transforms to ringwoodite, which subsequently transforms into
-        perovskite at about 600km.
+        The structure of minerals, such as <a href={% url 'three_d_viewer:'|add:olivine.url olivine.id %}>olivine</a> becomes unstable as pressure increases (? Stability of minerals). 
+        Below about 410 km olivine (Mg<sub>2</sub>SiO<sub>4</sub>) becomes unstable and transforms into wadsleyite (Mg<sub>2</sub>SiO<sub>4</sub>), 
+        which has the same chemical composition as olivine, but has a different crystal structure. As depth increases, 
+        wadsleyite transforms to ringwoodite (Mg<sub>2</sub>SiO<sub>4</sub>) at ~520 km, which subsequently transforms into silicate perovskite 
+        (MgSiO<sub>3</sub>) and magnesiowuestite (MgO) at about 660km depth. The increase in density is observed in an increase in the 
+        velocity of P- and S-waves.
         <br /><br />
-        At higher pressure, minerals have a higher melting point. The effect is this phenomenon
-        is that the dominant method of melting in the mantle is not by increasing the temperature
-        past its melting point, but by decompression. Due to convective processes in the mantle,
-        as parts of the mantle rise the decrease in pressure lowers the melting temperature and
-        can cause the mantle to melt.
+        </p>
+        <figure>
+        <a href='{% static "three_d_viewer/images/depth profile.png" %}' align="right"><img height=300 width=270 src='{% static "three_d_viewer/images/depth profile.png" %}'></a>
+        <figcaption>The depth profile of the earth</figcaption>
+        </figure>
+        <p>
+        <br />
+        At higher pressure, minerals have a higher melting point. The effect of this phenomenon is that the dominant method of 
+        melting in the mantle is not by increasing the temperature past its melting point, but by decompression. 
+        Due to convective processes in the mantle, as parts of the mantle rise the decrease in pressure lowers the melting temperature 
+        and can cause the mantle to melt. Such process is observed at oceanic spreading centres, where partial decompression melting of the 
+        mantle produces juvenile oceanic crust.
 	    </p>
         <div id="pushDownThree"></div>
         </div>

three_d_viewer/templates/three_d_viewer/theory/silicates.html

@@ -0,0 +1,78 @@
+{% extends base_template %}
+{% load static %}
+
+{% block content %}
+    <div id="pushDownTwo"></div>
+    	<div id="mainText">
+        <h1 class="subHeadings">Silicates</h1>
+        <figure>
+        <img src="{% static "three_d_viewer/images/SiO4 tetraedra.png" %}">
+        <figcaption>The silica tetrahedron, [SiO<sub>4</sub>]<sup>4-</sup></figcaption>
+        </figure>
+        <br /> 
+        <table>
+            <tr><td>
+            <h2 class="theoryHeadings" id="cyclosilicates">Cyclosilicates</h2>
+            <p>
+            <img src="{% static "three_d_viewer/images/cyclosilicates.png" %}" align="right">
+            The cyclosilicates form rings of linked [SiO<sub>4</sub>]<sup>4-</sup> tedrahedra with either [Si<sub>3</sub>O<sub>9</sub>]<sup>6-</sup>, 
+            [Si<sub>4</sub>O<sub>12</sub>]<sup>8-</sup>, or [Si<sub>6</sub>O<sub>18</sub>]<sup>12-</sup> configurations. Cordierite with the 
+            chemical formula (Mg,Fe)<sub>2</sub>Al<sub>4</sub>Si<sub>5</sub>O<sub>18</sub> represents an example of the cyclosilicate group.
+            </p>
+            </tr></td>
+            <tr><td>
+            <h2 class="theoryHeadings" id="inosilicates">Inosilicates</h2>
+            <p>
+            <img src="{% static "three_d_viewer/images/inosilicates.png" %}" align="right">
+            In the inosilicates, [SiO<sub>4</sub>]<sup>4-</sup> tedrahedra are linked as chains, which in turn are linked together by cations. 
+            Single-chain inosilicates form [Si<sub>2</sub>O<sub>6</sub>]<sup>4-</sup> groups, and double-chain inosilicates 
+            form [Si<sub>4</sub>O<sub>11</sub>]<sup>6-</sup> groups. Pyroxenes, e.g. diopside with the chemical formula 
+            CaMgSi<sub>2</sub>O<sub>6</sub>, are single-chain, and amphiboles, e.g. hornblende 
+            (Ca<sub>2</sub>(Mg,Fe,Al)<sub>5</sub>(Al,Si)<sub>8</sub>O<sub>22</sub>(OH)), are double-chain inosilicates.
+            </p>
+            </tr></td>
+            <tr><td>
+            <h2 class="theoryHeadings" id="nesosilicates">Nesosilicates</h2>
+            <p>
+            <img src="{% static "three_d_viewer/images/nesosilicates.png" %}" align="right">
+            In the nesosilicate group, [SiO<sub>4</sub>]<sup>4-</sup> tedrahedra are isolated from each other and share their oxygens 
+            with octahedral groups, which contain cations, such as Mg<sup>2+</sup>, Fe<sup>2+</sup>, or Ca<sup>2+</sup>.  A common 
+            rock-forming mineral of the nesosilicate group is 
+            <a href={% url 'three_d_viewer:'|add:olivine.url olivine.id %}>olivine</a> with the chemical formula 
+            (Mg,Fe)<sub>2</sub>SiO<sub>4</sub>.
+            </p>
+            </tr></td>
+            <tr><td>
+            <h2 class="theoryHeadings" id="phyllosilicates">Phyllosilicates</h2>
+            <p>
+            <img src="{% static "three_d_viewer/images/phyllosilicates.png" %}" align="right">
+            Phyllosilicates comprise sheets of [SiO<sub>4</sub>]<sup>4-</sup> tedrahedra rings, where three of the four oxygens of 
+            each tedrahedrons are shared resulting in [Si<sub>4</sub>O<sub>10</sub>]<sup>4-</sup> groups. Biotite with the 
+            chemical formula K(Mg,Fe)<sub>3</sub>(AlSi<sub>3</sub>O<sub>10</sub>)(F,OH)<sub>2</sub> is a common rock-forming phyllosilicate.
+            </p>
+            </tr></td>
+            <tr><td>
+            <h2 class="theoryHeadings" id="sorosilicates">Sorosilicates</h2>
+            <p>
+            <img src="{% static "three_d_viewer/images/sorosilicates.png" %}" align="right">
+            Two [SiO<sub>4</sub>]<sup>4-</sup> tedrahedra are linked by a shared corner oxygen to form 
+            [Si<sub>2</sub>O<sub>7</sub>]<sup>6-</sup> groups. An example for the sorosilicate group is the mineral epidote with the 
+            chemical formula Ca<sub>2</sub>Al<sub>2</sub>(Fe<sup>3+</sup>,Al)(SiO<sub>4</sub>)(Si<sub>2</sub>O<sub>7</sub>)O(OH).
+            </p>
+            </tr></td>
+            <tr><td>
+            <h2 class="theoryHeadings" id="tectosilicates">Tectosilicates</h2>
+            <p>
+            <img src="{% static "three_d_viewer/images/tectosilicates.png" %}" align="right">            
+            Complete linkage of [SiO<sub>4</sub>]<sup>4-</sup> tedrahedra results in the 3-dimensional framework of the tectosilicates. 
+            <a href={% url 'three_d_viewer:'|add:quartz.url quartz.id %}>Quartz</a> (SiO<sub>2</sub>) and the feldspars 
+            (<a href={% url 'three_d_viewer:'|add:plag.url plag.id %}>plagioclase</a>, 
+            <a href={% url 'three_d_viewer:'|add:microcline.url microcline.id %}>microcline</a>) 
+            (e.g. anorthite, CaAl<sub>2</sub>Si<sub>2</sub>O<sub>8</sub>) are tectosilicates.
+            </p>
+            </tr></td>
+        </table>
+        <br /><br /><br /><br />
+    <div id="pushDownThree"></div>
+    </div>
+{% endblock %}

three_d_viewer/templates/three_d_viewer/theory/structure.html

@@ -7,26 +7,32 @@
         <h1 class="subHeadings">Theory</h1>
         <h2 class="theoryHeadings" id="structureofearth">Structure of Earth</h2>
         <p>
-	The Earth's structure is differentiated in three distinct layers: the core, mantle, and crust. The layers are distinguished by a change in the velocity of seismic waves at their boundaries. 
-	The crust is the upper most part of the earth, with depths ranging from an average of 7km in in the oceans, to an average of 38km in continental crust. 
-	The crust thickens underneath mountain ranges, and can reach depths of 90km underneath the Himalayas. The composition of the crust also differs between oceanic and 
-	continental environments. Ocean crust is young mafic crust dominated by basalts and gabbros that is recycled regularly(~300Ma) due to subduction processes. 
-	Continental crust is much more varied in structure and composition than oceanic, but has an overall average composition of granodiorite. 
+	The Earth's structure is differentiated in three distinct layers: the core, mantle, and crust (? Earth profile). The layers are distinguished 
+    by a change in the velocity of seismic waves at their boundaries (? Seismic profile). The crust is the upper most part of the earth, with 
+    depths ranging from an average of 7 km in the oceans, to an average of 38 km in continental crust. The crust thickens underneath mountain 
+    ranges, and can reach depths of 90 km underneath the Himalayas. The composition of the crust also differs between oceanic and continental 
+    environments. Ocean crust is young mafic crust dominated by basalts and gabbros that is recycled regularly (~300 Ma) due to subduction 
+    processes (? Subduction). Continental crust is much more varied in structure and composition than oceanic, but has an overall average 
+    composition of granodiorite. 
 	<br /><br />
-	The boundary of the crust and mantle is defined by the Mohorovi?i? discontinuity, commonly referred to as the Moho. 
-	It is defined by a sharp increase in seismic wave velocity, due to a change in material properties between crustal rocks and mantle rocks. The mantle is dominated by 
-	silicate minerals that are rich in iron and magnesium, chiefly pyroxenes and polymorphs of olivine, forming peridotite. The mantle, while solid, behaves plastically, 
-	allowing to flow at very slow rates.
+    <img src="{% static "three_d_viewer/images/element abundance.png" %}" align="right" width="412" height="324">
+	The boundary of the crust and mantle is defined by the Mohorovicic discontinuity, commonly referred to as the Moho. It is defined by a 
+    sharp increase in seismic wave velocity, due to a change in material properties between crustal rocks and mantle rocks (? Seismic profile). 
+    The mantle is dominated by silicate minerals that are rich in iron and magnesium, chiefly pyroxenes and polymorphs (? Polymorphs) of olivine, 
+    forming peridotite. The mantle, while solid, behaves plastically, allowing to flow at very slow rates. 
 	<br /><br />
-	The core is distinguished by the absence of S waves, leading to the inference that the core is liquid. The core is separated into the outer core and the inner core. 
-	The outer core is liquid dominated by iron and nickel. The inner core is solid, as determined by the strong refraction of P waves at the inner core-outer core boundary, 
-	and was formed by crystalizing minerals from the liquid part of the core as the Earth cools. 
+	The core is distinguished by the absence of S waves, leading to the inference that the core is liquid. 
+    The core is separated into the outer core and the inner core. The outer core is liquid dominated by iron and nickel. 
+    The inner core is solid, as determined by the strong refraction of P waves at the inner core-outer core boundary, and was formed by 
+    crystallizing minerals from the liquid part of the core as the Earth cools. 
 	<br /><br />
-	The crust and mantle are also further distinguished by material properties into the lithosphere, asthenosphere, and mesosphere. The chemical composition is 
-	uniform throughout the mantle though, but changes in pressure and temperature determine which polymorphs will exist at different depths. 
-	The lithosphere contains the crust, and the upper part of the mantle down to ~100km under oceanic crust, and 200-300km under continental crust (Twiss & Moores, 2007). 
-	The lithosphere-asthenosphere boundary is defined by the 1300K isotherm, which is the temperature where olivine starts to behave viscously.  
-	The rocks in the mesosphere are under more pressure than those in the asthenosphere, so no longer behave viscously.</p>
+    The crust and mantle are also further distinguished by material properties into the lithosphere, asthenosphere, and 
+    mesosphere (? Earth profile). The chemical composition is uniform throughout the mantle though, but changes in pressure and temperature 
+    determine which polymorphs will exist at different depths. The lithosphere contains the crust, and the upper part of the mantle down 
+    to ~100 km under oceanic crust, and 200-300 km under continental crust (Twiss & Moores, 2007). The lithosphere-asthenosphere boundary 
+    is defined by the 1300 K isotherm, which is the temperature where olivine starts to behave viscously. The rocks in the mesosphere are 
+    under more pressure than those in the asthenosphere, so no longer behave viscously.
+    </p>
 	<figure>
 		<img src="{% static "three_d_viewer/images/structure - usgs.gif" %}" style="padding-top:20px;">
 		<figcaption><p>Image sourced from <a href="http://pubs.usgs.gov/gip/dynamic/graphics/FigS1-1.gif">USGS</a>.</p></figcaption>

three_d_viewer/urls.py

@@ -13,6 +13,14 @@ urlpatterns = patterns(
     url(r'^theory/erb101_bowen/$', views.ERB101TheoryTemplateView.as_view(template_name="three_d_viewer/theory/bowen.html"  ), name='erb101_theory_bowen'),
     url(r'^theory/pressure_temp/$', views.TheoryTemplateView.as_view(template_name="three_d_viewer/theory/pressure_temp.html"), name='theory_pt'),
     url(r'^theory/erb101_pressure_temp/$', views.ERB101TheoryTemplateView.as_view(template_name="three_d_viewer/theory/pressure_temp.html"), name='erb101_theory_pt'),
+    url(r'^theory/formationdiff/$', views.TheoryTemplateView.as_view(template_name="three_d_viewer/theory/formationdiff.html"), name='theory_fd'),
+    url(r'^theory/erb101_formationdiff/$', views.ERB101TheoryTemplateView.as_view(template_name="three_d_viewer/theory/formationdiff.html"), name='erb101_theory_fd'),    
+    url(r'^theory/silicates/$', views.TheoryTemplateView.as_view(template_name="three_d_viewer/theory/silicates.html"), name='theory_silicates'),
+    url(r'^theory/erb101_silicates/$', views.ERB101TheoryTemplateView.as_view(template_name="three_d_viewer/theory/silicates.html"), name='erb101_theory_silicates'),
+    url(r'^theory/classification/$', views.TheoryTemplateView.as_view(template_name="three_d_viewer/theory/classification.html"), name='theory_classification'),
+    url(r'^theory/erb101_classification/$', views.ERB101TheoryTemplateView.as_view(template_name="three_d_viewer/theory/classification.html"), name='erb101_theory_classification'),    
+    url(r'^theory/crystals/$', views.TheoryTemplateView.as_view(template_name="three_d_viewer/theory/crystals.html"), name='theory_crystals'),
+    url(r'^theory/erb101_crystals/$', views.ERB101TheoryTemplateView.as_view(template_name="three_d_viewer/theory/crystals.html"), name='erb101_theory_crystals'),    
     url(r'^minerals_practice/$', views.MineralPracticeView.as_view(template_name="three_d_viewer/minerals_practice.html"), name='minerals_practice'),
     url(r'^minerals/(?P<pk>\d+)/$', views.MineralDetailView.as_view(), name='mineral_detail'),
     url(r'^minerals_selftest/$', generic.TemplateView.as_view(template_name="three_d_viewer/minerals_selftest.html"), name='minerals_selftest'),

three_d_viewer/views.py

@@ -280,13 +280,19 @@ class ERB101RockDetailView(generic.DetailView):
         return object
         
 class TheoryTemplateView(generic.TemplateView):
+
     def get_context_data(self, **kwargs):
         context = super(TheoryTemplateView, self).get_context_data(**kwargs)
         context['base_template'] = 'three_d_viewer/base.html'
+        context['olivine'] = Mineral.objects.filter(name='Olivine')[0]
+        context['quartz'] = Mineral.objects.filter(name='Quartz')[0]
+        context['microcline'] = Mineral.objects.filter(name='Microcline')[0]
+        context['plag'] = Mineral.objects.filter(name='Plagioclase')[0]
         return context
  
 class ERB101TheoryTemplateView(generic.TemplateView):
     def get_context_data(self, **kwargs):
         context = super(ERB101TheoryTemplateView, self).get_context_data(**kwargs)
         context['base_template'] = 'three_d_viewer/erb101/base.html'
-        return context
+        return context
+