title: syntax highlighter for CSS (ace ajax)
body: <p>I have been working on the <a href="http://ace.ajax.org/" rel="nofollow">ace</a> for a few days but I still cannot get it worked with css properly, been trying to look for solutions online or ace weki/ documentation, etc, but no luck at all.</p>
  
  <p>This is my <a href="http://lauthiamkok.net/dump/ace/editor_3.html" rel="nofollow">attempt</a> to highlight css with ace, but it has these error message on firefox,</p>
  
  <pre><code>Could not load worker ace.js (line 1)
  Error: Could not get domain! [Break On This Error] define("ace/mode/css",["require","expo...).call(f.prototype),b.WorkerClient=f})
  </code></pre>
  
  <p>Any ideas what that means and how to fix it?</p>
  
  <p>The entire code,</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
  &lt;head&gt;
      &lt;meta charset="UTF-8"&gt;
      &lt;meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"&gt;
      &lt;title&gt;Ace editor&lt;/title&gt;
      &lt;style&gt;
      #ace-editor {
          position: absolute;
          width: 500px;
          height: 400px;
      }
      &lt;/style&gt;
  
      &lt;script src="jquery-1.7.min.js" type="text/javascript" charset="utf-8"&gt;&lt;/script&gt;
      &lt;script src="src/ace.js" type="text/javascript" charset="utf-8"&gt;&lt;/script&gt;
      &lt;script src="src/theme-eclipse.js" type="text/javascript" charset="utf-8"&gt;&lt;/script&gt;
      &lt;script src="src/mode-css.js" type="text/javascript" charset="utf-8"&gt;&lt;/script&gt;
  
      &lt;script&gt;
      $(document).ready(function(){
  
          var editor = ace.edit("ace-editor");
          editor.setTheme("ace/theme/eclipse");
  
          var CssMode = require("ace/mode/css").Mode;
          editor.getSession().setMode(new CssMode());
  
          //var textarea = $('.code').hide();
          var textarea = $('.code');
  
          // Get the value from the editor and place it into the texrarea.
          var text = editor.getSession().getValue();
          textarea.val(text);
  
          // Update the textarea on change.
          editor.getSession().on('change', function(){
  
              // Get the value from the editor and place it into the texrarea.
              var text = editor.getSession().getValue();
              textarea.val(text);
              //alert(text);
          });
  
          $('#form_data').submit(function(e){
              //alert($(this).serialize());
  
              var object = $(this);
              var path = object.attr('action');
  
              alert(object.serialize());
  
              $.post(path, object.serialize(),function(xml){
  
              });
              return false;
          });
      });
      &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
  &lt;form action="data.php" method="post" enctype="multipart/form-data" id="form_data" class="set-form"&gt;
  
      &lt;textarea rows="5" cols="10" class="code" name="ace-editor"&gt;&lt;/textarea&gt;
  
      &lt;div style="height:450px; border:1px solid #000;"&gt;
          &lt;div id="ace-editor"&gt;&lt;style&gt;.text-layer {
      font-family: Monaco, "Courier New", monospace;
      font-size: 12px;
      cursor: text;
  }&lt;/style&gt;&lt;/div&gt;
      &lt;/div&gt;
  
  &lt;input type="submit" name="submit" value="submit"/&gt;
  
  &lt;/form&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>