mirror of
https://github.com/humhub/humhub.git
synced 2025-04-21 23:52:04 +02:00
Chng: Removed humhub\modules\space\widgets\Picker which is deprecated since v1.2
This commit is contained in:
buddh4
parent
651e3bcdb4
commit
659b5727d0
@ -1,112 +0,0 @@
|
||||
<?php
|
||||
|
||||
/**
|
||||
* @link https://www.humhub.org/
|
||||
* @copyright Copyright (c) 2016 HumHub GmbH & Co. KG
|
||||
* @license https://www.humhub.com/licences
|
||||
*/
|
||||
|
||||
namespace humhub\modules\space\widgets;
|
||||
|
||||
use humhub\modules\space\models\Space;
|
||||
use Yii;
|
||||
use yii\base\Widget;
|
||||
use yii\helpers\Url;
|
||||
|
||||
/**
|
||||
* Picker displays a space picker instead of an input field.
|
||||
*
|
||||
* To use this widget, you may insert the following code in a view:
|
||||
* <pre>
|
||||
*
|
||||
* echo humhub\modules\space\widgets\Picker::widget([
|
||||
* 'inputId' => 'space_filter',
|
||||
* 'value' => $spaceGuidsString,
|
||||
* 'maxSpaces' => 3
|
||||
* ]);
|
||||
*
|
||||
* </pre>
|
||||
*
|
||||
* @since 0.5
|
||||
* @deprecated since version 1.2 use SpacePickerField instead
|
||||
* @author Luke
|
||||
*/
|
||||
class Picker extends Widget
|
||||
{
|
||||
/**
|
||||
* @var string The id of input element which should replaced
|
||||
*/
|
||||
public $inputId = '';
|
||||
|
||||
/**
|
||||
* JSON Search URL - default: /space/browse/search-json
|
||||
* The token -keywordPlaceholder- will replaced by the current search query.
|
||||
*
|
||||
* @var string the search url
|
||||
*/
|
||||
public $spaceSearchUrl = '';
|
||||
|
||||
/**
|
||||
* @var int the maximum of spaces
|
||||
*/
|
||||
public $maxSpaces = 10;
|
||||
|
||||
/**
|
||||
* @var \yii\base\Model the data model associated with this widget. (Optional)
|
||||
*/
|
||||
public $model = null;
|
||||
|
||||
/**
|
||||
* The name can contain square brackets (e.g. 'name[1]') which is used to collect tabular data input.
|
||||
* @var string the attribute associated with this widget. (Optional)
|
||||
*/
|
||||
public $attribute = null;
|
||||
|
||||
/**
|
||||
* @var string the initial value of comma separated space guids
|
||||
*/
|
||||
public $value = '';
|
||||
|
||||
/**
|
||||
* @var string placeholder message, when no space is set
|
||||
*/
|
||||
public $placeholder = null;
|
||||
|
||||
/**
|
||||
* Displays / Run the Widgets
|
||||
*/
|
||||
public function run()
|
||||
{
|
||||
// Try to get current field value, when model & attribute attributes are specified.
|
||||
if ($this->model != null && $this->attribute != null) {
|
||||
$attribute = $this->attribute;
|
||||
$this->value = $this->model->$attribute;
|
||||
}
|
||||
|
||||
if ($this->spaceSearchUrl == '')
|
||||
$this->spaceSearchUrl = Url::to(['/space/browse/search-json', 'keyword' => '-keywordPlaceholder-']);
|
||||
|
||||
if ($this->placeholder === null) {
|
||||
$this->placeholder = Yii::t('SpaceModule.chooser', 'Add {n,plural,=1{space} other{spaces}}', ['n' => $this->maxSpaces]);
|
||||
}
|
||||
|
||||
// Currently populated spaces
|
||||
$spaces = [];
|
||||
foreach (explode(",", $this->value) as $guid) {
|
||||
$space = Space::findOne(['guid' => trim($guid)]);
|
||||
if ($space != null) {
|
||||
$spaces[] = $space;
|
||||
}
|
||||
}
|
||||
|
||||
return $this->render('spacePicker', [
|
||||
'spaceSearchUrl' => $this->spaceSearchUrl,
|
||||
'maxSpaces' => $this->maxSpaces,
|
||||
'value' => $this->value,
|
||||
'spaces' => $spaces,
|
||||
'placeholder' => $this->placeholder,
|
||||
'inputId' => $this->inputId,
|
||||
]);
|
||||
}
|
||||
|
||||
}
|
||||
@ -1,27 +0,0 @@
|
||||
<?php
|
||||
|
||||
use humhub\modules\space\widgets\Image;
|
||||
use yii\helpers\Html;
|
||||
use yii\web\View;
|
||||
|
||||
$this->registerJsFile('@web-static/resources/space/spacepicker.js', ['position' => View::POS_END]);
|
||||
|
||||
// Resolve guids to space tags
|
||||
$selectedSpaces = '';
|
||||
foreach ($spaces as $space) {
|
||||
$name = Html::encode($space->name);
|
||||
$selectedSpaces .= '<li class="spaceInput" id="' . $space->guid . '">' . Image::widget(['space' => $space, 'width' => 24]) . ' ' . addslashes($name) . '<i class="fa fa-times-circle"></i></li>';
|
||||
}
|
||||
?>
|
||||
|
||||
<script <?= \humhub\libs\Html::nonce() ?>>
|
||||
$(function () {
|
||||
$('#<?= $inputId; ?>').spacepicker({
|
||||
inputId: '#<?= $inputId; ?>',
|
||||
maxSpaces: '<?= $maxSpaces; ?>',
|
||||
searchUrl: '<?= $spaceSearchUrl; ?>',
|
||||
currentValue: '<?= str_replace("\n", " \\", $selectedSpaces); ?>',
|
||||
placeholder: '<?= Html::encode($placeholder); ?>'
|
||||
});
|
||||
});
|
||||
</script>
|
||||
@ -1,174 +0,0 @@
|
||||
/**
|
||||
* Handling space chooser user input
|
||||
*/
|
||||
|
||||
$(document).ready(function () {
|
||||
|
||||
var chosen = []; // Array for visible space menu entries
|
||||
var arrPosition = ""; // Save the current position inside the chosen array
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Show and navigate through spaces depends on user input
|
||||
*/
|
||||
$('#space-menu-search').keyup(function (event) {
|
||||
|
||||
if (event.keyCode == 40) {
|
||||
|
||||
// set current array position
|
||||
if (arrPosition === "") {
|
||||
arrPosition = 1;
|
||||
} else if ((arrPosition) < chosen.length - 1) {
|
||||
arrPosition++;
|
||||
}
|
||||
|
||||
// remove selection from last space entry
|
||||
$('#space-menu-dropdown li ul li').removeClass('selected');
|
||||
|
||||
// add selection to the current space entry
|
||||
$('#space-menu-dropdown li ul li:eq(' + chosen[arrPosition] + ')').addClass('selected');
|
||||
|
||||
return false;
|
||||
|
||||
} else if (event.keyCode == 38) {
|
||||
|
||||
// set current array position
|
||||
if (arrPosition === "") {
|
||||
arrPosition = 1;
|
||||
} else if ((arrPosition) > 0) {
|
||||
arrPosition--;
|
||||
}
|
||||
|
||||
$('#space-menu-dropdown li ul li').removeClass('selected');
|
||||
|
||||
// add selection to the current space entry
|
||||
$('#space-menu-dropdown li ul li:eq(' + chosen[arrPosition] + ')').addClass('selected');
|
||||
|
||||
return false;
|
||||
|
||||
} else if (event.keyCode == 13) {
|
||||
|
||||
// check if one space is selected
|
||||
if ($('#space-menu-spaces li').hasClass("selected")) {
|
||||
|
||||
// move to selected space, by hitting enter
|
||||
window.location.href = $('#space-menu-dropdown li ul li.selected a').attr('href');
|
||||
}
|
||||
|
||||
} else {
|
||||
|
||||
// lowercase and save entered string in variable
|
||||
var input = $(this).val().toLowerCase();
|
||||
|
||||
if (input > 0) {
|
||||
// remove max-height property to hide the nicescroll scrollbar
|
||||
$('#space-menu-spaces').css({'max-height': 'none'});
|
||||
} else {
|
||||
// set max-height property to show the nicescroll scrollbar
|
||||
$('#space-menu-spaces').css({'max-height': '400px'});
|
||||
}
|
||||
|
||||
// empty variable and array
|
||||
chosen = [];
|
||||
arrPosition = "";
|
||||
|
||||
$("#space-menu-dropdown li ul li").each(function (index) {
|
||||
|
||||
// remove selected classes from all space entries
|
||||
$('#space-menu-dropdown li ul li').removeClass('selected');
|
||||
|
||||
|
||||
// lowercase and save space strings in variable
|
||||
var str = $(this).text().toLowerCase();
|
||||
|
||||
if (str.search(input) == -1) {
|
||||
// hide elements when not matched
|
||||
$(this).css('display', 'none');
|
||||
} else {
|
||||
// show elements when matched
|
||||
$(this).css('display', 'block');
|
||||
|
||||
// update array with the right li element
|
||||
chosen.push(index);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
|
||||
// add selection to the first space entry
|
||||
$('#space-menu-dropdown li ul li:eq(' + chosen[0] + ')').addClass('selected');
|
||||
|
||||
// check if entered string is empty or not
|
||||
if (input.length == 0) {
|
||||
// reset inputs
|
||||
resetSpaceSearch();
|
||||
} else {
|
||||
// show search reset icon
|
||||
$('#space-search-reset').fadeIn('fast');
|
||||
}
|
||||
|
||||
// remove hightlight
|
||||
$("#space-menu-dropdown li ul li").removeHighlight();
|
||||
|
||||
// add new highlight matching strings
|
||||
$("#space-menu-dropdown li ul li").highlight(input);
|
||||
|
||||
|
||||
}
|
||||
|
||||
//return event.returnValue;
|
||||
|
||||
});
|
||||
|
||||
/**
|
||||
* Disable enter key
|
||||
*/
|
||||
$('#space-menu-search').keypress(function (event) {
|
||||
if (event.keyCode == 13) {
|
||||
// deactivate the standard press event
|
||||
event.preventDefault();
|
||||
return false;
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
/**
|
||||
* Click handler to reset user input
|
||||
*/
|
||||
$('#space-search-reset').click(function () {
|
||||
resetSpaceSearch();
|
||||
});
|
||||
|
||||
/**
|
||||
* Reset user input
|
||||
*/
|
||||
function resetSpaceSearch() {
|
||||
|
||||
// fade out the cross icon
|
||||
$('#space-search-reset').fadeOut('fast');
|
||||
|
||||
// empty input field
|
||||
$('#space-menu-search').val('');
|
||||
|
||||
// set focus to input field
|
||||
$('#space-menu-search').focus();
|
||||
|
||||
$("#space-menu-dropdown li ul li").each(function () {
|
||||
|
||||
// show all space entries
|
||||
$(this).css('display', 'block');
|
||||
|
||||
// remove search result highlighting
|
||||
$("#space-menu-dropdown li ul li").removeHighlight();
|
||||
|
||||
// remove the curren tspace entry selection
|
||||
$('#space-menu-dropdown li ul li').removeClass('selected');
|
||||
|
||||
});
|
||||
|
||||
// set max-height property to show the nicescroll scrollbar
|
||||
$('#space-menu-spaces').css({'max-height': '400px'});
|
||||
}
|
||||
|
||||
});
|
||||
@ -1,352 +0,0 @@
|
||||
/*
|
||||
* SpacePicker
|
||||
* Version 1.0.0
|
||||
* Written by: Andreas Strobel
|
||||
*
|
||||
* @property String $inputId is the ID of the input HTML Element
|
||||
* @property Int $maxSpaces the maximum of users in this dropdown
|
||||
* @property String $spaceSearchUrl the url of the search, to find the spaces
|
||||
* @property String $currentValue is the current value of the parent field.
|
||||
* @property String $templates.inputStructure is the HTML structure to replace the original input element.
|
||||
*
|
||||
* License: MIT License - http://www.opensource.org/licenses/mit-license.php
|
||||
*/
|
||||
|
||||
|
||||
var chosen = "";
|
||||
var spaceCount = 0;
|
||||
|
||||
$.fn.spacepicker = function (options) {
|
||||
|
||||
// set standard options
|
||||
options = $.extend({
|
||||
inputId: "",
|
||||
maxSpaces: 0,
|
||||
searchUrl: "",
|
||||
placeholder: "",
|
||||
currentValue: "",
|
||||
}, options);
|
||||
|
||||
// add input structure template
|
||||
options = $.extend({
|
||||
templates: {
|
||||
inputStructure: '<div class="space_picker_container"><ul class="tag_input" id="space_tags"><li id="space_tag_input"><input type="text" id="space_input_field" class="tag_input_field" value="" autocomplete="off" placeholder="'+options.placeholder+'"></li></ul><ul class="dropdown-menu" id="spacepicker" role="menu" aria-labelledby="dropdownMenu"></ul></div>'
|
||||
}
|
||||
}, options);
|
||||
|
||||
|
||||
init();
|
||||
|
||||
|
||||
function init() {
|
||||
|
||||
// remove picker if existing
|
||||
$('.space_picker_container').remove();
|
||||
|
||||
// insert the new input structure after the original input element
|
||||
$(options.inputId).after(options.templates.inputStructure);
|
||||
|
||||
// hide original input element
|
||||
$(options.inputId).hide();
|
||||
|
||||
if (options.currentValue != "") {
|
||||
|
||||
// restore data from database
|
||||
restoreSpaceTags(options.currentValue);
|
||||
}
|
||||
|
||||
// simulate focus in
|
||||
$('#space_input_field').focusin(function () {
|
||||
$('#space_tags').addClass('focus');
|
||||
})
|
||||
|
||||
// simulate focus out
|
||||
$('#space_input_field').focusout(function () {
|
||||
$('#space_tags').removeClass('focus');
|
||||
});
|
||||
|
||||
$('body').append($('#spacepicker'));
|
||||
}
|
||||
|
||||
function restoreSpaceTags(html) {
|
||||
|
||||
// add html structure for input element
|
||||
$('#space_tags').prepend(html);
|
||||
|
||||
// create function for every space tag to remove the element
|
||||
$('#space_tags .spaceInput i').each(function () {
|
||||
|
||||
$(this).click(function () {
|
||||
|
||||
// remove user tag
|
||||
$(this).parent().remove();
|
||||
|
||||
// reduce the count of added spaces
|
||||
spaceCount--;
|
||||
|
||||
})
|
||||
|
||||
// raise the count of added spaces
|
||||
spaceCount++;
|
||||
|
||||
})
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
// Set focus on the input field, by clicking the <ul> construct
|
||||
jQuery('#space_tags').click(function () {
|
||||
|
||||
// set focus
|
||||
$('#space_input_field').focus();
|
||||
})
|
||||
|
||||
$('#space_input_field').keydown(function (event) {
|
||||
|
||||
// by pressing the tab key an the input is empty
|
||||
if ($(this).val() == "" && event.keyCode == 9) {
|
||||
|
||||
//do nothing
|
||||
|
||||
// by pressing enter, tab, up or down arrow
|
||||
} else if (event.keyCode == 40 || event.keyCode == 38 || event.keyCode == 13 || event.keyCode == 9) {
|
||||
|
||||
// ... disable the default behavior to hold the cursor at the end of the string
|
||||
event.preventDefault();
|
||||
|
||||
}
|
||||
|
||||
// if there is a space limit and the user didn't press the tab key
|
||||
if (options.maxSpaces != 0 && event.keyCode != 9) {
|
||||
|
||||
// if the max space count is reached
|
||||
if (spaceCount == options.maxSpaces) {
|
||||
|
||||
// show hint
|
||||
showHintSpaces();
|
||||
|
||||
// block input events
|
||||
event.preventDefault();
|
||||
}
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
$('#space_input_field').keyup(function (event) {
|
||||
|
||||
// start search after a specific count of characters
|
||||
if ($('#space_input_field').val().length >= 3) {
|
||||
|
||||
// set spacepicker position in bottom of the space input
|
||||
$('#spacepicker').css({
|
||||
position: "absolute",
|
||||
top: $('#space_input_field').offset().top + 30,
|
||||
left: $('#space_input_field').offset().left + 2
|
||||
})
|
||||
|
||||
if (event.keyCode == 40) {
|
||||
|
||||
// select next <li> element
|
||||
if (chosen === "") {
|
||||
chosen = 1;
|
||||
} else if ((chosen + 1) < $('#spacepicker li').length) {
|
||||
chosen++;
|
||||
}
|
||||
$('#spacepicker li').removeClass('selected');
|
||||
$('#spacepicker li:eq(' + chosen + ')').addClass('selected');
|
||||
return false;
|
||||
|
||||
} else if (event.keyCode == 38) {
|
||||
|
||||
// select previous <li> element
|
||||
if (chosen === "") {
|
||||
chosen = 1;
|
||||
} else if (chosen > 0) {
|
||||
chosen--;
|
||||
}
|
||||
$('#spacepicker li').removeClass('selected');
|
||||
$('#spacepicker li:eq(' + chosen + ')').addClass('selected');
|
||||
return false;
|
||||
|
||||
} else if (event.keyCode == 13 || event.keyCode == 9) {
|
||||
|
||||
var href = $('#spacepicker .selected a').attr('href');
|
||||
// simulate click event when href is not undefined.
|
||||
if (href !== undefined) {
|
||||
window.location.href = href;
|
||||
}
|
||||
|
||||
} else {
|
||||
|
||||
// save the search string to variable
|
||||
var str = $('#space_input_field').val();
|
||||
|
||||
// show spacepicker with the results
|
||||
$('#spacepicker').show();
|
||||
|
||||
// load spaces
|
||||
loadSpaces(str);
|
||||
}
|
||||
} else {
|
||||
|
||||
// hide spacepicker
|
||||
$('#spacepicker').hide();
|
||||
}
|
||||
|
||||
|
||||
})
|
||||
|
||||
|
||||
$('#space_input_field').focusout(function () {
|
||||
|
||||
// set the plain text including user guids to the original input or textarea element
|
||||
$(options.inputId).val(parseSpaceInput());
|
||||
})
|
||||
|
||||
|
||||
function loadSpaces(string) {
|
||||
|
||||
// remove existings entries
|
||||
$('#spacepicker li').remove();
|
||||
|
||||
// show loader while loading
|
||||
$('#spacepicker').html('<li><div class="loader"><div class="sk-spinner sk-spinner-three-bounce"><div class="sk-bounce1"></div><div class="sk-bounce2"></div><div class="sk-bounce3"></div></div></div></li>');
|
||||
|
||||
jQuery.getJSON(options.searchUrl.replace('-keywordPlaceholder-', string), function (json) {
|
||||
|
||||
// remove existings entries
|
||||
$('#spacepicker li').remove();
|
||||
|
||||
|
||||
if (json.length > 0) {
|
||||
|
||||
|
||||
for (var i = 0; i < json.length; i++) {
|
||||
|
||||
var _guid = json[i].guid;
|
||||
var _title = addslashes(htmlDecode(json[i].title));
|
||||
var _image = $('<div/>').text(json[i].image).html();
|
||||
_image = _image.replace(/"/g, '\\\'');
|
||||
|
||||
// build <li> entry
|
||||
var str = '<li><a tabindex="-1" href="javascript:addSpaceTag(\'' + _guid + '\', \'' + _image + '\', \'' + _title + '\');">' + json[i].image + ' ' + _title + '</a></li>';
|
||||
|
||||
// append the entry to the <ul> list
|
||||
$('#spacepicker').append(str);
|
||||
|
||||
}
|
||||
|
||||
// reset the variable for arrows keys
|
||||
chosen = "";
|
||||
|
||||
} else {
|
||||
|
||||
// hide spacepicker, if no space was found
|
||||
$('#spacepicker').hide();
|
||||
}
|
||||
|
||||
|
||||
// remove hightlight
|
||||
$("#spacepicker li").removeHighlight();
|
||||
|
||||
// add new highlight matching strings
|
||||
$("#spacepicker li").highlight(string);
|
||||
|
||||
// add selection to the first space entry
|
||||
$('#spacepicker li:eq(0)').addClass('selected');
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
function showHintSpaces() {
|
||||
|
||||
// remove hint, if exists
|
||||
$('#maxSpaceHint').remove();
|
||||
|
||||
// build html structure
|
||||
var _html = '<div id="maxSpaceHint" style="display: none;" class="alert alert-danger"><button type="button" class="close" data-dismiss="alert">×</button><strong>Sorry!</strong> You can add a maximum of ' + options.maxSpaces + ' default spaces for this group.</div>';
|
||||
|
||||
// add hint to DOM
|
||||
$('#space_tags').after(_html);
|
||||
|
||||
// fadein hint
|
||||
$('#maxSpaceHint').fadeIn('fast');
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Add a space tag for invitation
|
||||
function addSpaceTag(guid, image, name) {
|
||||
|
||||
// Building a new <li> entry
|
||||
var _tagcode = '<li class="spaceInput" id="' + guid + '">' + image + ' ' + name + '<i class="fa fa-times-circle"></i></li>';
|
||||
|
||||
|
||||
// insert the new created <li> entry into the <ul> contruct
|
||||
$('#space_tag_input').before(_tagcode);
|
||||
|
||||
|
||||
// remove tag, by clicking the close icon
|
||||
$('#' + guid + " i").click(function () {
|
||||
|
||||
// remove space tag
|
||||
$('#' + guid).remove();
|
||||
|
||||
// reduce the count of added spaces
|
||||
spaceCount--;
|
||||
|
||||
})
|
||||
|
||||
// hide space results
|
||||
$('#spacepicker').hide();
|
||||
|
||||
// set focus to the input element
|
||||
$('#space_input_field').focus();
|
||||
|
||||
// Clear the textinput
|
||||
$('#space_input_field').val('');
|
||||
|
||||
// raise the count of added spaces
|
||||
spaceCount++;
|
||||
|
||||
|
||||
}
|
||||
|
||||
function parseSpaceInput() {
|
||||
|
||||
// create and insert a dummy <div> element to work with
|
||||
$('#space_tags').after('<div id="spaceInputResult"></div>')
|
||||
|
||||
// set html form input element to the new <div> element
|
||||
$('#spaceInputResult').html($('#space_tags').html());
|
||||
|
||||
|
||||
$('#spaceInputResult .spaceInput').each(function () {
|
||||
|
||||
// add the space guid as plain text
|
||||
$(this).after(this.id + ",");
|
||||
|
||||
// remove the link
|
||||
$(this).remove();
|
||||
})
|
||||
|
||||
// save the plain text
|
||||
var result = $('#spaceInputResult').text();
|
||||
|
||||
// remove the dummy <div> element
|
||||
$('#spaceInputResult').remove();
|
||||
|
||||
// return the plain text
|
||||
return result;
|
||||
|
||||
}
|
||||
|
||||
function addslashes(str) {
|
||||
|
||||
return (str + '').replace(/[\\"']/g, '\\$&').replace(/\u0000/g, '\\0');
|
||||
}
|
||||
|
||||
function htmlDecode(value) {
|
||||
return $("<textarea/>").html(value).text();
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user