authors auto-complete

This commit is contained in:
Rueshyna 2013-03-04 12:16:46 +08:00
parent e99fef9404
commit 8f1d7b55ab
12 changed files with 1576 additions and 9 deletions

View File

@ -16,3 +16,4 @@
//= require orbitdesktop //= require orbitdesktop
//= require jquery.gridster //= require jquery.gridster
//= require desktop/books_pages //= require desktop/books_pages
//= require jquery.tokeninput

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,122 @@
/* Example tokeninput style #2: Facebook style */
ul.token-input-list-facebook {
overflow: hidden;
height: auto !important;
height: 1%;
width: 400px;
border: 1px solid #8496ba;
cursor: text;
font-size: 12px;
font-family: Verdana, sans-serif;
min-height: 1px;
z-index: 999;
margin: 0;
padding: 0;
background-color: #fff;
list-style-type: none;
clear: left;
}
ul.token-input-list-facebook li input {
border: 0;
width: 100px;
padding: 3px 8px;
background-color: white;
margin: 2px 0;
-webkit-appearance: caret;
}
li.token-input-token-facebook {
overflow: hidden;
height: auto !important;
height: 15px;
margin: 3px;
padding: 1px 3px;
background-color: #eff2f7;
color: #000;
cursor: default;
border: 1px solid #ccd5e4;
font-size: 11px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
float: left;
white-space: nowrap;
}
li.token-input-token-facebook p {
display: inline;
padding: 0;
margin: 0;
}
li.token-input-token-facebook span {
color: #a6b3cf;
margin-left: 5px;
font-weight: bold;
cursor: pointer;
}
li.token-input-selected-token-facebook {
background-color: #5670a6;
border: 1px solid #3b5998;
color: #fff;
}
li.token-input-input-token-facebook {
float: left;
margin: 0;
padding: 0;
list-style-type: none;
}
div.token-input-dropdown-facebook {
position: absolute;
width: 400px;
background-color: #fff;
overflow: hidden;
border-left: 1px solid #ccc;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
cursor: default;
font-size: 11px;
font-family: Verdana, sans-serif;
z-index: 1;
}
div.token-input-dropdown-facebook p {
margin: 0;
padding: 5px;
font-weight: bold;
color: #777;
}
div.token-input-dropdown-facebook ul {
margin: 0;
padding: 0;
}
div.token-input-dropdown-facebook ul li {
background-color: #fff;
padding: 3px;
margin: 0;
list-style-type: none;
}
div.token-input-dropdown-facebook ul li.token-input-dropdown-item-facebook {
background-color: #fff;
}
div.token-input-dropdown-facebook ul li.token-input-dropdown-item2-facebook {
background-color: #fff;
}
div.token-input-dropdown-facebook ul li em {
font-weight: bold;
font-style: normal;
}
div.token-input-dropdown-facebook ul li.token-input-selected-dropdown-item-facebook {
background-color: #3b5998;
color: #fff;
}

View File

@ -0,0 +1,204 @@
/* Example tokeninput style #2: Mac Style */
fieldset.token-input-mac {
position: relative;
padding: 0;
margin: 5px 0;
background: #fff;
width: 400px;
border: 1px solid #A4BDEC;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}
fieldset.token-input-mac.token-input-dropdown-mac {
border-radius: 10px 10px 0 0;
-moz-border-radius: 10px 10px 0 0;
-webkit-border-radius: 10px 10px 0 0;
box-shadow: 0 5px 20px 0 rgba(0,0,0,0.25);
-moz-box-shadow: 0 5px 20px 0 rgba(0,0,0,0.25);
-webkit-box-shadow: 0 5px 20px 0 rgba(0,0,0,0.25);
}
ul.token-input-list-mac {
overflow: hidden;
height: auto !important;
height: 1%;
cursor: text;
font-size: 12px;
font-family: Verdana, sans-serif;
min-height: 1px;
z-index: 999;
margin: 0;
padding: 3px;
background: transparent;
}
ul.token-input-list-mac.error {
border: 1px solid #C52020;
}
ul.token-input-list-mac li {
list-style-type: none;
}
li.token-input-token-mac p {
display: inline;
padding: 0;
margin: 0;
}
li.token-input-token-mac span {
color: #a6b3cf;
margin-left: 5px;
font-weight: bold;
cursor: pointer;
}
/* TOKENS */
li.token-input-token-mac {
font-family: "Lucida Grande", Arial, sans-serif;
font-size: 9pt;
line-height: 12pt;
overflow: hidden;
height: 16px;
margin: 3px;
padding: 0 10px;
background: none;
background-color: #dee7f8;
color: #000;
cursor: default;
border: 1px solid #a4bdec;
border-radius: 15px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
float: left;
}
li.token-input-highlighted-token-mac {
background-color: #bbcef1;
border: 1px solid #598bec;
color: #000;
}
li.token-input-selected-token-mac {
background-color: #598bec;
border: 1px solid transparent;
color: #fff;
}
li.token-input-highlighted-token-mac span.token-input-delete-token-mac {
color: #000;
}
li.token-input-selected-token-mac span.token-input-delete-token-mac {
color: #fff;
}
li.token-input-input-token-mac {
border: none;
background: transparent;
float: left;
padding: 0;
margin: 0;
}
li.token-input-input-token-mac input {
border: 0;
width: 100px;
padding: 3px;
background-color: transparent;
margin: 0;
}
div.token-input-dropdown-mac {
position: absolute;
border: 1px solid #A4BDEC;
border-top: none;
left: -1px;
right: -1px;
background-color: #fff;
overflow: hidden;
cursor: default;
font-size: 10pt;
font-family: "Lucida Grande", Arial, sans-serif;
padding: 5px;
border-radius: 0 0 10px 10px;
-moz-border-radius: 0 0 10px 10px;
-webkit-border-radius: 0 0 10px 10px;
box-shadow: 0 5px 20px 0 rgba(0,0,0,0.25);
-moz-box-shadow: 0 5px 20px 0 rgba(0,0,0,0.25);
-webkit-box-shadow: 0 5px 20px 0 rgba(0,0,0,0.25);
clip:rect(0px, 1000px, 1000px, -10px);
}
div.token-input-dropdown-mac p {
font-size: 8pt;
margin: 0;
padding: 0 5px;
font-style: italic;
color: #aaa;
}
div.token-input-dropdown-mac h3.token-input-dropdown-category-mac {
font-family: "Lucida Grande", Arial, sans-serif;
font-size: 10pt;
font-weight: bold;
border: none;
padding: 0 5px;
margin: 0;
}
div.token-input-dropdown-mac ul {
margin: 0;
padding: 0;
}
div.token-input-dropdown-mac ul li {
list-style-type: none;
cursor: pointer;
background: none;
background-color: #fff;
margin: 0;
padding: 0 0 0 25px;
}
div.token-input-dropdown-mac ul li.token-input-dropdown-item-mac {
background-color: #fff;
}
div.token-input-dropdown-mac ul li.token-input-dropdown-item-mac.odd {
background-color: #ECF4F9;
border-radius: 15px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
}
div.token-input-dropdown-mac ul li.token-input-dropdown-item-mac span.token-input-dropdown-item-description-mac {
float: right;
font-size: 8pt;
font-style: italic;
padding: 0 10px 0 0;
color: #999;
}
div.token-input-dropdown-mac ul li strong {
font-weight: bold;
text-decoration: underline;
font-style: none;
}
div.token-input-dropdown-mac ul li.token-input-selected-dropdown-item-mac,
div.token-input-dropdown-mac ul li.token-input-selected-dropdown-item-mac.odd {
background-color: #598bec;
color: #fff;
border-radius: 15px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
}
div.token-input-dropdown-mac ul li.token-input-selected-dropdown-item-mac span.token-input-dropdown-item-description-mac,
div.token-input-dropdown-mac ul li.token-input-selected-dropdown-item-mac.odd span.token-input-dropdown-item-description-mac {
color: #fff;
}

View File

@ -0,0 +1,127 @@
/* Example tokeninput style #1: Token vertical list*/
ul.token-input-list {
overflow: hidden;
height: auto !important;
height: 1%;
width: 400px;
border: 1px solid #999;
cursor: text;
font-size: 12px;
font-family: Verdana, sans-serif;
z-index: 999;
margin: 0;
padding: 0;
background-color: #fff;
list-style-type: none;
clear: left;
}
ul.token-input-list li {
list-style-type: none;
}
ul.token-input-list li input {
border: 0;
width: 350px;
padding: 3px 8px;
background-color: white;
-webkit-appearance: caret;
}
ul.token-input-disabled,
ul.token-input-disabled li input {
background-color: #E8E8E8;
}
ul.token-input-disabled li.token-input-token {
background-color: #D9E3CA;
color: #7D7D7D
}
ul.token-input-disabled li.token-input-token span {
color: #CFCFCF;
cursor: default;
}
li.token-input-token {
overflow: hidden;
height: auto !important;
height: 1%;
margin: 3px;
padding: 3px 5px;
background-color: #d0efa0;
color: #000;
font-weight: bold;
cursor: default;
display: block;
}
li.token-input-token p {
float: left;
padding: 0;
margin: 0;
}
li.token-input-token span {
float: right;
color: #777;
cursor: pointer;
}
li.token-input-selected-token {
background-color: #08844e;
color: #fff;
}
li.token-input-selected-token span {
color: #bbb;
}
div.token-input-dropdown {
position: absolute;
width: 400px;
background-color: #fff;
overflow: hidden;
border-left: 1px solid #ccc;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
cursor: default;
font-size: 12px;
font-family: Verdana, sans-serif;
z-index: 1;
}
div.token-input-dropdown p {
margin: 0;
padding: 5px;
font-weight: bold;
color: #777;
}
div.token-input-dropdown ul {
margin: 0;
padding: 0;
}
div.token-input-dropdown ul li {
background-color: #fff;
padding: 3px;
list-style-type: none;
}
div.token-input-dropdown ul li.token-input-dropdown-item {
background-color: #fafafa;
}
div.token-input-dropdown ul li.token-input-dropdown-item2 {
background-color: #fff;
}
div.token-input-dropdown ul li em {
font-weight: bold;
font-style: normal;
}
div.token-input-dropdown ul li.token-input-selected-dropdown-item {
background-color: #d0efa0;
}

View File

@ -23,13 +23,21 @@ class Panel::PersonalConference::Desktop::ConferencePagesController < Applicatio
@writing_conference = WritingConference.new @writing_conference = WritingConference.new
@paper_types = ConferencePaperType.all @paper_types = ConferencePaperType.all
@author_types = ConferenceAuthorType.all @author_types = ConferenceAuthorType.all
#@co_author_candidate =
# CoAuthor.where(name_id: current_user.id).map{|c|c.co_author} if (not params[:q].nil?) and (current_user.name.include?params[:q])
#@conference_candidate = @user = [{ :id => 0, :name => current_user.name}] # self account name
# WritingConference.where(create_user_id: current_user.id).map{|j|j.conference_title}.uniq else
@user = []
end
@co_authors = ConferenceCoAuthor.where(name_id: current_user.id, :co_author => /#{params[:q]}/)
@co_authors = [{ :id => params[:q], :name => params[:q] }] + # search string
@user + # self account name
@co_authors.map{|m| { :id => m.id, :name => m.co_author } } # match pattern
respond_to do |format| respond_to do |format|
format.html { render :layout => false} format.html { render :layout => false}
format.json { render :json => @co_authors.to_json }
end end
end end

View File

@ -71,4 +71,16 @@ module Panel::PersonalConference::Desktop::ConferencePagesHelper
file_type = "" file_type = ""
end end
end end
def generate_authors_name ids
author_name = ids.map{|m|
if m == "0"
{:id => 0, :name => current_user.name}
else
{:id => m, :name => ConferenceCoAuthor.find(m).co_author}
end
}
author_name.to_json
end
end end

View File

@ -3,11 +3,12 @@ class ConferenceCoAuthor
LANGUAGE_TYPES = [ "English", "Chinese" ] LANGUAGE_TYPES = [ "English", "Chinese" ]
field :name_id, type: BSON::ObjectId field :name_id, type: BSON::ObjectId # this is author
field :co_author, localize: true field :co_author, localize: true
field :email field :email
belongs_to :conference_co_author_relations belongs_to :conference_co_author_relations
has_and_belongs_to_many :writing_conferences
VALID_EMAIL_REGEX = /\A[\w+\-.]+@[a-z\d\-.]+\.[a-z]+\z/ VALID_EMAIL_REGEX = /\A[\w+\-.]+@[a-z\d\-.]+\.[a-z]+\z/
validates :email, format: { with: VALID_EMAIL_REGEX }, validates :email, format: { with: VALID_EMAIL_REGEX },

View File

@ -16,6 +16,7 @@ class WritingConference
has_and_belongs_to_many :tags, :class_name => "PersonalConferenceTag" has_and_belongs_to_many :tags, :class_name => "PersonalConferenceTag"
has_and_belongs_to_many :conference_author_types has_and_belongs_to_many :conference_author_types
has_and_belongs_to_many :conference_paper_types has_and_belongs_to_many :conference_paper_types
has_and_belongs_to_many :conference_co_authors
field :year field :year
field :language field :language
@ -43,6 +44,25 @@ class WritingConference
after_save :save_writing_conference_files after_save :save_writing_conference_files
validates :url, :format => /^(http|https):\/\/(([a-z0-9]+([\-\.]{1}[a-z0-9]+)*\.[a-z]{2,5})|((25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?))(:[0-9]{1,5})?(\/.*)?/i, :unless => Proc.new{self.url.blank?} validates :url, :format => /^(http|https):\/\/(([a-z0-9]+([\-\.]{1}[a-z0-9]+)*\.[a-z]{2,5})|((25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?))(:[0-9]{1,5})?(\/.*)?/i, :unless => Proc.new{self.url.blank?}
attr_reader :author_tokens
def author_tokens=(ids)
authors_ids = ids.split(",").map{|id|
begin
ConferenceCoAuthor.find(m).id
rescue
if id != "0"
new_co_author = ConferenceCoAuthor.new(:co_author => id, :name_id => create_user_id)
new_co_author.save
new_co_author.id
else
id
end
end
}
self.conference_co_author_ids = authors_ids
end
def self.search( category_id = nil ) def self.search( category_id = nil )
if category_id.to_s.size > 0 if category_id.to_s.size > 0
find(:all, :conditions => {writing_conference_category_id: category_id}).desc( :is_top, :title ) find(:all, :conditions => {writing_conference_category_id: category_id}).desc( :is_top, :title )

View File

@ -104,14 +104,20 @@
<div class="s_grid_con s_form"> <div class="s_grid_con s_form">
<ul> <ul>
<li class="s_grid_row"> <li class="s_grid_row">
<%= f.fields_for :authors_translations do |f| %> <%= f.label :author_tokens, t("personal_conference.authors") %><br />
<%= f.text_area locale, <%= f.text_area :author_tokens,
class: "s_grid_6 s_grid",
size: "20x2",
placeholder: t("personal_conference.authors"),
"data-pre" => generate_authors_name(@writing_conference.conference_co_author_ids) %>
<%#= f.fields_for :authors_translations do |f| %>
<%#= f.text_area locale,
class: "s_grid_6 s_grid", class: "s_grid_6 s_grid",
size: "20x2", size: "20x2",
placeholder: t("personal_conference.authors"), placeholder: t("personal_conference.authors"),
# "autocomplete-list" => "coauthor_autocomplete_list", # "autocomplete-list" => "coauthor_autocomplete_list",
value: (@writing_conference.authors_translations[locale.to_s] rescue nil) %> value: (@writing_conference.authors_translations[locale.to_s] rescue nil) %>
<% end %> <%# end %>
<span class="icon-plus input_append"></span> <span class="icon-plus input_append"></span>
</li> </li>
@ -194,6 +200,23 @@
</div> </div>
</div> </div>
<%= stylesheet_link_tag "token-input-facebook" %>
<%= javascript_include_tag :defaults, "jquery.tokeninput" %>
<script>
$(function() {
$("#writing_conference_author_tokens").tokenInput("/panel/personal_conference/desktop/conference_pages/new.json", {
crossDomain: false,
prePopulate: $("#writing_conference_author_tokens").data("pre"),
theme: "facebook",
hintText: "<%=t("hintText")%>",
noResultsText: "<%=t("noResultsText")%>",
searchingText: "<%=t("searchingText")%>"
});
});
</script>
<script type="text/javascript"> <script type="text/javascript">
orbitDesktop.prototype.initializeJournalPapers.conference_title_autocomplete_list = <%= @conference_candidate.to_json.html_safe %>; orbitDesktop.prototype.initializeJournalPapers.conference_title_autocomplete_list = <%= @conference_candidate.to_json.html_safe %>;
orbitDesktop.prototype.initializeJournalPapers.coauthor_autocomplete_list = <%= @co_author_candidate.to_json.html_safe %>; orbitDesktop.prototype.initializeJournalPapers.coauthor_autocomplete_list = <%= @co_author_candidate.to_json.html_safe %>;

View File

@ -41,6 +41,9 @@ en:
no_: "No" no_: "No"
cancel : "Cancel" cancel : "Cancel"
save: "save" save: "save"
hintText: "Type in a search term"
noResultsText: "No results"
searchingText: "Searching…"
error_msg: error_msg:
time_series_illegal: "must be before end time" time_series_illegal: "must be before end time"

View File

@ -41,6 +41,9 @@ zh_tw:
no_: "否" no_: "否"
cancel : "取消" cancel : "取消"
save: "儲存" save: "儲存"
hintText: "請輸入搜尋關鍵字"
noResultsText: "沒有相關的比對結果"
searchingText: "搜尋中…"
error_msg: error_msg:
time_series_illegal: "啟始時間必須早於結束時間" time_series_illegal: "啟始時間必須早於結束時間"