<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<div class="container">
<div class="row">
<h2>Create your snippet's HTML, CSS and Javascript in the editor tabs</h2>
</div>
</div>
(function ($) {
var select2cache = (function () {
var cache = [];
function getData(config, term) {
return $.post('', {
method: '',
type: 'init',
table: config.table,
field: config.field,
term: term,
rand: Math.random()
}).then(function (r) {
return JSON.parse(r);
});
}
function find(config, term) {
var dfd = new $.Deferred,
entry = cache[config.table],
exist = [];
if (Array.isArray(entry)) {
exist = entry.filter(function (item) {
return item.id == term;
});
}
if (exist.length) {
dfd.resolve(exist);
} else {
dfd = getData(config, term);
}
return dfd;
}
function add(config, data) {
if (config.Method) {
return;
}
if (!cache[config.table]) {
cache[config.table] = [];
}
data.forEach(function (item) {
var exist = cache[config.table].some(function (cItem) {
return item.id == cItem.id;
});
if (!exist) {
cache[config.table].push(item);
}
});
}
return {
init: function (config, term, fn) {
find(config, term).then(function (response) {
add(config, response);
fn(config.Multiple ? response : response[0]);
});
},
add: add
}
})();
$.fn.employeeLookup = function (opts) {
var select2opts = {
minimumInputLength: 1,
placeholder: opts.placeholder || '',
allowClear: opts.allowClear || false,
multiple: opts.multiple || false,
ajax: {
url: '',
dataType: 'json',
quietMillis: 100,
data: function (term, page) {
var request = {
type: 'find',
term: term,
rand: Math.random()
};
if (opts.method) {
request.method = opts.method;
} else {
request.method = '',
request.table = opts.table;
request.field = opts.field;
}
return request;
},
results: function (data, page) {
if (opts.Table) {
select2cache.add(opts.table, data);
}
return { results: data };
}
},
initSelection: function (el, fn) {
var term = $(el).val();
if (!term) {
return;
}
select2cache.init(opts, term, fn);
}
};
this.select2(select2opts);
return this;
};
})(jQuery);
(function (root, factory) {
if (!root.Feedback) {
root.Feedback = factory();
}
}((window.wssc || (window.wssc = {})), function () {
var AJAX = '';
var NS = '';
Handlebars.registerPartial('settingsFeedbackSection', $('#settingsFeedbackSectionItem').html());
Handlebars.registerPartial('feedbackSectionItem', $('#feedbackSectionItemTemplate').html());
var t_Feedback = Handlebars.compile($('#feedbackSectionTemplate').html());
var t_FeedbackPopup = Handlebars.compile($('#feedbackSectionPopupTemplate').html());
var t_Settings = Handlebars.compile($('#feedbackSectionSettingsTemplate').html());
var t_SettingsItem = Handlebars.compile($('#settingsFeedbackSectionItem').html());
var Feedback = function (info, clientID) {
this.json = JSON.parse(info);
this.ID = this.json.ID;
this.info = this.json.data;
this.clientID = clientID;
$(this.render.bind(this));
this.node('.js-settings')
.on('click', this.openSettings.bind(this));
this.node('.js-feedback-expand')
.on('click', this.showAll.bind(this));
};
Feedback.prototype = {
node: function (selector) {
return $('#' + this.clientID + ' ' + (selector && ' ' + selector || ''));
},
render: function() {
var count = this.json.count,
html = t_Feedback(this.info.slice(0, count));
this.node('#feedbackSectionContent').html(html);
if (this.info.length <= count) {
this.node('.js-feedback-expand').hide();
} else {
this.node('.js-feedback-expand').show();
}
},
showAll: function() {
if (!this.info)
return;
$.fancybox.open(t_FeedbackPopup(this.info), {
width: '770',
autoSize: false,
autoHeight: true
});
},
openSettings: function () {
var self = this;
$.fancybox.open(t_Settings(this.info), {
width: '700',
autoSize: false,
autoHeight: true,
beforeShow: function () {
self.attchSettingsEvents(this.inner);
},
afterClose: function () {
self.detachSettingsEvents(this.inner);
}
});
},
attchSettingsEvents: function ($el) {
$el.find('.js-feedback-employee').employeeLookup({
table: 'Employees',
field: 'Title'
});
$el.on('click', '.js-button', function (e) {
var action = $(e.target).data('action');
switch (action) {
case 'add':
this.add();
break;
case 'remove':
var $p = $(e.target).parents('.js-feedback-item');
$p.find('input.js-feedback-employee').select2('destroy');
$p.remove();
break;
case 'accept':
var items = [];
$('.js-feedback-item').each(function () {
var $item = $(this);
items.push({
id: parseInt($item.data('id')),
responsibility: $item.find('.js-feedback-responsibility').val().trim(),
employee: parseInt($item.find('input.js-feedback-employee').val())
});
});
this.update(items)
.then($.fancybox.close);
break;
case 'cancel':
$.fancybox.close();
}
}.bind(this));
},
detachSettingsEvents: function ($el) {
},
update: function(items) {
return $.post(AJAX, {
method: NS + 'UpdateFeedback',
data: JSON.stringify(items),
wID: this.ID
}).then(function (response) {
return JSON.parse(response);
}).then(function (info) {
if (!info || info.Error) {
alert('Произошла ошибка при сохранении');
return;
}
this.info = JSON.parse(info.Items);
$(this.render.bind(this));
}.bind(this));
},
add: function () {
var hasEmpty = false;
this.node('.js-feedback-item[data-id=""]').each(function () {
if (!$(this).find('.js-feedback-responsibility').val().trim().length ||
!$(this).find('input.js-feedback-employee').val()) {
hasEmpty = true;
}
});
if (hasEmpty) {
return;
}
var $item = $(t_SettingsItem({}));
$item.find('.js-feedback-employee').employeeLookup({
table: 'Employees',
field: 'Title',
allowClear: true,
placeholder: 'Выберите сотрудника'
});
$('.js-feedback-items').prepend($item);
}
};
return Feedback;
}));
