define(["react", "jquery"], function(React,$) {
    return function(ContentEditor, Block, ContentBlock) {
        return React.createClass({

            onDocChange: function(c, oldDoc, newDoc) {
                this.props.onChange(this, oldDoc, newDoc);
            },

            onContentChange: function(e) {
                var oldDoc = this.props.doc;
                var newDoc = $.extend({}, oldDoc);
                newDoc.value = e.target.value;
                if (newDoc.autoId) {
                    newDoc.id = e.target.value.toLowerCase().replace(/[^\w]/g, '-');
                }
                this.onDocChange(this, oldDoc, newDoc);
            },

            onExplanationChange: function(e) {
                var oldDoc = this.props.doc;
                var newDoc = $.extend({}, oldDoc);
                newDoc.explanation.value = e.target.value;
                this.onDocChange(this, oldDoc, newDoc);
            },

            onAutoIdToggle: function(c, oldVal, newVal) {
                var oldDoc = this.props.doc;
                var newDoc = $.extend({}, oldDoc);
                newDoc.autoId = !newDoc.autoId;
                if (newDoc.autoId) {
                    newDoc.id = newDoc.value.toLowerCase().replace(/[^\w]/g, '-');
                }
                this.onDocChange(this, oldDoc, newDoc);
            },

            onIdChange: function(c, oldVal, newVal) {
                var oldDoc = this.props.doc;
                var newDoc = $.extend({}, oldDoc);
                newDoc.id = c.target.value.toLowerCase().replace(/[^\w]/g, '-');
                this.onDocChange(this, oldDoc, newDoc);
            },

            toggle: function(attribute) {
                return function() {
                    var oldDoc = this.props.doc;
                    var newDoc = $.extend({}, oldDoc);
                    newDoc[attribute] = !oldDoc[attribute];
                    this.onDocChange(this, oldDoc, newDoc);
                }.bind(this);
            },

            render: function() {
                if (typeof this.props.doc.autoId == 'undefined') {
                    this.props.doc.autoId = true;
                }
                return (
                    <Block type="glossaryTerm" blockTypeTitle="Glossary term" doc={this.props.doc} onChange={this.onDocChange}>
                        <div className="small-3 columns">
                            <div className="row">
                                <input type="text" value={this.props.doc.value} onChange={this.onContentChange} placeholder="Glossary term" />
                                <input type="checkbox" checked={this.props.doc.autoId} onChange={this.onAutoIdToggle} /><label>Automatic IDs</label>
                                {this.props.doc.autoId && <p>ID: {this.props.doc.id}</p>}
                                {!this.props.doc.autoId && <input type="text" value={this.props.doc.id} onChange={this.onIdChange} placeholder="ID" />}
                            </div>
                        </div>
                        <div className="small-9 columns" >
                            <textarea value={this.props.doc.explanation.value || ''} rows="6" onChange={this.onExplanationChange}></textarea>
                        </div>
                    </Block>
                );
            }
        })
    }
})

@@ -1644,32 +1644,312 @@
             %7D,%0A%0A
+            onExamBoardChange: function(c, oldVal, newVal) %7B%0A                var oldDoc = this.props.doc;%0A                var newDoc = $.extend(%7B%7D, oldDoc);%0A                newDoc.examBoard = c.target.value;%0A                this.onDocChange(this, oldDoc, newDoc);%0A            %7D,%0A%0A
             togg
@@ -1970,24 +1970,24 @@
 ttribute) %7B%0A
-
             
@@ -2440,32 +2440,171 @@
               %7D%0A
+                if (typeof this.props.doc.examBoard == 'undefined') %7B%0A                    this.props.doc.examBoard = '';%0A                %7D%0A
                 
@@ -2790,9 +2790,9 @@
 all-
-3
+5
  col
@@ -2991,16 +2991,171 @@
 erm%22 /%3E%0A
+                            %3C/div%3E%0A                            %3Cdiv className=%22row%22%3E%0A                                %3Cdiv className=%22small-7 columns%22%3E%0A    
         
@@ -3327,16 +3327,20 @@
         
+ 
+   
 %7Bthis.pr
@@ -3389,16 +3389,20 @@
 d%7D%3C/p%3E%7D%0A
+    
         
@@ -3545,16 +3545,682 @@
 ID%22 /%3E%7D%0A
+                                %3C/div%3E%0A                                %3Cdiv className=%22small-5 columns%22%3E%0A                                    %3Clabel%3EExam board:%3C/label%3E%0A                                    %3Cselect value=%7Bthis.props.doc.examBoard%7D onChange=%7Bthis.onExamBoardChange%7D%3E%0A                                        %3Coption value=%22%22%3EAny%3C/option%3E%0A                                        %3Coption value=%22AQA%22%3EAQA%3C/option%3E%0A                                        %3Coption value=%22OCR%22%3EOCR%3C/option%3E%0A                                    %3C/select%3E%0A                                %3C/div%3E%0A                            %3C/div%3E%0A                            %3Cdiv className=%22row%22%3E%0A
         
@@ -4327,9 +4327,9 @@
 all-
-9
+7
  col

Add exam board select box to glossary terms.