lots of ui cleanups

classes/WhatDidTheySayAdmin.inc

@@ -95,6 +95,12 @@ class WhatDidTheySayAdmin {
     }
   }
 
+  function include_editor_javascript() {
+    $nonce = wp_create_nonce('what-did-they-say');
+    
+    include(dirname(__FILE__) . '/partials/_editor-script.inc');
+  }
+
   /**
    * Attempt to automatically embed transcripts in posts.
    */
@@ -147,8 +153,10 @@ class WhatDidTheySayAdmin {
     wp_enqueue_script('toggle-transcript', plugin_dir_url(dirname(__FILE__)) . 'js/toggle-transcript.js', array('prototype'), false, true);
     if (current_user_can('submit_transcriptions')) {
       wp_enqueue_script('scriptaculous-effects');
-      wp_enqueue_script('edit-transcript', plugin_dir_url(dirname(__FILE__)) . 'js/edit-transcripts.js', array('scriptaculous-effects'), false, true);
+      wp_enqueue_script('edit-transcripts', plugin_dir_url(dirname(__FILE__)) . 'js/edit-transcripts.js', array('scriptaculous-effects'));
       wp_enqueue_style('wdts-admin', plugin_dir_url(dirname(__FILE__)) . 'css/wdts-admin.css');
+
+      add_action('wp_head', array(&$this, 'include_editor_javascript'));
     }
     
     $options = get_option('what-did-they-say-options');
@@ -675,6 +683,8 @@ class WhatDidTheySayAdmin {
       }
   
       wp_enqueue_script('scriptaculous-effects');
+
+      add_action('wp_head', array(&$this, 'include_editor_javascript'));
     }
 
     if (current_user_can('approve_transcriptions')) {
@@ -691,7 +701,7 @@ class WhatDidTheySayAdmin {
         wp_enqueue_style('wdts-admin', plugin_dir_url(dirname(__FILE__)) . 'css/wdts-admin.css');
         wp_enqueue_style('wdts-defaults', plugin_dir_url(dirname(__FILE__)) . 'css/wdts-defaults.css');
         wp_enqueue_script('scriptaculous-effects');
-        wp_enqueue_script('edit-transcript', plugin_dir_url(dirname(__FILE__)) . 'js/edit-transcripts.js', array('scriptaculous-effects'), false, true);
+        wp_enqueue_script('edit-transcripts', plugin_dir_url(dirname(__FILE__)) . 'js/edit-transcripts.js', array('scriptaculous-effects'), false, true);
       }
     }
   }

classes/partials/_display-queued-transcript.inc

@@ -1,3 +1,4 @@
-<div class="queued-transcription-holder">
+<div class="queued-transcript-holder" id="wdts-<?php echo $id = md5(rand()) ?>">
   <?php include(dirname(__FILE__) . '/_queued-transcript-contents.inc') ?>
 </div>
+<script type="text/javascript">WhatDidTheySay.setup_transcript_action_buttons('wdts-<?php echo $id ?>', 'wdts-<?php echo $approved_editor_id ?>')</script>

classes/partials/_editor-script.inc

@@ -1,8 +1,8 @@
 <script type="text/javascript">
-  var ajax_url = '<?php echo $_SERVER['REQUEST_URI'] ?>';
+  WhatDidTheySay.ajax_url = '<?php echo $_SERVER['REQUEST_URI'] ?>';
-  var nonce = '<?php echo $nonce ?>';
+  WhatDidTheySay.nonce = '<?php echo $nonce ?>';
 
-  var messages = {
+  WhatDidTheySay.messages = {
     'overwrite': '<?php _e('This will overwrite the current transcript. Are you sure?', 'what-did-they-say') ?>',
     'delete_message': '<?php _e('This will delete the queued transcript. Are you sure?', 'what-did-they-say') ?>',
     'approved': '<?php _e('Transcript approved and posted. You can further edit it below.', 'what-did-they-say') ?>',
@@ -13,4 +13,15 @@
     'dialog_direction': '<?php _e('Enter the direction in which the character is speaking:', 'what-did-they-say') ?>',
     'dialog_speech': '<?php _e('Enter what the character is speaking:', 'what-did-they-say') ?>'
   };
+
+  WhatDidTheySay.button_labels = {
+    'scene-heading': '<?php _e('Scene Heading') ?>',
+    'scene-action': '<?php _e('Scene Action') ?>',
+    'dialog': '<?php _e('Dialog') ?>',
+    'approve': '<?php _e('Approve') ?>',
+    'delete': '<?php _e('Delete') ?>',
+    'edit': '<?php _e('Edit') ?>',
+  };
+
+  WhatDidTheySay.can_approve = <?php echo current_user_can('approve_transcriptions') ? "true" : "false" ?>;
 </script>

classes/partials/_queued-transcript-contents.inc

@@ -8,12 +8,6 @@
     $language_options->get_language_name($transcript['language'])
   )
 ?></p>
-<div class="queued-transcription transcript"><?php echo do_shortcode($transcript['transcript']) ?></div>
+<div class="queued-transcript transcript"><?php echo do_shortcode($transcript['transcript']) ?></div>
-<pre class="queued-transcription-raw" style="display:none"><?php echo $transcript['transcript'] ?></pre>
+<pre class="queued-transcript-raw" style="display:none"><?php echo $transcript['transcript'] ?></pre>
-<div class="transcript-action-links">
+<div class="queued-transcript-actions"></div>
-  <?php if (current_user_can('approve_transcriptions')) { ?>
-    <a href="#" class="approve-transcript button">Approve</a> |
-  <?php } ?>
-  <a href="#" class="delete-transcript button">Delete</a> |
-  <a href="#" class="edit-transcript-button button">Edit</a>
-</div>

classes/partials/meta-box.inc

@@ -1,12 +1,14 @@
 <input type="hidden" name="wdts[_nonce]" value="<?php echo $nonce ?>" />
 <input type="hidden" name="wdts[module]" value="manage-post-transcripts" />
 <input type="hidden" name="wdts[post_id]" value="<?php echo $post->ID ?>" />
-<p>
+
-  <label>
+<label>
-    <input type="checkbox" name="wdts[allow_on_post]" value="yes" <?php echo ($transcript_options->are_new_transcripts_allowed()) ? 'checked="checked"' : '' ?> />
+  <input id="wdts-<?php echo $checkbox_id = md5(rand()) ?>" type="checkbox" name="wdts[allow_on_post]" value="yes" <?php echo ($transcript_options->are_new_transcripts_allowed()) ? 'checked="checked"' : '' ?> />
-    <?php _e('Allow new transcripts to be submitted for this post', 'what-did-they-say') ?>
+  <?php _e('Allow new transcripts to be submitted for this post', 'what-did-they-say') ?>
-  </label>
+</label>
-</p>
+
+<?php $approved_editor_id = md5(rand()) ?>
+
 <?php if (is_array($queued_transcripts) && !empty($queued_transcripts)) { ?>
   <p><strong><?php _e('Manage queued transcripts:', 'what-did-they-say') ?></strong></p>
   <?php
@@ -16,27 +18,32 @@
     }
   ?>
 <?php } ?>
-<p>
-  <label>
-    <?php _e('Edit provided transcript for:', 'what-did-they-say') ?>
-    <select name="wdts[language]" id="wdts-language">
-      <?php foreach ($options['languages'] as $code => $info) { ?>
-        <option value="<?php echo $code ?>" <?php echo $info['default'] ? 'selected="selected"' : '' ?>><?php echo $info['name'] ?></option>
-      <?php } ?>
-    </select>
-  </label>
 
-  <div id="wdts-shorttags">
+<div id="wdts-<?php echo $approved_editor_id ?>">
-    <button class="wdts-create" id="wdts-scene-heading" onclick="return false">Scene Heading</button>
+  <?php if (!defined('WP_ADMIN')) { ?>
-    <button class="wdts-create" id="wdts-scene-action" onclick="return false">Scene Action</button>
+    <h3 class="wdts"><?php _e('Edit Approved Transcripts:', 'what-did-they-say') ?></h3>
-    <button class="wdts-create" id="wdts-dialog" onclick="return false">Dialog</button>
+  <?php } ?>
+  <div class="wdts-transcript-editor">
+    <label>
+      <?php _e('Language:', 'what-did-they-say') ?>
+      <select name="wdts[language]" class="wdts-transcript-selector">
+        <?php foreach ($options['languages'] as $code => $info) { ?>
+          <option value="<?php echo $code ?>" <?php echo $info['default'] ? 'selected="selected"' : '' ?>><?php echo $info['name'] ?></option>
+        <?php } ?>
+      </select>
+    </label>
 
+    <div class="wdts-button-holder"></div>
     <?php foreach (array_keys($options['languages']) as $code) {
       $approved_transcript_text = '';
       foreach ($approved_transcripts as $transcript) {
         if ($transcript['language'] == $code) { $approved_transcript_text = $transcript['transcript']; break; }
       } ?>
-      <textarea class="edit-transcript" id="wdts-transcripts-<?php echo $code ?>" name="wdts[transcripts][<?php echo $code ?>]" style="display: none; width: 99%; height: 200px"><?php echo $approved_transcript_text ?></textarea>
+      <textarea class="edit-transcript" name="wdts[transcripts][<?php echo $code ?>]" style="display: none; width: 99%; height: 200px"><?php echo $approved_transcript_text ?></textarea>
     <?php } ?>
   </div>
-</p>
+</div>
+<script type="text/javascript">
+  WhatDidTheySay.setup_transcript_editor('wdts-<?php echo $approved_editor_id ?>');
+  WhatDidTheySay.setup_allow_new_transcripts('wdts-<?php echo $checkbox_id ?>');
+</script>

css/wdts-admin.css

@@ -54,12 +54,19 @@
   display: inline
 }
 
-#wdts-shorttags {
+.wdts-transcript-editor {
   background-color: #DFDFDF;
-  padding: 3px;
+  padding: 0.5em;
   border-radius: 2px;
   -moz-border-radius: 2px;
   -webkit-border-radius: 2px;
+  margin: 0.35em 0
+}
+
+.wdts-transcript-editor label {
+  margin: 0.25em 0;
+  font-weight: bold;
+  cursor: pointer
 }
 
 #wdts-page-introduction label {
@@ -74,3 +81,7 @@
 .queued-transcription-raw {
   display: none
 }
+
+h3.wdts {
+  margin: 0.75em 0 0.25em;
+}

js/edit-transcripts.js

@@ -1,10 +1,319 @@
-var language_selector = $('wdts-language');
+var WhatDidTheySay = Class.create({});
 
-function switch_transcript() {
+/**
-  $$('.edit-transcript').each(function(t) {
+ * Set up a transcript editor widget.
-    (t.id == "wdts-transcripts-" + $F('wdts-language')) ? t.show() : t.hide();
+ */
-  });
+WhatDidTheySay.setup_transcript_editor = function(container) {
-}
+  if (container) {
+    container = $(container);
+
+    var button_holder = container.select('.wdts-button-holder').pop();
+
+    if (button_holder) {
+      var language_selector = container.select('.wdts-transcript-selector').pop();
+
+      var get_transcript;
+
+      if (language_selector) {
+        var switch_transcripts = function() {
+          container.select('.edit-transcript').each(function(t) {
+            (t.name == 'wdts[transcripts][' + $F(language_selector) + ']') ? t.show() : t.hide();
+          });
+        };
+
+        switch_transcripts();
+
+        language_selector.observe('change', switch_transcripts);
+
+        get_transcript = function() { return container.select('textarea[name*=[' + $F(language_selector) + ']]').pop(); };
+      } else {
+        get_transcript = function() { return container.select('textarea').pop(); }
+      }
+
+      [ 'scene-heading', 'scene-action', 'dialog' ].each(function(tag) {
+        var b = new Element('button').update(WhatDidTheySay.button_labels[tag]);
+
+        var get_t = function() { return tag; };
+
+        b.observe('click', function(e) {
+          Event.stop(e);
+
+          var transcript = get_transcript();
+
+          if (transcript) {
+            if (document.selection) {
+              var range = document.selection.createRange();
+              var stored_range = range.duplicate();
+              stored_range.moveToElementText(current_transcript);
+              stored_range.setEndPoint('EndToEnd', range);
+              transcript.selectionStart = stored_range.text.length - range.text.length;
+              transcript.selectionEnd = current_transcript.selectionStart + range.text.length;
+            }
+
+            var start = transcript.selectionStart;
+            var end = transcript.selectionEnd;
+
+            var injector = new WDTSInjector(transcript, end);
+
+            var tag = get_t();
+
+            var new_content = (start == end);
+            switch (tag) {
+              case 'scene-heading':
+              case 'scene-action':
+                var message = tag.replace('-', '_');
+                if (new_content) {
+                  var content = prompt(WhatDidTheySay.messages[message]);
+                  if (content) {
+                    injector.inject('[' + tag + ']' + content + "[/" + tag + "]\n", start);
+                  }
+                } else {
+                  injector.inject("[/" + tag + "]\n", end);
+                  injector.inject('[' + tag + ']', start);
+                }
+                break;
+              case 'dialog':
+                var name = prompt(WhatDidTheySay.messages.dialog_name);
+                if (name) {
+                  var direction = prompt(WhatDidTheySay.messages.dialog_direction);
+                  var tag = '[dialog name="' + name + '"';
+                  if (direction) { tag += ' direction="' + direction + '"'; }
+                  tag += ']';
+
+                  if (new_content) {
+                    var speech = prompt(WhatDidTheySay.messages.dialog_speech);
+
+                    tag += speech + "[/dialog]\n";
+
+                    injector.inject(tag, start);
+                  } else {
+                    injector.inject("[/dialog]\n", end);
+                    injector.inject(tag, start);
+                  }
+                }
+                break;
+            }
+            injector.set_caret();
+          }
+        });
+
+        button_holder.insert(b);
+      });
+
+    }
+  }
+};
+
+/**
+ * Set up action buttons for queued transcripts.
+ */
+WhatDidTheySay.setup_transcript_action_buttons = function(container, approved_editor_container) {
+  top.console.log(approved_editor_container);
+
+  if (container && approved_editor_container) {
+    container = $(container);
+    approved_editor_container = $(approved_editor_container);
+
+  top.console.log(approved_editor_container);
+
+    var actions_holder = container.select('.queued-transcript-actions').pop();
+
+    if (actions_holder) {
+      [
+        [ 'approve',
+          function(e) {
+            Event.stop(e);
+
+            var lang = container.select("input[name*=[language]]").shift();
+            var post_id = container.select("input[name*=[post_id]]").shift();
+            var key = container.select("input[name*=[key]]").shift();
+            if (lang && post_id && key) {
+              lang = lang.value;
+              post_id = post_id.value;
+              key = key.value;
+
+              var editor = approved_editor_container.select('textarea[name*=[' + lang + ']').pop();
+// 
+              var raw_transcript = p.select(".queued-transcript-raw").shift();
+              if (raw_transcript && editor) {
+                var ok = true;
+                if (editor.value.match(/[^ ]/)) {
+                  ok = confirm(WhatDidTheySay.messages.overwrite);
+                }
+                if (ok) {
+                  editor.value = raw_transcript.innerHTML;
+
+                  new Ajax.Request(
+                    WhatDidTheySay.ajax_url, {
+                      'method': 'post',
+                      'parameters': {
+                        'wdts[_nonce]': WhatDidTheySay.nonce,
+                        'wdts[module]': 'approve-transcript',
+                        'wdts[key]': key,
+                        'wdts[post_id]': post_id
+                      },
+                      'onSuccess': function() {
+                        container.update(WhatDidTheySay.messages.approved);
+                        new Effect.Highlight(container);
+
+                        var language_selector = approved_editor_container.select('select').pop();
+                        if (language_selector) {
+                          var i,il;
+                          for (i = 0, il = language_selector.options.length; i < il; ++i) {
+                            if (language_selector.options[i].value == lang) {
+                              language_selector.selectedIndex = i;
+                              switch_transcript();
+                              break;
+                            }
+                          }
+                        }
+                      }
+                    }
+                  );
+                }
+              }
+            }
+          }
+        ],
+        [
+          'delete',
+          function(e) {
+            Event.stop(e);
+
+            if (confirm(WhatDidTheySay.messages.delete_message)) {
+              var post_id = container.select("input[name*=[post_id]]").pop();
+              var key = container.select("input[name*=[key]]").pop();
+
+              if (post_id && key) {
+                post_id = post_id.value;
+                key = key.value;
+
+                new Ajax.Request(
+                  WhatDidTheySay.ajax_url, {
+                    'method': 'post',
+                    'parameters': {
+                      'wdts[_nonce]': WhatDidTheySay.nonce,
+                      'wdts[module]': 'delete-transcript',
+                      'wdts[key]': key,
+                      'wdts[post_id]': post_id
+                    },
+                    'onSuccess': function() {
+                      container.update(WhatDidTheySay.messages.deleted);
+                      new Effect.Highlight(container);
+
+                      new PeriodicalExecuter(function(pe) {
+                        new Effect.Fade(container, { from: 1, to: 0, duration: 0.5 });
+                        pe.stop();
+                      }, 2);
+                    }
+                  }
+                );
+              }
+            }
+          }
+        ],
+        [
+          'edit',
+          function(e) {
+            Event.stop(e);
+
+            var transcript = container.select('.transcript').pop();
+
+            var editor        = new Element("div", { class: 'wdts-transcript-editor' });
+            var button_holder = new Element("div", { class: 'wdts-button-holder' });
+            var textnode   = new Element('textarea', { style: 'height: 200px; width: 99%' });
+            textnode.value = container.select('.queued-transcript-raw').pop().innerHTML;
+
+            editor.appendChild(button_holder);
+            editor.appendChild(textnode);
+
+            container.insertBefore(editor, transcript);
+            transcript.hide();
+
+            WhatDidTheySay.setup_transcript_editor(editor);
+
+            var post_id = container.select("input[name*=[post_id]]").shift();
+            var key = container.select("input[name*=[key]]").shift();
+
+            var submitter  = new Element('button').update('Update Transcript');
+            submitter.observe('click', function(e) {
+              Event.stop(e);
+              if (post_id && key) {
+                post_id = post_id.value;
+                key = key.value;
+
+                new Ajax.Updater(container, WhatDidTheySay.ajax_url, {
+                  'method': 'post',
+                  'parameters': {
+                    'wdts[_nonce]': WhatDidTheySay.nonce,
+                    'wdts[module]': 'update-queued-transcript',
+                    'wdts[key]': key,
+                    'wdts[post_id]': post_id,
+                    'wdts[transcript]': textnode.value
+                  },
+                  'onComplete': function() {
+                    new Effect.Highlight(container);
+                    WhatDidTheySay.setup_transcript_action_buttons(container);
+                  }
+                });
+              }
+            });
+
+            container.appendChild(submitter);
+            actions_holder.parentNode.removeChild(actions_holder);
+          }
+        ]
+      ].each(function(info) {
+        var button = new Element("button").update(WhatDidTheySay.button_labels[info[0]]);
+        button.observe('click', info[1]);
+
+        actions_holder.insert(button);
+      });
+    }
+  }
+};
+
+WhatDidTheySay.setup_allow_new_transcripts = function(checkbox) {
+  if (checkbox) {
+    checkbox = $(checkbox);
+
+    checkbox.observe('change', function(e) {
+      Event.stop(e);
+      
+      var p = $(checkbox.parentNode.parentNode);
+      if (p) {
+        var post_id = p.select("input[name*=[post_id]]").pop();
+        var key = p.select("input[name*=[key]]").pop();
+
+        if (post_id && key) {
+          post_id = post_id.value;
+          key = key.value;
+
+          var parameters = {
+            'wdts[_nonce]': WhatDidTheySay.nonce,
+            'wdts[module]': 'manage-post-transcripts',
+            'wdts[key]': key,
+            'wdts[post_id]': post_id
+          };
+
+          if (checkbox.checked) {
+            parameters['wdts[allow_on_post]'] = checkbox.value;
+          }
+
+          new Ajax.Request(
+            WhatDidTheySay.ajax_url, {
+              'method': 'post',
+              'parameters': parameters,
+              'onSuccess': function() {
+                new Effect.Highlight(checkbox.parentNode);
+              }
+            }
+          );
+        }
+      }
+    });
+  }
+};
 
 var WDTSInjector = Class.create({
   initialize: function(textarea, end) {
@@ -28,223 +337,3 @@ var WDTSInjector = Class.create({
     }
   }
 });
-
-Event.observe(window, 'load', function() {
-  var buttons_to_watch = [];
-  if ($('wdts-transcript')) {
-    buttons_to_watch.push([ '#wdts-submit-shorttags button', $('wdts-transcript') ]);
-  }
-
-  if ($$('select[name=wdts-language]').pop()) {
-    buttons_to_watch.push([ '#wdts-shorttags button', $("wdts-transcripts-" + $F('wdts-language')) ]);
-  }
-
-  buttons_to_watch.each(function(info) {
-    $$(info[0]).each(function(b) {
-      b.observe('click', function(e) {
-        Event.stop(e);
-        var current_transcript = info[1];
-        if (current_transcript) {
-          if (document.selection) {
-            var range = document.selection.createRange();
-            var stored_range = range.duplicate();
-            stored_range.moveToElementText(current_transcript);
-            stored_range.setEndPoint('EndToEnd', range);
-            current_transcript.selectionStart = stored_range.text.length - range.text.length;
-            current_transcript.selectionEnd = current_transcript.selectionStart + range.text.length;
-          }
-          
-          var start = current_transcript.selectionStart;
-          var end = current_transcript.selectionEnd;
-
-          var injector = new WDTSInjector(current_transcript, end);
-
-          var new_content = (start == end);
-          var tag = b.id.replace('wdts-', '');
-          switch (b.id) {
-            case 'wdts-scene-heading':
-            case 'wdts-scene-action':
-              var message = tag.replace('-', '_');
-              if (new_content) {
-                var content = prompt(messages[message]);
-                if (content) {
-                  injector.inject('[' + tag + ']' + content + "[/" + tag + "]\n", start);
-                }
-              } else {
-                injector.inject("[/" + tag + "]\n", end);
-                injector.inject('[' + tag + ']', start);
-              }
-              break;
-            case 'wdts-dialog':
-              var name = prompt(messages.dialog_name);
-              if (name) {
-                var direction = prompt(messages.dialog_direction);
-                var tag = '[dialog name="' + name + '"';
-                if (direction) { tag += ' direction="' + direction + '"'; }
-                tag += ']';
-
-                if (new_content) {
-                  var speech = prompt(messages.dialog_speech);
-
-                  tag += speech + "[/dialog]\n";
-
-                  injector.inject(tag, start);
-                } else {
-                  injector.inject("[/dialog]\n", end);
-                  injector.inject(tag, start);
-                }
-              }
-              break;
-          }
-          injector.set_caret();
-        }
-      });
-    });
-  });
-});
-
-function wdts_setup_approve_transcript_clicker(b) {
-  b.observe('click', function(e) {
-    Event.stop(e);
-
-    var p = $(b.parentNode.parentNode);
-    
-    var lang = p.select("input[name*=[language]]").shift();
-    var post_id = p.select("input[name*=[post_id]]").shift();
-    var key = p.select("input[name*=[key]]").shift();
-    if (lang && post_id && key) {
-      lang = lang.value;
-      post_id = post_id.value;
-      key = key.value;
-      var editor = $('wdts-transcripts-' + lang);
-
-      var raw_transcript = p.select(".queued-transcription-raw").shift();
-      if (raw_transcript && editor) {
-        var ok = true;
-        if (editor.value.match(/[^ ]/)) {
-          ok = confirm(messages.overwrite);
-        }
-        if (ok) {
-          editor.value = raw_transcript.innerHTML;
-
-          new Ajax.Request(
-            ajax_url, {
-              'method': 'post',
-              'parameters': {
-                'wdts[_nonce]': nonce,
-                'wdts[module]': 'approve-transcript',
-                'wdts[key]': key,
-                'wdts[post_id]': post_id
-              },
-              'onSuccess': function() {
-                p.update(messages.approved);
-                new Effect.Highlight(p);
-                var i,il;
-
-                for (i = 0, il = language_selector.options.length; i < il; ++i) {
-                  if (language_selector.options[i].value == lang) {
-                    language_selector.selectedIndex = i;
-                    switch_transcript();
-                    break;
-                  }
-                }
-              }
-            }
-          );
-        }
-      }
-    }
-  });
-};
-
-function wdts_setup_delete_transcript_clicker(b) {
-  b.observe('click', function(e) {
-    Event.stop(e);
-
-    var p = $(b.parentNode.parentNode);
-    
-    if (confirm(messages.delete_message)) {
-      var post_id = p.select("input[name*=[post_id]]").pop();
-      var key = p.select("input[name*=[key]]").pop();
-
-      if (post_id && key) {
-        post_id = post_id.value;
-        key = key.value;
-
-        new Ajax.Request(
-          ajax_url, {
-            'method': 'post',
-            'parameters': {
-              'wdts[_nonce]': nonce,
-              'wdts[module]': 'delete-transcript',
-              'wdts[key]': key,
-              'wdts[post_id]': post_id
-            },
-            'onSuccess': function() {
-              p.update(messages.deleted);
-              new Effect.Highlight(p);
-            }
-          }
-        );
-      }
-    }
-  });
-}
-
-function wdts_setup_edit_transcript_clicker(b) {
-  b.observe('click', function(e) {
-    Event.stop(e);
-
-    var p = $(b.parentNode.parentNode);
-
-    var transcript = p.select('.transcript').pop();
-    var textnode   = new Element('textarea', { style: 'height: 200px; width: 90%' });
-    var action_links = p.select('.transcript-action-links').pop();
-    textnode.value = p.select('.queued-transcription-raw').pop().innerHTML;
-
-    p.insertBefore(textnode, transcript);
-    transcript.hide();
-
-    var post_id = p.select("input[name*=[post_id]]").shift();
-    var key = p.select("input[name*=[key]]").shift();
-
-    var submitter  = new Element('button').update('Update Transcript');
-    submitter.observe('click', function(e) {
-      if (post_id && key) {
-        post_id = post_id.value;
-        key = key.value;
-
-        new Ajax.Updater(p, ajax_url, {
-          'method': 'post',
-          'parameters': {
-            'wdts[_nonce]': nonce,
-            'wdts[module]': 'update-queued-transcript',
-            'wdts[key]': key,
-            'wdts[post_id]': post_id,
-            'wdts[transcript]': textnode.value
-          },
-          'onComplete': function() {
-            new Effect.Highlight(p);
-            wdts_add_clickers(p);
-          }
-        });
-      }
-    });
-
-    p.appendChild(submitter);
-    action_links.parentNode.removeChild(action_links);
-  });
-}
-
-function wdts_add_clickers(p) {
-  p.select('.edit-transcript-button').each(function(b) { wdts_setup_edit_transcript_clicker(b); });
-  p.select('.approve-transcript').each(function(b) { wdts_setup_approve_transcript_clicker(b); });
-  p.select('.delete-transcript').each(function(b) { wdts_setup_delete_transcript_clicker(b); });
-}
-
-wdts_add_clickers($$('body').pop());
-if (language_selector) {
-  switch_transcript();
-  Event.observe(window, 'load', switch_transcript);
-  Event.observe(language_selector, 'change', switch_transcript);
-}

what-did-they-say.php

@@ -211,14 +211,11 @@ function the_media_transcript_queue_editor() {
     
     $nonce = wp_create_nonce('what-did-they-say');
 
-    include(dirname(__FILE__) . '/classes/partials/_editor-script.inc');
-
     ?>
     <?php if (current_user_can('approve_transcriptions')) { ?>
-      <h3><?php _e('Manage Transcripts:', 'what-did-they-say') ?></h3>
+      <h3 class="wdts"><?php _e('Manage Transcripts:', 'what-did-they-say') ?></h3>
       <form method="post" class="transcript-editor">
         <?php include(dirname(__FILE__) . '/classes/partials/meta-box.inc') ?>
-        <?php include(dirname(__FILE__) . '/classes/partials/_editor-script.inc'); ?>
         <input type="submit" value="Modify Transcript" />
       </form>
     <?php } ?>
@@ -232,30 +229,30 @@ function the_media_transcript_queue_editor() {
 		<?php } ?>
     <?php if (current_user_can('submit_transcriptions')) { ?>
       <?php if ($transcript_options->are_new_transcripts_allowed()) { ?>
-        <h3 style="margin-top: 0.5em"><?php _e('Submit a new transcript:', 'what-did-they-say') ?></h3>
+        <h3 class="wdts"><?php _e('Submit a new transcript:', 'what-did-they-say') ?></h3>
-        <form method="post" class="transcript-editor">
+        <form method="post" id="<?php echo $id = "wdts-" . md5(rand()) ?>">
           <input type="hidden" name="wdts[_nonce]" value="<?php echo wp_create_nonce('what-did-they-say') ?>" />
           <input type="hidden" name="wdts[module]" value="queue-transcript" />
           <input type="hidden" name="wdts[post_id]" value="<?php echo $post->ID ?>" />
-          <label>
-            <?php _e('Language:', 'what-did-they-say') ?>
-            <select name="wdts[language]">
-              <?php foreach ($language_options->get_languages() as $code => $info) { ?>
-                <option value="<?php echo $code ?>"><?php echo $info['name'] ?></option>
-              <?php } ?>
-            </select>
-          </label><br />
-          <?php _e('Transcript:', 'what-did-they-say') ?><br />
-          <div id="wdts-submit-shorttags">
-            <button class="wdts-create" id="wdts-scene-heading">Scene Heading</button>
-            <button class="wdts-create" id="wdts-scene-action">Scene Action</button>
-            <button class="wdts-create" id="wdts-dialog">Dialog</button>
-          </div>
           
-          <textarea style="height: 200px; width: 90%" id="wdts-transcript" name="wdts[transcript]"></textarea>
+          <div class="wdts-transcript-editor">
-          <input type="submit" value="<?php _e('Submit For Approval', 'what-did-they-say') ?>" />
+            <label>
-        <?php } ?>
+              <?php _e('Language:', 'what-did-they-say') ?>
-      </form>
+              <select name="wdts[language]">
+                <?php foreach ($language_options->get_languages() as $code => $info) { ?>
+                  <option value="<?php echo $code ?>"><?php echo $info['name'] ?></option>
+                <?php } ?>
+              </select>
+            </label>
+            
+            <div class="wdts-button-holder"></div>
+
+            <textarea style="height: 200px; width: 99%" name="wdts[transcript]"></textarea>
+            <input type="submit" value="<?php _e('Submit For Approval', 'what-did-they-say') ?>" />
+          </div>
+        </form>
+        <script type="text/javascript">WhatDidTheySay.setup_transcript_editor('<?php echo $id ?>')</script>
+      <?php } ?>
     <?php } ?>
   <?php }
 }