instantiating bespin - still broken

flightdeck/jetpack/media/js/Bespin.js

@@ -29,29 +29,44 @@ Class.refactor(Editor, {
 	},
 	initialize: function(options) {
 		this.previous(options);
-		if (this.options.version < 0.6) {
-			this.embed = tiki.require("bespin:embed");
-		} else {
-			this.embed = tiki.require("Embedded");
-		}	
-		this.textarea = this.element;
+	},
+	initEditor: function() {
+		console.log('FD: instantiating ',this.options.element)
+		this.textarea = $(this.options.element);
+		var editor_id = this.textarea.get('id');
+		console.log('FD: changing ', this.textarea);
+		this.textarea.set('id',editor_id+'_textarea')
+		console.log('FD: textarea id changed ', this.textarea.get('id'));
 		this.element = new Element('div',{
-			'text': this.element.get('text'),
-			'id': this.element.get('id'),
-			'class': 'bespin' 
-		});
-		this.textarea.set('id',this.textarea.get('id')+'_textarea')
-		this.element.inject(this.textarea, 'after');
+			'text': this.textarea.get('text'),
+			'id': editor_id,
+		}).inject(this.textarea, 'before');
+		console.log('FD: div element created ', this.element);
+
 		if (this.textarea.isHidden()) {
 			this.element.hide();
+			console.log('div hidden');
 		}
 		this.textarea.hide();
+		console.log('FD: textarea hidden');
+		this.bespin = tiki
+			.require("Embedded")
+			.useBespin(this.element,{syntax: "js"});
+		console.log('FD: bespin instantiated');
 
-		this.embed.useBespin(this.element);
-		this.element.addClass("bespin");
+		var boundOnBespinChange = this.onBespinChange.bind(this);
+		this.bespin._editorView.getPath('layoutManager.textStorage')
+			.addDelegate(SC.Object.create({
+				textStorageEdited: boundOnBespinChange
+			}));
+		console.log('FD: bespin onChange hooked');
+	},
+	onBespinChange: function() {
+		this.fireEvent('change');
+		this.changed = true;
 	},
 	getContent: function() {
-		this.textarea.set('text', this.element.value);
-		return this.element.value;
+		this.textarea.set('text', this.bespin.value);
+		return this.bespin.value;
 	}
 });

flightdeck/jetpack/media/js/Editor.js

@@ -15,15 +15,20 @@ var Editor = new Class({
 	},
 	initialize: function(options) {
 		this.setOptions(options);
-		this.element = $(this.options.element);
 		this.changed = false;
+		this.initEditor();
+	},
+	initEditor: function() {
+		this.element = $(this.options.element);
+		var boundOnChange = this.onChange.bind(this);
 		this.element.addEvents({
-			'change': function() {
-				this.fireEvent('change');
-				this.changed = true;
-			}.bind(this)
+			'change': boundOnChange 
 		});
 	},
+	onChange: function () {
+		this.fireEvent('change');
+		this.changed = true;
+	},
 	toElement: function() {
 		return this.element;
 	},

flightdeck/jetpack/templates/editor.html

@@ -3,12 +3,12 @@
 {% block head %}
 	<link rel="stylesheet" href="/media/jetpack/css/UI.Editor.css" type="text/css" media="screen" />
 	<link rel="stylesheet" href="/media/bespin/BespinEmbedded.css" type="text/css" media="screen" />
-	{#<script src="/media/bespin/BespinEmbedded.js"></script>#}
+	<script src="/media/bespin/BespinEmbedded.js"></script>
 	<script src="/media/jetpack/js/Create.js"></script>
 	<script src="/media/jetpack/js/Editor.js"></script>
 	<script src="/media/jetpack/js/Capability.js"></script>
 	<script src="/media/jetpack/js/CapDependency.js"></script>
-	{#<script src="/media/jetpack/js/Bespin.js"></script>#}
+	<script src="/media/jetpack/js/Bespin.js"></script>
 	<script type="text/javascript">
 		var settings = {
 			user: "{{ request.user }}",

flightdeck/jetpack/templates/jetpack_edit.html

@@ -129,9 +129,9 @@
 {% block app_content %}
 	{% include "_editor_menu.html" %}
 	<div id="editor-wrapper">
-		<textarea id='jetpack_description' class="UI_Editor_Area" name='jetpack_description'>{{ jetpack.description }}</textarea>
-		<textarea id="version_content" class="UI_Editor_Area" data-bespinoptions='{ "stealFocus":true }' name='version_content'>{{ version.content }}</textarea>
+		<textarea id="version_content" class="UI_Editor_Area" name='version_content'>{{ version.content }}</textarea>
 		<textarea id='version_manifest' class="UI_Editor_Area" name='version_manifest'>{{ version.manifest }}</textarea>
+		<textarea id='jetpack_description' class="UI_Editor_Area" name='jetpack_description'>{{ jetpack.description }}</textarea>
 		<textarea id='version_description' class='UI_Editor_Area'>{{ version.description }}</textarea>
 		{% for cap in version.capabilities.all %}
 			<textarea id="dependency_content_{{ cap.slug }}" class="UI_Editor_Area" name="dependency_content_{{ cap.slug }}">{{ cap.version.content }}</textarea>

scripts/install.sh

@@ -56,8 +56,8 @@ if [ ! -e $V_ENV/lib/BespinEmbedded-0.6 ]
 then
 	mkdir BespinEmbedded-0.6
 	cd BespinEmbedded-0.6
-	wget https://bespin.mozilla.com/embedded/BespinEmbedded.css --no-check-certificate
-	wget https://bespin.mozilla.com/embedded/BespinEmbedded.js --no-check-certificate
+	wget https://bespin.mozillalabs.com/embedded/BespinEmbedded.css --no-check-certificate
+	wget https://bespin.mozillalabs.com/embedded/BespinEmbedded.js --no-check-certificate
 	rm $V_ENV/lib/BespinEmbedded
 	ln -fs $V_ENV/lib/BespinEmbedded-0.6/ $V_ENV/lib/BespinEmbedded
 fi