1
0
mirror of https://github.com/owncloud/bookmarks.git synced 2025-02-26 23:54:25 +01:00

First version of Bookmark popup enhanced. Need more work

This commit is contained in:
Brice Maron 2012-06-26 17:43:03 +02:00
parent c0c1d49a04
commit 8d59e3b9f0
8 changed files with 1050 additions and 14 deletions

View File

@ -27,7 +27,40 @@
OCP\User::checkLoggedIn();
OCP\App::checkAppEnabled('bookmarks');
if(!isset($_GET['url']) || trim($_GET['url']) == '') {
header("HTTP/1.0 404 Not Found");
$tmpl = new OCP\Template( '', '404', 'guest' );
$tmpl->printPage();
exit;
}
require_once('bookmarksHelper.php');
addBookmark($_GET['url'], '', 'Read-Later');
include 'templates/addBm.php';
if(isset($_POST['url'])) {
addBookmark($_POST['url'], '', 'Read-Later');
}
OCP\Util::addscript('bookmarks','tag-it');
OCP\Util::addscript('bookmarks','addBm');
OCP\Util::addStyle('bookmarks', 'bookmarks');
OCP\Util::addStyle('bookmarks', 'jquery.tagit');
$bm = array('title'=>'hello world',
'url'=> $_GET['url'],
'tags'=> array('@admin','music','test'),
'desc'=>'A fancy description',
'is_public'=>1,
);
//Find All Tags
$qtags = OC_Bookmarks_Bookmarks::findTags();
$tags = array();
foreach($qtags as $tag) {
$tags[] = $tag['tag'];
}
$tmpl = new OCP\Template( 'bookmarks', 'addBm', 'empty' );
$tmpl->assign('bookmark', $bm);
$tmpl->assign('tags', json_encode($tags), false);
$tmpl->printPage();

View File

@ -85,3 +85,67 @@
display: none;
margin-left: 5px;
}
#addBm {
background: none repeat scroll 0 0 #F8F8F8;
border-radius: 0.5em 0.5em 0.5em 0.5em;
color: #555555;
margin: 1em;
padding: 0.5em 1em;
text-shadow: 0 1px 0 #FFFFFF;
width: 500px;
}
.bm_desc {
width:90%;
}
#addBm h1 {
font-weight: bold;
border-bottom: 1px solid #BABABA;
}
#addBm #url {
display:none;
}
#addBm fieldset > ul > li {
margin-top: 1em;
}
#addBm label {
display:block;
width:100%;
}
#addBm #is_public_label {
display: inline;
}
#addBm fieldset input[type="text"], #addBm textarea {
width:100%;
}
#addBm textarea{
min-width:250px;
/* min-height: 70px; */
}
#addBm #close_btn
{
/* background-color: #EEEEEE; */
height: 18px;
margin: -20px 0 0;
padding: 1px;
float:right;
width: 19px;
}
#addBm .submit {
float: right;
}
#addBm ul.tagit { background:white; }
#addBm input.ui-autocomplete-input{
box-shadow:none;
}
.ui-autocomplete {
/* background: none repeat scroll 0 0 #DEE7F8; */
}

110
css/jquery.tagit.css Normal file
View File

@ -0,0 +1,110 @@
ul.tagit {
padding: 1px 5px;
overflow: auto;
margin-left: inherit; /* usually we don't want the regular ul margins. */
margin-right: inherit;
}
ul.tagit li {
display: block;
float: left;
margin: 2px 5px 2px 0;
}
ul.tagit li.tagit-choice {
padding: .2em 18px .2em .5em;
position: relative;
line-height: inherit;
}
ul.tagit li.tagit-new {
padding: .25em 4px .25em 0;
}
ul.tagit li.tagit-choice a.tagit-label {
cursor: pointer;
text-decoration: none;
}
ul.tagit li.tagit-choice .close {
cursor: pointer;
position: absolute;
right: .1em;
top: 50%;
margin-top: -8px;
}
/* used for some custom themes that don't need image icons */
ul.tagit li.tagit-choice .close .text-icon {
display: none;
}
ul.tagit li.tagit-choice input {
display: block;
float: left;
margin: 2px 5px 2px 0;
}
ul.tagit input[type="text"] {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border: none;
margin: 0;
padding: 0;
width: inherit;
background-color: inherit;
outline: none;
}
/***** ZENDESK ***/
/* Optional scoped theme for tag-it which mimics the zendesk widget. */
ul.tagit {
border-style: solid;
border-width: 1px;
border-color: #C6C6C6;
background: inherit;
}
ul.tagit li.tagit-choice {
-moz-border-radius: 6px;
border-radius: 6px;
-webkit-border-radius: 6px;
border: 1px solid #CAD8F3;
background: none;
background-color: #DEE7F8;
color: #555;
font-weight: normal;
}
ul.tagit li.tagit-choice a.close {
text-decoration: none;
}
ul.tagit li.tagit-choice .close {
right: .4em;
}
ul.tagit li.tagit-choice .ui-icon {
display: none;
}
ul.tagit li.tagit-choice .close .text-icon {
display: inline;
font-family: arial, sans-serif;
font-size: 16px;
line-height: 16px;
color: #777;
}
ul.tagit li.tagit-choice:hover, ul.tagit li.tagit-choice.remove {
background-color: #bbcef1;
border-color: #6d95e0;
}
ul.tagit li.tagit-choice a.tagLabel:hover,
ul.tagit li.tagit-choice a.close .text-icon:hover {
color: #222;
}
ul.tagit input[type="text"] {
color: #333333;
background: none;
}

View File

@ -1,5 +1,14 @@
$(document).ready(function() {
$('#bookmark_add_submit').click(addBookmark);
$('#url-ro img').click(editUrl);
$('#url').keypress(changeUrl);
$('#addBm').submit(bookletSubmit);
$('#tags').tagit({
allowSpaces: true,
availableTags: sampleTags,
itemName: 'item',
fieldName: 'tags',
});
});
function addBookmark(event) {
@ -13,4 +22,21 @@ function addBookmark(event) {
window.close();
}
});
}
function editUrl(event) {
$('#url').slideToggle();
}
function changeUrl(event) {
$('#url-ro code').text($('#url').val());
}
function bookletSubmit(event) {
event.preventDefault();
$.ajax({
type: 'POST',
url: $('#addBm').attr('action'),
data: $('#addBm').serialize(),
success: function(data){
self.close();
}
});
}

759
js/tag-it.js Normal file
View File

@ -0,0 +1,759 @@
/*
* jQuery UI Tag-it!
*
* @version v2.0 (06/2011)
*
* Copyright 2011, Levy Carneiro Jr.
* Released under the MIT license.
* http://aehlke.github.com/tag-it/LICENSE
*
* Homepage:
* http://aehlke.github.com/tag-it/
*
* Authors:
* Levy Carneiro Jr.
* Martin Rehfeld
* Tobias Schmidt
* Skylar Challand
* Alex Ehlke
*
* Maintainer:
* Alex Ehlke - Twitter: @aehlke
*
* Dependencies:
* jQuery v1.4+
* jQuery UI v1.8+
*/
(function($) {
$.widget('ui.tagit', {
options: {
itemName : 'item',
fieldName : 'tags',
availableTags : [],
tagSource : null,
removeConfirmation: false,
caseSensitive : true,
// When enabled, quotes are not neccesary
// for inputting multi-word tags.
allowSpaces: false,
// The below options are for using a single field instead of several
// for our form values.
//
// When enabled, will use a single hidden field for the form,
// rather than one per tag. It will delimit tags in the field
// with singleFieldDelimiter.
//
// The easiest way to use singleField is to just instantiate tag-it
// on an INPUT element, in which case singleField is automatically
// set to true, and singleFieldNode is set to that element. This
// way, you don't need to fiddle with these options.
singleField: false,
singleFieldDelimiter: ',',
// Set this to an input DOM node to use an existing form field.
// Any text in it will be erased on init. But it will be
// populated with the text of tags as they are created,
// delimited by singleFieldDelimiter.
//
// If this is not set, we create an input node for it,
// with the name given in settings.fieldName,
// ignoring settings.itemName.
singleFieldNode: null,
// Optionally set a tabindex attribute on the input that gets
// created for tag-it.
tabIndex: null,
// Event callbacks.
onTagAdded : null,
onTagRemoved: null,
onTagClicked: null
},
_create: function() {
// for handling static scoping inside callbacks
var that = this;
// There are 2 kinds of DOM nodes this widget can be instantiated on:
// 1. UL, OL, or some element containing either of these.
// 2. INPUT, in which case 'singleField' is overridden to true,
// a UL is created and the INPUT is hidden.
if (this.element.is('input')) {
this.tagList = $('<ul></ul>').insertAfter(this.element);
this.options.singleField = true;
this.options.singleFieldNode = this.element;
this.element.css('display', 'none');
} else {
this.tagList = this.element.find('ul, ol').andSelf().last();
}
this._tagInput = $('<input type="text">').addClass('ui-widget-content');
if (this.options.tabIndex) {
this._tagInput.attr('tabindex', this.options.tabIndex);
}
this.options.tagSource = this.options.tagSource || function(search, showChoices) {
var filter = search.term.toLowerCase();
var choices = $.grep(that.options.availableTags, function(element) {
// Only match autocomplete options that begin with the search term.
// (Case insensitive.)
return (element.toLowerCase().indexOf(filter) === 0);
});
showChoices(that._subtractArray(choices, that.assignedTags()));
};
this.tagList
.addClass('tagit')
.addClass('ui-widget ui-widget-content ui-corner-all')
// Create the input field.
.append($('<li class="tagit-new"></li>').append(this._tagInput))
.click(function(e) {
var target = $(e.target);
if (target.hasClass('tagit-label')) {
that._trigger('onTagClicked', e, target.closest('.tagit-choice'));
} else {
// Sets the focus() to the input field, if the user
// clicks anywhere inside the UL. This is needed
// because the input field needs to be of a small size.
that._tagInput.focus();
}
});
// Add existing tags from the list, if any.
this.tagList.children('li').each(function() {
if (!$(this).hasClass('tagit-new')) {
that.createTag($(this).html(), $(this).attr('class'));
$(this).remove();
}
});
// Single field support.
if (this.options.singleField) {
if (this.options.singleFieldNode) {
// Add existing tags from the input field.
var node = $(this.options.singleFieldNode);
var tags = node.val().split(this.options.singleFieldDelimiter);
node.val('');
$.each(tags, function(index, tag) {
that.createTag(tag);
});
} else {
// Create our single field input after our list.
this.options.singleFieldNode = this.tagList.after('<input type="hidden" style="display:none;" value="" name="' + this.options.fieldName + '">');
}
}
// Events.
this._tagInput
.keydown(function(event) {
// Backspace is not detected within a keypress, so it must use keydown.
if (event.which == $.ui.keyCode.BACKSPACE && that._tagInput.val() === '') {
var tag = that._lastTag();
if (!that.options.removeConfirmation || tag.hasClass('remove')) {
// When backspace is pressed, the last tag is deleted.
that.removeTag(tag);
} else if (that.options.removeConfirmation) {
tag.addClass('remove ui-state-highlight');
}
} else if (that.options.removeConfirmation) {
that._lastTag().removeClass('remove ui-state-highlight');
}
// Comma/Space/Enter are all valid delimiters for new tags,
// except when there is an open quote or if setting allowSpaces = true.
// Tab will also create a tag, unless the tag input is empty, in which case it isn't caught.
if (
event.which == $.ui.keyCode.COMMA ||
event.which == $.ui.keyCode.ENTER ||
(
event.which == $.ui.keyCode.TAB &&
that._tagInput.val() !== ''
) ||
(
event.which == $.ui.keyCode.SPACE &&
that.options.allowSpaces !== true &&
(
$.trim(that._tagInput.val()).replace( /^s*/, '' ).charAt(0) != '"' ||
(
$.trim(that._tagInput.val()).charAt(0) == '"' &&
$.trim(that._tagInput.val()).charAt($.trim(that._tagInput.val()).length - 1) == '"' &&
$.trim(that._tagInput.val()).length - 1 !== 0
)
)
)
) {
event.preventDefault();
that.createTag(that._cleanedInput());
// The autocomplete doesn't close automatically when TAB is pressed.
// So let's ensure that it closes.
that._tagInput.autocomplete('close');
}
}).blur(function(e){
// Create a tag when the element loses focus (unless it's empty).
that.createTag(that._cleanedInput());
});
// Autocomplete.
if (this.options.availableTags || this.options.tagSource) {
this._tagInput.autocomplete({
source: this.options.tagSource,
select: function(event, ui) {
// Delete the last tag if we autocomplete something despite the input being empty
// This happens because the input's blur event causes the tag to be created when
// the user clicks an autocomplete item.
// The only artifact of this is that while the user holds down the mouse button
// on the selected autocomplete item, a tag is shown with the pre-autocompleted text,
// and is changed to the autocompleted text upon mouseup.
if (that._tagInput.val() === '') {
that.removeTag(that._lastTag(), false);
}
that.createTag(ui.item.value);
// Preventing the tag input to be updated with the chosen value.
return false;
}
});
}
},
_cleanedInput: function() {
// Returns the contents of the tag input, cleaned and ready to be passed to createTag
return $.trim(this._tagInput.val().replace(/^"(.*)"$/, '$1'));
},
_lastTag: function() {
return this.tagList.children('.tagit-choice:last');
},
assignedTags: function() {
// Returns an array of tag string values
var that = this;
var tags = [];
if (this.options.singleField) {
tags = $(this.options.singleFieldNode).val().split(this.options.singleFieldDelimiter);
if (tags[0] === '') {
tags = [];
}
} else {
this.tagList.children('.tagit-choice').each(function() {
tags.push(that.tagLabel(this));
});
}
return tags;
},
_updateSingleTagsField: function(tags) {
// Takes a list of tag string values, updates this.options.singleFieldNode.val to the tags delimited by this.options.singleFieldDelimiter
$(this.options.singleFieldNode).val(tags.join(this.options.singleFieldDelimiter));
},
_subtractArray: function(a1, a2) {
var result = [];
for (var i = 0; i < a1.length; i++) {
if ($.inArray(a1[i], a2) == -1) {
result.push(a1[i]);
}
}
return result;
},
tagLabel: function(tag) {
// Returns the tag's string label.
if (this.options.singleField) {
return $(tag).children('.tagit-label').text();
} else {
return $(tag).children('input').val();
}
},
_isNew: function(value) {
var that = this;
var isNew = true;
this.tagList.children('.tagit-choice').each(function(i) {
if (that._formatStr(value) == that._formatStr(that.tagLabel(this))) {
isNew = false;
return;
}
});
return isNew;
},
_formatStr: function(str) {
if (this.options.caseSensitive) {
return str;
}
return $.trim(str.toLowerCase());
},
createTag: function(value, additionalClass) {
that = this;
// Automatically trims the value of leading and trailing whitespace.
value = $.trim(value);
if (!this._isNew(value) || value === '') {
return false;
}
var label = $(this.options.onTagClicked ? '<a class="tagit-label"></a>' : '<span class="tagit-label"></span>').text(value);
// Create tag.
var tag = $('<li></li>')
.addClass('tagit-choice ui-widget-content ui-state-default ui-corner-all')
.addClass(additionalClass)
.append(label);
// Button for removing the tag.
var removeTagIcon = $('<span></span>')
.addClass('ui-icon ui-icon-close');
var removeTag = $('<a><span class="text-icon">\xd7</span></a>') // \xd7 is an X
.addClass('close')
.append(removeTagIcon)
.click(function(e) {
// Removes a tag when the little 'x' is clicked.
that.removeTag(tag);
});
tag.append(removeTag);
// Unless options.singleField is set, each tag has a hidden input field inline.
if (this.options.singleField) {
var tags = this.assignedTags();
tags.push(value);
this._updateSingleTagsField(tags);
} else {
var escapedValue = label.html();
tag.append('<input type="hidden" style="display:none;" value="' + escapedValue + '" name="' + this.options.itemName + '[' + this.options.fieldName + '][]">');
}
this._trigger('onTagAdded', null, tag);
// Cleaning the input.
this._tagInput.val('');
// insert tag
this._tagInput.parent().before(tag);
},
removeTag: function(tag, animate) {
if (typeof animate === 'undefined') { animate = true; }
tag = $(tag);
this._trigger('onTagRemoved', null, tag);
if (this.options.singleField) {
var tags = this.assignedTags();
var removedTagLabel = this.tagLabel(tag);
tags = $.grep(tags, function(el){
return el != removedTagLabel;
});
this._updateSingleTagsField(tags);
}
// Animate the removal.
if (animate) {
tag.fadeOut('fast').hide('blind', {direction: 'horizontal'}, 'fast', function(){
tag.remove();
}).dequeue();
} else {
tag.remove();
}
},
removeAll: function() {
// Removes all tags. Takes an optional `animate` argument.
var that = this;
this.tagList.children('.tagit-choice').each(function(index, tag) {
that.removeTag(tag, false);
});
}
});
})(jQuery);
/*
* jQuery UI Tag-it!
*
* @version v2.0 (06/2011)
*
* Copyright 2011, Levy Carneiro Jr.
* Released under the MIT license.
* http://aehlke.github.com/tag-it/LICENSE
*
* Homepage:
* http://aehlke.github.com/tag-it/
*
* Authors:
* Levy Carneiro Jr.
* Martin Rehfeld
* Tobias Schmidt
* Skylar Challand
* Alex Ehlke
*
* Maintainer:
* Alex Ehlke - Twitter: @aehlke
*
* Dependencies:
* jQuery v1.4+
* jQuery UI v1.8+
*/
(function($) {
$.widget('ui.tagit', {
options: {
itemName : 'item',
fieldName : 'tags',
availableTags : [],
tagSource : null,
removeConfirmation: false,
caseSensitive : true,
// When enabled, quotes are not neccesary
// for inputting multi-word tags.
allowSpaces: false,
// The below options are for using a single field instead of several
// for our form values.
//
// When enabled, will use a single hidden field for the form,
// rather than one per tag. It will delimit tags in the field
// with singleFieldDelimiter.
//
// The easiest way to use singleField is to just instantiate tag-it
// on an INPUT element, in which case singleField is automatically
// set to true, and singleFieldNode is set to that element. This
// way, you don't need to fiddle with these options.
singleField: false,
singleFieldDelimiter: ',',
// Set this to an input DOM node to use an existing form field.
// Any text in it will be erased on init. But it will be
// populated with the text of tags as they are created,
// delimited by singleFieldDelimiter.
//
// If this is not set, we create an input node for it,
// with the name given in settings.fieldName,
// ignoring settings.itemName.
singleFieldNode: null,
// Optionally set a tabindex attribute on the input that gets
// created for tag-it.
tabIndex: null,
// Event callbacks.
onTagAdded : null,
onTagRemoved: null,
onTagClicked: null
},
_create: function() {
// for handling static scoping inside callbacks
var that = this;
// There are 2 kinds of DOM nodes this widget can be instantiated on:
// 1. UL, OL, or some element containing either of these.
// 2. INPUT, in which case 'singleField' is overridden to true,
// a UL is created and the INPUT is hidden.
if (this.element.is('input')) {
this.tagList = $('<ul></ul>').insertAfter(this.element);
this.options.singleField = true;
this.options.singleFieldNode = this.element;
this.element.css('display', 'none');
} else {
this.tagList = this.element.find('ul, ol').andSelf().last();
}
this._tagInput = $('<input type="text">').addClass('ui-widget-content');
if (this.options.tabIndex) {
this._tagInput.attr('tabindex', this.options.tabIndex);
}
this.options.tagSource = this.options.tagSource || function(search, showChoices) {
var filter = search.term.toLowerCase();
var choices = $.grep(that.options.availableTags, function(element) {
// Only match autocomplete options that begin with the search term.
// (Case insensitive.)
return (element.toLowerCase().indexOf(filter) === 0);
});
showChoices(that._subtractArray(choices, that.assignedTags()));
};
this.tagList
.addClass('tagit')
.addClass('ui-widget ui-widget-content ui-corner-all')
// Create the input field.
.append($('<li class="tagit-new"></li>').append(this._tagInput))
.click(function(e) {
var target = $(e.target);
if (target.hasClass('tagit-label')) {
that._trigger('onTagClicked', e, target.closest('.tagit-choice'));
} else {
// Sets the focus() to the input field, if the user
// clicks anywhere inside the UL. This is needed
// because the input field needs to be of a small size.
that._tagInput.focus();
}
});
// Add existing tags from the list, if any.
this.tagList.children('li').each(function() {
if (!$(this).hasClass('tagit-new')) {
that.createTag($(this).html(), $(this).attr('class'));
$(this).remove();
}
});
// Single field support.
if (this.options.singleField) {
if (this.options.singleFieldNode) {
// Add existing tags from the input field.
var node = $(this.options.singleFieldNode);
var tags = node.val().split(this.options.singleFieldDelimiter);
node.val('');
$.each(tags, function(index, tag) {
that.createTag(tag);
});
} else {
// Create our single field input after our list.
this.options.singleFieldNode = this.tagList.after('<input type="hidden" style="display:none;" value="" name="' + this.options.fieldName + '">');
}
}
// Events.
this._tagInput
.keydown(function(event) {
// Backspace is not detected within a keypress, so it must use keydown.
if (event.which == $.ui.keyCode.BACKSPACE && that._tagInput.val() === '') {
var tag = that._lastTag();
if (!that.options.removeConfirmation || tag.hasClass('remove')) {
// When backspace is pressed, the last tag is deleted.
that.removeTag(tag);
} else if (that.options.removeConfirmation) {
tag.addClass('remove ui-state-highlight');
}
} else if (that.options.removeConfirmation) {
that._lastTag().removeClass('remove ui-state-highlight');
}
// Comma/Space/Enter are all valid delimiters for new tags,
// except when there is an open quote or if setting allowSpaces = true.
// Tab will also create a tag, unless the tag input is empty, in which case it isn't caught.
if (
event.which == $.ui.keyCode.COMMA ||
event.which == $.ui.keyCode.ENTER ||
(
event.which == $.ui.keyCode.TAB &&
that._tagInput.val() !== ''
) ||
(
event.which == $.ui.keyCode.SPACE &&
that.options.allowSpaces !== true &&
(
$.trim(that._tagInput.val()).replace( /^s*/, '' ).charAt(0) != '"' ||
(
$.trim(that._tagInput.val()).charAt(0) == '"' &&
$.trim(that._tagInput.val()).charAt($.trim(that._tagInput.val()).length - 1) == '"' &&
$.trim(that._tagInput.val()).length - 1 !== 0
)
)
)
) {
event.preventDefault();
that.createTag(that._cleanedInput());
// The autocomplete doesn't close automatically when TAB is pressed.
// So let's ensure that it closes.
that._tagInput.autocomplete('close');
}
}).blur(function(e){
// Create a tag when the element loses focus (unless it's empty).
that.createTag(that._cleanedInput());
});
// Autocomplete.
if (this.options.availableTags || this.options.tagSource) {
this._tagInput.autocomplete({
source: this.options.tagSource,
select: function(event, ui) {
// Delete the last tag if we autocomplete something despite the input being empty
// This happens because the input's blur event causes the tag to be created when
// the user clicks an autocomplete item.
// The only artifact of this is that while the user holds down the mouse button
// on the selected autocomplete item, a tag is shown with the pre-autocompleted text,
// and is changed to the autocompleted text upon mouseup.
if (that._tagInput.val() === '') {
that.removeTag(that._lastTag(), false);
}
that.createTag(ui.item.value);
// Preventing the tag input to be updated with the chosen value.
return false;
}
});
}
},
_cleanedInput: function() {
// Returns the contents of the tag input, cleaned and ready to be passed to createTag
return $.trim(this._tagInput.val().replace(/^"(.*)"$/, '$1'));
},
_lastTag: function() {
return this.tagList.children('.tagit-choice:last');
},
assignedTags: function() {
// Returns an array of tag string values
var that = this;
var tags = [];
if (this.options.singleField) {
tags = $(this.options.singleFieldNode).val().split(this.options.singleFieldDelimiter);
if (tags[0] === '') {
tags = [];
}
} else {
this.tagList.children('.tagit-choice').each(function() {
tags.push(that.tagLabel(this));
});
}
return tags;
},
_updateSingleTagsField: function(tags) {
// Takes a list of tag string values, updates this.options.singleFieldNode.val to the tags delimited by this.options.singleFieldDelimiter
$(this.options.singleFieldNode).val(tags.join(this.options.singleFieldDelimiter));
},
_subtractArray: function(a1, a2) {
var result = [];
for (var i = 0; i < a1.length; i++) {
if ($.inArray(a1[i], a2) == -1) {
result.push(a1[i]);
}
}
return result;
},
tagLabel: function(tag) {
// Returns the tag's string label.
if (this.options.singleField) {
return $(tag).children('.tagit-label').text();
} else {
return $(tag).children('input').val();
}
},
_isNew: function(value) {
var that = this;
var isNew = true;
this.tagList.children('.tagit-choice').each(function(i) {
if (that._formatStr(value) == that._formatStr(that.tagLabel(this))) {
isNew = false;
return;
}
});
return isNew;
},
_formatStr: function(str) {
if (this.options.caseSensitive) {
return str;
}
return $.trim(str.toLowerCase());
},
createTag: function(value, additionalClass) {
that = this;
// Automatically trims the value of leading and trailing whitespace.
value = $.trim(value);
if (!this._isNew(value) || value === '') {
return false;
}
var label = $(this.options.onTagClicked ? '<a class="tagit-label"></a>' : '<span class="tagit-label"></span>').text(value);
// Create tag.
var tag = $('<li></li>')
.addClass('tagit-choice ui-widget-content ui-state-default ui-corner-all')
.addClass(additionalClass)
.append(label);
// Button for removing the tag.
var removeTagIcon = $('<span></span>')
.addClass('ui-icon ui-icon-close');
var removeTag = $('<a><span class="text-icon">\xd7</span></a>') // \xd7 is an X
.addClass('close')
.append(removeTagIcon)
.click(function(e) {
// Removes a tag when the little 'x' is clicked.
that.removeTag(tag);
});
tag.append(removeTag);
// Unless options.singleField is set, each tag has a hidden input field inline.
if (this.options.singleField) {
var tags = this.assignedTags();
tags.push(value);
this._updateSingleTagsField(tags);
} else {
var escapedValue = label.html();
tag.append('<input type="hidden" style="display:none;" value="' + escapedValue + '" name="' + this.options.itemName + '[' + this.options.fieldName + '][]">');
}
this._trigger('onTagAdded', null, tag);
// Cleaning the input.
this._tagInput.val('');
// insert tag
this._tagInput.parent().before(tag);
},
removeTag: function(tag, animate) {
if (typeof animate === 'undefined') { animate = true; }
tag = $(tag);
this._trigger('onTagRemoved', null, tag);
if (this.options.singleField) {
var tags = this.assignedTags();
var removedTagLabel = this.tagLabel(tag);
tags = $.grep(tags, function(el){
return el != removedTagLabel;
});
this._updateSingleTagsField(tags);
}
// Animate the removal.
if (animate) {
tag.fadeOut('fast').hide('blind', {direction: 'horizontal'}, 'fast', function(){
tag.remove();
}).dequeue();
} else {
tag.remove();
}
},
removeAll: function() {
// Removes all tags. Takes an optional `animate` argument.
var that = this;
this.tagList.children('.tagit-choice').each(function(index, tag) {
that.removeTag(tag, false);
});
}
});
})(jQuery);

View File

@ -25,6 +25,14 @@
*/
class OC_Bookmarks_Bookmarks{
/**
* @brief Finds all tags for bookmarks
*/
public static function findTags($offset = 0, $limit = 10){
$query = OCP\DB::prepare('SELECT distinct tag from *PREFIX*bookmarks_tags LIMIT '.$offset.', '.$limit);
$tags = $query->execute()->fetchAll();
return $tags;
}
/**
* @brief Finds all bookmarks, matching the filter
* @param offset result offset

View File

@ -1,11 +1,47 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Read later - ownCloud</title>
</head>
<body>
<div class="message"><h1>Saved!</h1></div>
<a href="javascript:self.close()" >Close the window</a>
</body>
</html>
<form id="addBm" method="post" action="<?php OCP\Util::linkToAbsolute('bookmarks', 'addBm.php');?>">
<h1><?php echo $l->t('Add a bookmark');?></h1>
<div id="close_btn"><a href="javascript:self.close()" class="ui-icon ui-icon-closethick"><?php echo $l->t('Close');?></a></div>
<fieldset class="bm_desc">
<ul>
<li>
<label for="title"><strong><?php echo $l->t('Title');?></strong></label>
<input type="text" name="title" id="title" value="<?php echo $_['bookmark']['title']; ?>" placeholder="<?php echo $l->t('The title of the page');?>" />
</li>
<li>
<label for="url"><strong><?php echo $l->t('Address');?></strong></label>
<div id="url-ro">
<code><?php echo $_['bookmark']['url']; ?></code>
<img class="svg action" src="<?php echo image_path('core','actions/rename.svg')?>"
alt="<?php echo $l->t('Edit');?>" title="<?php echo $l->t('Edit');?>" />
</div>
<input type="text" name="url" id="url" value="<?php echo $_['bookmark']['url']; ?>" placeholder="<?php echo $l->t('The address of the page');?>" />
</li>
<li>
<label for="tags"><strong><?php echo $l->t('Tags');?></strong></label>
<ul id="tags" >
<?php foreach($_['bookmark']['tags'] as $tag):?>
<li><?php echo $tag;?></li>
<?php endforeach;?>
</ul>
</li>
<li>
<label for="desc"><strong><?php echo $l->t('Description');?></strong></label>
<textarea name="desc" id="desc" value="<?php echo $_['bookmark']['desc']; ?>" placeholder="<?php echo $l->t('Description of the page');?>"></textarea>
</li>
<li>
<input type="submit" class="submit" value="<?php echo $l->t("Submit");?>" />
<input type="checkbox" <?php if($_['bookmark']['is_public']){echo 'checked="checked"';} ?> id="is_public" name="is_public">
<label for="is_public" id="is_public_label"><?php echo $l->t("Make this link public");?></label>
</li>
</ul>
</fieldset>
<script>
var sampleTags = <?php echo $_['tags'];?>;
</script>
</form>

View File

@ -3,6 +3,6 @@
function createBookmarklet() {
$l = OC_L10N::get('bookmarks');
echo '<small>' . $l->t('Drag this to your browser bookmarks and click it, when you want to bookmark a webpage quickly:') . '</small>'
. '<a class="button bookmarklet" href="javascript:(function(){var a=window,b=document,c=encodeURIComponent,d=a.open(\'' . OCP\Util::linkToAbsolute('bookmarks', 'addBm.php') . '?output=popup&url=\'+c(b.location),\'bkmk_popup\',\'left=\'+((a.screenX||a.screenLeft)+10)+\',top=\'+((a.screenY||a.screenTop)+10)+\',height=230px,width=230px,resizable=1,alwaysRaised=1\');a.setTimeout(function(){d.focus()},300);})();">'
. '<a class="button bookmarklet" href="javascript:(function(){var a=window,b=document,c=encodeURIComponent,d=a.open(\'' . OCP\Util::linkToAbsolute('bookmarks', 'addBm.php') . '?output=popup&url=\'+c(b.location),\'bkmk_popup\',\'left=\'+((a.screenX||a.screenLeft)+10)+\',top=\'+((a.screenY||a.screenTop)+10)+\',height=400px,width=550px,resizable=1,alwaysRaised=1\');a.setTimeout(function(){d.focus()},300);})();">'
. $l->t('Read later') . '</a>';
}