Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
51 commits
Select commit Hold shift + click to select a range
9e8ffd1
When using jQuery-UI autocomplete, honour _renderItem extension point
alfonsomunozpomer Feb 24, 2016
f93aeb5
Allow \n to be used as a delimiter
alfonsomunozpomer Feb 24, 2016
2bc18ea
Delete support for removeDuplicates
alfonsomunozpomer May 6, 2016
11d4a96
Add .gitignore to repository
alfonsomunozpomer Apr 11, 2016
e451455
Delete minified JS (out-of-sync with main)
alfonsomunozpomer Apr 11, 2016
ae3123b
Support for cut is Windows-specific (ctrlKey): remove it as I don’t s…
alfonsomunozpomer Apr 18, 2016
51fc8df
Delete support for removeDuplicates
alfonsomunozpomer May 6, 2016
b49646d
Add .gitignore to repository
alfonsomunozpomer Apr 11, 2016
9cb02ee
Delete minified JS (out-of-sync with main)
alfonsomunozpomer May 6, 2016
d986015
Support for cut is Windows-specific (ctrlKey): remove it as I don’t s…
alfonsomunozpomer May 6, 2016
5098d5d
Format code: terse code doesn’t make for very readable code...
alfonsomunozpomer May 6, 2016
b26a670
Remove support for autogrow for text inputs, let’s keep what the tag …
alfonsomunozpomer May 6, 2016
c6f36c9
Double equals is evil
alfonsomunozpomer May 6, 2016
ba4ef19
!== doesn’t work (flag this for future revision)
alfonsomunozpomer May 6, 2016
ed12ec4
When using the public method addTag validate tag as object or JSON st…
alfonsomunozpomer May 10, 2016
51202e9
Remove temporary <li> after split_cleanup
alfonsomunozpomer May 10, 2016
6949e28
removeTag uses data attributes to match tags
alfonsomunozpomer May 10, 2016
772a515
Backing tagList is now an arraty of tag objects
alfonsomunozpomer May 10, 2016
a46a424
Fix my concerns in ba4ef19
alfonsomunozpomer May 10, 2016
a175e07
Add data attribute to initial tags
alfonsomunozpomer May 11, 2016
dec138a
Rename files to json-tag-editor
alfonsomunozpomer May 11, 2016
ff21ff9
Change authorship
alfonsomunozpomer May 11, 2016
737f42e
Change tagEditor function to jsonTagEditor to avoid clashes in jQuery.fn
alfonsomunozpomer May 11, 2016
7297d35
Add documentation
alfonsomunozpomer May 11, 2016
68ed151
Merge branch 'master' into without_newline_support
alfonsomunozpomer May 11, 2016
4d3aa05
Rename readme.md to README.md
alfonsomunozpomer May 11, 2016
9a40272
Merge remote-tracking branch 'origin/master'
alfonsomunozpomer May 11, 2016
23a043a
Separate tags in #hero-demo using tabs instead of commas
alfonsomunozpomer May 16, 2016
967103a
Rewrite some documentation and add info about hard-coded delimiters
alfonsomunozpomer May 16, 2016
9ba0bc1
Delimiter hard-coded to \t and \n; paste now works with multi-line wo…
alfonsomunozpomer May 16, 2016
eea8464
Clean up code; prefix “tag-editor” classes with “json-” to avoid clas…
alfonsomunozpomer May 17, 2016
416c660
Prefix “tag-editor” classes with “json-” to avoid clashes with the re…
alfonsomunozpomer May 17, 2016
b87f0b4
Some more code clean-up
alfonsomunozpomer May 17, 2016
65c4d96
Use Selection API to properly delete tags using Delete/Backspace acro…
alfonsomunozpomer May 18, 2016
7ceaf9b
Remove custom delimiter from features
alfonsomunozpomer May 18, 2016
71ccceb
When editing an ellipsified tag don’t add an empty tag, as the new ta…
alfonsomunozpomer May 18, 2016
88d5193
Multi-line paste feature
alfonsomunozpomer May 18, 2016
18d11c8
Add minified version
alfonsomunozpomer May 18, 2016
b0c70ab
Rename tag-value and tagValue to value (less verbose and less redundant)
alfonsomunozpomer Jul 11, 2016
0b72c3f
Parse and validate initial tags as array of strings, array of objects…
alfonsomunozpomer Jul 22, 2016
dbae97c
Provide examples to test parsing and validation of initial tags as a…
alfonsomunozpomer Jul 22, 2016
4db77a4
Add noselect option to disable selection on the tag editor
alfonsomunozpomer Jul 24, 2016
8c9a9c0
Do not highlight selected tag spacers
alfonsomunozpomer Jul 25, 2016
f2d1d8b
Add option for noSelect; a negative value in maxTagLength means full …
alfonsomunozpomer Jul 25, 2016
ac32f6a
Fully document new and deprecated features
alfonsomunozpomer Jul 25, 2016
04633dd
Last touches on the demo HTML
alfonsomunozpomer Jul 25, 2016
c3efe48
Fix GitHub Pages link
alfonsomunozpomer Jul 25, 2016
ebaa804
Make onChange work on Safari by explicitly adding the value property …
Nov 22, 2016
10f9507
Merge pull request #1 from wbazant/master
alfonsomunozpomer Nov 22, 2016
02d5c4a
Minify
alfonsomunozpomer Nov 22, 2016
04ea197
Allow to plug in arbitrary autocomplete plug-ins specified in autocom…
alfonsomunozpomer Jan 20, 2017
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 9 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
### Example user template template
### Example user template

# IntelliJ project files
.idea
*.iml
out
gen
# Created by .ignore support plugin (hsz.mobi)
45 changes: 44 additions & 1 deletion readme.md → README.md
Original file line number Diff line number Diff line change
@@ -1,7 +1,50 @@
jQuery JSON Tag Editor
======================

*jQuery JSON Tag Editor* is a fork of [jQuery-tagEditor](https://goodies.pixabay.com/jquery/tag-editor/demo.html), originally developed by Simon Steinberger for
[Pixabay.com](https://pixabay.com) and licensed under the [MIT license](https://opensource.org/licenses/MIT). This fork maintains the same license and adds the
[Apache License, 2.0](http://www.apache.org/licenses/LICENSE-2.0).

*jQuery JSON Tag Editor* adds a separation between the visual representation of a tag and the tag itself. Tags are plain JavaScript objects with a `value` attribute
that is its visual representation in the tag editor. `value` plus any other properties that the tag object may have are all stored as
[data attributes](https://developer.mozilla.org/en/docs/Web/Guide/HTML/Using_data_attributes) in each `<div class="tag-editor-tag">` element.

So, using the `addTag` public method, this:
```
$('#id').jsonTagEditor('addTag', '{"value": "Car", "tagType": "string", "category": "vehicle"}')
```

Produces the markup below:
```
<div class="tag-editor-tag" data-value="Car" data-tag-type="string" data-category="vehicle">Car</div>
```

If a string is provided as an argument then an object with only the `value` property is created. This is the case when tags are manually typed into the editor.

Features added:
---------------
* Tags are complex objects: what you see in the editor is the property `value`, but you can add arbitrary data to your tags
* Tag object properties are stored as data attributes in their corresponding `<div>` element
* A new option `maxTagLength` can ellipsify tags while keeping the original value in `data-value`
* Multiple tags when pasting a multi-line text snippet, one per line, or split by tabs

Features removed:
-----------------
* Auto-grow width of `<input>` editors
* Support for cut: the original feature was Window-specific but buggy as tags weren’t put in the clipboard
* `removeDuplicates`: because tags aren’t strings it was the simplest way to deal with this issue
* The `delimiter` is hard-coded to `\t` and `\n`

__[Visit the demo page for the full documentation](https://alfonsomunozpomer.github.io/jsontageditor/demo.html).__

---

What follows are the original contents of jQuery-tagEditor’s README.md file:

jQuery-tagEditor
================

A powerful and lightweight tag editor plugin for jQuery.
A powerful and lightweight tag editor plugin for jQuery based on jQuery-tagEditor by Pixabay

Compatible with jQuery 1.7.0+ in Firefox, Safari, Chrome, Opera, Internet Explorer 8+. IE7 technically works, but no care has gone into CSS/layout bugs.
Released under the MIT License: http://www.opensource.org/licenses/mit-license.php
Expand Down
225 changes: 125 additions & 100 deletions demo.html

Large diffs are not rendered by default.

62 changes: 62 additions & 0 deletions jquery.json-tag-editor.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,62 @@
.noselect {
-webkit-touch-callout: none; /* iOS Safari */
-webkit-user-select: none; /* Chrome/Safari/Opera */
-khtml-user-select: none; /* Konqueror */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* Internet Explorer/Edge */
user-select: none; /* Non-prefixed version, currently
not supported by any browser */
}

.json-tag-editor-spacer::selection {
background: transparent; /* WebKit/Blink Browsers */
}
.json-tag-editor-spacer::-moz-selection {
background: transparent; /* Gecko Browsers */
}

/* surrounding tag container */
.json-tag-editor {
list-style-type: none; padding: 0 5px 0 0; margin: 0; overflow: hidden; border: 1px solid #eee; cursor: text;
font: normal 14px sans-serif; color: #555; background: #fff; line-height: 20px;
}

/* core styles usually need no change */
.json-tag-editor li { display: block; float: left; overflow: hidden; margin: 3px 0; }
.json-tag-editor div { float: left; padding: 0 4px; }
.json-tag-editor .placeholder { padding: 0 8px; color: #bbb; }
.json-tag-editor .json-tag-editor-spacer { padding: 0; width: 8px; overflow: hidden; color: transparent; background: none; }
.json-tag-editor input {
vertical-align: inherit; border: 0; outline: none; padding: 0; margin: 0; cursor: text;
font-family: inherit; font-weight: inherit; font-size: inherit; font-style: inherit;
box-shadow: none; background: none; color: #444;
}
/* hide original input field or textarea visually to allow tab navigation */
.json-tag-editor-hidden-src { position: absolute !important; left: -99999px; }
/* hide IE10 "clear field" X */
.json-tag-editor ::-ms-clear { display: none; }

/* tag style */
.json-tag-editor .json-tag-editor-tag {
padding-left: 5px; color: #46799b; background: #e0eaf1; white-space: nowrap;
overflow: hidden; cursor: pointer; border-radius: 2px 0 0 2px;
}

/* delete icon */
.json-tag-editor .json-tag-editor-delete { background: #e0eaf1; cursor: pointer; border-radius: 0 2px 2px 0; padding-left: 3px; padding-right: 4px; }
.json-tag-editor .json-tag-editor-delete i { line-height: 18px; display: inline-block; }
.json-tag-editor .json-tag-editor-delete i:before { font-size: 16px; color: #8ba7ba; content: "×"; font-style: normal; }
.json-tag-editor .json-tag-editor-delete:hover i:before { color: #d65454; }
.json-tag-editor .json-tag-editor-tag.active+.json-tag-editor-delete, .json-tag-editor .json-tag-editor-tag.active+.json-tag-editor-delete i { visibility: hidden; cursor: text; }

.json-tag-editor .json-tag-editor-tag.active { background: none !important; }

/* jQuery UI autocomplete - code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css */
.ui-autocomplete { position: absolute; top: 0; left: 0; cursor: default; font-size: 14px; }
.ui-front { z-index: 9999; }
.ui-menu { list-style: none; padding: 1px; margin: 0; display: block; outline: none; }
.ui-menu .ui-menu-item a { text-decoration: none; display: block; padding: 2px .4em; line-height: 1.4; min-height: 0; /* support: IE7 */ }
.ui-widget-content { border: 1px solid #bbb; background: #fff; color: #555; }
.ui-widget-content a { color: #46799b; }
.ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { background: #e0eaf1; }
.ui-helper-hidden-accessible { display: none; }
Loading