diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js index 250672c7..8a56bca9 100644 --- a/app/assets/javascripts/application.js +++ b/app/assets/javascripts/application.js @@ -12,13 +12,10 @@ // //= require jquery //= require jquery_ujs -//= require twitter/bootstrap +//= require twitter/bootstrap/bootstrap-tooltip +//= require twitter/bootstrap/bootstrap-popover //= require mousetrap -// Stuff in app/assets -//= require tracks.js -//= require keybindings.js - // Stuff in vendor/assets // require jquery-ui-1.10.0.custom.min // require jquery.ui.touch-punch.min @@ -28,5 +25,10 @@ // require jquery.simulate.drag-sortable // require jquery.truncator +//= require typeahead //= require jquery.cookie //= require swf_fu + +// Stuff in app/assets +//= require tracks.js +//= require keybindings.js \ No newline at end of file diff --git a/app/assets/javascripts/keybindings.js.coffee b/app/assets/javascripts/keybindings.js.coffee index b6033a44..ded2a4e8 100644 --- a/app/assets/javascripts/keybindings.js.coffee +++ b/app/assets/javascripts/keybindings.js.coffee @@ -48,13 +48,13 @@ $ -> # GO TO Mousetrap.bind 'G', -> TracksApp.go_menu() - Mousetrap.bind 'g h', -> TracksApp.go_home() - Mousetrap.bind 'g c', -> alert("go context") - Mousetrap.bind 'g C', -> TracksApp.go_contexts() - Mousetrap.bind 'g t', -> alert("go tag") + Mousetrap.bind 'g h', -> TracksApp.go_home_page() + Mousetrap.bind 'g c', -> TracksApp.go_context() + Mousetrap.bind 'g C', -> TracksApp.go_contexts_page() + Mousetrap.bind 'g t', -> TracksApp.go_tag() Mousetrap.bind 'g p', -> TracksApp.go_project() - Mousetrap.bind 'g P', -> TracksApp.go_projects() - Mousetrap.bind 'g s', -> TracksApp.go_starred() + Mousetrap.bind 'g P', -> TracksApp.go_projects_page() + Mousetrap.bind 'g s', -> TracksApp.go_starred_page() # VIEW Mousetrap.bind 'v p', -> TracksApp.group_view_by_project() @@ -62,4 +62,5 @@ $ -> # Item Selection Mousetrap.bind 'j', -> TracksApp.selectNext() - Mousetrap.bind 'k', -> TracksApp.selectPrev() \ No newline at end of file + Mousetrap.bind 'k', -> TracksApp.selectPrev() + Mousetrap.bind 'n', -> TracksApp.toggleNoteOfSelectedTodo() \ No newline at end of file diff --git a/app/assets/javascripts/tracks.js.coffee b/app/assets/javascripts/tracks.js.coffee deleted file mode 100644 index ad929d7d..00000000 --- a/app/assets/javascripts/tracks.js.coffee +++ /dev/null @@ -1,118 +0,0 @@ -# Tracks specific coffeescript - -TracksApp = - goto_page: (page) -> window.location.href = page - go_home: -> TracksApp.goto_page "/" - go_contexts: -> TracksApp.goto_page "/contexts" - go_projects: -> TracksApp.goto_page "/projects" - go_starred: -> TracksApp.goto_page "/tag/starred" - - # TODO: refactor to work for contexts and projects and tags - go_project: -> - $("input#tracks-goto-project").val("") - $('div#tracks-go-project-dialog').on 'shown', -> $("input#tracks-goto-project").focus() - $('div#tracks-go-project-dialog').modal() - - go_menu: -> $('div#tracks-goto-dialog').modal() - add_todo: -> $('div#tracks-add-action-dialog').modal() - - createSubmenu: (todo, itemToAddBefore) -> - template_clone = $("div.todo-sub-menu-template").clone() - itemToAddBefore.before(template_clone) - todo_menu = todo.find("div.todo-sub-menu-template") - todo_menu.removeClass("todo-sub-menu-template") - todo_menu.addClass("todo-sub-menu") - todo_menu.removeClass("hide") - - appendTodoSubMenu: (todo) -> - if todo.find("div.todo-sub-menu").length is 0 - notes_row = todo.find(".todo-notes").parent() - submenu = TracksApp.createSubmenu(todo, notes_row) - else - todo.find("div.todo-sub-menu").removeClass("hide") - - selectTodo: (new_todo) -> - selected_item = $("div.todo-item.selected-item") - selected_item.find("div.todo-sub-menu").addClass("hide") - selected_item.find("span.todo-item-detail").addClass("hide") - selected_item.removeClass("selected-item") - TracksApp.appendTodoSubMenu(new_todo) - new_todo.find("span.todo-item-detail").removeClass("hide") - new_todo.addClass("selected-item") - - selectPrevNext: (go_next) -> - current = prev = next = null - stop = false - $("div.todo-item").each -> - if stop - next = $(this) - return false - - prev = current - current = $(this) - - if $(this).hasClass("selected-item") - stop = true - - if go_next - TracksApp.selectTodo(prev) if prev? - return prev - else - TracksApp.selectTodo(next) if next? - return next - - selectPrev: -> - unless TracksApp.selectPrevNext(true)? - TracksApp.selectTodo($("div.todo-item").last()) - - selectNext: -> - unless TracksApp.selectPrevNext(false)? - TracksApp.selectTodo($("div.todo-item").first()) - - show_note: (node) -> - notes_id = node.attr("data-note-id") - notes_div = $("div#" + notes_id ) - notes_div.toggleClass("hide") - todo_item = $(this).parent().parent().parent().parent().parent() - TracksApp.selectTodo(todo_item) - - refresh_page: -> - location.reload(true) - - group_view_by: (state) -> - $.cookie('group_view_by', state) - - group_view_by_context: -> - TracksApp.group_view_by('context') - TracksApp.refresh_page() - - group_view_by_project: -> - TracksApp.group_view_by('project') - TracksApp.refresh_page() - - -# Make TracksApp globally accessible. From http://stackoverflow.com/questions/4214731/coffeescript-global-variables -root = exports ? this -root.TracksApp = TracksApp - -$ -> - $("a#menu-keyboard-shotcuts").click -> $('div#tracks-shortcuts-dialog').modal() - $("a.button-add-todo").click -> TracksApp.add_todo() - $("a.button-home").click -> TracksApp.go_home() - $("a.button-goto").click -> TracksApp.go_menu() - $("i.icon-book").click -> TracksApp.show_note( $(this) ) - $("span.todo-item-description-container").click -> TracksApp.selectTodo( $(this).parent().parent().parent() ) - - $('.ajax-typeahead').typeahead - minLength: 2, - source: (query, process) -> - typeaheadURL = $(this)[0].$element[0].dataset.link - return $.ajax - url: typeaheadURL, - type: 'get', - data: {"query": query}, - dataType: 'json', - success: (json) -> - $("input#tracks-json-result").val(json) - map = $.map json, (data, item) -> data.value - return process(map) \ No newline at end of file diff --git a/app/assets/javascripts/tracks.js.coffee.erb b/app/assets/javascripts/tracks.js.coffee.erb new file mode 100644 index 00000000..daf6674f --- /dev/null +++ b/app/assets/javascripts/tracks.js.coffee.erb @@ -0,0 +1,177 @@ +# Tracks specific coffeescript + +TracksApp = + dialog_data: { + project: { + title: "Go to project" + placeholder: "Type (part of) project name" + autocomplete_link: "<%= Rails.application.routes.url_helpers.projects_path(format: :autocomplete) %>" + target_link: "<%= Rails.application.routes.url_helpers.project_path "" %>" + target_id: "id" # json/datum field containing id to use + } + context: { + title: "Go to context" + placeholder: "Type (part of) context name" + autocomplete_link: "<%= Rails.application.routes.url_helpers.contexts_path(format: :autocomplete) %>" + target_link: "<%= Rails.application.routes.url_helpers.context_path ""%>" + target_id: "id" # json/datum field containing id to use + } + tag: { + title: "Go to tagged actions" + placeholder: "Type (part of) tag name" + autocomplete_link: "<%= Rails.application.routes.url_helpers.tags_autocomplete_path %>" + target_link: "<%= Rails.application.routes.url_helpers.tag_path "" %>" + # json/datum field containing id to use. For tag it is the tag name, not the id field + target_id: "value" + } + } + + goto_page: (page) -> window.location.href = page + go_home_page: -> TracksApp.goto_page "<%= Rails.application.routes.url_helpers.root_path %>" + go_contexts_page: -> TracksApp.goto_page "<%= Rails.application.routes.url_helpers.contexts_path %>" + go_projects_page: -> TracksApp.goto_page "<%= Rails.application.routes.url_helpers.projects_path %>" + go_starred_page: -> TracksApp.goto_page "<%= Rails.application.routes.url_helpers.tag_path("starred") %>" + + show_item_dialog: (settings) -> + dialog = $('div#tracks-go-item-dialog') + # clear input field and set attributes + dialog.find("input#tracks-goto-item").typeahead("val", "") + dialog.find("input#tracks-goto-item").attr("placeholder", settings.placeholder) + dialog.find("input#tracks-goto-item").attr("data-link", settings.autocomplete_link) + dialog.find("form").attr("data-link", settings.target_link) + dialog.find("form").attr("data-id", settings.target_id) + # set title of dialog + dialog.find("h3#myModalLabel").html(settings.title) + # set focus to input field when dialog is shown + dialog.on 'shown', -> + # twitter-typeahead adds span around search field with display:inline-block. This causes + # the search field to ignore the width set in tracks.css + $("span.twitter-typeahead").css("display", "block") + $("input#tracks-goto-item").focus() + # show the dialog + dialog.modal() + + go_project: -> TracksApp.show_item_dialog(TracksApp.dialog_data.project) + go_context: -> TracksApp.show_item_dialog(TracksApp.dialog_data.context) + go_tag: -> TracksApp.show_item_dialog(TracksApp.dialog_data.tag) + + go_menu: -> $('div#tracks-goto-dialog').modal() + add_todo: -> $('div#tracks-add-action-dialog').modal() + + createSubmenu: (todo, itemToAddBefore) -> + template_clone = $("div.todo-sub-menu-template").clone() + itemToAddBefore.before(template_clone) + todo_menu = todo.find("div.todo-sub-menu-template") + todo_menu.removeClass("todo-sub-menu-template") + todo_menu.addClass("todo-sub-menu") + todo_menu.removeClass("hide") + + appendTodoSubMenu: (todo) -> + if todo.find("div.todo-sub-menu").length is 0 + notes_row = todo.find(".todo-notes").parent() + submenu = TracksApp.createSubmenu(todo, notes_row) + else + todo.find("div.todo-sub-menu").removeClass("hide") + + selectTodo: (new_todo) -> + selected_item = $("div.todo-item.selected-item") + selected_item.find("div.todo-sub-menu").addClass("hide") + selected_item.find("span.todo-item-detail").addClass("hide") + selected_item.removeClass("selected-item") + TracksApp.appendTodoSubMenu(new_todo) + new_todo.find("span.todo-item-detail").removeClass("hide") + new_todo.addClass("selected-item") + + selectPrevNext: (go_next) -> + current = prev = next = null + stop = false + $("div.todo-item").each -> + if stop + next = $(this) + return false + + prev = current + current = $(this) + + if $(this).hasClass("selected-item") + stop = true + + if go_next + TracksApp.selectTodo(prev) if prev? + return prev + else + TracksApp.selectTodo(next) if next? + return next + + selectPrev: -> + unless TracksApp.selectPrevNext(true)? + TracksApp.selectTodo($("div.todo-item").last()) + + selectNext: -> + unless TracksApp.selectPrevNext(false)? + TracksApp.selectTodo($("div.todo-item").first()) + + toggleNoteOfSelectedTodo: -> + selected_item = $("div.todo-item.selected-item") + notes_id = selected_item.find("i.icon-book").attr("data-note-id") + notes_div = $("div#" + notes_id ) + notes_div.toggleClass("hide") + + toggleNoteOfTodo: (node) -> + todo_item = $(this).parent().parent().parent().parent().parent() + TracksApp.selectTodo(todo_item) + TracksApp.toggleNoteOfSelectedTodo() + + refresh_page: -> + location.reload(true) + + group_view_by: (state) -> + $.cookie('group_view_by', state) + + group_view_by_context: -> + TracksApp.group_view_by('context') + TracksApp.refresh_page() + + group_view_by_project: -> + TracksApp.group_view_by('project') + TracksApp.refresh_page() + + +# Make TracksApp globally accessible. From http://stackoverflow.com/questions/4214731/coffeescript-global-variables +root = exports ? this +root.TracksApp = TracksApp + +$ -> + $("a#menu-keyboard-shotcuts").click -> $('div#tracks-shortcuts-dialog').modal() + $("a.button-add-todo").click -> TracksApp.add_todo() + $("a.button-home").click -> TracksApp.go_home() + $("a.button-goto").click -> TracksApp.go_menu() + $("i.icon-book").click -> TracksApp.toggleNoteOfTodo( $(this) ) + $("span.todo-item-description-container").click -> TracksApp.selectTodo( $(this).parent().parent().parent() ) + + autocompleteDataset = new Dataset + limit: 7 + remote: + url: "/wrong-url-from-tracks-js.autocomplete" + replace: (url, query) -> + # replace url with data-link attribute + $("input#tracks-goto-item").attr("data-link")+"?query="+query + + autocompleteDataset.initialize() + + $('input.ajax-typeahead').typeahead + minLength: 2 + hint: true + autoselect: true + sections: + highlight: true + source: autocompleteDataset + + $('input.ajax-typeahead').on "typeahead:selected", (ev, datum) -> + form = $("div#tracks-go-item-dialog form") + base_url = form.attr("data-link") + base_id = datum[form.attr("data-id")] + form.attr("action", base_url + base_id) + form.submit() + + $('a[rel="tracks-popover"]').popover() \ No newline at end of file diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css index b14f486e..f1e794d4 100644 --- a/app/assets/stylesheets/application.css +++ b/app/assets/stylesheets/application.css @@ -13,4 +13,4 @@ *= require mousetrap *= require_tree ../../../vendor/assets/stylesheets *= require tracks -*/ +*/ \ No newline at end of file diff --git a/app/assets/stylesheets/tracks.css.scss b/app/assets/stylesheets/tracks.css.scss index d4cfe78e..247bc090 100644 --- a/app/assets/stylesheets/tracks.css.scss +++ b/app/assets/stylesheets/tracks.css.scss @@ -170,7 +170,7 @@ div.todos-container { overflow-y: visible; } -div#tracks-go-project-dialog { +div#tracks-go-item-dialog { input.input-medium { width : 95%; } diff --git a/app/controllers/contexts_controller.rb b/app/controllers/contexts_controller.rb index c2c99d31..3d0725c3 100644 --- a/app/controllers/contexts_controller.rb +++ b/app/controllers/contexts_controller.rb @@ -31,7 +31,9 @@ class ContextsController < ApplicationController headers['Content-Type']=Mime::TEXT.to_s render :action => 'index', :layout => false, :content_type => Mime::TEXT end - format.autocomplete &render_autocomplete + format.autocomplete do + render :text => for_autocomplete(@all_contexts, params[:query] || params[:term]) + end end end @@ -220,12 +222,6 @@ class ContextsController < ApplicationController end end - def render_autocomplete - lambda do - render :text => for_autocomplete(current_user.contexts, params[:term]) - end - end - def feed_options Context.feed_options(current_user) end diff --git a/app/controllers/todos_controller.rb b/app/controllers/todos_controller.rb index ea823b25..03e5971e 100644 --- a/app/controllers/todos_controller.rb +++ b/app/controllers/todos_controller.rb @@ -685,12 +685,13 @@ class TodosController < ApplicationController def tags # TODO: limit to current_user - tags_beginning = Tag.where('name like ?', params[:term]+'%') - tags_all = Tag.where('name like ?', '%'+params[:term]+'%') + term = params[:query] || param[:term] + tags_beginning = Tag.where('name like ?', term+'%') + tags_all = Tag.where('name like ?', '%'+term+'%') tags_all= tags_all - tags_beginning respond_to do |format| - format.autocomplete { render :text => for_autocomplete(tags_beginning+tags_all, params[:term]) } + format.autocomplete { render :text => for_autocomplete(tags_beginning+tags_all, term) } end end diff --git a/app/helpers/projects_helper.rb b/app/helpers/projects_helper.rb index 82b5f351..a6be59de 100644 --- a/app/helpers/projects_helper.rb +++ b/app/helpers/projects_helper.rb @@ -8,12 +8,6 @@ module ProjectsHelper end end - def show_project_settings(project) - content_tag(:div, :id => dom_id(project, "container"), :class=>"list") do - render :partial => "projects/project_settings", :object => project - end - end - def project_next_prev content_tag(:div, :id=>"project-next-prev") do html = "" @@ -49,7 +43,7 @@ module ProjectsHelper end def link_to_edit_project (project, descriptor = sanitize(project.name)) - link_to_edit(:project, project, descriptor) + link_to_edit(:project, project, descriptor).sub!('"',"'") end end diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb index 0b9f152a..1a55fdd3 100644 --- a/app/views/layouts/application.html.erb +++ b/app/views/layouts/application.html.erb @@ -49,7 +49,7 @@ <%= render partial: "shared/add_new_action" %> <%= render partial: "shared/goto" %> <%= render partial: "todos/todo_sub_menu" %> - <%= render partial: "projects/go_project" %> + <%= render partial: "projects/goto_item" %> <% end -%> <% # Javascripts diff --git a/app/views/projects/_go_project.html.erb b/app/views/projects/_go_project.html.erb deleted file mode 100644 index d6b5d6d6..00000000 --- a/app/views/projects/_go_project.html.erb +++ /dev/null @@ -1,17 +0,0 @@ - \ No newline at end of file diff --git a/app/views/projects/_goto_item.html.erb b/app/views/projects/_goto_item.html.erb new file mode 100644 index 00000000..530628a9 --- /dev/null +++ b/app/views/projects/_goto_item.html.erb @@ -0,0 +1,16 @@ + \ No newline at end of file diff --git a/app/views/projects/_project_settings.html.erb b/app/views/projects/_project_settings.html.erb index 86311954..befc8cbc 100644 --- a/app/views/projects/_project_settings.html.erb +++ b/app/views/projects/_project_settings.html.erb @@ -1,6 +1,6 @@ <% project = project_settings -%> -
-
<%= t('projects.this_project') %> +
+
<%= t('projects.this_project') %> <% if project.completed? -%><%= t('projects.was_marked_complete') %> <% elsif project.hidden? -%><%= t('projects.was_marked_hidden') %> <% else -%><%= t('projects.is_active') %> @@ -18,9 +18,9 @@ <%= link_to_edit_project(project, t('projects.edit_project_settings')) %>
<% unless project.description.blank? -%> -
<%= Tracks::Utils.render_text(project.description) %>
+
<%= Tracks::Utils.render_text(project.description) %>
<% end -%>
- - -
- <%= render :partial => "shared/add_new_item_form" %> - <%= render :file => "sidebar/sidebar" %>
\ No newline at end of file diff --git a/app/views/shared/_keyboard_shortcuts.html.erb b/app/views/shared/_keyboard_shortcuts.html.erb index af0e6af3..1d2d4347 100644 --- a/app/views/shared/_keyboard_shortcuts.html.erb +++ b/app/views/shared/_keyboard_shortcuts.html.erb @@ -23,6 +23,10 @@
  • v then p: group the actions on the page by project
  • v then c: group the actions on the page by context
    • +

    Handling actions:

    +
    diff --git a/app/views/todos/tag.html.erb b/app/views/todos/tag.html.erb index d545b50e..9e068422 100644 --- a/app/views/todos/tag.html.erb +++ b/app/views/todos/tag.html.erb @@ -11,7 +11,7 @@ hidden_options = options.clone done_options = options.clone -%> -<% cache("not_done_with_tag_#{@tag_name}", @not_done_todos.empty?) do -%> +<% cache ["not_done_with_tag_#{@tag_name}", @not_done_todos.empty?] do -%> <%= render partial: "empty_message_container", locals: {:show => @not_done_todos.empty?, :container_name => "not_done_with_tag"} %> <% end -%> diff --git a/vendor/assets/javascripts/typeahead.js b/vendor/assets/javascripts/typeahead.js new file mode 100644 index 00000000..782d1f33 --- /dev/null +++ b/vendor/assets/javascripts/typeahead.js @@ -0,0 +1,1633 @@ +/*! + * typeahead.js 0.10.0-beta + * https://github.com/twitter/typeahead + * Copyright 2013 Twitter, Inc. and other contributors; Licensed MIT + */ + +(function($) { + var _ = { + isMsie: function() { + var match = /(msie) ([\w.]+)/i.exec(navigator.userAgent); + return match ? parseInt(match[2], 10) : false; + }, + isBlankString: function(str) { + return !str || /^\s*$/.test(str); + }, + escapeRegExChars: function(str) { + return str.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&"); + }, + isString: function(obj) { + return typeof obj === "string"; + }, + isNumber: function(obj) { + return typeof obj === "number"; + }, + isArray: $.isArray, + isFunction: $.isFunction, + isObject: $.isPlainObject, + isUndefined: function(obj) { + return typeof obj === "undefined"; + }, + bind: $.proxy, + each: function(collection, cb) { + $.each(collection, reverseArgs); + function reverseArgs(index, value) { + return cb(value, index); + } + }, + map: $.map, + filter: $.grep, + every: function(obj, test) { + var result = true; + if (!obj) { + return result; + } + $.each(obj, function(key, val) { + if (!(result = test.call(null, val, key, obj))) { + return false; + } + }); + return !!result; + }, + some: function(obj, test) { + var result = false; + if (!obj) { + return result; + } + $.each(obj, function(key, val) { + if (result = test.call(null, val, key, obj)) { + return false; + } + }); + return !!result; + }, + mixin: $.extend, + getUniqueId: function() { + var counter = 0; + return function() { + return counter++; + }; + }(), + templatify: function templatify(obj) { + return $.isFunction(obj) ? obj : template; + function template() { + return String(obj); + } + }, + defer: function(fn) { + setTimeout(fn, 0); + }, + debounce: function(func, wait, immediate) { + var timeout, result; + return function() { + var context = this, args = arguments, later, callNow; + later = function() { + timeout = null; + if (!immediate) { + result = func.apply(context, args); + } + }; + callNow = immediate && !timeout; + clearTimeout(timeout); + timeout = setTimeout(later, wait); + if (callNow) { + result = func.apply(context, args); + } + return result; + }; + }, + throttle: function(func, wait) { + var context, args, timeout, result, previous, later; + previous = 0; + later = function() { + previous = new Date(); + timeout = null; + result = func.apply(context, args); + }; + return function() { + var now = new Date(), remaining = wait - (now - previous); + context = this; + args = arguments; + if (remaining <= 0) { + clearTimeout(timeout); + timeout = null; + previous = now; + result = func.apply(context, args); + } else if (!timeout) { + timeout = setTimeout(later, remaining); + } + return result; + }; + }, + noop: function() {} + }; + var VERSION = "0.10.0-beta"; + var LruCache = function(root, undefined) { + function LruCache(maxSize) { + this.maxSize = maxSize || 100; + this.size = 0; + this.hash = {}; + this.list = new List(); + } + _.mixin(LruCache.prototype, { + set: function set(key, val) { + var tailItem = this.list.tail, node; + if (this.size >= this.maxSize) { + this.list.remove(tailItem); + delete this.hash[tailItem.key]; + } + if (node = this.hash[key]) { + node.val = val; + this.list.moveToFront(node); + } else { + node = new Node(key, val); + this.list.add(node); + this.hash[key] = node; + this.size++; + } + }, + get: function get(key) { + var node = this.hash[key]; + if (node) { + this.list.moveToFront(node); + return node.val; + } + } + }); + function List() { + this.head = this.tail = null; + } + _.mixin(List.prototype, { + add: function add(node) { + if (this.head) { + node.next = this.head; + this.head.prev = node; + } + this.head = node; + this.tail = this.tail || node; + }, + remove: function remove(node) { + node.prev ? node.prev.next = node.next : this.head = node.next; + node.next ? node.next.prev = node.prev : this.tail = node.prev; + }, + moveToFront: function(node) { + this.remove(node); + this.add(node); + } + }); + function Node(key, val) { + this.key = key; + this.val = val; + this.prev = this.next = null; + } + return LruCache; + }(this); + var PersistentStorage = function() { + var ls, methods; + try { + ls = window.localStorage; + ls.setItem("~~~", "!"); + ls.removeItem("~~~"); + } catch (err) { + ls = null; + } + function PersistentStorage(namespace) { + this.prefix = [ "__", namespace, "__" ].join(""); + this.ttlKey = "__ttl__"; + this.keyMatcher = new RegExp("^" + this.prefix); + } + if (ls && window.JSON) { + methods = { + _prefix: function(key) { + return this.prefix + key; + }, + _ttlKey: function(key) { + return this._prefix(key) + this.ttlKey; + }, + get: function(key) { + if (this.isExpired(key)) { + this.remove(key); + } + return decode(ls.getItem(this._prefix(key))); + }, + set: function(key, val, ttl) { + if (_.isNumber(ttl)) { + ls.setItem(this._ttlKey(key), encode(now() + ttl)); + } else { + ls.removeItem(this._ttlKey(key)); + } + return ls.setItem(this._prefix(key), encode(val)); + }, + remove: function(key) { + ls.removeItem(this._ttlKey(key)); + ls.removeItem(this._prefix(key)); + return this; + }, + clear: function() { + var i, key, keys = [], len = ls.length; + for (i = 0; i < len; i++) { + if ((key = ls.key(i)).match(this.keyMatcher)) { + keys.push(key.replace(this.keyMatcher, "")); + } + } + for (i = keys.length; i--; ) { + this.remove(keys[i]); + } + return this; + }, + isExpired: function(key) { + var ttl = decode(ls.getItem(this._ttlKey(key))); + return _.isNumber(ttl) && now() > ttl ? true : false; + } + }; + } else { + methods = { + get: _.noop, + set: _.noop, + remove: _.noop, + clear: _.noop, + isExpired: _.noop + }; + } + _.mixin(PersistentStorage.prototype, methods); + return PersistentStorage; + function now() { + return new Date().getTime(); + } + function encode(val) { + return JSON.stringify(_.isUndefined(val) ? null : val); + } + function decode(val) { + return JSON.parse(val); + } + }(); + var Transport = function() { + var pendingRequestsCount = 0, pendingRequests = {}, maxPendingRequests = 6, requestCache = new LruCache(10); + function Transport(o) { + o = o || {}; + this._send = o.send ? callbackToDeferred(o.send) : $.ajax; + this._get = o.rateLimiter ? o.rateLimiter(this._get) : this._get; + } + Transport.setMaxPendingRequests = function setMaxPendingRequests(num) { + maxPendingRequests = num; + }; + Transport.resetCache = function clearCache() { + requestCache = new LruCache(10); + }; + _.mixin(Transport.prototype, { + _get: function(url, o, cb) { + var that = this, jqXhr; + if (jqXhr = pendingRequests[url]) { + jqXhr.done(done); + } else if (pendingRequestsCount < maxPendingRequests) { + pendingRequestsCount++; + pendingRequests[url] = this._send(url, o).done(done).always(always); + } else { + this.onDeckRequestArgs = [].slice.call(arguments, 0); + } + function done(resp) { + cb && cb(resp); + requestCache.set(url, resp); + } + function always() { + pendingRequestsCount--; + delete pendingRequests[url]; + if (that.onDeckRequestArgs) { + that._get.apply(that, that.onDeckRequestArgs); + that.onDeckRequestArgs = null; + } + } + }, + get: function(url, o, cb) { + var that = this, resp; + if (_.isFunction(o)) { + cb = o; + o = {}; + } + if (resp = requestCache.get(url)) { + _.defer(function() { + cb && cb(resp); + }); + } else { + this._get(url, o, cb); + } + return !!resp; + } + }); + return Transport; + function callbackToDeferred(fn) { + return function customSendWrapper(url, o) { + var deferred = $.Deferred(); + fn(url, o, onSuccess, onError); + return deferred; + function onSuccess(resp) { + _.defer(function() { + deferred.resolve(resp); + }); + } + function onError(err) { + _.defer(function() { + deferred.reject(err); + }); + } + }; + } + }(); + var SearchIndex = function() { + function SearchIndex(o) { + o = o || {}; + this.tokenize = o.tokenizer || tokenize; + this.datums = []; + this.trie = newNode(); + } + _.mixin(SearchIndex.prototype, { + bootstrap: function bootstrap(o) { + this.datums = o.datums; + this.trie = o.trie; + }, + add: function(data) { + var that = this; + data = _.isArray(data) ? data : [ data ]; + _.each(data, function(datum) { + var id, tokens; + id = that.datums.push(datum) - 1; + tokens = normalizeTokens(datum.tokens || that.tokenize(datum.value)); + delete datum.tokens; + _.each(tokens, function(token) { + var node, chars, ch, ids; + node = that.trie; + chars = token.split(""); + while (ch = chars.shift()) { + node = node.children[ch] || (node.children[ch] = newNode()); + node.ids.push(id); + } + }); + }); + }, + remove: function remove() { + $.error("not implemented"); + }, + get: function get(query) { + var that = this, tokens, matches; + tokens = this.tokenize(query); + _.each(tokens, function(token) { + var node, chars, ch, ids; + if (matches && matches.length === 0) { + return false; + } + node = that.trie; + chars = token.split(""); + while (node && (ch = chars.shift())) { + node = node.children[ch]; + } + if (node && chars.length === 0) { + ids = node.ids.slice(0); + matches = matches ? getIntersection(matches, ids) : ids; + } else { + return false; + } + }); + return matches ? _.map(unique(matches), function(id) { + return that.datums[id]; + }) : []; + }, + serialize: function serialize() { + return { + datums: this.datums, + trie: this.trie + }; + } + }); + return SearchIndex; + function tokenize(str) { + return $.trim(str).toLowerCase().split(/\s+/); + } + function normalizeTokens(tokens) { + tokens = _.filter(tokens, function(token) { + return !!token; + }); + tokens = _.map(tokens, function(token) { + return token.toLowerCase(); + }); + return tokens; + } + function newNode() { + return { + ids: [], + children: {} + }; + } + function unique(array) { + var seen = {}, uniques = []; + for (var i = 0; i < array.length; i++) { + if (!seen[array[i]]) { + seen[array[i]] = true; + uniques.push(array[i]); + } + } + return uniques; + } + function getIntersection(arrayA, arrayB) { + var ai = 0, bi = 0, intersection = []; + arrayA = arrayA.sort(compare); + arrayB = arrayB.sort(compare); + while (ai < arrayA.length && bi < arrayB.length) { + if (arrayA[ai] < arrayB[bi]) { + ai++; + } else if (arrayA[ai] > arrayB[bi]) { + bi++; + } else { + intersection.push(arrayA[ai]); + ai++; + bi++; + } + } + return intersection; + function compare(a, b) { + return a - b; + } + } + }(); + var Dataset = window.Dataset = function() { + var keys; + keys = { + data: "data", + protocol: "protocol", + thumbprint: "thumbprint" + }; + function Dataset(o) { + if (!o || !o.local && !o.prefetch && !o.remote) { + $.error("one of local, prefetch, or remote is required"); + } + this.name = o.name || _.getUniqueId(); + this.limit = o.limit || 5; + this.valueKey = o.valueKey || "value"; + this.dupChecker = getDupChecker(o.dupChecker); + this.sorter = getSorter(o.sorter); + this.local = getLocal(o); + this.prefetch = getPrefetch(o); + this.remote = getRemote(o); + this.index = new SearchIndex({ + tokenizer: o.tokenizer + }); + this.storage = o.name ? new PersistentStorage(o.name) : null; + } + _.mixin(Dataset.prototype, { + _loadPrefetch: function loadPrefetch(o) { + var that = this, serialized, deferred; + if (serialized = this._readFromStorage(o.thumbprint)) { + this.index.bootstrap(serialized); + deferred = $.Deferred().resolve(); + } else { + deferred = $.ajax(o.url, o.ajax).done(handlePrefetchResponse); + } + return deferred; + function handlePrefetchResponse(resp) { + var filtered, normalized; + filtered = o.filter ? o.filter(resp) : resp; + that.add(filtered); + that._saveToStorage(that.index.serialize(), o.thumbprint, o.ttl); + } + }, + _getFromRemote: function getFromRemote(query, cb) { + var that = this, url, uriEncodedQuery; + query = query || ""; + uriEncodedQuery = encodeURIComponent(query); + url = this.remote.replace ? this.remote.replace(this.remote.url, query) : this.remote.url.replace(this.remote.wildcard, uriEncodedQuery); + return this.transport.get(url, this.remote.ajax, handleRemoteResponse); + function handleRemoteResponse(resp) { + var filtered = that.remote.filter ? that.remote.filter(resp) : resp; + cb(that._normalize(filtered)); + } + }, + _normalize: function normalize(data) { + var that = this; + return _.map(data, normalizeRawDatum); + function normalizeRawDatum(raw) { + var value, datum; + value = _.isString(raw) ? raw : raw[that.valueKey]; + datum = { + value: value, + tokens: raw.tokens + }; + _.isString(raw) ? (datum.raw = {})[that.valueKey] = raw : datum.raw = raw; + return datum; + } + }, + _saveToStorage: function saveToStorage(data, thumbprint, ttl) { + if (this.storage) { + this.storage.set(keys.data, data, ttl); + this.storage.set(keys.protocol, location.protocol, ttl); + this.storage.set(keys.thumbprint, thumbprint, ttl); + } + }, + _readFromStorage: function readFromStorage(thumbprint) { + var stored = {}; + if (this.storage) { + stored.data = this.storage.get(keys.data); + stored.protocol = this.storage.get(keys.protocol); + stored.thumbprint = this.storage.get(keys.thumbprint); + } + isExpired = stored.thumbprint !== thumbprint || stored.protocol !== location.protocol; + return stored.data && !isExpired ? stored.data : null; + }, + initialize: function initialize() { + var that = this, deferred; + deferred = this.prefetch ? this._loadPrefetch(this.prefetch) : $.Deferred().resolve(); + this.local && deferred.done(addLocalToIndex); + this.transport = this.remote ? new Transport(this.remote) : null; + this.initialize = function initialize() { + return that; + }; + return this; + function addLocalToIndex() { + that.add(that.local); + } + }, + add: function add(data) { + var normalized; + data = _.isArray(data) ? data : [ data ]; + normalized = this._normalize(data); + this.index.add(normalized); + }, + get: function get(query, cb) { + var that = this, matches, cacheHit = false; + matches = _.map(this.index.get(query), pickRaw).sort(this.sorter).slice(0, this.limit); + if (matches.length < this.limit && this.transport) { + cacheHit = this._getFromRemote(query, returnRemoteMatches); + } + !cacheHit && cb && cb(matches); + function returnRemoteMatches(remoteMatches) { + var matchesWithBackfill = matches.slice(0); + remoteMatches = _.map(remoteMatches, pickRaw); + _.each(remoteMatches, function(remoteMatch) { + var isDuplicate; + isDuplicate = _.some(matchesWithBackfill, function(match) { + return that.dupChecker(remoteMatch, match); + }); + !isDuplicate && matchesWithBackfill.push(remoteMatch); + return matchesWithBackfill.length < that.limit; + }); + cb && cb(matchesWithBackfill.sort(this.sorter)); + } + function pickRaw(obj) { + return obj.raw; + } + } + }); + return Dataset; + function getSorter(sorter) { + return sorter || defaultSorter; + function defaultSorter() { + return 0; + } + } + function getDupChecker(dupChecker) { + if (!_.isFunction(dupChecker)) { + dupChecker = dupChecker === false ? ignoreDups : standardDupChecker; + } + return dupChecker; + function ignoreDups() { + return false; + } + function standardDupChecker(a, b) { + return a.value === b.value; + } + } + function getLocal(o) { + return o.local || null; + } + function getPrefetch(o) { + var prefetch, defaults; + defaults = { + url: null, + thumbprint: "", + ttl: 24 * 60 * 60 * 1e3, + filter: null, + ajax: {} + }; + if (prefetch = o.prefetch || null) { + prefetch = _.isString(prefetch) ? { + url: prefetch + } : prefetch; + prefetch = _.mixin(defaults, prefetch); + prefetch.thumbprint = VERSION + prefetch.thumbprint; + prefetch.ajax.method = prefetch.ajax.method || "get"; + prefetch.ajax.dataType = prefetch.ajax.dataType || "json"; + } + return prefetch; + } + function getRemote(o) { + var remote, defaults; + defaults = { + url: null, + wildcard: "%QUERY", + replace: null, + rateLimitBy: "debounce", + rateLimitWait: 300, + send: null, + filter: null, + ajax: {} + }; + if (remote = o.remote || null) { + remote = _.isString(remote) ? { + url: remote + } : remote; + remote = _.mixin(defaults, remote); + remote.rateLimiter = /^throttle$/i.test(remote.rateLimitBy) ? byThrottle(remote.rateLimitWait) : byDebounce(remote.rateLimitWait); + remote.ajax.method = remote.ajax.method || "get"; + remote.ajax.dataType = remote.ajax.dataType || "json"; + delete remote.rateLimitBy; + delete remote.rateLimitWait; + } + return remote; + function byDebounce(wait) { + return function(fn) { + return _.debounce(fn, wait); + }; + } + function byThrottle(wait) { + return function(fn) { + return _.throttle(fn, wait); + }; + } + } + }(); + var html = { + wrapper: '', + dropdown: '', + section: '
    ', + suggestions: '', + suggestion: '
    %BODY%
    ' + }; + var css = { + wrapper: { + position: "relative", + display: "inline-block" + }, + hint: { + position: "absolute", + top: "0", + left: "0", + borderColor: "transparent", + boxShadow: "none" + }, + input: { + position: "relative", + verticalAlign: "top", + backgroundColor: "transparent" + }, + inputWithNoHint: { + position: "relative", + verticalAlign: "top" + }, + dropdown: { + position: "absolute", + top: "100%", + left: "0", + zIndex: "100", + display: "none" + }, + suggestions: { + display: "block" + }, + suggestion: { + whiteSpace: "nowrap", + cursor: "pointer" + }, + suggestionChild: { + whiteSpace: "normal" + }, + ltr: { + left: "0", + right: "auto" + }, + rtl: { + left: "auto", + right: " 0" + } + }; + if (_.isMsie()) { + _.mixin(css.query, { + backgroundImage: "url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7)" + }); + } + if (_.isMsie() && _.isMsie() <= 7) { + _.mixin(css.wrapper, { + display: "inline", + zoom: "1" + }); + _.mixin(css.query, { + marginTop: "-1px" + }); + } + var EventBus = function() { + var namespace = "typeahead:"; + function EventBus(o) { + if (!o || !o.el) { + $.error("EventBus initialized without el"); + } + this.$el = $(o.el); + } + _.mixin(EventBus.prototype, { + trigger: function(type) { + var args = [].slice.call(arguments, 1); + this.$el.trigger(namespace + type, args); + } + }); + return EventBus; + }(); + var EventEmitter = function() { + var splitter = /\s+/, nextTick = getNextTick(); + return { + onSync: onSync, + onAsync: onAsync, + off: off, + trigger: trigger + }; + function on(method, types, cb, context) { + var type; + if (!cb) { + return this; + } + types = types.split(splitter); + cb = context ? bindContext(cb, context) : cb; + this._callbacks = this._callbacks || {}; + while (type = types.shift()) { + this._callbacks[type] = this._callbacks[type] || { + sync: [], + async: [] + }; + this._callbacks[type][method].push(cb); + } + return this; + } + function onAsync(types, cb, context) { + return on.call(this, "async", types, cb, context); + } + function onSync(types, cb, context) { + return on.call(this, "sync", types, cb, context); + } + function off(types) { + var type; + if (!this._callbacks) { + return this; + } + types = types.split(splitter); + while (type = types.shift()) { + delete this._callbacks[type]; + } + return this; + } + function trigger(types) { + var that = this, type, callbacks, args, syncFlush, asyncFlush; + if (!this._callbacks) { + return this; + } + types = types.split(splitter); + args = [].slice.call(arguments, 1); + while ((type = types.shift()) && (callbacks = this._callbacks[type])) { + syncFlush = getFlush(callbacks.sync, this, [ type ].concat(args)); + asyncFlush = getFlush(callbacks.async, this, [ type ].concat(args)); + syncFlush() && nextTick(asyncFlush); + } + return this; + } + function getFlush(callbacks, context, args) { + return flush; + function flush() { + var cancelled; + for (var i = 0; !cancelled && i < callbacks.length; i += 1) { + cancelled = callbacks[i].apply(context, args) === false; + } + return !cancelled; + } + } + function getNextTick() { + var nextTickFn, messageChannel; + if (window.setImmediate) { + nextTickFn = function nextTickSetImmediate(fn) { + setImmediate(function() { + fn(); + }); + }; + } else { + nextTickFn = function nextTickSetTimeout(fn) { + setTimeout(function() { + fn(); + }, 0); + }; + } + return nextTickFn; + } + function bindContext(fn, context) { + return fn.bind ? fn.bind(context) : function() { + fn.apply(context, [].slice.call(arguments, 0)); + }; + } + }(); + var highlight = function(doc) { + var defaults = { + node: null, + pattern: null, + tagName: "strong", + className: null, + wordsOnly: false, + caseSensitive: false + }; + return function hightlight(o) { + var regex; + o = _.mixin({}, defaults, o); + if (!o.node || !o.pattern) { + throw new Error("both node and pattern must be set"); + } + o.pattern = _.isArray(o.pattern) ? o.pattern : [ o.pattern ]; + regex = getRegex(o.pattern, o.caseSensitive, o.wordsOnly); + traverse(o.node, hightlightTextNode); + function hightlightTextNode(textNode) { + var match, patternNode; + if (match = regex.exec(textNode.data)) { + wrapperNode = doc.createElement(o.tagName); + o.className && (wrapperNode.className = o.className); + patternNode = textNode.splitText(match.index); + patternNode.splitText(match[0].length); + wrapperNode.appendChild(patternNode.cloneNode(true)); + textNode.parentNode.replaceChild(wrapperNode, patternNode); + } + return !!match; + } + function traverse(el, hightlightTextNode) { + var childNode, TEXT_NODE_TYPE = 3; + for (var i = 0; i < el.childNodes.length; i++) { + childNode = el.childNodes[i]; + if (childNode.nodeType === TEXT_NODE_TYPE) { + i += hightlightTextNode(childNode) ? 1 : 0; + } else { + traverse(childNode, hightlightTextNode); + } + } + } + }; + function getRegex(patterns, caseSensitive, wordsOnly) { + var escapedPatterns = [], regexStr; + for (var i = 0; i < patterns.length; i++) { + escapedPatterns.push(_.escapeRegExChars(patterns[i])); + } + regexStr = wordsOnly ? "\\b(" + escapedPatterns.join("|") + ")\\b" : "(" + escapedPatterns.join("|") + ")"; + return caseSensitive ? new RegExp(regexStr) : new RegExp(regexStr, "i"); + } + }(window.document); + var Input = function() { + var specialKeyCodeMap; + specialKeyCodeMap = { + 9: "tab", + 27: "esc", + 37: "left", + 39: "right", + 13: "enter", + 38: "up", + 40: "down" + }; + function Input(o) { + var that = this, onBlur, onFocus, onKeydown, onInput; + o = o || {}; + if (!o.input) { + $.error("input is missing"); + } + onBlur = _.bind(this._onBlur, this); + onFocus = _.bind(this._onFocus, this); + onKeydown = _.bind(this._onKeydown, this); + onInput = _.bind(this._onInput, this); + this.$hint = $(o.hint); + this.$input = $(o.input).on("blur.tt", onBlur).on("focus.tt", onFocus).on("keydown.tt", onKeydown); + if (this.$hint.length === 0) { + this.setHintValue = this.getHintValue = this.clearHint = _.noop; + } + if (!_.isMsie()) { + this.$input.on("input.tt", onInput); + } else { + this.$input.on("keydown.tt keypress.tt cut.tt paste.tt", function($e) { + if (specialKeyCodeMap[$e.which || $e.keyCode]) { + return; + } + _.defer(_.bind(that._onInput, that, $e)); + }); + } + this.query = this.$input.val(); + this.$overflowHelper = buildOverflowHelper(this.$input); + } + Input.normalizeQuery = function(str) { + return (str || "").replace(/^\s*/g, "").replace(/\s{2,}/g, " "); + }; + _.mixin(Input.prototype, EventEmitter, { + _onBlur: function onBlur($e) { + this.resetInputValue(); + this.trigger("blurred"); + }, + _onFocus: function onFocus($e) { + this.trigger("focused"); + }, + _onKeydown: function onKeydown($e) { + var keyName = specialKeyCodeMap[$e.which || $e.keyCode]; + this._managePreventDefault(keyName, $e); + if (keyName && this._shouldTrigger(keyName, $e)) { + this.trigger(keyName + "Keyed", $e); + } + }, + _onInput: function onInput($e) { + this._checkInputValue(); + }, + _managePreventDefault: function managePreventDefault(keyName, $e) { + var preventDefault, hintValue, inputValue; + switch (keyName) { + case "tab": + hintValue = this.getHintValue(); + inputValue = this.getInputValue(); + preventDefault = hintValue && hintValue !== inputValue && !withModifier($e); + break; + + case "up": + case "down": + preventDefault = !withModifier($e); + break; + + default: + preventDefault = false; + } + preventDefault && $e.preventDefault(); + }, + _shouldTrigger: function shouldTrigger(keyName, $e) { + var trigger; + switch (keyName) { + case "tab": + trigger = !withModifier($e); + break; + + default: + trigger = true; + } + return trigger; + }, + _checkInputValue: function checkInputValue() { + var inputValue, areEquivalent, hasDifferentWhitespace; + inputValue = this.getInputValue(); + areEquivalent = areQueriesEquivalent(inputValue, this.query); + hasDifferentWhitespace = areEquivalent ? this.query.length !== inputValue.length : false; + if (!areEquivalent) { + this.trigger("queryChanged", this.query = inputValue); + } else if (hasDifferentWhitespace) { + this.trigger("whitespaceChanged", this.query); + } + }, + focus: function focus() { + this.$input.focus(); + }, + blur: function blur() { + this.$input.blur(); + }, + getQuery: function getQuery() { + return this.query; + }, + setQuery: function setQuery(query) { + this.query = query; + }, + getInputValue: function getInputValue() { + return this.$input.val(); + }, + setInputValue: function setInputValue(value, silent) { + this.$input.val(value); + !silent && this._checkInputValue(); + }, + getHintValue: function getHintValue() { + return this.$hint.val(); + }, + setHintValue: function setHintValue(value) { + this.$hint.val(value); + }, + resetInputValue: function resetInputValue() { + this.$input.val(this.query); + }, + clearHint: function clearHint() { + this.$hint.val(""); + }, + getLanguageDirection: function getLanguageDirection() { + return (this.$input.css("direction") || "ltr").toLowerCase(); + }, + hasOverflow: function hasOverflow() { + this.$overflowHelper.text(this.getInputValue()); + return this.$overflowHelper.width() > this.$input.width(); + }, + isCursorAtEnd: function() { + var valueLength, selectionStart, range; + valueLength = this.$input.val().length; + selectionStart = this.$input[0].selectionStart; + if (_.isNumber(selectionStart)) { + return selectionStart === valueLength; + } else if (document.selection) { + range = document.selection.createRange(); + range.moveStart("character", -valueLength); + return valueLength === range.text.length; + } + return true; + }, + destroy: function destroy() { + this.$hint.off(".tt"); + this.$input.off(".tt"); + this.$hint = this.$input = this.$overflowHelper = null; + } + }); + return Input; + function buildOverflowHelper($input) { + return $("").css({ + position: "absolute", + left: "-9999px", + visibility: "hidden", + whiteSpace: "nowrap", + fontFamily: $input.css("font-family"), + fontSize: $input.css("font-size"), + fontStyle: $input.css("font-style"), + fontVariant: $input.css("font-variant"), + fontWeight: $input.css("font-weight"), + wordSpacing: $input.css("word-spacing"), + letterSpacing: $input.css("letter-spacing"), + textIndent: $input.css("text-indent"), + textRendering: $input.css("text-rendering"), + textTransform: $input.css("text-transform") + }).insertAfter($input); + } + function areQueriesEquivalent(a, b) { + return Input.normalizeQuery(a) === Input.normalizeQuery(b); + } + function withModifier($e) { + return $e.altKey || $e.ctrlKey || $e.metaKey || $e.shiftKey; + } + }(); + var Section = function() { + var sectionKey = "ttSection", valueKey = "ttValue", datumKey = "ttDatum"; + function Section(o) { + o = o || {}; + o.templates = o.templates || {}; + if (!o.source) { + $.error("missing source"); + } + this.query = null; + this.highlight = !!o.highlight; + this.name = o.name || _.getUniqueId(); + this.source = setupSource(o.source); + this.valueKey = getValueKeyFromDataset(o.source) || o.valueKey || "value"; + this.templates = getTemplates(o.templates, this.valueKey); + this.$el = $(html.section.replace("%CLASS%", this.name)); + } + Section.extractSectionName = function extractSectionName(el) { + return $(el).data(sectionKey); + }; + Section.extractValue = function extractDatum(el) { + return $(el).data(valueKey); + }; + Section.extractDatum = function extractDatum(el) { + return $(el).data(datumKey); + }; + _.mixin(Section.prototype, EventEmitter, { + _render: function render(query, suggestions) { + var that = this, hasSuggestions; + this.$el.empty(); + hasSuggestions = suggestions && suggestions.length; + if (!hasSuggestions && this.templates.empty) { + this.$el.html(getEmptyHtml()).append(that.templates.header ? getHeaderHtml() : null).prepend(that.templates.footer ? getFooterHtml() : null); + } else if (hasSuggestions) { + this.$el.html(getSuggestionsHtml()).append(that.templates.header ? getHeaderHtml() : null).prepend(that.templates.footer ? getFooterHtml() : null); + } + this.trigger("rendered"); + function getEmptyHtml() { + return that.templates.empty({ + query: query + }); + } + function getSuggestionsHtml() { + var $suggestions; + $suggestions = $(html.suggestions).css(css.suggestions).append(_.map(suggestions, getSuggestionNode)); + that.highlight && highlight({ + node: $suggestions[0], + pattern: query + }); + return $suggestions; + function getSuggestionNode(suggestion) { + var $el, innerHtml, outerHtml; + innerHtml = that.templates.suggestion(suggestion); + outerHtml = html.suggestion.replace("%BODY%", innerHtml); + $el = $(outerHtml).data(sectionKey, that.name).data(valueKey, suggestion[that.valueKey]).data(datumKey, suggestion); + $el.children().each(function() { + $(this).css(css.suggestionChild); + }); + return $el; + } + } + function getHeaderHtml() { + return that.templates.header({ + query: query, + isEmpty: !hasSuggestions + }); + } + function getFooterHtml() { + return that.templates.footer({ + query: query, + isEmpty: !hasSuggestions + }); + } + }, + getRoot: function getRoot() { + return this.$el; + }, + update: function update(query) { + var that = this; + this.query = query; + this.source(query, renderIfQueryIsSame); + function renderIfQueryIsSame(suggestions) { + query === that.query && that._render(query, suggestions); + } + }, + clear: function clear() { + this._render(this.query || ""); + }, + isEmpty: function isEmpty() { + return this.$el.is(":empty"); + }, + destroy: function destroy() { + this.$el = null; + } + }); + return Section; + function setupSource(source) { + var Dataset = window.Dataset; + return Dataset && source instanceof Dataset ? _.bind(source.get, source) : source; + } + function getValueKeyFromDataset(source) { + return Dataset && source instanceof Dataset ? source.valueKey : null; + } + function getTemplates(templates, valueKey) { + valueKey = valueKey || "value"; + return { + empty: templates.empty && _.templatify(templates.empty), + header: templates.header && _.templatify(templates.header), + footer: templates.footer && _.templatify(templates.footer), + suggestion: templates.suggestion || suggestionTemplate + }; + function suggestionTemplate(context) { + return "

    " + context[valueKey] + "

    "; + } + } + }(); + var Dropdown = function() { + function Dropdown(o) { + var that = this, onMouseEnter, onMouseLeave, onSuggestionClick, onSuggestionMouseEnter, onSuggestionMouseLeave; + o = o || {}; + if (!o.menu) { + $.error("menu and/or sections are required"); + } + this.isOpen = false; + this.isEmpty = true; + this.isMouseOverDropdown = false; + this.sections = _.map(o.sections, initializeSection); + onMouseEnter = _.bind(this._onMouseEnter, this); + onMouseLeave = _.bind(this._onMouseLeave, this); + onSuggestionClick = _.bind(this._onSuggestionClick, this); + onSuggestionMouseEnter = _.bind(this._onSuggestionMouseEnter, this); + onSuggestionMouseLeave = _.bind(this._onSuggestionMouseLeave, this); + this.$menu = $(o.menu).on("mouseenter.tt", onMouseEnter).on("mouseleave.tt", onMouseLeave).on("click.tt", ".tt-suggestion", onSuggestionClick).on("mouseenter.tt", ".tt-suggestion", onSuggestionMouseEnter).on("mouseleave.tt", ".tt-suggestion", onSuggestionMouseLeave); + _.each(this.sections, function(section) { + that.$menu.append(section.getRoot()); + section.onSync("rendered", that._onRendered, that); + }); + } + _.mixin(Dropdown.prototype, EventEmitter, { + _onMouseEnter: function onMouseEnter($e) { + this.isMouseOverDropdown = true; + }, + _onMouseLeave: function onMouseLeave($e) { + this.isMouseOverDropdown = false; + }, + _onSuggestionClick: function onSuggestionClick($e) { + this.trigger("suggestionClicked", $($e.currentTarget)); + }, + _onSuggestionMouseEnter: function onSuggestionMouseEnter($e) { + this._setCursor($($e.currentTarget)); + }, + _onSuggestionMouseLeave: function onSuggestionMouseLeave($e) { + this._removeCursor(); + }, + _onRendered: function onRendered() { + this.isEmpty = _.every(this.sections, isSectionEmpty); + this.isEmpty ? this._hide() : this.isOpen && this._show(); + this.trigger("sectionRendered"); + function isSectionEmpty(section) { + return section.isEmpty(); + } + }, + _hide: function() { + this.$menu.hide(); + }, + _show: function() { + this.$menu.css("display", "block"); + }, + _getSuggestions: function getSuggestions() { + return this.$menu.find(".tt-suggestion"); + }, + _getCursor: function getCursor() { + return this.$menu.find(".tt-cursor").first(); + }, + _setCursor: function setCursor($el) { + $el.first().addClass("tt-cursor"); + this.trigger("cursorMoved"); + }, + _removeCursor: function removeCursor() { + this._getCursor().removeClass("tt-cursor"); + }, + _moveCursor: function moveCursor(increment) { + var $suggestions, $oldCursor, newCursorIndex, $newCursor; + if (!this.isOpen) { + return; + } + $oldCursor = this._getCursor(); + $suggestions = this._getSuggestions(); + this._removeCursor(); + newCursorIndex = $suggestions.index($oldCursor) + increment; + newCursorIndex = (newCursorIndex + 1) % ($suggestions.length + 1) - 1; + if (newCursorIndex === -1) { + this.trigger("cursorRemoved"); + return; + } else if (newCursorIndex < -1) { + newCursorIndex = $suggestions.length - 1; + } + this._setCursor($newCursor = $suggestions.eq(newCursorIndex)); + this._ensureVisible($newCursor); + }, + _ensureVisible: function ensureVisible($el) { + var elTop, elBottom, menuScrollTop, menuHeight; + elTop = $el.position().top; + elBottom = elTop + $el.outerHeight(true); + menuScrollTop = this.$menu.scrollTop(); + menuHeight = this.$menu.height() + parseInt(this.$menu.css("paddingTop"), 10) + parseInt(this.$menu.css("paddingBottom"), 10); + if (elTop < 0) { + this.$menu.scrollTop(menuScrollTop + elTop); + } else if (menuHeight < elBottom) { + this.$menu.scrollTop(menuScrollTop + (elBottom - menuHeight)); + } + }, + close: function close() { + if (this.isOpen) { + this.isOpen = this.isMouseOverDropdown = false; + this._removeCursor(); + this._hide(); + this.trigger("closed"); + } + }, + open: function open() { + if (!this.isOpen) { + this.isOpen = true; + !this.isEmpty && this._show(); + this.trigger("opened"); + } + }, + setLanguageDirection: function setLanguageDirection(dir) { + this.$menu.css(dir === "ltr" ? css.ltr : css.rtl); + }, + moveCursorUp: function moveCursorUp() { + this._moveCursor(-1); + }, + moveCursorDown: function moveCursorDown() { + this._moveCursor(+1); + }, + getDatumForSuggestion: function getDatumForSuggestion($el) { + var datum = null; + if ($el.length) { + datum = { + raw: Section.extractDatum($el), + value: Section.extractValue($el), + sectionName: Section.extractSectionName($el) + }; + } + return datum; + }, + getDatumForCursor: function getDatumForCursor() { + return this.getDatumForSuggestion(this._getCursor().first()); + }, + getDatumForTopSuggestion: function getDatumForTopSuggestion() { + return this.getDatumForSuggestion(this._getSuggestions().first()); + }, + update: function update(query) { + _.each(this.sections, updateSection); + function updateSection(section) { + section.update(query); + } + }, + empty: function empty() { + _.each(this.sections, clearSection); + function clearSection(section) { + section.clear(); + } + }, + isVisible: function isVisible() { + return this.isOpen && !this.isEmpty; + }, + destroy: function destroy() { + this.$menu.off(".tt"); + this.$menu = null; + _.each(this.sections, destroySection); + function destroySection(section) { + section.destroy(); + } + } + }); + return Dropdown; + function initializeSection(oSection) { + return new Section(oSection); + } + }(); + var Typeahead = function() { + var attrsKey = "ttAttrs"; + function Typeahead(o) { + var $menu, $input, $hint, sections; + o = o || {}; + if (!o.input) { + $.error("missing input"); + } + this.autoselect = o.autoselect; + this.minLength = o.minLength || 0; + this.$node = buildDomStructure(o.input, o.withHint); + $menu = this.$node.find(".tt-dropdown-menu"); + $input = this.$node.find(".tt-input"); + $hint = this.$node.find(".tt-hint"); + this.eventBus = new EventBus({ + el: $input + }); + this.dropdown = new Dropdown({ + menu: $menu, + sections: o.sections + }).onSync("suggestionClicked", this._onSuggestionClicked, this).onSync("cursorMoved", this._onCursorMoved, this).onSync("cursorRemoved", this._onCursorRemoved, this).onSync("sectionRendered", this._onSectionRendered, this).onSync("opened", this._onOpened, this).onSync("closed", this._onClosed, this); + this.input = new Input({ + input: $input, + hint: $hint + }).onSync("focused", this._onFocused, this).onSync("blurred", this._onBlurred, this).onSync("enterKeyed", this._onEnterKeyed, this).onSync("tabKeyed", this._onTabKeyed, this).onSync("escKeyed", this._onEscKeyed, this).onSync("upKeyed", this._onUpKeyed, this).onSync("downKeyed", this._onDownKeyed, this).onSync("leftKeyed", this._onLeftKeyed, this).onSync("rightKeyed", this._onRightKeyed, this).onSync("queryChanged", this._onQueryChanged, this).onSync("whitespaceChanged", this._onWhitespaceChanged, this); + } + _.mixin(Typeahead.prototype, { + _onSuggestionClicked: function onSuggestionClicked(type, $el) { + var datum; + if (datum = this.dropdown.getDatumForSuggestion($el)) { + this._select(datum); + this.input.focus(); + } + }, + _onCursorMoved: function onCursorMoved() { + var datum = this.dropdown.getDatumForCursor(); + this.input.clearHint(); + this.input.setInputValue(datum.value, true); + this.eventBus.trigger("cursorchanged", datum.raw, datum.sectionName); + }, + _onCursorRemoved: function onCursorRemoved() { + this.input.resetInputValue(); + this._updateHint(); + }, + _onSectionRendered: function onSectionRendered() { + this._updateHint(); + }, + _onOpened: function onOpened() { + this._updateHint(); + this.eventBus.trigger("opened"); + }, + _onClosed: function onClosed() { + this.input.clearHint(); + this.eventBus.trigger("closed"); + }, + _onFocused: function onFocused() { + this.dropdown.open(); + }, + _onBlurred: function onBlurred() { + !this.dropdown.isMouseOverDropdown && this.dropdown.close(); + }, + _onEnterKeyed: function onEnterKeyed(type, $e) { + var cursorDatum, topSuggestionDatum; + cursorDatum = this.dropdown.getDatumForCursor(); + topSuggestionDatum = this.dropdown.getDatumForTopSuggestion(); + if (cursorDatum) { + this._select(cursorDatum); + $e.preventDefault(); + } else if (this.autoselect && topSuggestionDatum) { + this._select(topSuggestionDatum); + $e.preventDefault(); + } + }, + _onTabKeyed: function onTabKeyed(type, $e) { + var datum; + if (datum = this.dropdown.getDatumForCursor()) { + this._select(datum); + $e.preventDefault(); + } else { + this._autocomplete(); + } + }, + _onEscKeyed: function onEscKeyed() { + this.dropdown.close(); + this.input.resetInputValue(); + }, + _onUpKeyed: function onUpKeyed() { + this.dropdown.open(); + this.dropdown.moveCursorUp(); + }, + _onDownKeyed: function onDownKeyed() { + this.dropdown.open(); + this.dropdown.moveCursorDown(); + }, + _onLeftKeyed: function onLeftKeyed() { + this.dir === "rtl" && this._autocomplete(); + }, + _onRightKeyed: function onRightKeyed() { + this.dir === "ltr" && this._autocomplete(); + }, + _onQueryChanged: function onQueryChanged(e, query) { + this.input.clearHint(); + this.dropdown.empty(); + query.length >= this.minLength && this.dropdown.update(query); + this.dropdown.open(); + this._setLanguageDirection(); + }, + _onWhitespaceChanged: function onWhitespaceChanged() { + this._updateHint(); + this.dropdown.open(); + }, + _setLanguageDirection: function setLanguageDirection() { + var dir; + if (this.dir !== (dir = this.input.getLanguageDirection())) { + this.dir = dir; + this.$node.css("direction", dir); + this.dropdown.setLanguageDirection(dir); + } + }, + _updateHint: function updateHint() { + var datum, inputValue, query, escapedQuery, frontMatchRegEx, match; + datum = this.dropdown.getDatumForTopSuggestion(); + if (datum && this.dropdown.isVisible() && !this.input.hasOverflow()) { + inputValue = this.input.getInputValue(); + query = Input.normalizeQuery(inputValue); + escapedQuery = _.escapeRegExChars(query); + frontMatchRegEx = new RegExp("^(?:" + escapedQuery + ")(.*$)", "i"); + match = frontMatchRegEx.exec(datum.value); + this.input.setHintValue(inputValue + (match ? match[1] : "")); + } + }, + _autocomplete: function autocomplete() { + var hint, query, datum; + hint = this.input.getHintValue(); + query = this.input.getQuery(); + if (hint && query !== hint && this.input.isCursorAtEnd()) { + datum = this.dropdown.getDatumForTopSuggestion(); + datum && this.input.setInputValue(datum.value); + this.eventBus.trigger("autocompleted", datum.raw, datum.sectionName); + } + }, + _select: function select(datum) { + this.input.clearHint(); + this.input.setQuery(datum.value); + this.input.setInputValue(datum.value, true); + this._setLanguageDirection(); + _.defer(_.bind(this.dropdown.close, this.dropdown)); + this.eventBus.trigger("selected", datum.raw, datum.sectionName); + }, + open: function open() { + this.dropdown.open(); + }, + close: function close() { + this.dropdown.close(); + }, + getQuery: function getQuery() { + return this.input.getQuery(); + }, + setQuery: function setQuery(val) { + this.input.setInputValue(val); + }, + destroy: function destroy() { + this.input.destroy(); + this.dropdown.destroy(); + destroyDomStructure(this.$node); + this.$node = null; + } + }); + return Typeahead; + function buildDomStructure(input, withHint) { + var $input, $wrapper, $dropdown, $hint; + $input = $(input); + $wrapper = $(html.wrapper).css(css.wrapper); + $dropdown = $(html.dropdown).css(css.dropdown); + $hint = $input.clone().css(css.hint).css(getBackgroundStyles($input)); + $hint.removeData().addClass("tt-hint").removeAttr("id name placeholder").prop("disabled", true).attr({ + autocomplete: "off", + spellcheck: "false" + }); + $input.data(attrsKey, { + dir: $input.attr("dir"), + autocomplete: $input.attr("autocomplete"), + spellcheck: $input.attr("spellcheck"), + style: $input.attr("style") + }); + $input.addClass("tt-input").attr({ + autocomplete: "off", + spellcheck: false + }).css(withHint ? css.input : css.inputWithNoHint); + try { + !$input.attr("dir") && $input.attr("dir", "auto"); + } catch (e) {} + return $input.wrap($wrapper).parent().prepend(withHint ? $hint : null).append($dropdown); + } + function getBackgroundStyles($el) { + return { + backgroundAttachment: $el.css("background-attachment"), + backgroundClip: $el.css("background-clip"), + backgroundColor: $el.css("background-color"), + backgroundImage: $el.css("background-image"), + backgroundOrigin: $el.css("background-origin"), + backgroundPosition: $el.css("background-position"), + backgroundRepeat: $el.css("background-repeat"), + backgroundSize: $el.css("background-size") + }; + } + function destroyDomStructure($node) { + var $input = $node.find(".tt-input"); + _.each($input.data(attrsKey), function(val, key) { + _.isUndefined(val) ? $input.removeAttr(key) : $input.attr(key, val); + }); + $input.detach().removeData(attrsKey).removeClass("tt-input").insertAfter($node); + $node.remove(); + } + }(); + (function() { + var typeaheadKey, methods; + typeaheadKey = "ttTypeahead"; + methods = { + initialize: function initialize(o) { + o = o || {}; + return this.each(attach); + function attach() { + var $input = $(this), typeahead; + typeahead = new Typeahead({ + input: $input, + withHint: _.isUndefined(o.hint) ? true : !!o.hint, + minLength: o.minLength || 0, + autoselect: !!o.autoselect, + sections: _.isArray(o.sections) ? o.sections : [ o.sections ] + }); + $input.data(typeaheadKey, typeahead); + } + }, + open: function open() { + return this.each(openTypeahead); + function openTypeahead() { + var $input = $(this), typeahead; + if (typeahead = $input.data(typeaheadKey)) { + typeahead.open(); + } + } + }, + close: function close() { + return this.each(closeTypeahead); + function closeTypeahead() { + var $input = $(this), typeahead; + if (typeahead = $input.data(typeaheadKey)) { + typeahead.close(); + } + } + }, + val: function val(newVal) { + return newVal ? this.each(setQuery) : this.map(getQuery).get(); + function setQuery() { + var $input = $(this), typeahead; + if (typeahead = $input.data(typeaheadKey)) { + typeahead.setQuery(newVal); + } + } + function getQuery() { + var $input = $(this), typeahead, query; + if (typeahead = $input.data(typeaheadKey)) { + query = typeahead.getQuery(); + } + return query; + } + }, + destroy: function destroy() { + return this.each(unattach); + function unattach() { + var $input = $(this), typeahead; + if (typeahead = $input.data(typeaheadKey)) { + typeahead.destroy(); + $input.removeData(typeaheadKey); + } + } + } + }; + jQuery.fn.typeahead = function(method) { + if (methods[method]) { + return methods[method].apply(this, [].slice.call(arguments, 1)); + } else { + return methods.initialize.apply(this, arguments); + } + }; + })(); +})(window.jQuery); \ No newline at end of file diff --git a/vendor/assets/stylesheets/typeahead.js-bootstrap.css b/vendor/assets/stylesheets/typeahead.js-bootstrap.css new file mode 100644 index 00000000..bdf783e9 --- /dev/null +++ b/vendor/assets/stylesheets/typeahead.js-bootstrap.css @@ -0,0 +1,49 @@ +.twitter-typeahead .tt-query, +.twitter-typeahead .tt-hint { + margin-bottom: 0; +} + +.tt-dropdown-menu { + min-width: 160px; + margin-top: 2px; + padding: 5px 0; + background-color: #fff; + border: 1px solid #ccc; + border: 1px solid rgba(0,0,0,.2); + *border-right-width: 2px; + *border-bottom-width: 2px; + -webkit-border-radius: 6px; + -moz-border-radius: 6px; + border-radius: 6px; + -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2); + -moz-box-shadow: 0 5px 10px rgba(0,0,0,.2); + box-shadow: 0 5px 10px rgba(0,0,0,.2); + -webkit-background-clip: padding-box; + -moz-background-clip: padding; + background-clip: padding-box; +} + +.tt-suggestion { + display: block; + padding: 3px 20px; +} + +.tt-suggestion.tt-cursor { + color: #fff; + background-color: #0081c2; + background-image: -moz-linear-gradient(top, #0088cc, #0077b3); + background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0077b3)); + background-image: -webkit-linear-gradient(top, #0088cc, #0077b3); + background-image: -o-linear-gradient(top, #0088cc, #0077b3); + background-image: linear-gradient(to bottom, #0088cc, #0077b3); + background-repeat: repeat-x; + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0077b3', GradientType=0) +} + +.tt-suggestion.tt-cursor a { + color: #fff; +} + +.tt-suggestion p { + margin: 0; +}