radiant-taggable-extension 1.2.3 → 1.2.4

data/public/javascripts/admin/taggable.js

@@ -0,0 +1,19 @@
+var TagSuggester = Behavior.create({
+  initialize: function() {
+    var textbox = this.element;
+    new Autocomplete(textbox, { 
+      serviceUrl: '/admin/tags.json', 
+      minChars: 2, 
+      maxHeight: 400, 
+      deferRequestBy: 500,
+      multiple: true
+    });
+  }
+});
+
+Event.addBehavior({
+  'input.toggle': Toggle.CheckboxBehavior({ onLoad: function(link) { if (!this.checked) Toggle.hide(this.toggleWrappers, this.effect); } }),
+  'input.tagger': TagSuggester
+});
+
+

data/public/javascripts/autocomplete.js

@@ -0,0 +1,334 @@
+/*
+ *
+ *  Ajax Autocomplete for Prototype, version 1.0.4
+ *  (c) 2010 Tomas Kirda
+ *
+ *  Ajax Autocomplete for Prototype is freely distributable under the terms of an MIT-style license.
+ *  For details, see the web site: http://www.devbridge.com/projects/autocomplete/
+ *
+ *  Adapted by Will 11/4/2011 to take a 'multiple' option and work with a comma-separated list of values.
+ *  Type-ahead would be nice too.
+ */
+
+var Autocomplete = function(el, options){
+  this.el = $(el);
+  this.id = this.el.identify();
+  this.el.setAttribute('autocomplete','off');
+  this.suggestions = [];
+  this.data = [];
+  this.badQueries = [];
+  this.selectedIndex = -1;
+  this.currentValue = this.el.value;
+  this.intervalId = 0;
+  this.cachedResponse = [];
+  this.instanceId = null;
+  this.onChangeInterval = null;
+  this.ignoreValueChange = false;
+  this.serviceUrl = options.serviceUrl;
+  this.options = {
+    autoSubmit:false,
+    minChars:1,
+    maxHeight:300,
+    deferRequestBy:0,
+    width:0,
+    container:null
+  };
+  if(options){ Object.extend(this.options, options); }
+  if(Autocomplete.isDomLoaded){
+    this.initialize();
+  }else{
+    Event.observe(document, 'dom:loaded', this.initialize.bind(this), false);
+  }
+};
+
+Autocomplete.instances = [];
+Autocomplete.isDomLoaded = false;
+
+Autocomplete.getInstance = function(id){
+  var instances = Autocomplete.instances;
+  var i = instances.length;
+  while(i--){ if(instances[i].id === id){ return instances[i]; }}
+};
+
+Autocomplete.highlight = function(value, re){
+  return value.replace(re, function(match){ return '<strong>' + match + '<\/strong>'; });
+};
+
+Autocomplete.prototype = {
+
+  killerFn: null,
+
+  initialize: function() {
+    var me = this;
+    this.killerFn = function(e) {
+      if (!$(Event.element(e)).up('.autocomplete')) {
+        me.killSuggestions();
+        me.disableKillerFn();
+      }
+    } .bindAsEventListener(this);
+
+    if (!this.options.width) { this.options.width = this.el.getWidth(); }
+
+    var div = new Element('div', { style: 'position:absolute;' });
+    div.update('<div class="autocomplete-w1"><div class="autocomplete-w2"><div class="autocomplete" id="Autocomplete_' + this.id + '" style="display:none; width:' + this.options.width + 'px;"></div></div></div>');
+
+    this.options.container = $(this.options.container);
+    if (this.options.container) {
+      this.options.container.appendChild(div);
+      this.fixPosition = function() { };
+    } else {
+      document.body.appendChild(div);
+    }
+
+    this.mainContainerId = div.identify();
+    this.container = $('Autocomplete_' + this.id);
+    this.fixPosition();
+    
+    Event.observe(this.el, window.opera ? 'keypress':'keydown', this.onKeyPress.bind(this));
+    Event.observe(this.el, 'keyup', this.onKeyUp.bind(this));
+    Event.observe(this.el, 'blur', this.enableKillerFn.bind(this));
+    Event.observe(this.el, 'focus', this.fixPosition.bind(this));
+    this.container.setStyle({ maxHeight: this.options.maxHeight + 'px' });
+    this.instanceId = Autocomplete.instances.push(this) - 1;
+  },
+
+  fixPosition: function() {
+    var offset = this.el.cumulativeOffset();
+    $(this.mainContainerId).setStyle({ top: (offset.top + this.el.getHeight()) + 'px', left: offset.left + 'px' });
+  },
+
+  enableKillerFn: function() {
+    Event.observe(document.body, 'click', this.killerFn);
+  },
+
+  disableKillerFn: function() {
+    Event.stopObserving(document.body, 'click', this.killerFn);
+  },
+
+  killSuggestions: function() {
+    this.stopKillSuggestions();
+    this.intervalId = window.setInterval(function() { this.hide(); this.stopKillSuggestions(); } .bind(this), 300);
+  },
+
+  stopKillSuggestions: function() {
+    window.clearInterval(this.intervalId);
+  },
+
+  onKeyPress: function(e) {
+    if (!this.enabled) { return; }
+    // return will exit the function
+    // and event will not fire
+    switch (e.keyCode) {
+      case Event.KEY_ESC:
+        this.el.value = this.currentValue;
+        this.hide();
+        break;
+      case Event.KEY_TAB:
+      case Event.KEY_RETURN:
+        if (this.selectedIndex === -1) {
+          this.hide();
+          return;
+        }
+        this.select(this.selectedIndex);
+        if (e.keyCode === Event.KEY_TAB) { return; }
+        break;
+      case Event.KEY_UP:
+        this.moveUp();
+        break;
+      case Event.KEY_DOWN:
+        this.moveDown();
+        break;
+      default:
+        return;
+    }
+    Event.stop(e);
+  },
+
+  onKeyUp: function(e) {
+    switch (e.keyCode) {
+      case Event.KEY_UP:
+      case Event.KEY_DOWN:
+        return;
+    }
+    clearInterval(this.onChangeInterval);
+    if (this.currentValue !== this.el.value) {
+      if (this.options.deferRequestBy > 0) {
+        // Defer lookup in case when value changes very quickly:
+        this.onChangeInterval = setInterval((function() {
+          this.onValueChange();
+        }).bind(this), this.options.deferRequestBy);
+      } else {
+        this.onValueChange();
+      }
+    }
+  },
+
+  onValueChange: function() {
+    clearInterval(this.onChangeInterval);
+    var newValue = this.activeValue();
+    this.selectedIndex = -1;
+    if (this.ignoreValueChange) {
+      this.ignoreValueChange = false;
+      return;
+    }
+    if (newValue === '' || newValue.length < this.options.minChars) {
+      this.hide();
+    } else {
+      this.getSuggestions();
+    }
+  },
+  
+  activeValue: function () {
+    if (this.options.multiple) {
+      return this.el.value.split(/,\s*/).last();
+    } else {
+      return this.el.value;
+    }
+  },
+
+  getSuggestions: function() {
+    var newValue = this.activeValue();
+    console.log('getting suggestions for ', newValue);
+    var cr = this.cachedResponse[newValue];
+    if (cr && Object.isArray(cr.suggestions)) {
+      this.suggestions = cr.suggestions;
+      this.data = cr.data;
+      this.suggest();
+    } else if (!this.isBadQuery(newValue)) {
+      new Ajax.Request(this.serviceUrl, {
+        parameters: { query: newValue },
+        onComplete: this.processResponse.bind(this),
+        method: 'get'
+      });
+    }
+  },
+
+  isBadQuery: function(q) {
+    var i = this.badQueries.length;
+    while (i--) {
+      if (q.indexOf(this.badQueries[i]) === 0) { return true; }
+    }
+    return false;
+  },
+
+  hide: function() {
+    this.enabled = false;
+    this.selectedIndex = -1;
+    this.container.hide();
+  },
+
+  suggest: function() {
+    if (this.suggestions.length === 0) {
+      this.hide();
+      return;
+    }
+    var content = [];
+    var re = new RegExp('\\b' + this.activeValue().match(/\w+/g).join('|\\b'), 'gi');
+    this.suggestions.each(function(value, i) {
+      content.push((this.selectedIndex === i ? '<div class="selected"' : '<div'), ' title="', value, '" onclick="Autocomplete.instances[', this.instanceId, '].select(', i, ');" onmouseover="Autocomplete.instances[', this.instanceId, '].activate(', i, ');">', Autocomplete.highlight(value, re), '</div>');
+    } .bind(this));
+    this.enabled = true;
+    this.container.update(content.join('')).show();
+  },
+
+  processResponse: function(xhr) {
+    var response;
+    try {
+      response = xhr.responseText.evalJSON();
+      if (!Object.isArray(response.data)) { response.data = []; }
+    } catch (err) { return; }
+    this.cachedResponse[response.query] = response;
+    if (response.suggestions.length === 0) { 
+      this.badQueries.push(response.query); 
+    }
+    if (response.query === this.activeValue()) {
+      this.suggestions = response.suggestions;
+      this.data = response.data;
+      this.suggest(); 
+    }
+  },
+
+  activate: function(index) {
+    var divs = this.container.childNodes;
+    var activeItem;
+    // Clear previous selection:
+    if (this.selectedIndex !== -1 && divs.length > this.selectedIndex) {
+      divs[this.selectedIndex].className = '';
+    }
+    this.selectedIndex = index;
+    if (this.selectedIndex !== -1 && divs.length > this.selectedIndex) {
+      activeItem = divs[this.selectedIndex];
+      activeItem.className = 'selected';
+    }
+    return activeItem;
+  },
+
+  deactivate: function(div, index) {
+    div.className = '';
+    if (this.selectedIndex === index) { this.selectedIndex = -1; }
+  },
+
+  select: function(i) {
+    var selectedValue = this.suggestions[i];
+    if (selectedValue) {
+      this.updateValue(selectedValue);
+      if (this.options.autoSubmit && this.el.form) {
+        this.el.form.submit();
+      }
+      this.ignoreValueChange = true;
+      this.hide();
+      this.onSelect(i);
+    }
+  },
+  
+  updateValue: function (selectedValue) {
+    if (this.options.multiple) {
+      var values = this.el.value.split(/,\s*/);
+      values.pop();
+      values.push(selectedValue, '');
+      this.el.value = values.uniq().join(', ');
+      
+    } else {
+      this.el.value = selectedValue;
+    }
+    this.currentValue = this.el.value;
+    this.el.focus();
+  },
+
+  moveUp: function() {
+    if (this.selectedIndex === -1) { return; }
+    if (this.selectedIndex === 0) {
+      this.container.childNodes[0].className = '';
+      this.selectedIndex = -1;
+      this.updateValue(this.currentValue);
+      return;
+    }
+    this.adjustScroll(this.selectedIndex - 1);
+  },
+
+  moveDown: function() {
+    if (this.selectedIndex === (this.suggestions.length - 1)) { return; }
+    this.adjustScroll(this.selectedIndex + 1);
+  },
+
+  adjustScroll: function(i) {
+    var container = this.container;
+    var activeItem = this.activate(i);
+    var offsetTop = activeItem.offsetTop;
+    var upperBound = container.scrollTop;
+    var lowerBound = upperBound + this.options.maxHeight - 25;
+    if (offsetTop < upperBound) {
+      container.scrollTop = offsetTop;
+    } else if (offsetTop > lowerBound) {
+      container.scrollTop = offsetTop - this.options.maxHeight + 25;
+    }
+    this.updateValue(this.suggestions[i]);
+  },
+
+  onSelect: function(i) {
+    (this.options.onSelect || Prototype.emptyFunction)(this.suggestions[i], this.data[i]);
+  }
+
+};
+
+Event.observe(document, 'dom:loaded', function(){ Autocomplete.isDomLoaded = true; }, false);

data/public/stylesheets/sass/admin/taggable.sass

@@ -0,0 +1,89 @@
+@import compass/css3
+
+// index
+
+#tags-table
+  table
+    margin-bottom: 0
+
+tr.secret
+  td
+    color: #999999
+    a
+      color: #999999
+
+td.tag-title
+  font-size: 115%
+  font-weight: bold
+
+td.tag-title a
+  text-decoration: none
+  color: black
+
+td.tag-description
+  font-size: 80%
+  color: #999999
+
+ul.cloud
+  list-style: none
+  margin: 0
+  padding: 0
+  line-height: 20px
+  ul.cloud li
+    display: inline
+    font-family: "Lucida Grande", "Bitstream Vera Sans", Helvetica, Verdana, Arial, sans-serif
+    letter-spacing: -0.04em
+    white-space: nowrap
+    line-height: 20px
+    margin: 0
+
+// edit-page
+
+p.title
+  width: 70%
+
+p.keywords
+  width: 28%
+  float: right
+  margin: 0 1% 0 0
+
+#content
+  form
+    .keywords
+      .textbox
+        font-family: Georgia, Palatino, "Times New Roman", Times, serif
+        font-size: 200%
+        width: 100%
+        color: #cc0000
+        margin-top: 4px
+
+#attributes
+  clear: both
+
+.autocomplete-w1
+  +box-shadow
+  position: absolute
+  top: 0
+  left: 0
+  background-color: #333
+
+.autocomplete-w2
+  padding: 0
+
+.autocomplete
+  font-family: Georgia, Palatino, "Times New Roman", Times, serif
+  width: 300px
+  opacity: 0.8
+  cursor: default
+  text-align: left
+  max-height: 350px
+  overflow: auto
+  margin: 0
+  div
+    padding: 5px 10px
+    white-space: nowrap
+    .selected
+      background: #f0f0f0
+  strong
+    font-weight: normal
+    color: #3399ff

data/radiant-taggable-extension.gemspec

@@ -5,11 +5,11 @@
 
 Gem::Specification.new do |s|
   s.name = %q{radiant-taggable-extension}
-  s.version = "1.2.3"
+  s.version = "1.2.4"
 
   s.required_rubygems_version = Gem::Requirement.new(">= 0") if s.respond_to? :required_rubygems_version=
   s.authors = ["spanner"]
-  s.date = %q{2011-03-13}
+  s.date = %q{2011-04-12}
   s.description = %q{General purpose tagging extension: more versatile but less focused than the tags extension}
   s.email = %q{will@spanner.org}
   s.extra_rdoc_files = [
@@ -22,6 +22,7 @@ Gem::Specification.new do |s|
      "VERSION",
      "app/controllers/admin/taggings_controller.rb",
      "app/controllers/admin/tags_controller.rb",
+     "app/helpers/taggable_helper.rb",
      "app/models/tag.rb",
      "app/models/tagging.rb",
      "app/views/admin/pages/_edit_title.html.haml",
@@ -32,9 +33,12 @@ Gem::Specification.new do |s|
      "app/views/admin/tags/index.html.haml",
      "app/views/admin/tags/new.html.haml",
      "app/views/admin/tags/show.html.haml",
+     "config/locales/en.yml",
      "config/routes.rb",
      "db/migrate/001_create_tags.rb",
      "db/migrate/002_import_keywords.rb",
+     "db/migrate/20110316210834_structural_tags.rb",
+     "db/migrate/20110411075109_metaphones.rb",
      "lib/natcmp.rb",
      "lib/radiant-taggable-extension.rb",
      "lib/taggable_admin_page_controller.rb",
@@ -43,9 +47,13 @@ Gem::Specification.new do |s|
      "lib/taggable_page.rb",
      "lib/taggable_tags.rb",
      "lib/tasks/taggable_extension_tasks.rake",
+     "lib/text/double_metaphone.rb",
+     "lib/text/metaphone.rb",
      "public/images/admin/new-tag.png",
      "public/images/admin/tag.png",
-     "public/stylesheets/admin/tags.css",
+     "public/javascripts/admin/taggable.js",
+     "public/javascripts/autocomplete.js",
+     "public/stylesheets/sass/admin/taggable.sass",
      "public/stylesheets/sass/tagcloud.sass",
      "radiant-taggable-extension.gemspec",
      "spec/datasets/tag_sites_dataset.rb",