mirror of
https://github.com/wahyd4/jQuery-Tags-Input.git
synced 2026-08-09 21:06:43 +10:00
Compare commits
| Author | SHA1 | Date | |
|---|---|---|---|
 Ben Brown
|
87d4b72a79 |
@@ -1,100 +0,0 @@
|
||||
# jQuery Tags Input Plugin
|
||||
|
||||
Do you use tags to organize content on your site?
|
||||
This plugin will turn your boring tag list into a
|
||||
magical input that turns each tag into a style-able
|
||||
object with its own delete link. The plugin handles
|
||||
all the data - your form just sees a comma-delimited
|
||||
list of tags!
|
||||
|
||||
[Get it from Github](https://github.com/xoxco/jQuery-Tags-Input)
|
||||
|
||||
[View Demo](http://xoxco.com/projects/code/tagsinput/)
|
||||
|
||||
Created by [XOXCO](http://xoxco.com)
|
||||
|
||||
|
||||
## Instructions
|
||||
|
||||
First, add the Javascript and CSS files to your <head> tag:
|
||||
|
||||
<script src="jquery.tagsinput.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="jquery.tagsinput.css" />
|
||||
|
||||
Create a real input in your form that will contain a comma-separated list of
|
||||
tags. You can put any default or existing tags in the value attribute, and
|
||||
they'll be handled properly.
|
||||
|
||||
<input name="tags" id="tags" value="foo,bar,baz" />
|
||||
|
||||
Then, simply call the tagsInput function on any field that should be treated as
|
||||
a list of tags.
|
||||
|
||||
$('#tags').tagsInput();
|
||||
|
||||
If you want to use jQuery.autocomplete, you can pass in a parameter with the
|
||||
autocomplete url.
|
||||
|
||||
$('#tags').tagsInput({
|
||||
autocomplete_url:'http://myserver.com/api/autocomplete'
|
||||
});
|
||||
|
||||
If you're using the bassistance jQuery.autocomplete, which takes extra
|
||||
parameters, you can also send in options to the autocomplete plugin, as
|
||||
described here.
|
||||
|
||||
$('#tags').tagsInput({
|
||||
autocomplete_url:'http://myserver.com/api/autocomplete',
|
||||
autocomplete:{selectFirst:true,width:'100px',autoFill:true}
|
||||
});
|
||||
|
||||
You can add and remove tags by calling the addTag() and removeTag() functions.
|
||||
|
||||
$('#tags').addTag('foo');
|
||||
$('#tags').removeTag('bar');
|
||||
|
||||
You can import a list of tags using the importTags() function...
|
||||
|
||||
$('#tags').importTags('foo,bar,baz');
|
||||
|
||||
You can also use importTags() to reset the tag list...
|
||||
|
||||
$('#tags').importTags('');
|
||||
|
||||
And you can check if a tag exists using tagExist()...
|
||||
|
||||
if ($('#tags').tagExist('foo')) { ... }
|
||||
|
||||
If additional functionality is required when a tag is added or removed, you may
|
||||
specify callback functions via the onAddTag and onRemoveTag parameters. Both
|
||||
functions should accept a single tag as the parameter.
|
||||
|
||||
If you do not want to provide a way to add tags, or you would prefer to provide
|
||||
an alternate interface for adding tags to the box, you may pass an false into
|
||||
the optional 'interactive' parameter. The tags will still be rendered as per
|
||||
usual, and the addTag and removeTag functions will operate as expected.
|
||||
|
||||
If you want a function to be called every time a tag is updated/deleted, set it
|
||||
as the 'onChange' option.
|
||||
|
||||
By default, if the cursor is immediately after a tag, hitting backspace will
|
||||
delete that tag. If you want to override this, set the 'removeWithBackspace'
|
||||
option to false.
|
||||
|
||||
## Options
|
||||
|
||||
$(selector).tagsInput({
|
||||
'autocomplete_url': url_to_autocomplete_api,
|
||||
'autocomplete': { option: value, option: value},
|
||||
'height':'100px',
|
||||
'width':'300px',
|
||||
'interactive':true,
|
||||
'defaultText':'add a tag',
|
||||
'onAddTag':callback_function,
|
||||
'onRemoveTag':callback_function,
|
||||
'onChange' : callback_function,
|
||||
'removeWithBackspace' : true,
|
||||
'minChars' : 0,
|
||||
'maxChars' : 0 //if not provided there is no limit,
|
||||
'placeholderColor' : '#666666'
|
||||
});
|
||||
@@ -1,84 +0,0 @@
|
||||
|
||||
<link rel="stylesheet" type="text/css" href="http://xoxco.com/projects/code/tagsinput/jquery.tagsinput.css" />
|
||||
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
|
||||
<script type="text/javascript" src="jquery.tagsinput.js"></script>
|
||||
|
||||
<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js'></script>
|
||||
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/themes/start/jquery-ui.css" />
|
||||
|
||||
|
||||
<script type="text/javascript">
|
||||
|
||||
function onAddTag(tag) {
|
||||
console.log("Added a tag: " + tag);
|
||||
}
|
||||
function onRemoveTag(tag) {
|
||||
console.log("Removed a tag: " + tag);
|
||||
}
|
||||
|
||||
function onChangeTag(input,tag) {
|
||||
console.log("Changed a tag: " + tag);
|
||||
}
|
||||
|
||||
function validateTag(tag) {
|
||||
console.log("Validating tag " + tag);
|
||||
return true;
|
||||
|
||||
}
|
||||
|
||||
function onError(msg) {
|
||||
console.log(msg);
|
||||
}
|
||||
|
||||
$(function() {
|
||||
|
||||
// $('.tags').tagsInput({validateTag: validateTag,,onAddTag:onAddTag,onRemoveTag:onRemoveTag,onChange: onChangeTag});
|
||||
|
||||
|
||||
|
||||
|
||||
$('.tags').tagsInput({
|
||||
onError: onError,
|
||||
autocomplete: {source: ['a','alpha']}
|
||||
});;
|
||||
/*
|
||||
$('#tags_2').tagsInput({
|
||||
width: 'auto',
|
||||
onChange: function(elem, elem_tags)
|
||||
{
|
||||
var languages = ['php','ruby','javascript'];
|
||||
$('.tag', elem_tags).each(function()
|
||||
{
|
||||
if($(this).text().search(new RegExp('\\b(' + languages.join('|') + ')\\b')) >= 0)
|
||||
$(this).css('background-color', 'yellow');
|
||||
});
|
||||
}
|
||||
});
|
||||
$('#tags_3').tagsInput({
|
||||
width: 'auto',
|
||||
autocomplete: {source: 'test/fake_json_endpoint.html'}
|
||||
// autocomplete: {source: [{label:'Alpha',value:'1'},{label:'Beta',value:'x'}] }
|
||||
});
|
||||
|
||||
*/
|
||||
|
||||
|
||||
// Uncomment this line to see the callback functions in action
|
||||
// $('input.tags').tagsInput({onAddTag:onAddTag,onRemoveTag:onRemoveTag,onChange: onChangeTag});
|
||||
|
||||
// Uncomment this line to see an input with no interface for adding new tags.
|
||||
// $('input.tags').tagsInput({interactive:false});
|
||||
});
|
||||
|
||||
</script>
|
||||
<form>
|
||||
<p><label>Defaults:</label>
|
||||
<input id="tags_1" type="text" class="tags" value="foo,bar,baz,roffle" /></p>
|
||||
|
||||
<p><label>Technologies: (Programming languages in yellow)</label>
|
||||
<input id="tags_2" type="text" class="tags" value="php,ios,javascript,ruby,android,kindle" /></p>
|
||||
|
||||
<p><label>Autocomplete:</label>
|
||||
<input id='tags_3' type='text' class='tags' /></p>
|
||||
|
||||
</form>
|
||||
+146
@@ -0,0 +1,146 @@
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="chrome=1">
|
||||
<title>Jquery-tags-input by xoxco</title>
|
||||
|
||||
<link rel="stylesheet" href="stylesheets/styles.css">
|
||||
<link rel="stylesheet" href="stylesheets/pygment_trac.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
|
||||
<!--[if lt IE 9]>
|
||||
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrapper">
|
||||
<header>
|
||||
<h1>Jquery-tags-input</h1>
|
||||
<p>Magically convert a simple text input into a cool tag list with this jQuery plugin.</p>
|
||||
<p class="view"><a href="https://github.com/xoxco/jQuery-Tags-Input">View the Project on GitHub <small>xoxco/jQuery-Tags-Input</small></a></p>
|
||||
<ul>
|
||||
<li><a href="https://github.com/xoxco/jQuery-Tags-Input/zipball/master">Download <strong>ZIP File</strong></a></li>
|
||||
<li><a href="https://github.com/xoxco/jQuery-Tags-Input/tarball/master">Download <strong>TAR Ball</strong></a></li>
|
||||
<li><a href="https://github.com/xoxco/jQuery-Tags-Input">Fork On <strong>GitHub</strong></a></li>
|
||||
</ul>
|
||||
</header>
|
||||
<section>
|
||||
<h1>jQuery Tags Input Plugin</h1>
|
||||
|
||||
<p>Do you use tags to organize content on your site?
|
||||
This plugin will turn your boring tag list into a
|
||||
magical input that turns each tag into a style-able
|
||||
object with its own delete link. The plugin handles
|
||||
all the data - your form just sees a comma-delimited
|
||||
list of tags!</p>
|
||||
|
||||
<p><a href="https://github.com/xoxco/jQuery-Tags-Input">Get it from Github</a></p>
|
||||
|
||||
<p><a href="http://xoxco.com/projects/code/tagsinput/">View Demo</a></p>
|
||||
|
||||
<p>Created by <a href="http://xoxco.com">XOXCO</a></p>
|
||||
|
||||
<h2>Instructions</h2>
|
||||
|
||||
<p>First, add the Javascript and CSS files to your </p> tag:
|
||||
|
||||
<pre><code><script src="jquery.tagsinput.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="jquery.tagsinput.css" />
|
||||
</code></pre>
|
||||
|
||||
<p>Create a real input in your form that will contain a comma-separated list of
|
||||
tags. You can put any default or existing tags in the value attribute, and
|
||||
they'll be handled properly.</p>
|
||||
|
||||
<pre><code><input name="tags" id="tags" value="foo,bar,baz" />
|
||||
</code></pre>
|
||||
|
||||
<p>Then, simply call the tagsInput function on any field that should be treated as
|
||||
a list of tags.</p>
|
||||
|
||||
<pre><code>$('#tags').tagsInput();
|
||||
</code></pre>
|
||||
|
||||
<p>If you want to use jQuery.autocomplete, you can pass in a parameter with the
|
||||
autocomplete url.</p>
|
||||
|
||||
<pre><code>$('#tags').tagsInput({
|
||||
autocomplete_url:'<a href="http://myserver.com/api/autocomplete">http://myserver.com/api/autocomplete</a>'
|
||||
});
|
||||
</code></pre>
|
||||
|
||||
<p>If you're using the bassistance jQuery.autocomplete, which takes extra
|
||||
parameters, you can also send in options to the autocomplete plugin, as
|
||||
described here.</p>
|
||||
|
||||
<pre><code>$('#tags').tagsInput({
|
||||
autocomplete_url:'<a href="http://myserver.com/api/autocomplete">http://myserver.com/api/autocomplete</a>',
|
||||
autocomplete:{selectFirst:true,width:'100px',autoFill:true}
|
||||
});
|
||||
</code></pre>
|
||||
|
||||
<p>You can add and remove tags by calling the addTag() and removeTag() functions.</p>
|
||||
|
||||
<pre><code>$('#tags').addTag('foo');
|
||||
$('#tags').removeTag('bar');
|
||||
</code></pre>
|
||||
|
||||
<p>You can import a list of tags using the importTags() function...</p>
|
||||
|
||||
<pre><code>$('#tags').importTags('foo,bar,baz');
|
||||
</code></pre>
|
||||
|
||||
<p>You can also use importTags() to reset the tag list...</p>
|
||||
|
||||
<pre><code>$('#tags').importTags('');
|
||||
</code></pre>
|
||||
|
||||
<p>And you can check if a tag exists using tagExist()...</p>
|
||||
|
||||
<pre><code>if ($('#tags').tagExist('foo')) { ... }
|
||||
</code></pre>
|
||||
|
||||
<p>If additional functionality is required when a tag is added or removed, you may
|
||||
specify callback functions via the onAddTag and onRemoveTag parameters. Both
|
||||
functions should accept a single tag as the parameter.</p>
|
||||
|
||||
<p>If you do not want to provide a way to add tags, or you would prefer to provide
|
||||
an alternate interface for adding tags to the box, you may pass an false into
|
||||
the optional 'interactive' parameter. The tags will still be rendered as per
|
||||
usual, and the addTag and removeTag functions will operate as expected. </p>
|
||||
|
||||
<p>If you want a function to be called every time a tag is updated/deleted, set it
|
||||
as the 'onChange' option.</p>
|
||||
|
||||
<p>By default, if the cursor is immediately after a tag, hitting backspace will
|
||||
delete that tag. If you want to override this, set the 'removeWithBackspace'
|
||||
option to false.</p>
|
||||
|
||||
<h2>Options</h2>
|
||||
|
||||
<pre><code>$(selector).tagsInput({
|
||||
'autocomplete_url': url_to_autocomplete_api,
|
||||
'autocomplete': { option: value, option: value},
|
||||
'height':'100px',
|
||||
'width':'300px',
|
||||
'interactive':true,
|
||||
'defaultText':'add a tag',
|
||||
'onAddTag':callback_function,
|
||||
'onRemoveTag':callback_function,
|
||||
'onChange' : callback_function,
|
||||
'removeWithBackspace' : true,
|
||||
'minChars' : 0,
|
||||
'maxChars' : 0 //if not provided there is no limit,
|
||||
'placeholderColor' : '#666666'
|
||||
});
|
||||
</code></pre>
|
||||
</section>
|
||||
<footer>
|
||||
<p>This project is maintained by <a href="https://github.com/xoxco">xoxco</a></p>
|
||||
<p><small>Hosted on GitHub Pages — Theme by <a href="https://github.com/orderedlist">orderedlist</a></small></p>
|
||||
</footer>
|
||||
</div>
|
||||
<script src="javascripts/scale.fix.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,17 @@
|
||||
var metas = document.getElementsByTagName('meta');
|
||||
var i;
|
||||
if (navigator.userAgent.match(/iPhone/i)) {
|
||||
for (i=0; i<metas.length; i++) {
|
||||
if (metas[i].name == "viewport") {
|
||||
metas[i].content = "width=device-width, minimum-scale=1.0, maximum-scale=1.0";
|
||||
}
|
||||
}
|
||||
document.addEventListener("gesturestart", gestureStart, false);
|
||||
}
|
||||
function gestureStart() {
|
||||
for (i=0; i<metas.length; i++) {
|
||||
if (metas[i].name == "viewport") {
|
||||
metas[i].content = "width=device-width, minimum-scale=0.25, maximum-scale=1.6";
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,7 +0,0 @@
|
||||
div.tagsinput { border:1px solid #CCC; background: #FFF; padding:5px; width:300px; height:100px; overflow-y: auto;}
|
||||
div.tagsinput span.tag { border: 1px solid #a5d24a; -moz-border-radius:2px; -webkit-border-radius:2px; display: block; float: left; padding: 5px; text-decoration:none; background: #cde69c; color: #638421; margin-right: 5px; margin-bottom:5px;font-family: helvetica; font-size:13px;}
|
||||
div.tagsinput span.tag a { font-weight: bold; color: #82ad2b; text-decoration:none; font-size: 11px; }
|
||||
div.tagsinput input { width:80px; margin:0px; font-family: helvetica; font-size: 13px; border:1px solid transparent; padding:5px; background: transparent; color: #000; outline:0px; margin-right:5px; margin-bottom:5px; }
|
||||
div.tagsinput div { display:block; float: left; }
|
||||
.tags_clear { clear: both; width: 100%; height: 0px; }
|
||||
.not_valid {background: #FBD8DB !important; color: #90111A !important;}
|
||||
@@ -1,403 +0,0 @@
|
||||
/*
|
||||
|
||||
jQuery Tags Input Plugin 2.0
|
||||
|
||||
Copyright (c) 2012 XOXCO, Inc
|
||||
|
||||
Documentation for this plugin lives here:
|
||||
http://xoxco.com/clickable/jquery-tags-input
|
||||
|
||||
Licensed under the MIT license:
|
||||
http://www.opensource.org/licenses/mit-license.php
|
||||
|
||||
ben@xoxco.com
|
||||
|
||||
GOALS FOR 2.0
|
||||
|
||||
Fix identifier issue - should work with any valid jquery selector
|
||||
Make internationalization friendly
|
||||
add tag input validation
|
||||
make sure autocomplete works with newest jquery
|
||||
|
||||
|
||||
*/
|
||||
|
||||
(function($) {
|
||||
|
||||
var internal_counter = 0; // this is used to create unique ids for each tag input
|
||||
|
||||
|
||||
// automatically size the input to show the entire value
|
||||
$.fn.doAutosize = function(o){
|
||||
var minWidth = $(this).data('minwidth'),
|
||||
maxWidth = $(this).data('maxwidth'),
|
||||
val = '',
|
||||
input = $(this),
|
||||
testSubject = $('#'+$(this).data('tester_id'));
|
||||
|
||||
if (val === (val = input.val())) {return;}
|
||||
|
||||
// Enter new content into testSubject
|
||||
var escaped = val.replace(/&/g, '&').replace(/\s/g,' ').replace(/</g, '<').replace(/>/g, '>');
|
||||
testSubject.html(escaped);
|
||||
// Calculate new width + whether to change
|
||||
var testerWidth = testSubject.width(),
|
||||
newWidth = (testerWidth + o.comfortZone) >= minWidth ? testerWidth + o.comfortZone : minWidth,
|
||||
currentWidth = input.width(),
|
||||
isValidWidthChange = (newWidth < currentWidth && newWidth >= minWidth)
|
||||
|| (newWidth > minWidth && newWidth < maxWidth);
|
||||
|
||||
// Animate width
|
||||
if (isValidWidthChange) {
|
||||
input.width(newWidth);
|
||||
}
|
||||
|
||||
|
||||
};
|
||||
$.fn.resetAutosize = function(options){
|
||||
var minWidth = $(this).data('minwidth') || options.minInputWidth || $(this).width(),
|
||||
maxWidth = $(this).data('maxwidth') || options.maxInputWidth || ($(this).closest('.tagsinput').width() - options.inputPadding),
|
||||
val = '',
|
||||
input = $(this),
|
||||
testSubject = $('<tester/>').css({
|
||||
position: 'absolute',
|
||||
top: -9999,
|
||||
left: -9999,
|
||||
width: 'auto',
|
||||
fontSize: input.css('fontSize'),
|
||||
fontFamily: input.css('fontFamily'),
|
||||
fontWeight: input.css('fontWeight'),
|
||||
letterSpacing: input.css('letterSpacing'),
|
||||
whiteSpace: 'nowrap'
|
||||
}),
|
||||
testerId = $(this).attr('id')+'_autosize_tester';
|
||||
if(! $('#'+testerId).length > 0){
|
||||
testSubject.attr('id', testerId);
|
||||
testSubject.appendTo('body');
|
||||
}
|
||||
|
||||
input.data('minwidth', minWidth);
|
||||
input.data('maxwidth', maxWidth);
|
||||
input.data('tester_id', testerId);
|
||||
input.css('width', minWidth);
|
||||
};
|
||||
|
||||
$.fn.addTag = function(value,options) {
|
||||
options = jQuery.extend({focus:false,callback:true},options);
|
||||
this.each(function() {
|
||||
|
||||
var settings = $(this).data('settings');
|
||||
var tagslist = $(this).val().split(settings.delimiter);
|
||||
if (tagslist[0] == '') {
|
||||
tagslist = new Array();
|
||||
}
|
||||
|
||||
value = jQuery.trim(value);
|
||||
|
||||
var skipTag = false;
|
||||
if (options.unique) {
|
||||
skipTag = $(this).tagExist(value);
|
||||
if(skipTag == true) {
|
||||
//Marks fake input as not_valid to let styling it
|
||||
$(settings.fake_input).addClass('not_valid');
|
||||
if (settings.onError) {
|
||||
var f = settings.onError;
|
||||
f.call(this,'duplicate');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (settings.validateTag) {
|
||||
var f = settings.validateTag;
|
||||
if (!f.call(this,value)) {
|
||||
skipTag = true;
|
||||
$(settings.fake_input).addClass('not_valid');
|
||||
if (settings.onError) {
|
||||
var f = settings.onError;
|
||||
f.call(this,'validation');
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
if (value !='' && skipTag != true) {
|
||||
$('<span>').addClass('tag').append(
|
||||
$('<span>').text(value).append(' '),
|
||||
$('<a>', {
|
||||
href : '#',
|
||||
title : settings.removeText,
|
||||
text : 'x'
|
||||
}).click(function () {
|
||||
return $(settings.real_input).removeTag(escape(value));
|
||||
})
|
||||
).insertBefore(settings.input_wrapper);
|
||||
|
||||
tagslist.push(value);
|
||||
|
||||
$(settings.fake_input).val('');
|
||||
if (options.focus) {
|
||||
$(settings.fake_input).focus();
|
||||
} else {
|
||||
$(settings.fake_input).blur();
|
||||
}
|
||||
|
||||
|
||||
$.fn.tagsInput.updateTagsField(this,tagslist);
|
||||
|
||||
if (settings.onAddTag) {
|
||||
var f = settings.onAddTag;
|
||||
f.call(this, value);
|
||||
}
|
||||
if(settings.onChange)
|
||||
{
|
||||
var i = tagslist.length;
|
||||
var f = settings.onChange;
|
||||
f.call(this, $(this), tagslist[i-1]);
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
return false;
|
||||
};
|
||||
|
||||
$.fn.removeTag = function(value) {
|
||||
value = unescape(value);
|
||||
this.each(function() {
|
||||
var settings = $(this).data('settings');
|
||||
var old = $(this).val().split(settings.delimiter);
|
||||
|
||||
$(settings.holder + ' .tag').remove();
|
||||
str = '';
|
||||
for (i=0; i< old.length; i++) {
|
||||
if (old[i]!=value) {
|
||||
str = str + settings.delimiter +old[i];
|
||||
}
|
||||
}
|
||||
|
||||
$.fn.tagsInput.importTags(this,str);
|
||||
|
||||
if (settings.onRemoveTag) {
|
||||
var f = settings.onRemoveTag;
|
||||
f.call(this, value);
|
||||
}
|
||||
});
|
||||
|
||||
return false;
|
||||
};
|
||||
|
||||
$.fn.tagExist = function(val) {
|
||||
var settings = $(this).data('settings');
|
||||
var tagslist = $(this).val().split(settings.delimiter);
|
||||
return (jQuery.inArray(val, tagslist) >= 0); //true when tag exists, false when not
|
||||
};
|
||||
|
||||
// clear all existing tags and import new ones from a string
|
||||
$.fn.importTags = function(str) {
|
||||
var settings = $(this).data('settings');
|
||||
$(settings.holder + ' .tag').remove();
|
||||
$.fn.tagsInput.importTags(this,str);
|
||||
}
|
||||
|
||||
$.fn.tagsInput = function(options) {
|
||||
var settings = jQuery.extend({
|
||||
interactive:true,
|
||||
defaultText:'add a tag',
|
||||
removeText:'Remove Tag',
|
||||
minChars:0,
|
||||
width:'auto',
|
||||
minHeight:'100px',
|
||||
height: 'auto',
|
||||
autocomplete: null,
|
||||
autocompleteselect: null,
|
||||
'hide':true,
|
||||
'delimiter':',',
|
||||
'unique':true,
|
||||
removeWithBackspace:true,
|
||||
placeholderColor:'#666666',
|
||||
autosize: true,
|
||||
comfortZone: 20,
|
||||
inputPadding: 6*2,
|
||||
onChange: null, // events and handlers
|
||||
onAddTag: null,
|
||||
onRemoveTag: null,
|
||||
validateTag: null,
|
||||
onError: null
|
||||
},options);
|
||||
|
||||
this.each(function() {
|
||||
if (settings.hide) {
|
||||
$(this).hide();
|
||||
}
|
||||
|
||||
|
||||
var id = internal_counter++;
|
||||
|
||||
var data = jQuery.extend({
|
||||
pid:id,
|
||||
real_input: this,
|
||||
holder: '#'+id+'_tagsinput',
|
||||
input_wrapper: '#'+id+'_addTag',
|
||||
fake_input: '#'+id+'_tag'
|
||||
},settings);
|
||||
|
||||
$(this).addClass('tagsinput_processed');
|
||||
|
||||
var markup = '<div id="'+id+'_tagsinput" class="tagsinput"><div id="'+id+'_addTag" class="tagsinput_inputwrapper">';
|
||||
|
||||
if (settings.interactive) {
|
||||
markup = markup + '<input id="'+id+'_tag" value="" data-default="'+settings.defaultText+'" />';
|
||||
}
|
||||
|
||||
markup = markup + '</div><div class="tags_clear"></div></div>';
|
||||
|
||||
$(markup).insertAfter(this);
|
||||
|
||||
$(data.holder).css('width',settings.width);
|
||||
$(data.holder).css('height',settings.height);
|
||||
$(data.holder).css('min-height',settings.minHeight);
|
||||
|
||||
// store the settings with the DOM object so we can use them in other functions
|
||||
$(this).data('settings',data);
|
||||
|
||||
|
||||
if ($(this).val()!='') {
|
||||
$.fn.tagsInput.importTags($(this),$(this).val());
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
if (settings.interactive) {
|
||||
$(data.fake_input).val($(data.fake_input).attr('data-default'));
|
||||
$(data.fake_input).css('color',settings.placeholderColor);
|
||||
$(data.fake_input).resetAutosize(settings);
|
||||
|
||||
|
||||
// if the user clicks anywhere in the tag box, focus the input field
|
||||
$(data.holder).on('click',data,function(event) {
|
||||
$(event.data.fake_input).focus();
|
||||
});
|
||||
|
||||
// if the user clicks in the input field…
|
||||
$(data.fake_input).on('focus',data,function(event) {
|
||||
// empty the field
|
||||
if ($(event.data.fake_input).val()==$(event.data.fake_input).attr('data-default')) {
|
||||
$(event.data.fake_input).val('');
|
||||
}
|
||||
// set the field to the active color
|
||||
$(event.data.fake_input).css('color','#000000');
|
||||
});
|
||||
|
||||
// if an autocomplete has been specified, do some stuff…
|
||||
if (settings.autocomplete) {
|
||||
// pass in the autocomplete settings to the autocomplete plugin
|
||||
// provided by jquery UI
|
||||
$(data.fake_input).autocomplete(settings.autocomplete);
|
||||
|
||||
// if an autocompleteselect handler has been passed in, use that.
|
||||
// otherwise, use our own.
|
||||
if (settings.autocompleteselect) {
|
||||
$(data.fake_input).on('autocompleteselect',data,settings.autocompleteselect);
|
||||
} else {
|
||||
$(data.fake_input).on('autocompleteselect',data,function(event,ui) {
|
||||
$(event.data.real_input).addTag(ui.item.value,{focus:true,unique:(settings.unique)});
|
||||
return false;
|
||||
});
|
||||
}
|
||||
|
||||
// track whether or not the autocomplete is open so we can avoid adding duplicate tags
|
||||
$(data.fake_input).on('autocompleteopen',data,function() {
|
||||
$(this).data('autocompleteopen',true);
|
||||
return false;
|
||||
});
|
||||
$(data.fake_input).on('autocompleteclose',data,function() {
|
||||
$(this).data('autocompleteopen',null);
|
||||
return false;
|
||||
});
|
||||
}
|
||||
|
||||
// if the user tabs out of the field
|
||||
// add the tag that was being typed
|
||||
// UNLESS the autocompleter is open
|
||||
// and then set back to default.
|
||||
$(data.fake_input).on('blur',data,function(event) {
|
||||
if ($(event.data.fake_input).val()!='' && $(event.data.fake_input).val()!=event.data.defaultText) {
|
||||
if (!$(this).data('autocompleteopen')) {
|
||||
if( (event.data.minChars <= $(event.data.fake_input).val().length) && (!event.data.maxChars || (event.data.maxChars >= $(event.data.fake_input).val().length)) )
|
||||
$(event.data.real_input).addTag($(event.data.fake_input).val(),{focus:true,unique:(settings.unique)});
|
||||
} else {
|
||||
// autocomplete is open, do not add tag because
|
||||
// this will be handled by the autocompleteselect event.
|
||||
}
|
||||
} else {
|
||||
$(event.data.fake_input).val(event.data.defaultText);
|
||||
$(event.data.fake_input).css('color',event.data.placeholderColor);
|
||||
$(event.data.fake_input).removeClass('not_valid');
|
||||
}
|
||||
return false;
|
||||
});
|
||||
|
||||
|
||||
// if user types a comma, create a new tag
|
||||
$(data.fake_input).on('keypress',data,function(event) {
|
||||
if (event.which==event.data.delimiter.charCodeAt(0) || event.which==13 ) {
|
||||
event.preventDefault();
|
||||
if( (event.data.minChars <= $(event.data.fake_input).val().length) && (!event.data.maxChars || (event.data.maxChars >= $(event.data.fake_input).val().length)) )
|
||||
$(event.data.real_input).addTag($(event.data.fake_input).val(),{focus:true,unique:(settings.unique)});
|
||||
$(event.data.fake_input).resetAutosize(settings);
|
||||
return false;
|
||||
} else if (event.data.autosize) {
|
||||
$(event.data.fake_input).doAutosize(settings);
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
//Delete last tag on backspace
|
||||
data.removeWithBackspace && $(data.fake_input).on('keydown',data, function(event)
|
||||
{
|
||||
if(event.keyCode == 8 && $(this).val() == '')
|
||||
{
|
||||
event.preventDefault();
|
||||
var last_tag = $(this).closest('.tagsinput').find('.tag:last').text();
|
||||
last_tag = last_tag.replace(/[\s]+x$/, '');
|
||||
$(data.real_input).removeTag(escape(last_tag));
|
||||
$(this).trigger('focus');
|
||||
}
|
||||
});
|
||||
$(data.fake_input).blur();
|
||||
|
||||
//Removes the not_valid class when user changes the value of the fake input
|
||||
if(data.unique || data.validateTag) {
|
||||
$(data.fake_input).keydown(function(event){
|
||||
if(event.keyCode == 8 || String.fromCharCode(event.which).match(/\w+|[áéíóúÁÉÍÓÚñÑ,/]+/)) {
|
||||
$(this).removeClass('not_valid');
|
||||
}
|
||||
});
|
||||
}
|
||||
} // if settings.interactive
|
||||
});
|
||||
|
||||
return this;
|
||||
|
||||
};
|
||||
|
||||
$.fn.tagsInput.updateTagsField = function(obj,tagslist) {
|
||||
var settings = $(obj).data('settings');
|
||||
$(obj).val(tagslist.join(settings.delimiter));
|
||||
};
|
||||
|
||||
$.fn.tagsInput.importTags = function(obj,val) {
|
||||
var settings = $(obj).data('settings');
|
||||
$(obj).val('');
|
||||
var tags = val.split(settings.delimiter);
|
||||
for (i=0; i<tags.length; i++) {
|
||||
$(obj).addTag(tags[i],{focus:false,callback:false});
|
||||
}
|
||||
if(settings.onChange)
|
||||
{
|
||||
var f = settings.onChange;
|
||||
f.call(obj, obj, tags[i]);
|
||||
}
|
||||
};
|
||||
|
||||
})(jQuery);
|
||||
Vendored
-1
File diff suppressed because one or more lines are too long
@@ -0,0 +1 @@
|
||||
{"name":"Jquery-tags-input","body":"# jQuery Tags Input Plugin \r\n\r\nDo you use tags to organize content on your site? \r\nThis plugin will turn your boring tag list into a \r\nmagical input that turns each tag into a style-able \r\nobject with its own delete link. The plugin handles \r\nall the data - your form just sees a comma-delimited \r\nlist of tags!\r\n\r\n[Get it from Github](https://github.com/xoxco/jQuery-Tags-Input)\r\n\r\n[View Demo](http://xoxco.com/projects/code/tagsinput/)\r\n\r\nCreated by [XOXCO](http://xoxco.com)\r\n\r\n\r\n## Instructions\r\n\r\nFirst, add the Javascript and CSS files to your <head> tag:\r\n\r\n\t<script src=\"jquery.tagsinput.js\"></script>\r\n\t<link rel=\"stylesheet\" type=\"text/css\" href=\"jquery.tagsinput.css\" />\r\n\r\nCreate a real input in your form that will contain a comma-separated list of \r\ntags. You can put any default or existing tags in the value attribute, and \r\nthey'll be handled properly.\r\n\r\n\t<input name=\"tags\" id=\"tags\" value=\"foo,bar,baz\" />\r\n\r\nThen, simply call the tagsInput function on any field that should be treated as\r\na list of tags.\r\n\r\n\t$('#tags').tagsInput();\r\n\r\nIf you want to use jQuery.autocomplete, you can pass in a parameter with the \r\nautocomplete url.\r\n\r\n\t$('#tags').tagsInput({\r\n\t autocomplete_url:'http://myserver.com/api/autocomplete'\r\n\t});\r\n\r\nIf you're using the bassistance jQuery.autocomplete, which takes extra \r\nparameters, you can also send in options to the autocomplete plugin, as \r\ndescribed here.\r\n\r\n\t$('#tags').tagsInput({ \r\n\t autocomplete_url:'http://myserver.com/api/autocomplete',\r\n\t autocomplete:{selectFirst:true,width:'100px',autoFill:true}\r\n\t});\r\n\r\nYou can add and remove tags by calling the addTag() and removeTag() functions.\r\n\r\n\t$('#tags').addTag('foo');\r\n\t$('#tags').removeTag('bar');\r\n\r\nYou can import a list of tags using the importTags() function...\r\n\r\n\t$('#tags').importTags('foo,bar,baz');\r\n\r\nYou can also use importTags() to reset the tag list...\r\n\r\n\t$('#tags').importTags('');\r\n\r\nAnd you can check if a tag exists using tagExist()...\r\n\r\n\tif ($('#tags').tagExist('foo')) { ... }\r\n\r\nIf additional functionality is required when a tag is added or removed, you may\r\nspecify callback functions via the onAddTag and onRemoveTag parameters. Both \r\nfunctions should accept a single tag as the parameter.\r\n\r\nIf you do not want to provide a way to add tags, or you would prefer to provide \r\nan alternate interface for adding tags to the box, you may pass an false into \r\nthe optional 'interactive' parameter. The tags will still be rendered as per \r\nusual, and the addTag and removeTag functions will operate as expected. \r\n\r\nIf you want a function to be called every time a tag is updated/deleted, set it\r\nas the 'onChange' option.\r\n\r\nBy default, if the cursor is immediately after a tag, hitting backspace will \r\ndelete that tag. If you want to override this, set the 'removeWithBackspace' \r\noption to false.\r\n\r\n## Options\r\n\r\n\t$(selector).tagsInput({\r\n\t 'autocomplete_url': url_to_autocomplete_api,\r\n\t 'autocomplete': { option: value, option: value},\r\n\t 'height':'100px',\r\n\t 'width':'300px',\r\n\t 'interactive':true,\r\n\t 'defaultText':'add a tag',\r\n\t 'onAddTag':callback_function,\r\n\t 'onRemoveTag':callback_function,\r\n\t 'onChange' : callback_function,\r\n\t 'removeWithBackspace' : true,\r\n\t 'minChars' : 0,\r\n\t 'maxChars' : 0 //if not provided there is no limit,\r\n\t 'placeholderColor' : '#666666'\r\n\t});","tagline":"Magically convert a simple text input into a cool tag list with this jQuery plugin.","google":"","note":"Don't delete this file! It's used internally to help with page regeneration."}
|
||||
@@ -0,0 +1,69 @@
|
||||
.highlight { background: #ffffff; }
|
||||
.highlight .c { color: #999988; font-style: italic } /* Comment */
|
||||
.highlight .err { color: #a61717; background-color: #e3d2d2 } /* Error */
|
||||
.highlight .k { font-weight: bold } /* Keyword */
|
||||
.highlight .o { font-weight: bold } /* Operator */
|
||||
.highlight .cm { color: #999988; font-style: italic } /* Comment.Multiline */
|
||||
.highlight .cp { color: #999999; font-weight: bold } /* Comment.Preproc */
|
||||
.highlight .c1 { color: #999988; font-style: italic } /* Comment.Single */
|
||||
.highlight .cs { color: #999999; font-weight: bold; font-style: italic } /* Comment.Special */
|
||||
.highlight .gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */
|
||||
.highlight .gd .x { color: #000000; background-color: #ffaaaa } /* Generic.Deleted.Specific */
|
||||
.highlight .ge { font-style: italic } /* Generic.Emph */
|
||||
.highlight .gr { color: #aa0000 } /* Generic.Error */
|
||||
.highlight .gh { color: #999999 } /* Generic.Heading */
|
||||
.highlight .gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */
|
||||
.highlight .gi .x { color: #000000; background-color: #aaffaa } /* Generic.Inserted.Specific */
|
||||
.highlight .go { color: #888888 } /* Generic.Output */
|
||||
.highlight .gp { color: #555555 } /* Generic.Prompt */
|
||||
.highlight .gs { font-weight: bold } /* Generic.Strong */
|
||||
.highlight .gu { color: #800080; font-weight: bold; } /* Generic.Subheading */
|
||||
.highlight .gt { color: #aa0000 } /* Generic.Traceback */
|
||||
.highlight .kc { font-weight: bold } /* Keyword.Constant */
|
||||
.highlight .kd { font-weight: bold } /* Keyword.Declaration */
|
||||
.highlight .kn { font-weight: bold } /* Keyword.Namespace */
|
||||
.highlight .kp { font-weight: bold } /* Keyword.Pseudo */
|
||||
.highlight .kr { font-weight: bold } /* Keyword.Reserved */
|
||||
.highlight .kt { color: #445588; font-weight: bold } /* Keyword.Type */
|
||||
.highlight .m { color: #009999 } /* Literal.Number */
|
||||
.highlight .s { color: #d14 } /* Literal.String */
|
||||
.highlight .na { color: #008080 } /* Name.Attribute */
|
||||
.highlight .nb { color: #0086B3 } /* Name.Builtin */
|
||||
.highlight .nc { color: #445588; font-weight: bold } /* Name.Class */
|
||||
.highlight .no { color: #008080 } /* Name.Constant */
|
||||
.highlight .ni { color: #800080 } /* Name.Entity */
|
||||
.highlight .ne { color: #990000; font-weight: bold } /* Name.Exception */
|
||||
.highlight .nf { color: #990000; font-weight: bold } /* Name.Function */
|
||||
.highlight .nn { color: #555555 } /* Name.Namespace */
|
||||
.highlight .nt { color: #000080 } /* Name.Tag */
|
||||
.highlight .nv { color: #008080 } /* Name.Variable */
|
||||
.highlight .ow { font-weight: bold } /* Operator.Word */
|
||||
.highlight .w { color: #bbbbbb } /* Text.Whitespace */
|
||||
.highlight .mf { color: #009999 } /* Literal.Number.Float */
|
||||
.highlight .mh { color: #009999 } /* Literal.Number.Hex */
|
||||
.highlight .mi { color: #009999 } /* Literal.Number.Integer */
|
||||
.highlight .mo { color: #009999 } /* Literal.Number.Oct */
|
||||
.highlight .sb { color: #d14 } /* Literal.String.Backtick */
|
||||
.highlight .sc { color: #d14 } /* Literal.String.Char */
|
||||
.highlight .sd { color: #d14 } /* Literal.String.Doc */
|
||||
.highlight .s2 { color: #d14 } /* Literal.String.Double */
|
||||
.highlight .se { color: #d14 } /* Literal.String.Escape */
|
||||
.highlight .sh { color: #d14 } /* Literal.String.Heredoc */
|
||||
.highlight .si { color: #d14 } /* Literal.String.Interpol */
|
||||
.highlight .sx { color: #d14 } /* Literal.String.Other */
|
||||
.highlight .sr { color: #009926 } /* Literal.String.Regex */
|
||||
.highlight .s1 { color: #d14 } /* Literal.String.Single */
|
||||
.highlight .ss { color: #990073 } /* Literal.String.Symbol */
|
||||
.highlight .bp { color: #999999 } /* Name.Builtin.Pseudo */
|
||||
.highlight .vc { color: #008080 } /* Name.Variable.Class */
|
||||
.highlight .vg { color: #008080 } /* Name.Variable.Global */
|
||||
.highlight .vi { color: #008080 } /* Name.Variable.Instance */
|
||||
.highlight .il { color: #009999 } /* Literal.Number.Integer.Long */
|
||||
|
||||
.type-csharp .highlight .k { color: #0000FF }
|
||||
.type-csharp .highlight .kt { color: #0000FF }
|
||||
.type-csharp .highlight .nf { color: #000000; font-weight: normal }
|
||||
.type-csharp .highlight .nc { color: #2B91AF }
|
||||
.type-csharp .highlight .nn { color: #000000 }
|
||||
.type-csharp .highlight .s { color: #A31515 }
|
||||
.type-csharp .highlight .sc { color: #A31515 }
|
||||
@@ -0,0 +1,255 @@
|
||||
@import url(https://fonts.googleapis.com/css?family=Lato:300italic,700italic,300,700);
|
||||
|
||||
body {
|
||||
padding:50px;
|
||||
font:14px/1.5 Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
color:#777;
|
||||
font-weight:300;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
color:#222;
|
||||
margin:0 0 20px;
|
||||
}
|
||||
|
||||
p, ul, ol, table, pre, dl {
|
||||
margin:0 0 20px;
|
||||
}
|
||||
|
||||
h1, h2, h3 {
|
||||
line-height:1.1;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size:28px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
color:#393939;
|
||||
}
|
||||
|
||||
h3, h4, h5, h6 {
|
||||
color:#494949;
|
||||
}
|
||||
|
||||
a {
|
||||
color:#39c;
|
||||
font-weight:400;
|
||||
text-decoration:none;
|
||||
}
|
||||
|
||||
a small {
|
||||
font-size:11px;
|
||||
color:#777;
|
||||
margin-top:-0.6em;
|
||||
display:block;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
width:860px;
|
||||
margin:0 auto;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
border-left:1px solid #e5e5e5;
|
||||
margin:0;
|
||||
padding:0 0 0 20px;
|
||||
font-style:italic;
|
||||
}
|
||||
|
||||
code, pre {
|
||||
font-family:Monaco, Bitstream Vera Sans Mono, Lucida Console, Terminal;
|
||||
color:#333;
|
||||
font-size:12px;
|
||||
}
|
||||
|
||||
pre {
|
||||
padding:8px 15px;
|
||||
background: #f8f8f8;
|
||||
border-radius:5px;
|
||||
border:1px solid #e5e5e5;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
table {
|
||||
width:100%;
|
||||
border-collapse:collapse;
|
||||
}
|
||||
|
||||
th, td {
|
||||
text-align:left;
|
||||
padding:5px 10px;
|
||||
border-bottom:1px solid #e5e5e5;
|
||||
}
|
||||
|
||||
dt {
|
||||
color:#444;
|
||||
font-weight:700;
|
||||
}
|
||||
|
||||
th {
|
||||
color:#444;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width:100%;
|
||||
}
|
||||
|
||||
header {
|
||||
width:270px;
|
||||
float:left;
|
||||
position:fixed;
|
||||
}
|
||||
|
||||
header ul {
|
||||
list-style:none;
|
||||
height:40px;
|
||||
|
||||
padding:0;
|
||||
|
||||
background: #eee;
|
||||
background: -moz-linear-gradient(top, #f8f8f8 0%, #dddddd 100%);
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f8f8f8), color-stop(100%,#dddddd));
|
||||
background: -webkit-linear-gradient(top, #f8f8f8 0%,#dddddd 100%);
|
||||
background: -o-linear-gradient(top, #f8f8f8 0%,#dddddd 100%);
|
||||
background: -ms-linear-gradient(top, #f8f8f8 0%,#dddddd 100%);
|
||||
background: linear-gradient(top, #f8f8f8 0%,#dddddd 100%);
|
||||
|
||||
border-radius:5px;
|
||||
border:1px solid #d2d2d2;
|
||||
box-shadow:inset #fff 0 1px 0, inset rgba(0,0,0,0.03) 0 -1px 0;
|
||||
width:270px;
|
||||
}
|
||||
|
||||
header li {
|
||||
width:89px;
|
||||
float:left;
|
||||
border-right:1px solid #d2d2d2;
|
||||
height:40px;
|
||||
}
|
||||
|
||||
header ul a {
|
||||
line-height:1;
|
||||
font-size:11px;
|
||||
color:#999;
|
||||
display:block;
|
||||
text-align:center;
|
||||
padding-top:6px;
|
||||
height:40px;
|
||||
}
|
||||
|
||||
strong {
|
||||
color:#222;
|
||||
font-weight:700;
|
||||
}
|
||||
|
||||
header ul li + li {
|
||||
width:88px;
|
||||
border-left:1px solid #fff;
|
||||
}
|
||||
|
||||
header ul li + li + li {
|
||||
border-right:none;
|
||||
width:89px;
|
||||
}
|
||||
|
||||
header ul a strong {
|
||||
font-size:14px;
|
||||
display:block;
|
||||
color:#222;
|
||||
}
|
||||
|
||||
section {
|
||||
width:500px;
|
||||
float:right;
|
||||
padding-bottom:50px;
|
||||
}
|
||||
|
||||
small {
|
||||
font-size:11px;
|
||||
}
|
||||
|
||||
hr {
|
||||
border:0;
|
||||
background:#e5e5e5;
|
||||
height:1px;
|
||||
margin:0 0 20px;
|
||||
}
|
||||
|
||||
footer {
|
||||
width:270px;
|
||||
float:left;
|
||||
position:fixed;
|
||||
bottom:50px;
|
||||
}
|
||||
|
||||
@media print, screen and (max-width: 960px) {
|
||||
|
||||
div.wrapper {
|
||||
width:auto;
|
||||
margin:0;
|
||||
}
|
||||
|
||||
header, section, footer {
|
||||
float:none;
|
||||
position:static;
|
||||
width:auto;
|
||||
}
|
||||
|
||||
header {
|
||||
padding-right:320px;
|
||||
}
|
||||
|
||||
section {
|
||||
border:1px solid #e5e5e5;
|
||||
border-width:1px 0;
|
||||
padding:20px 0;
|
||||
margin:0 0 20px;
|
||||
}
|
||||
|
||||
header a small {
|
||||
display:inline;
|
||||
}
|
||||
|
||||
header ul {
|
||||
position:absolute;
|
||||
right:50px;
|
||||
top:52px;
|
||||
}
|
||||
}
|
||||
|
||||
@media print, screen and (max-width: 720px) {
|
||||
body {
|
||||
word-wrap:break-word;
|
||||
}
|
||||
|
||||
header {
|
||||
padding:0;
|
||||
}
|
||||
|
||||
header ul, header p.view {
|
||||
position:static;
|
||||
}
|
||||
|
||||
pre, code {
|
||||
word-wrap:normal;
|
||||
}
|
||||
}
|
||||
|
||||
@media print, screen and (max-width: 480px) {
|
||||
body {
|
||||
padding:15px;
|
||||
}
|
||||
|
||||
header ul {
|
||||
display:none;
|
||||
}
|
||||
}
|
||||
|
||||
@media print {
|
||||
body {
|
||||
padding:0.4in;
|
||||
font-size:12pt;
|
||||
color:#444;
|
||||
}
|
||||
}
|
||||
@@ -1 +0,0 @@
|
||||
[ { "id": "Netta rufina", "label": "Red-crested Pochard", "value": "Red-crested Pochard" }, { "id": "Sterna sandvicensis", "label": "Sandwich Tern", "value": "Sandwich Tern" }, { "id": "Saxicola rubetra", "label": "Whinchat", "value": "Whinchat" }, { "id": "Saxicola rubicola", "label": "European Stonechat", "value": "European Stonechat" }, { "id": "Lanius senator", "label": "Woodchat Shrike", "value": "Woodchat Shrike" }, { "id": "Coccothraustes coccothraustes", "label": "Hawfinch", "value": "Hawfinch" }, { "id": "Ficedula hypoleuca", "label": "Eurasian Pied Flycatcher", "value": "Eurasian Pied Flycatcher" }, { "id": "Sitta europaea", "label": "Eurasian Nuthatch", "value": "Eurasian Nuthatch" }, { "id": "Pyrrhula pyrrhula", "label": "Eurasian Bullfinch", "value": "Eurasian Bullfinch" }, { "id": "Muscicapa striata", "label": "Spotted Flycatcher", "value": "Spotted Flycatcher" }, { "id": "Carduelis chloris", "label": "European Greenfinch", "value": "European Greenfinch" }, { "id": "Carduelis carduelis", "label": "European Goldfinch", "value": "European Goldfinch" } ]
|
||||
@@ -1,4 +0,0 @@
|
||||
inky
|
||||
pinky
|
||||
blinky
|
||||
clyde
|
||||
Reference in New Issue
Block a user