Gists
On gists
Autocomplete (only for education) @deprecated
•
jQuery
jQuery-plugins
autocomplete.js #
/*
* jQuery Autocomplete plugin 1.2.3
*
* Copyright (c) 2009 Jörn Zaefferer
*
* Dual licensed under the MIT and GPL licenses:
* http://www.opensource.org/licenses/mit-license.php
* http://www.gnu.org/licenses/gpl.html
*
* With small modifications by Alfonso Gómez-Arzola.
* See changelog for details.
*
*/
;(function($) {
$.fn.extend({
autocomplete: function(urlOrData, options) {
var isUrl = typeof urlOrData == "string";
options = $.extend({}, $.Autocompleter.defaults, {
url: isUrl ? urlOrData : null,
data: isUrl ? null : urlOrData,
delay: isUrl ? $.Autocompleter.defaults.delay : 10,
max: options && !options.scroll ? 10 : 150,
noRecord: "No Records."
}, options);
// if highlight is set to false, replace it with a do-nothing function
options.highlight = options.highlight || function(value) { return value; };
// if the formatMatch option is not specified, then use formatItem for backwards compatibility
options.formatMatch = options.formatMatch || options.formatItem;
return this.each(function() {
new $.Autocompleter(this, options);
});
},
result: function(handler) {
return this.bind("result", handler);
},
search: function(handler) {
return this.trigger("search", [handler]);
},
flushCache: function() {
return this.trigger("flushCache");
},
setOptions: function(options){
return this.trigger("setOptions", [options]);
},
unautocomplete: function() {
return this.trigger("unautocomplete");
}
});
$.Autocompleter = function(input, options) {
var KEY = {
UP: 38,
DOWN: 40,
DEL: 46,
TAB: 9,
RETURN: 13,
ESC: 27,
COMMA: 188,
PAGEUP: 33,
PAGEDOWN: 34,
BACKSPACE: 8
};
var globalFailure = null;
if(options.failure != null && typeof options.failure == "function") {
globalFailure = options.failure;
}
// Create $ object for input element
var $input = $(input).attr("autocomplete", "off").addClass(options.inputClass);
var timeout;
var previousValue = "";
var cache = $.Autocompleter.Cache(options);
var hasFocus = 0;
var lastKeyPressCode;
var config = {
mouseDownOnSelect: false
};
var select = $.Autocompleter.Select(options, input, selectCurrent, config);
var blockSubmit;
// prevent form submit in opera when selecting with return key
navigator.userAgent.indexOf("Opera") != -1 && $(input.form).bind("submit.autocomplete", function() {
if (blockSubmit) {
blockSubmit = false;
return false;
}
});
// older versions of opera don't trigger keydown multiple times while pressed, others don't work with keypress at all
$input.bind((navigator.userAgent.indexOf("Opera") != -1 && !'KeyboardEvent' in window ? "keypress" : "keydown") + ".autocomplete", function(event) {
// a keypress means the input has focus
// avoids issue where input had focus before the autocomplete was applied
hasFocus = 1;
// track last key pressed
lastKeyPressCode = event.keyCode;
switch(event.keyCode) {
case KEY.UP:
if ( select.visible() ) {
event.preventDefault();
select.prev();
} else {
onChange(0, true);
}
break;
case KEY.DOWN:
if ( select.visible() ) {
event.preventDefault();
select.next();
} else {
onChange(0, true);
}
break;
case KEY.PAGEUP:
if ( select.visible() ) {
event.preventDefault();
select.pageUp();
} else {
onChange(0, true);
}
break;
case KEY.PAGEDOWN:
if ( select.visible() ) {
event.preventDefault();
select.pageDown();
} else {
onChange(0, true);
}
break;
// matches also semicolon
case options.multiple && $.trim(options.multipleSeparator) == "," && KEY.COMMA:
case KEY.TAB:
case KEY.RETURN:
if( selectCurrent() ) {
// stop default to prevent a form submit, Opera needs special handling
event.preventDefault();
blockSubmit = true;
return false;
}
break;
case KEY.ESC:
select.hide();
break;
default:
clearTimeout(timeout);
timeout = setTimeout(onChange, options.delay);
break;
}
}).focus(function(){
// track whether the field has focus, we shouldn't process any
// results if the field no longer has focus
hasFocus++;
}).blur(function() {
hasFocus = 0;
if (!config.mouseDownOnSelect) {
hideResults();
}
}).click(function() {
// show select when clicking in a focused field
// but if clickFire is true, don't require field
// to be focused to begin with; just show select
if( options.clickFire ) {
if ( !select.visible() ) {
onChange(0, true);
}
} else {
if ( hasFocus++ > 1 && !select.visible() ) {
onChange(0, true);
}
}
}).bind("search", function() {
// TODO why not just specifying both arguments?
var fn = (arguments.length > 1) ? arguments[1] : null;
function findValueCallback(q, data) {
var result;
if( data && data.length ) {
for (var i=0; i < data.length; i++) {
if( data[i].result.toLowerCase() == q.toLowerCase() ) {
result = data[i];
break;
}
}
}
if( typeof fn == "function" ) fn(result);
else $input.trigger("result", result && [result.data, result.value]);
}
$.each(trimWords($input.val()), function(i, value) {
request(value, findValueCallback, findValueCallback);
});
}).bind("flushCache", function() {
cache.flush();
}).bind("setOptions", function() {
$.extend(true, options, arguments[1]);
// if we've updated the data, repopulate
if ( "data" in arguments[1] )
cache.populate();
}).bind("unautocomplete", function() {
select.unbind();
$input.unbind();
$(input.form).unbind(".autocomplete");
});
function selectCurrent() {
var selected = select.selected();
if( !selected )
return false;
var v = selected.result;
previousValue = v;
if ( options.multiple ) {
var words = trimWords($input.val());
if ( words.length > 1 ) {
var seperator = options.multipleSeparator.length;
var cursorAt = $(input).selection().start;
var wordAt, progress = 0;
$.each(words, function(i, word) {
progress += word.length;
if (cursorAt <= progress) {
wordAt = i;
return false;
}
progress += seperator;
});
words[wordAt] = v;
// TODO this should set the cursor to the right position, but it gets overriden somewhere
//$.Autocompleter.Selection(input, progress + seperator, progress + seperator);
v = words.join( options.multipleSeparator );
}
v += options.multipleSeparator;
}
$input.val(v);
hideResultsNow();
$input.trigger("result", [selected.data, selected.value]);
return true;
}
function onChange(crap, skipPrevCheck) {
if( lastKeyPressCode == KEY.DEL ) {
select.hide();
return;
}
var currentValue = $input.val();
if ( !skipPrevCheck && currentValue == previousValue )
return;
previousValue = currentValue;
currentValue = lastWord(currentValue);
if ( currentValue.length >= options.minChars) {
$input.addClass(options.loadingClass);
if (!options.matchCase)
currentValue = currentValue.toLowerCase();
request(currentValue, receiveData, hideResultsNow);
} else {
stopLoading();
select.hide();
}
};
function trimWords(value) {
if (!value)
return [""];
if (!options.multiple)
return [$.trim(value)];
return $.map(value.split(options.multipleSeparator), function(word) {
return $.trim(value).length ? $.trim(word) : null;
});
}
function lastWord(value) {
if ( !options.multiple )
return value;
var words = trimWords(value);
if (words.length == 1)
return words[0];
var cursorAt = $(input).selection().start;
if (cursorAt == value.length) {
words = trimWords(value)
} else {
words = trimWords(value.replace(value.substring(cursorAt), ""));
}
return words[words.length - 1];
}
// fills in the input box w/the first match (assumed to be the best match)
// q: the term entered
// sValue: the first matching result
function autoFill(q, sValue){
// autofill in the complete box w/the first match as long as the user hasn't entered in more data
// if the last user key pressed was backspace, don't autofill
if( options.autoFill && (lastWord($input.val()).toLowerCase() == q.toLowerCase()) && lastKeyPressCode != KEY.BACKSPACE ) {
// fill in the value (keep the case the user has typed)
$input.val($input.val() + sValue.substring(lastWord(previousValue).length));
// select the portion of the value not typed by the user (so the next character will erase)
$(input).selection(previousValue.length, previousValue.length + sValue.length);
}
};
function hideResults() {
clearTimeout(timeout);
timeout = setTimeout(hideResultsNow, 200);
};
function hideResultsNow() {
var wasVisible = select.visible();
select.hide();
clearTimeout(timeout);
stopLoading();
if (options.mustMatch) {
// call search and run callback
$input.search(
function (result){
// if no value found, clear the input box
if( !result ) {
if (options.multiple) {
var words = trimWords($input.val()).slice(0, -1);
$input.val( words.join(options.multipleSeparator) + (words.length ? options.multipleSeparator : "") );
}
else {
$input.val( "" );
$input.trigger("result", null);
}
}
}
);
}
};
function receiveData(q, data) {
if ( data && data.length && hasFocus ) {
stopLoading();
select.display(data, q);
autoFill(q, data[0].value);
select.show();
} else {
hideResultsNow();
}
};
function request(term, success, failure) {
if (!options.matchCase)
term = term.toLowerCase();
var data = cache.load(term);
// recieve the cached data
if (data) {
if(data.length) {
success(term, data);
}
else{
var parsed = options.parse && options.parse(options.noRecord) || parse(options.noRecord);
success(term,parsed);
}
// if an AJAX url has been supplied, try loading the data now
} else if( (typeof options.url == "string") && (options.url.length > 0) ){
var extraParams = {
timestamp: +new Date()
};
$.each(options.extraParams, function(key, param) {
extraParams[key] = typeof param == "function" ? param() : param;
});
$.ajax({
// try to leverage ajaxQueue plugin to abort previous requests
mode: "abort",
// limit abortion to this input
port: "autocomplete" + input.name,
dataType: options.dataType,
url: options.url,
data: $.extend({
q: lastWord(term),
limit: options.max
}, extraParams),
success: function(data) {
var parsed = options.parse && options.parse(data) || parse(data);
cache.add(term, parsed);
success(term, parsed);
}
});
} else {
// if we have a failure, we need to empty the list -- this prevents the the [TAB] key from selecting the last successful match
select.emptyList();
if(globalFailure != null) {
globalFailure();
}
else {
failure(term);
}
}
};
function parse(data) {
var parsed = [];
var rows = data.split("\n");
for (var i=0; i < rows.length; i++) {
var row = $.trim(rows[i]);
if (row) {
row = row.split("|");
parsed[parsed.length] = {
data: row,
value: row[0],
result: options.formatResult && options.formatResult(row, row[0]) || row[0]
};
}
}
return parsed;
};
function stopLoading() {
$input.removeClass(options.loadingClass);
};
};
$.Autocompleter.defaults = {
inputClass: "ac_input",
resultsClass: "ac_results",
loadingClass: "ac_loading",
minChars: 1,
delay: 400,
matchCase: false,
matchSubset: true,
matchContains: false,
cacheLength: 100,
max: 1000,
mustMatch: false,
extraParams: {},
selectFirst: true,
formatItem: function(row) { return row[0]; },
formatMatch: null,
autoFill: false,
width: 0,
multiple: false,
multipleSeparator: " ",
inputFocus: true,
clickFire: false,
highlight: function(value, term) {
return value.replace(new RegExp("(?![^&;]+;)(?!<[^<>]*)(" + term.replace(/([\^\$\(\)\[\]\{\}\*\.\+\?\|\\])/gi, "\\$1") + ")(?![^<>]*>)(?![^&;]+;)", "gi"), "<strong>$1</strong>");
},
scroll: true,
scrollHeight: 180,
scrollJumpPosition: true
};
$.Autocompleter.Cache = function(options) {
var data = {};
var length = 0;
function matchSubset(s, sub) {
if (!options.matchCase)
s = s.toLowerCase();
var i = s.indexOf(sub);
if (options.matchContains == "word"){
i = s.toLowerCase().search("\\b" + sub.toLowerCase());
}
if (i == -1) return false;
return i == 0 || options.matchContains;
};
function add(q, value) {
if (length > options.cacheLength){
flush();
}
if (!data[q]){
length++;
}
data[q] = value;
}
function populate(){
if( !options.data ) return false;
// track the matches
var stMatchSets = {},
nullData = 0;
// no url was specified, we need to adjust the cache length to make sure it fits the local data store
if( !options.url ) options.cacheLength = 1;
// track all options for minChars = 0
stMatchSets[""] = [];
// loop through the array and create a lookup structure
for ( var i = 0, ol = options.data.length; i < ol; i++ ) {
var rawValue = options.data[i];
// if rawValue is a string, make an array otherwise just reference the array
rawValue = (typeof rawValue == "string") ? [rawValue] : rawValue;
var value = options.formatMatch(rawValue, i+1, options.data.length);
if ( typeof(value) === 'undefined' || value === false )
continue;
var firstChar = value.charAt(0).toLowerCase();
// if no lookup array for this character exists, look it up now
if( !stMatchSets[firstChar] )
stMatchSets[firstChar] = [];
// if the match is a string
var row = {
value: value,
data: rawValue,
result: options.formatResult && options.formatResult(rawValue) || value
};
// push the current match into the set list
stMatchSets[firstChar].push(row);
// keep track of minChars zero items
if ( nullData++ < options.max ) {
stMatchSets[""].push(row);
}
};
// add the data items to the cache
$.each(stMatchSets, function(i, value) {
// increase the cache size
options.cacheLength++;
// add to the cache
add(i, value);
});
}
// populate any existing data
setTimeout(populate, 25);
function flush(){
data = {};
length = 0;
}
return {
flush: flush,
add: add,
populate: populate,
load: function(q) {
if (!options.cacheLength || !length)
return null;
/*
* if dealing w/local data and matchContains than we must make sure
* to loop through all the data collections looking for matches
*/
if( !options.url && options.matchContains ){
// track all matches
var csub = [];
// loop through all the data grids for matches
for( var k in data ){
// don't search through the stMatchSets[""] (minChars: 0) cache
// this prevents duplicates
if( k.length > 0 ){
var c = data[k];
$.each(c, function(i, x) {
// if we've got a match, add it to the array
if (matchSubset(x.value, q)) {
csub.push(x);
}
});
}
}
return csub;
} else
// if the exact item exists, use it
if (data[q]){
return data[q];
} else
if (options.matchSubset) {
for (var i = q.length - 1; i >= options.minChars; i--) {
var c = data[q.substr(0, i)];
if (c) {
var csub = [];
$.each(c, function(i, x) {
if (matchSubset(x.value, q)) {
csub[csub.length] = x;
}
});
return csub;
}
}
}
return null;
}
};
};
$.Autocompleter.Select = function (options, input, select, config) {
var CLASSES = {
ACTIVE: "ac_over"
};
var listItems,
active = -1,
data,
term = "",
needsInit = true,
element,
list;
// Create results
function init() {
if (!needsInit)
return;
element = $("<div/>")
.hide()
.addClass(options.resultsClass)
.css("position", "absolute")
.appendTo(document.body)
.hover(function(event) {
// Browsers except FF do not fire mouseup event on scrollbars, resulting in mouseDownOnSelect remaining true, and results list not always hiding.
if($(this).is(":visible")) {
input.focus();
}
config.mouseDownOnSelect = false;
});
list = $("<ul/>").appendTo(element).mouseover( function(event) {
if(target(event).nodeName && target(event).nodeName.toUpperCase() == 'LI') {
active = $("li", list).removeClass(CLASSES.ACTIVE).index(target(event));
$(target(event)).addClass(CLASSES.ACTIVE);
}
}).click(function(event) {
$(target(event)).addClass(CLASSES.ACTIVE);
select();
if( options.inputFocus )
input.focus();
return false;
}).mousedown(function() {
config.mouseDownOnSelect = true;
}).mouseup(function() {
config.mouseDownOnSelect = false;
});
if( options.width > 0 )
element.css("width", options.width);
needsInit = false;
}
function target(event) {
var element = event.target;
while(element && element.tagName != "LI")
element = element.parentNode;
// more fun with IE, sometimes event.target is empty, just ignore it then
if(!element)
return [];
return element;
}
function moveSelect(step) {
listItems.slice(active, active + 1).removeClass(CLASSES.ACTIVE);
movePosition(step);
var activeItem = listItems.slice(active, active + 1).addClass(CLASSES.ACTIVE);
if(options.scroll) {
var offset = 0;
listItems.slice(0, active).each(function() {
offset += this.offsetHeight;
});
if((offset + activeItem[0].offsetHeight - list.scrollTop()) > list[0].clientHeight) {
list.scrollTop(offset + activeItem[0].offsetHeight - list.innerHeight());
} else if(offset < list.scrollTop()) {
list.scrollTop(offset);
}
}
};
function movePosition(step) {
if (options.scrollJumpPosition || (!options.scrollJumpPosition && !((step < 0 && active == 0) || (step > 0 && active == listItems.size() - 1)) )) {
active += step;
if (active < 0) {
active = listItems.size() - 1;
} else if (active >= listItems.size()) {
active = 0;
}
}
}
function limitNumberOfItems(available) {
return options.max && options.max < available
? options.max
: available;
}
function fillList() {
list.empty();
var max = limitNumberOfItems(data.length);
for (var i=0; i < max; i++) {
if (!data[i])
continue;
var formatted = options.formatItem(data[i].data, i+1, max, data[i].value, term);
if ( formatted === false )
continue;
var li = $("<li/>").html( options.highlight(formatted, term) ).addClass(i%2 == 0 ? "ac_even" : "ac_odd").appendTo(list)[0];
$.data(li, "ac_data", data[i]);
}
listItems = list.find("li");
if ( options.selectFirst ) {
listItems.slice(0, 1).addClass(CLASSES.ACTIVE);
active = 0;
}
// apply bgiframe if available
if ( $.fn.bgiframe )
list.bgiframe();
}
return {
display: function(d, q) {
init();
data = d;
term = q;
fillList();
},
next: function() {
moveSelect(1);
},
prev: function() {
moveSelect(-1);
},
pageUp: function() {
if (active != 0 && active - 8 < 0) {
moveSelect( -active );
} else {
moveSelect(-8);
}
},
pageDown: function() {
if (active != listItems.size() - 1 && active + 8 > listItems.size()) {
moveSelect( listItems.size() - 1 - active );
} else {
moveSelect(8);
}
},
hide: function() {
element && element.hide();
listItems && listItems.removeClass(CLASSES.ACTIVE);
active = -1;
},
visible : function() {
return element && element.is(":visible");
},
current: function() {
return this.visible() && (listItems.filter("." + CLASSES.ACTIVE)[0] || options.selectFirst && listItems[0]);
},
show: function() {
var offset = $(input).offset();
element.css({
width: typeof options.width == "string" || options.width > 0 ? options.width : $(input).width(),
top: offset.top + input.offsetHeight,
left: offset.left - 9
}).show();
if(options.scroll) {
list.scrollTop(0);
list.css({
maxHeight: options.scrollHeight,
overflow: 'auto'
});
if(navigator.userAgent.indexOf("MSIE") != -1 && typeof document.body.style.maxHeight === "undefined") {
var listHeight = 0;
listItems.each(function() {
listHeight += this.offsetHeight;
});
var scrollbarsVisible = listHeight > options.scrollHeight;
list.css('height', scrollbarsVisible ? options.scrollHeight : listHeight );
if (!scrollbarsVisible) {
// IE doesn't recalculate width when scrollbar disappears
listItems.width( list.width() - parseInt(listItems.css("padding-left")) - parseInt(listItems.css("padding-right")) );
}
}
}
},
selected: function() {
var selected = listItems && listItems.filter("." + CLASSES.ACTIVE).removeClass(CLASSES.ACTIVE);
return selected && selected.length && $.data(selected[0], "ac_data");
},
emptyList: function (){
list && list.empty();
},
unbind: function() {
element && element.remove();
}
};
};
$.fn.selection = function(start, end) {
if (start !== undefined) {
return this.each(function() {
if( this.createTextRange ){
var selRange = this.createTextRange();
if (end === undefined || start == end) {
selRange.move("character", start);
selRange.select();
} else {
selRange.collapse(true);
selRange.moveStart("character", start);
selRange.moveEnd("character", end);
selRange.select();
}
} else if( this.setSelectionRange ){
this.setSelectionRange(start, end);
} else if( this.selectionStart ){
this.selectionStart = start;
this.selectionEnd = end;
}
});
}
var field = this[0];
if ( field.createTextRange ) {
var range = document.selection.createRange(),
orig = field.value,
teststring = "<->",
textLength = range.text.length;
range.text = teststring;
var caretAt = field.value.indexOf(teststring);
field.value = orig;
this.selection(caretAt, caretAt + textLength);
return {
start: caretAt,
end: caretAt + textLength
}
} else if( field.selectionStart !== undefined ){
return {
start: field.selectionStart,
end: field.selectionEnd
}
}
};
})(jQuery);
On gists
JavaScript
jQuery-plugins
Test rychlosti psaní
test.js #
$('[name=psani]').keyup(function(){
var chars = $(this).val().split("");
var vzor = $("#vzor").text().split("");
var correctIndex = -1;
for(var i in chars){
if(chars[i] == vzor[i]){
correctIndex = parseInt(i);
}else{
break;
}
}
var correct = '';
var wrong = '';
if(correctIndex !== -1){
var correct = $("#vzor").text().substring(0,correctIndex+1);
}
if(chars.length > correctIndex+1){
var wrong = $("#vzor").text().substring(correctIndex+1, chars.length);
}
var rest = $("#vzor").text().substring(chars.length, vzor.length-1);
$('#display')
.html('<span id="correct">'+correct+'</span><span id="wrong">'+wrong+'</span>'+rest);
$('#auticko').css('left', $('#draha').width() * ((correctIndex+1) / vzor.length));
}).keyup();
On gists
jQuery-plugins
AW
Volani public metody z AW pluginu
example.js #
var instance = $elems['.eshop-menu-filters'].awEshopFilters();
//testovani metody z venci
//1 funkcni
instance.awEshopFilters('test');
//2 funkcni
$elems['.eshop-menu-filters'].awEshopFilters('test');
//3 funkcni, nutno si vratit ulozeny objekt, ktery je v dataatributu
var instanceDataset = $elems['.eshop-menu-filters'].data('awEshopFilters');
instanceDataset.test();
On gists
jQuery
jQuery-plugins
Iframe on load (youtube)
whenscrolled.jquery.js #
$.fn.showWhenScrolled=function(){
var self = this;
this.init = function(){
self.each(function(){
var self_top = $(this).offset().top;
var scroll_top = $(window).scrollTop();
var win_height = $(window).height();
var frame = $(this).find('iframe');
if(scroll_top > (self_top - win_height)){
if(!frame.attr('src')){
frame.attr({src:frame.attr('title')});
}
}
});
};
$(window).scroll(function(){
self.init();
}).resize(function(){
self.init();
});
self.init();
};
$('.youtube-container').showWhenScrolled();
On gists
Nette
Nette-Forms
Nette-Tricks
Form šablona přes bloky
form.latte #
{define form $formName}
<form n:name=$formName>
<ul class=error n:ifcontent>
<li n:foreach="$form->ownErrors as $error">{$error}</li>
</ul>
<table>
<tr n:foreach="$form->controls as $input"
n:if="!$input->getOption(rendered) && $input->getOption(type) !== hidden"
n:class="$input->required ? required">
<th>{label $input}</th>
<td>{input $input} <span class=error n:ifcontent>{$input->error}</span></td>
</tr>
</table>
</form>
{/define}
{* for Bootstrap v3 *}
{define bootstrap-form $formName}
<form n:name=$formName class=form-horizontal>
<ul class=error n:ifcontent>
<li n:foreach="$form->ownErrors as $error">{$error}</li>
</ul>
<div n:foreach="$form->controls as $name => $input"
n:if="!$input->getOption(rendered) && $input->getOption(type) !== hidden"
n:class="form-group, $input->required ? required, $input->error ? has-error">
<div class="col-sm-2 control-label">{label $input}</div>
<div class="col-sm-10">
{if $input->getOption(type) in [text, select, textarea]}
{input $input class => form-control}
{elseif $input->getOption(type) === button}
{input $input class => "btn btn-default"}
{elseif $input->getOption(type) === checkbox}
<div class="checkbox">{input $input}</div>
{elseif $input->getOption(type) === radio}
<div class="radio">{input $input}</div>
{else}
{input $input}
{/if}
<span class=help-block n:ifcontent>{$input->error ?: $input->getOption(description)}</span>
</div>
</div>
</form>
{/define}
On gists
Založení nového projektu na posledním CMS (rev 18.1.2019), Nette 2.4
•
AW
gistfile1.md #
1) Založení nového projektu v git.andwebcz
- clone na disk
2) Do naklonovaného repa, přidat do Gitu nový origin, který odkazuje na nette-bootstrap (branch: new)
3) Přepnout v projektu na nette-boostrap (udelat fetch, a nastavit branch: front-base přes checkout)
4) založit db, založit usera v db + nastavení database.dev.neon (login, heslo ...)
5) v CLI v rootu projektu spustit příkazy ( to samé poté i v adresáři admin)
npm installnpm install --only=devnpm rebuild node-sass
6) v Rootu projektu spustit v CLI npm run first-init:all
7) spusteni migrace
8) pridani svoji URL do tabulky domains
doplnkový body
1) TortoiseGit: je nutno, pak smazat remote nette-botstrap, a comitnout/pushnout projekt do masteru (ten nemame, visi tam branch front-base, ale jsme uz v origin: projektu, to nevadi, staci akorat dole pak zaskrtnout new branch, dopsat tam master a spustit ... vytvori se master branch v originu naseho projektu - done!
2) Kdyby nefungoval autoprefixer tak znovu spustit příkaz:
npm install --save-dev postcss-cli autoprefixer (nevím proč to někdy blbne)
On gists
JavaScript
jQuery
Vanilla JS equivalents of jQuery methods
README.md #
Sans jQuery
Events
// jQuery
$(document).ready(function() {
// code
})
// Vanilla
document.addEventListener('DOMContentLoaded', function() {
// code
})// jQuery
$('a').click(function() {
// code…
})
// Vanilla
[].forEach.call(document.querySelectorAll('a'), function(el) {
el.addEventListener('click', function() {
// code…
})
})Selectors
// jQuery
var divs = $('div')
// Vanilla
var divs = document.querySelectorAll('div')// jQuery
var newDiv = $('<div/>')
// Vanilla
var newDiv = document.createElement('div')Attributes
// jQuery
$('img').filter(':first').attr('alt', 'My image')
// Vanilla
document.querySelector('img').setAttribute('alt', 'My image')Classes
// jQuery
newDiv.addClass('foo')
// Vanilla
newDiv.classList.add('foo')// jQuery
newDiv.toggleClass('foo')
// Vanilla
newDiv.classList.toggle('foo')Manipulation
// jQuery
$('body').append($('<p/>'))
// Vanilla
document.body.appendChild(document.createElement('p'))// jQuery
var clonedElement = $('#about').clone()
// Vanilla
var clonedElement = document.getElementById('about').cloneNode(true)// jQuery
$('#wrap').empty()
// Vanilla
var wrap = document.getElementById('wrap')
while(wrap.firstChild) wrap.removeChild(wrap.firstChild)Transversing
// jQuery
var parent = $('#about').parent()
// Vanilla
var parent = document.getElementById('about').parentNode// jQuery
if($('#wrap').is(':empty'))
// Vanilla
if(!document.getElementById('wrap').hasChildNodes())// jQuery
var nextElement = $('#wrap').next()
// Vanilla
var nextElement = document.getElementById('wrap').nextSiblingAJAX
GET
// jQuery
$.get('//example.com', function (data) {
// code
})
// Vanilla
var httpRequest = new XMLHttpRequest()
httpRequest.onreadystatechange = function (data) {
// code
}
httpRequest.open('GET', url)
httpRequest.send()POST
// jQuery
$.post('//example.com', { username: username }, function (data) {
// code
})
// Vanilla
var httpRequest = new XMLHttpRequest()
httpRequest.onreadystatechange = function (data) {
// code
}
httpRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded')
httpRequest.open('POST', url)
httpRequest.send('username=' + encodeURIComponent(username))JSONP
// jQuery
$.getJSON('//openexchangerates.org/latest.json?callback=?', function (data) {
// code
})
// Vanilla
function success(data) {
// code
}
var scr = document.createElement('script')
scr.src = '//openexchangerates.org/latest.json?callback=formatCurrency'
document.body.appendChild(scr)More
Here are a few additional references demonstrating vanilla javascript equivalents of jquery methods:
Also, see the two part series showing equivalents for ...
-
[Events, Ajax and Utilities](http://www.sitepoint.com/jquery-vs-raw- javascript-3-events-ajax/)
On gists
MySql
MySql tricks
Functions - examples
Functions.sql #
Basic MySQL CREATE FUNCTION statement
A very basic CREATE FUNCTION example which will produced the famed 'Hello World' output:
DELIMITER $$
CREATE FUNCTION hello_world()
RETURNS TEXT
LANGUAGE SQL
BEGIN
RETURN 'Hello World';
END;
$$
DELIMITER ;
Execute this function as follows:
mysql> SELECT hello_world();
+---------------+
| hello_world() |
+---------------+
| Hello World |
+---------------+
1 row in set (0.00 sec)
MySQL function with a parameter
Customize your 'Hello World' output with input from a parameter:
DROP FUNCTION IF EXISTS hello_world;
DELIMITER $$
CREATE FUNCTION hello_world(addressee TEXT)
RETURNS TEXT
LANGUAGE SQL -- This element is optional and will be omitted from subsequent examples
BEGIN
RETURN CONCAT('Hello ', addressee);
END;
$$
DELIMITER ;
Execute as follows:
mysql> SELECT hello_world('Earth');
+----------------------+
| hello_world('Earth') |
+----------------------+
| Hello Earth |
+----------------------+
1 row in set (0.00 sec)
MySQL function with a local variable
Use a local variable to perform calculations inside your function:
DROP FUNCTION IF EXISTS hello_world;
DELIMITER $$
CREATE FUNCTION hello_world(addressee TEXT)
RETURNS TEXT
BEGIN
DECLARE strlen INT;
SET strlen = LENGTH(addressee);
RETURN CONCAT('Hello ', addressee, ' - your parameter has ', strlen, ' characters');
END;
$$
DELIMITER ;
Output:
mysql> SELECT hello_world('Earth');
+-----------------------------------------------+
| hello_world('Earth') |
+-----------------------------------------------+
| Hello Earth - your parameter has 5 characters |
+-----------------------------------------------+
1 row in set (0.00 sec)
MySQL function with a loop
DROP FUNCTION IF EXISTS looptest;
DELIMITER $$
CREATE FUNCTION looptest()
RETURNS INT READS SQL DATA
BEGIN
DECLARE v_total INT;
SET v_total = 0;
count_loop: LOOP
SET v_total = v_total + 1;
IF v_total = 10 THEN
LEAVE count_loop;
END IF;
END LOOP;
RETURN v_total;
END;
$$
DELIMITER ;
MySQL function with a loop and cursor
It is possible - if somewhat inelegant - to iterate through a CURSOR using a loop:
DROP FUNCTION IF EXISTS looptest;
DELIMITER $$
CREATE FUNCTION looptest()
RETURNS INT READS SQL DATA
BEGIN
DECLARE v_total INT;
DECLARE v_counter INT;
DECLARE done INT DEFAULT FALSE;
DECLARE csr CURSOR FOR
SELECT counter FROM items;
DECLARE CONTINUE HANDLER FOR NOT FOUND SET done = TRUE;
SET v_total = 0;
OPEN csr;
read_loop: LOOP
FETCH csr INTO v_counter;
IF done THEN
LEAVE read_loop;
END IF;
SET v_total = v_total + v_counter;
END LOOP;
CLOSE csr;
RETURN v_total;
END;
$$
DELIMITER ;
On gists
MySql
MySql tricks
Dense rank / rank (joins)
dense.sql #
SELECT COUNT(id) + 1 AS rank, COUNT(DISTINCT age) + 1 AS dense_rank
FROM testdata
WHERE gender = (SELECT gender FROM testdata WHERE id = 6)
AND age < (SELECT age FROM testdata WHERE id = 6)
SELECT testdata.id, COUNT(lesser.id) + 1 AS rank, COUNT(DISTINCT lesser.age) + 1 AS dense_rank
FROM testdata
LEFT JOIN testdata AS lesser ON lesser.age < testdata.age AND lesser.gender = testdata.gender
GROUP BY testdata.id
SELECT a.first_name,
a.age,
a.gender,
count(b.age)+1 as rank
FROM person a left join person b on a.age>b.age and a.gender=b.gender
group by a.first_name,
a.age,
a.gender
On gists
MySql
MySql tricks
Ranks - many cases
ranks.sql #
DROP TABLE IF EXISTS users;
CREATE TABLE users (user_id INT PRIMARY KEY AUTO_INCREMENT, name VARCHAR(20), start_date DATE, team_id INT);
INSERT INTO users (name, start_date, team_id) VALUES ('Matt', '2017-01-01', 1);
INSERT INTO users (name, start_date, team_id) VALUES ('John', '2017-01-02', 2);
INSERT INTO users (name, start_date, team_id) VALUES ('Sara', '2017-01-02', 2);
INSERT INTO users (name, start_date, team_id) VALUES ('Tim', '2017-01-02', 3);
INSERT INTO users (name, start_date, team_id) VALUES ('Bob', '2017-01-03', 3);
INSERT INTO users (name, start_date, team_id) VALUES ('Bill', '2017-01-04', 3);
INSERT INTO users (name, start_date, team_id) VALUES ('Kathy', '2017-01-04', 3);
INSERT INTO users (name, start_date, team_id) VALUES ('Anne', '2017-01-05', 3);
+---------+-------+------------+---------+
| user_id | name | start_date | team_id |
+---------+-------+------------+---------+
| 1 | Matt | 2017-01-01 | 1 |
| 2 | John | 2017-01-02 | 2 |
| 3 | Sara | 2017-01-02 | 2 |
| 4 | Tim | 2017-01-02 | 3 |
| 5 | Bob | 2017-01-03 | 3 |
| 6 | Bill | 2017-01-04 | 3 |
| 7 | Kathy | 2017-01-04 | 3 |
| 8 | Anne | 2017-01-05 | 3 |
+---------+-------+------------+---------+
# Ranked by start date
SELECT *
FROM users
ORDER by start_date ASC
# Ranked by start date with ties broken by user id
SELECT *
FROM users
ORDER by start_date ASC, user_id ASC
# First employee by start date with ties broken by user id
SELECT *
FROM users
ORDER by start_date ASC, user_id ASC
LIMIT 1
# First employee by start date with ties
SELECT *
FROM users
WHERE start_date = (SELECT MIN(start_date) FROM users);
# Second employee by start date with ties broken by user id
SELECT *
FROM users
ORDER by start_date ASC, user_id ASC
LIMIT 1
OFFSET 1
# Second employee by start date with ties
SELECT *
FROM users
WHERE start_date = (
SELECT DISTINCT start_date
FROM users
ORDER BY start_date ASC
LIMIT 1
OFFSET 1
)
# Ranked by start date using variable
SET @rank := 0;
SELECT
*,
@rank := @rank + 1 AS rank
FROM users
ORDER BY start_date ASC
+---------+-------+------------+---------+------+
| user_id | name | start_date | team_id | rank |
+---------+-------+------------+---------+------+
| 1 | Matt | 2017-01-01 | 1 | 1 |
| 2 | John | 2017-01-02 | 2 | 2 |
| 3 | Sara | 2017-01-02 | 2 | 3 |
| 4 | Tim | 2017-01-02 | 3 | 4 |
| 5 | Bob | 2017-01-03 | 3 | 5 |
| 6 | Bill | 2017-01-04 | 3 | 6 |
| 7 | Kathy | 2017-01-04 | 3 | 7 |
| 8 | Anne | 2017-01-05 | 3 | 8 |
+---------+-------+------------+---------+------+
# Ranked by start date using a variable
# Based on this Stack Overflow comment:
SELECT
*,
@rank := @rank + 1 AS rank
FROM users, (SELECT @rank := 0) r
ORDER BY start_date ASC
+---------+-------+------------+---------+------------+------+
| user_id | name | start_date | team_id | @rank := 0 | rank |
+---------+-------+------------+---------+------------+------+
| 1 | Matt | 2017-01-01 | 1 | 0 | 1 |
| 2 | John | 2017-01-02 | 2 | 0 | 2 |
| 3 | Sara | 2017-01-02 | 2 | 0 | 3 |
| 4 | Tim | 2017-01-02 | 3 | 0 | 4 |
| 5 | Bob | 2017-01-03 | 3 | 0 | 5 |
| 6 | Bill | 2017-01-04 | 3 | 0 | 6 |
| 7 | Kathy | 2017-01-04 | 3 | 0 | 7 |
| 8 | Anne | 2017-01-05 | 3 | 0 | 8 |
+---------+-------+------------+---------+------------+------+
# First employee by start date using by setting a variable
SET @rank := 0;
SELECT *
FROM (
SELECT
*,
@rank := @rank + 1 AS rank
FROM users
ORDER BY start_date ASC
) ranked
WHERE rank = 1
# Ranked by start date with ties
# Based on this Stack Overflow comment:
SET @prev_start_date = NULL;
SET @rank := 0;
SELECT
*,
CASE
WHEN @prev_start_date = start_date THEN @rank
-- Note that the assignment here will always be true
WHEN @prev_start_date := start_date THEN @rank := @rank + 1
END AS rank
FROM users
ORDER BY start_date ASC
+---------+-------+------------+---------+------+
| user_id | name | start_date | team_id | rank |
+---------+-------+------------+---------+------+
| 1 | Matt | 2017-01-01 | 1 | 1 |
| 2 | John | 2017-01-02 | 2 | 2 |
| 3 | Sara | 2017-01-02 | 2 | 2 |
| 4 | Tim | 2017-01-02 | 3 | 2 |
| 5 | Bob | 2017-01-03 | 3 | 3 |
| 6 | Bill | 2017-01-04 | 3 | 4 |
| 7 | Kathy | 2017-01-04 | 3 | 4 |
| 8 | Anne | 2017-01-05 | 3 | 5 |
+---------+-------+------------+---------+------+
# Ranked by user id within each team
SELECT
a.*,
COUNT(*) AS rank
FROM users a
INNER JOIN users b
ON a.team_id = b.team_id AND a.user_id >= b.user_id
GROUP BY a.team_id, a.user_id
# or, based on this Stack Overflow comment:
SELECT
a.*,
(
SELECT COUNT(*)
FROM users b
WHERE a.team_id = b.team_id AND a.user_id >= b.user_id
) AS ranked
FROM users a
+---------+-------+------------+---------+--------+
| user_id | name | start_date | team_id | ranked |
+---------+-------+------------+---------+--------+
| 1 | Matt | 2017-01-01 | 1 | 1 |
| 2 | John | 2017-01-02 | 2 | 1 |
| 3 | Sara | 2017-01-02 | 2 | 2 |
| 4 | Tim | 2017-01-02 | 3 | 1 |
| 5 | Bob | 2017-01-03 | 3 | 2 |
| 6 | Bill | 2017-01-04 | 3 | 3 |
| 7 | Kathy | 2017-01-04 | 3 | 4 |
| 8 | Anne | 2017-01-05 | 3 | 5 |
+---------+-------+------------+---------+--------+
# Note that both of these techniques require that there be a column without duplicates that we can rank on within the partition. For example, we can’t use start_date due to the duplicates within team 2 (2017-01-02) and team 3 (2017-01-14):
SELECT
a.*,
COUNT(*) AS rank
FROM users a
INNER JOIN users b
ON a.team_id = b.team_id AND a.start_date >= b.start_date
GROUP BY a.team_id, a.user_id
+---------+-------+------------+---------+------+
| user_id | name | start_date | team_id | rank |
+---------+-------+------------+---------+------+
| 1 | Matt | 2017-01-01 | 1 | 1 |
| 2 | John | 2017-01-02 | 2 | 2 |
| 3 | Sara | 2017-01-02 | 2 | 2 |
| 4 | Tim | 2017-01-02 | 3 | 1 |
| 5 | Bob | 2017-01-03 | 3 | 2 |
| 6 | Bill | 2017-01-04 | 3 | 4 |
| 7 | Kathy | 2017-01-04 | 3 | 4 |
| 8 | Anne | 2017-01-05 | 3 | 5 |
+---------+-------+------------+---------+------+
# Return the last person to join within each team based on user id
# Based on this Stack Overflow comment:
SELECT a.*
FROM users a
LEFT JOIN users b
ON a.team_id = b.team_id AND a.user_id < b.user_id
WHERE b.team_id IS NULL
or
SELECT a.*
FROM users a
WHERE user_id IN (
SELECT MAX(user_id)
FROM users
GROUP BY team_id
)
+---------+------+------------+---------+
| user_id | name | start_date | team_id |
+---------+------+------------+---------+
| 1 | Matt | 2017-01-01 | 1 |
| 3 | Sara | 2017-01-02 | 2 |
| 8 | Anne | 2017-01-05 | 3 |
+---------+------+------------+---------+
# Return the last people to join within each team based on start date
SELECT a.*
FROM users a
LEFT JOIN users b
ON a.team_id = b.team_id AND a.start_date < b.start_date
WHERE b.team_id IS NULL
# or, based on this groupwise max post:
SELECT a.*
FROM users a
INNER JOIN (
SELECT team_id, MAX(start_date) AS max_start_date
FROM users b
GROUP BY team_id
) max_start_dates
ON a.team_id = max_start_dates.team_id AND a.start_date = max_start_dates.max_start_date
+---------+------+------------+---------+
| user_id | name | start_date | team_id |
+---------+------+------------+---------+
| 1 | Matt | 2017-01-01 | 1 |
| 2 | John | 2017-01-02 | 2 |
| 3 | Sara | 2017-01-02 | 2 |
| 8 | Anne | 2017-01-05 | 3 |
+---------+------+------------+---------+
# Ranked with gaps
# Based on this Stack Overflow comment:
SELECT
user_id,
name,
start_date,
team_id,
rank
FROM (
SELECT
*,
IF(start_date = @_last_start_date, @cur_rank := @cur_rank, @cur_rank := @_sequence) AS rank,
@_sequence := @_sequence + 1,
@_last_start_date := start_date
FROM users, (SELECT @cur_rank := 1, @_sequence := 1, @_last_start_date := NULL) r
ORDER BY start_date
) ranked
# Notice that after the three tied for second earliest start date, the next one jumps to 5 (not 3):
+---------+-------+------------+---------+------+
| user_id | name | start_date | team_id | rank |
+---------+-------+------------+---------+------+
| 1 | Matt | 2017-01-01 | 1 | 1 |
| 2 | John | 2017-01-02 | 2 | 2 |
| 3 | Sara | 2017-01-02 | 2 | 2 |
| 4 | Tim | 2017-01-02 | 3 | 2 |
| 5 | Bob | 2017-01-03 | 3 | 5 |
| 6 | Bill | 2017-01-04 | 3 | 6 |
| 7 | Kathy | 2017-01-04 | 3 | 6 |
| 8 | Anne | 2017-01-05 | 3 | 8 |
+---------+-------+------------+---------+------+