Hook up format selector

lib/gollum/frontend/public/css/editor.css

@@ -180,6 +180,7 @@ a#function-image:hover span { background-position: -324px -28px; }
   
   float: right;
   font-size: 1.1em;
+  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
   font-weight: bold;
   line-height: 1.6em;
   padding: 0.5em 0.7em;
@@ -189,7 +190,6 @@ a#function-image:hover span { background-position: -324px -28px; }
   border-radius: 0.5em;
   -moz-border-radius: 0.5em;
   -webkit-border-radius: 0.5em; 
-  
   -moz-outline: none;
 }
 
@@ -200,6 +200,21 @@ a#function-image:hover span { background-position: -324px -28px; }
   -moz-outline: none;
 }
 
+#gollum-editor #gollum-editor-function-bar
+  #gollum-editor-format-selector label {
+  color: #999;
+  float: right;
+  font-size: 1.1em;
+  font-weight: bold;
+  line-height: 1.6em;
+  padding: 0.6em 0.5em 0 0;
+}
+  
+#gollum-editor #gollum-editor-function-bar
+  #gollum-editor-format-selector label:after {
+  content: ':';
+}
+  
   
 /* @section form-fields */
 

lib/gollum/frontend/public/javascript/gollum-editor/gollum.editor.js

@@ -56,6 +56,7 @@
       
       // Initialize the function bar by loading proper definitions
       if ( EditorHas.functionBar() ) {
+        
         var htmlSetMarkupLang =
           $('#gollum-editor-body').attr('data-markup-lang');
         
@@ -72,15 +73,18 @@
                       + 'type ' + ActiveOptions.MarkupType);
                 return;
               }
+              
+              if ( EditorHas.formatSelector() ) {
+                FormatSelector.init( 
+                  $('#gollum-editor-format-selector select') );
+              }
+              
               // activate the function bar
               debug('Activating function bar');
               FunctionBar.activate();
             } );
-        } else {
-          // loaded language already
-          debug('Activating function bar');
-          FunctionBar.activate();
         }
+        
       } 
       // EditorHas.functionBar
     } 
@@ -143,6 +147,18 @@
       LanguageDefinition._LANG[name] = definitionObject;
     },
     
+    getActiveLanguage: function() {
+      return LanguageDefinition._ACTIVE_LANG;
+    },
+    
+    setActiveLanguage: function( name ) {
+      if ( !LanguageDefinition.isLoadedFor(name) ) {
+        LanguageDefinition.loadFor( name );
+      } else {
+        LanguageDefinition._ACTIVE_LANG = name;
+      }
+    },
+    
     
     /**
      *  gets a definition object for a specified attribute
@@ -176,7 +192,7 @@
      */
     loadFor: function( markup_name, on_complete ) {
       // attempt to load the definition for this language
-      var script_uri = 'js/gollum-editor/langs/' + markup_name + '.js';
+      var script_uri = '/javascript/gollum-editor/langs/' + markup_name + '.js';
       $.ajax({
                 url: script_uri, 
                 dataType: 'script',
@@ -233,6 +249,10 @@
       return $('#gollum-editor .collapsed, #gollum-editor .expanded').length;
     },
     
+    formatSelector: function() {
+      return $('#gollum-editor-format-selector select').length;
+    },
+    
     
     /**
      *  EditorHas.functionBar
@@ -446,6 +466,34 @@
    };
 
 
+   var FormatSelector = {
+     
+     $_SELECTOR: null,
+   
+     changeFormat: function( newFormat ) {
+       
+     },
+     
+     evtChangeFormat: function( e ) {
+       var newMarkup = $(this).val();
+       LanguageDefinition.setActiveLanguage( newMarkup );
+     },
+     
+     init: function( $sel ) {
+       debug('Initializing format selector');
+       
+       FormatSelector.$_SELECTOR = $sel;
+       
+       // set format selector to the current language
+       var currentLang = LanguageDefinition.getActiveLanguage();
+       FormatSelector.$_SELECTOR.val( currentLang );
+       FormatSelector.$_SELECTOR.change( FormatSelector.evtChangeFormat );
+     }
+     
+     
+   };
+   
+   
    /**
     *  $.GollumEditor.Dialog
     *  Used in exec() to display dialogs with dynamic fields.

lib/gollum/frontend/templates/editor.mustache

@@ -53,6 +53,7 @@
         </option>
       {{/formats}}
      </select>
+      <label for="format">Edit Mode</label>
     </div>
   </div>
     <textarea id="gollum-editor-body"

lib/gollum/frontend/templates/layout.mustache

@@ -15,8 +15,6 @@
   <!-- TODO: only load this on the edit page -->
   <script type="text/javascript" 
     src="/javascript/gollum-editor/gollum.editor.js"></script>
-  <script type="text/javascript" 
-    src="/javascript/gollum-editor/langs/markdown.js"></script>
   <title>{{title}}</title>
 </head>
 <body>