We Keep Coding

Vuejs SyntaxError: Unexpected identifier

VUE debug mode report an error in this line of my code:
:style="{transform : 'translate3d(' + translateX + 'px,0, 0)'}"\
In the docs they don't explain how to paint a variable within a style binding.
You can check my vuejs component here:
Vue.component('vue-tab', {
template: '<template>\
<div class="tab-container">\
<ul class="tab-title-container">\
<li class="tab-title"\
v-for="(title,index) in tabtitles"\
:class="{active: index+1===currentPage}"\
:key="index"\
#click="setPage(index+1)">{{title}}\
</li>\
</ul>\
<!-- decide if bind touchstart -->\
<div v-if="slidable"\
class="tabswiper"\
:class="{invisible:invisible}"\
#touchstart="_onTouchStart">\
<div class="tabswiper-wrap"\
ref="tabswiper-wrap"\
:class="{dragging: dragging}"\
:style="{transform : 'translate3d(' + translateX + 'px,0, 0)'}"\
#transitionend="_onTransitionEnd">\
<slot></slot>\
</div>\
</div>\
<div v-else class="tabswiper"\
:class="{invisible:invisible}">\
<div class="tabswiper-wrap"\
ref="tabswiper-wrap"\
:class="{dragging: dragging}"\
:style="{'transform' : 'translate3d(' + translateX + 'px,0, 0)'}"\
#transitionend="_onTransitionEnd">\
<slot></slot>\
</div>\
</div>\
</div>\
</template>',
props: {
tabtitles: {
type: Array,
default: []
},
curPage: {
type: Number,
default: 1
},
slidable: {
type: Boolean,
default: true
}
},
watch: {
curPage: function (val) {
this.setPage(val)
}
},
data() {
return {
lastPage: 1,
currentPage: this.curPage,
translateX: 0,
startTranslateX: 0,
delta: 0,
deltaY: 0,
dragging: false,
startPos: null,
startPosY: null,
transitioning: false,
slideEls: [],
invisible: true,
judge: JUDGE_INITIAL,
};
},
mounted(){
this.$nextTick(function () {
this._onTouchMove = this._onTouchMove.bind(this);
this._onTouchEnd = this._onTouchEnd.bind(this);
this.slideEls = this.$refs['tabswiper-wrap'].children;
this.dragging = true;
this.setPage(this.currentPage);
let _this = this;
setTimeout(() => {
_this.dragging = _this.invisible = false;
}, 100)
window.onresize=()=>{
_this.setPage(_this.currentPage)
}
})
},
methods: {
next() {
var page = this.currentPage;
if (page < this.slideEls.length) {
page++;
this.setPage(page);
} else {
this._revert();
}
},
prev() {
var page = this.currentPage;
if (page > 1) {
page--;
this.setPage(page);
} else {
this._revert();
}
},
setPage(page) {
this.lastPage = this.currentPage;
this.currentPage = page;
this.translateX = -[].reduce.call(this.slideEls, function (total, el, i) {
//previousValue,currentValue,currentIndex
return i > page - 2 ? total : total + el['clientWidth'];
}, 0);
this._onTransitionStart();
},
_onTouchStart(e) {
this.startPos = this._getTouchPos(e);
this.startYPos = this._getTouchYPos(e);
this.delta = 0;
this.startTranslateX = this.translateX;
this.startTime = new Date().getTime();
this.dragging = true;
document.addEventListener('touchmove', this._onTouchMove, false);
document.addEventListener('touchend', this._onTouchEnd, false);
},
_onTouchMove(e) {
this.delta = this._getTouchPos(e) - this.startPos;
this.deltaY = Math.abs(this._getTouchYPos(e) - this.startYPos);
switch (this.judge) {
case JUDGE_INITIAL:
// if (Math.abs(this.delta) > 20 && this.deltaY<25) {//judge to allow/prevent scroll
if (Math.abs(this.delta) / this.deltaY > 1.5) {//judge to allow/prevent scroll
this.judge = JUDGE_SLIDEING
e.preventDefault();
e.stopPropagation()
} else {
this.judge = JUDGE_SCROLLING
}
break;
case JUDGE_SCROLLING:
break;
case JUDGE_SLIDEING:
e.preventDefault();
e.stopPropagation()
this.translateX = this.startTranslateX + this.delta;
break;
default:
break;
}
},
_onTouchEnd(e) {
this.dragging = false;
if (this.judge == JUDGE_SLIDEING) {
var isQuickAction = new Date().getTime() - this.startTime < 1000;
if (this.delta < -100 || (isQuickAction && this.delta < -15 && this.deltaY / this.delta > -6)) {
this.next();
} else if (this.delta > 100 || (isQuickAction && this.delta > 15 && this.deltaY / this.delta < 6)) {
this.prev();
} else {
this._revert();
}
}
this.judge = JUDGE_INITIAL
document.removeEventListener('touchmove', this._onTouchMove);
document.removeEventListener('touchend', this._onTouchEnd);
},
_revert() {
this.setPage(this.currentPage);
},
_getTouchPos(e) {
var key = 'pageX';
return e.changedTouches ? e.changedTouches[0][key] : e[key];
},
_getTouchYPos(e) {
var key = 'pageY';
return e.changedTouches ? e.changedTouches[0][key] : e[key];
},
_onTransitionStart() {
this.transitioning = true;
if (this._isPageChanged()) {
this.$emit('tab-change-start', this.currentPage);
//FIX:remove the height of the hidden tab-items
[].forEach.call(this.slideEls,(item,index)=>{
if (index== (this.currentPage-1)) {
removeClass(item,'hide-height')
}
else {
addClass(item,'hide-height')
}
})
} else {
this.$emit('tab-revert-start', this.currentPage);
}
},
_onTransitionEnd(e) {
e.stopPropagation()
if (e.target.className != 'tabswiper-wrap') return;
this.transitioning = false;
if (this._isPageChanged()) {
this.$emit('tab-change-end', this.currentPage);
} else {
this.$emit('tab-revert-end', this.currentPage);
}
},
_isPageChanged() {
return this.lastPage !== this.currentPage;
}
}
});

You could use a computed property.
computed: {
//however you want to call it
style() {
return {transform : 'translate3d(' + this.translateX + 'px, 0, 0)'}
}
}
To use it just change your binding to :style="this.style"

Jquery syntax error only in IE 11

I have a main page that load another html page with some javascript inside.
Unfortunately, in IE 11 the debugger retrieve me a syntax error in jquery.2.1.0.min.js. The javascript isn't executed at all.
With all other browsers the problem doesn't exist. I've checked the script with javascript lint, but there aren't significant error.
If you want the online test:
TwisteggUp, than click on "What" menu and than click on "Web" span.
//dichiarazioni globali
var servUrl;
var $currGallery;
var currPortrait;
var currTabIndex;
//switch iniziale
if ($('#pageType').attr('value') == 'web') {
servUrl = "/EggWS.asmx/GetWebProjects";
}
else {
servUrl = "/EggWS.asmx/GetGraphicProjects";
}
//richiesta Ajax
SwitchAjaxBrowser(servUrl);
//funzioni per richieste Ajax
function SwitchAjaxBrowser(servUrl) {
$.ajax({
url: servUrl,
dataType: "xml",
success: function (xml) { ProcessAjaxRequest(xml); },
error: function (xhr, status, error) {
console.log(xhr.status);
}
});
}
function ProcessAjaxRequest(xml) {
//crea oggetti progetto
console.log(xml);
var i = 0;
var pjCount = $(xml).find('Project').length;
$(xml).find('Project').each(function () {
var pjObject = $('#pj' + i);
console.log($(this).find('Name').text());
pjObject.children('.pjContent').children('.pjName').html($(this).find('Name').text());
pjObject.children('.pjContent').children('.pjDesc').load($(this).find('Description').text());
pjObject.children('.pjContent').children('.pjFullDesc').html($(this).find('FullDescription').text());
pjObject.children('.pjContent').children('.pjSkills').html($(this).find('Skills').text());
//popolo le info e la galleria nascosta
pjObject.children('.pjContent').children('.pjmImage').attr('src', $(this).find('MainImage').text());
//archivio i dati con le info delle immagini
$(this).find('ProjectImage').each(function () {
pjObject.children('.pjContent').children('.pjmImage').clone(false).attr('src', $(this).text()).removeClass('pjmImage').addClass('pjmDetailImageGallery').appendTo(pjObject.children('.pjContent').children('.pjGallery'));
});
//se è il terzo oggetto
if ((i > 0) && ((i + 1) % 3 == 0) && (i < (pjCount - 1))) {
pjObject.parent().clone().empty().insertAfter(pjObject.parent());
$('.pjPager').last().data('index', (i + 1) / 3);
pjObject.clone().attr('id', 'pj' + (i + 1)).appendTo($('.pjPager').last()).children('.pjContent').children('.pjGallery').html('');
} else
//se non è l'ultimo, clona l'oggetto
if (i < (pjCount - 1)) {
pjObject.clone().attr('id', 'pj' + (i + 1)).insertAfter(pjObject).children('.pjContent').children('.pjGallery').html('');
}
i++;
});
$('.pjLoad').fadeOut(500);
$('#pjGeneralContainer').children('.pjPager').fadeIn(500);
//correla l'evento di caricamento generale alla visualizzazione.
//$('#pjGeneralContainer').waitForImages(function () {
//});
//gestione dell'hovering per tutti i progetti
$('.pjContent').each(function () {
$(this).children('.pjDesc').mouseover(function (e) {
$(this).stop().animate({ height: '365px' }, { duration: 600, step: function (now) { $(this).css('height', now + 'px'); } });
});
});
$('.pjContent').each(function () {
$(this).children('.pjDesc').mouseout(function (e) {
$(this).stop().animate({ height: '30px' }, { duration: 600, step: function (now) { $(this).css('height', now + 'px'); } });
});
});
//popolamento scheda singolo progetto
$('.pjContent').on('click', function () {
PopulateDetailedContainer($(this));
});
$('.pjBtn').on('click', function () { moveGallery($(this)); });
//scomparsa dettaglio progetto
function CancelDetailedContainer() {
$('#pjDetailContainer').fadeOut(500);
$('#pjGeneralContainer').fadeIn(500);
$('.pjNav').fadeIn(500);
//svuoto le informazioni
$('.pjDetailmImage').attr('src', '');
$('.pjDetailTitle').html('');
$('.pjDetailFullDesc').html('');
$('.pjTab3Skill').html('');
$('.pjDetailGallery').html('');
//ripristino le condizioni iniziali
$('.pjDetailTab2').css('height', '100px');
$('.pjDetailTab3').css('height', '100px');
$('.pjBtn').removeClass('pjBtnDown');
$('.pjBtn').removeClass('pjBtnUp');
$('.pjBtn').addClass('pjBtnUp');
}
function PopulateDetailedContainer($projectContent) {
$currGallery = $projectContent.children('.pjGallery');
currTabIndex = 0;
//effetti di transizione
$('#pjGeneralContainer').fadeOut(500);
$('.pjNav').fadeOut(500);
$('#pjDetailContainer').fadeIn(500);
//popolo le informazioni
$('.pjDetailmImage').attr('src', $projectContent.children('.pjmImage').attr('src'));
var cancBtn = "<a class='btnDetailCancel' />";
$('.pjDetailTitle').html(cancBtn + $projectContent.children('.pjName').html());
$('.pjDetailTitle').children('.btnDetailCancel').on('click', function () { CancelDetailedContainer(); });
$('.pjDetailFullDesc').load($projectContent.children('.pjFullDesc').html());
$('.pjTab3Skill').load($projectContent.children('.pjSkills').html());
var sliderBtn = "<a class='sliderLeft'/><a class='sliderRight'/>";
$('.pjDetailGallery').html($projectContent.children('.pjGallery').html());
//controllo orientamento per galleria - inizializzazione owl
buildGallery();
$(window).resize(function () { moveGallery(null); });
}
function assignGalleryHeight() {
var wHeight = $('.SiteBody').height();
var galleryHeight = wHeight - 350;
var galleryWidth = $('.pjDetailGallery').width();
switch (currTabIndex) {
case 0:
$('.pjDetailTab2').css('height', '100px');
$('.pjDetailTab3').css('height', '100px');
break;
case 1:
$('.pjDetailTab2').css('height', (wHeight - 250) + 'px');
$('.pjDetailTab3').css('height', '100px');
break;
case 2:
$('.pjDetailTab2').css('height', (wHeight - 250) + 'px');
$('.pjDetailTab3').css('height', (wHeight - 250) + 'px');
break;
}
$('.pjmDetailImageGallery').removeAttr('style');
//se orizzontale una sola immagine, se verticale 2 immagini
if (localStorage['portrait'] == 'Y') {
$('.pjmDetailImageGallery').css('max-height', (galleryHeight - 30) + 'px');
$('.pjmDetailImageGallery').css('max-width', (galleryWidth) + 'px');
$('.pjmDetailImageGallery').css('margin-top', '0px');
//eliminazione visualizzazione speciale
$('.pjDetailmImage').removeAttr('style');
$('.pjDetailTab1').removeAttr('style');
$('.pjDetailFullDesc').removeAttr('style');
}
else {
$('.pjmDetailImageGallery').css('max-height', (galleryHeight - 50) / 2 + 'px');
$('.pjmDetailImageGallery').css('max-width', (galleryWidth) + 'px');
$('.pjmDetailImageGallery').css('margin-top', '10px');
//visualizzazione speciale
$('.pjDetailmImage').css('float', 'none');
$('.pjDetailmImage').css('height', '600px');
$('.pjDetailmImage').css('margin-top', '30px');
$('.pjDetailTab1').css('text-align', 'center');
$('.pjDetailTab1').css('text-align', 'center');
$('.pjDetailFullDesc').css('font-size', '150%');
}
}
function buildGallery() {
//azzeramento di sicurezza delle informazioni
var $pjDetailGallery = $('.pjDetailGallery');
$pjDetailGallery.html("");
if (typeof $pjDetailGallery.data('owlCarousel') != 'undefined') {
$pjDetailGallery.data('owlCarousel').destroy();
$pjDetailGallery.removeClass('owl-carousel');
}
//resetto i bottoni
currTabIndex = 0;
$('.pjTab2Title').children('div').removeClass('pjBtnDown');
if (!$('.pjTab2Title').children('div').hasClass('pjBtnUp'))
$('.pjTab2Title').children('div').addClass('pjBtnUp');
$('.pjTab3Title').children('div').removeClass('pjBtnDown');
if (!$('.pjTab3Title').children('div').hasClass('pjBtnUp'))
$('.pjTab3Title').children('div').addClass('pjBtnUp');
//recupero le info della galleria
if (localStorage['portrait'] == 'Y') {
//ricreo gli oggetti come erano
$('.pjDetailGallery').html($currGallery.html());
}
else {
//ricreo gli oggetti a coppie
k = 0;
$currGallery.children().each(function () {
if (k % 2 == 0) {
$pjDetailGallery.append("<div class='verticalGallery'></div>");
}
$(this).clone().appendTo($pjDetailGallery.children('div').last());
k++;
});
}
assignGalleryHeight();
if (localStorage['portrait'] == 'Y') {
$pjDetailGallery.owlCarousel({
items: 1,
itemsCustom: [0, 1],
scrollPerPage: true
});
}
else {
$pjDetailGallery.owlCarousel({
items: 1,
itemsCustom: [0, 1],
scrollPerPage: true
});
}
}
//gestione movimento tra schede del progetto singolo
function moveGallery($btn) {
var wHeight = $('.SiteBody').height();
//per il resize della finestra
if ($btn == null) {
//se è cambiato l'orientamento della pagina ricostruisco tutto
if (currPortrait != localStorage['portrait']) {
buildGallery();
currPortrait = localStorage['portrait'];
return;
}
assignGalleryHeight();
return;
}
//la finestra deve salire
if ($btn.hasClass('pjBtnUp')) {
$('.pjDetailGallery').css('height', (wHeight - 350) + 'px');
switch ($btn.data('index')) {
case 1:
$('.pjDetailTab2').stop().animate({ height: (wHeight - 250) + 'px' }, { duration: 600, step: function (now) { $(this).css('height', now + 'px'); } });
$btn.removeClass('pjBtnUp');
$btn.addClass('pjBtnDown');
currTabIndex = 1;
break;
case 2:
$('.pjDetailTab2').stop().animate({ height: (wHeight - 250) + 'px' }, { duration: 600, step: function (now) { $(this).css('height', now + 'px'); } });
$('.pjDetailTab3').stop().animate({ height: (wHeight - 250) + 'px' }, { duration: 600, step: function (now) { $(this).css('height', now + 'px'); } });
$btn.removeClass('pjBtnUp');
$btn.addClass('pjBtnDown');
$('.pjTab2Title').children('div').removeClass('pjBtnUp');
if (!$('.pjTab2Title').children('div').hasClass('pjBtnDown'))
$('.pjTab2Title').children('div').addClass('pjBtnDown');
currTabIndex = 2;
break;
default:
break;
}
}
//la finestra deve scendere
else {
switch ($btn.data('index')) {
case 1:
$('.pjDetailTab2').stop().animate({ height: '100px' }, { duration: 600, step: function (now) { $(this).css('height', now + 'px'); } });
$('.pjDetailTab3').stop().animate({ height: '100px' }, { duration: 600, step: function (now) { $(this).css('height', now + 'px'); } });
$btn.removeClass('pjBtnDown');
$btn.addClass('pjBtnUp');
$('.pjTab3Title').children('div').removeClass('pjBtnDown');
if (!$('.pjTab3Title').children('div').hasClass('pjBtnUp'))
$('.pjTab3Title').children('div').addClass('pjBtnUp');
currTabIndex = 0;
break;
case 2:
$('.pjDetailTab3').stop().animate({ height: '100px' }, { duration: 600, step: function (now) { $(this).css('height', now + 'px'); } });
$btn.removeClass('pjBtnDown');
$btn.addClass('pjBtnUp');
currTabIndex = 1;
break;
default:
break;
}
}
//checkGalleryPortrait();
}
//termine controllo caricamento portfolio
localStorage['folioisloading'] = 'N';
//Inizializzazione transizioni
InitiateTransition();
return false;
}
function InitiateTransition() {
var $main = $('#pjGeneralContainer'),
$pages = $main.children('div.pt-page'),
animcursor = 1,
pagesCount = $pages.length,
current = 0,
isAnimating = false,
endCurrPage = false,
endNextPage = false,
animEndEventNames = {
'WebkitAnimation': 'webkitAnimationEnd',
'OAnimation': 'oAnimationEnd',
'msAnimation': 'MSAnimationEnd',
'animation': 'animationend'
},
// animation end event name
animEndEventName = animEndEventNames[Modernizr.prefixed('animation')],
// support css animations
support = Modernizr.cssanimations;
function init() {
$pages.each(function () {
var $page = $(this);
$page.data('originalClassList', $page.attr('class'));
});
$pages.eq(current).addClass('pt-page-current');
CreateNav();
responsive();
}
function CreateNav() {
var i = 0;
//navigazione precedente
$('.pjNav').append("<a class='pjNavPrev pjNavIcon' />");
$('.pjNav').children().last().on('click', function () {
previousPager();
});
//navigazione checkbox
$main.children('.pjPager').each(function () {
var $pjPager = $(this);
$('.pjNav').append("<a class='pjNavButton' data-index='" + $pjPager.data('index') + "' />");
if (i == 0)
$('.pjNav').children().last().css('margin-left', '0px');
$('.pjNav').children().last().on('click', function () {
goToPager($pjPager.data('index'));
});
i++;
});
//navigazione successivo
$('.pjNav').append("<a class='pjNavNext pjNavIcon' />");
$('.pjNav').children().last().on('click', function () {
nextPager();
});
$('.pjNavButton').each(function () {
if ($(this).data('index') == 0)
$(this).addClass('pjNavButtonCurrent');
else
$(this).removeClass('pjNavButtonCurrent');
});
}
//funzioni di navigazione
function goToPager(toPageIndex) {
if (current == toPageIndex)
return false;
if (isAnimating)
return false;
isAnimating = true;
var $currPage = $pages.eq(current);
var $nextPage = $pages.eq(toPageIndex).addClass('pt-page-current');
//seleziono il bottone di navigazione corrente
$('.pjNavButton').each(function () {
if ($(this).data('index') == toPageIndex)
$(this).addClass('pjNavButtonCurrent');
else
$(this).removeClass('pjNavButtonCurrent');
});
//imposto lo stile dell'animazione
if (current > toPageIndex) {
outClass = 'pt-page-rotatePushRight';
inClass = 'pt-page-moveFromLeft';
}
else {
outClass = 'pt-page-rotatePushLeft';
inClass = 'pt-page-moveFromRight';
}
current = toPageIndex;
$currPage.addClass(outClass).on(animEndEventName, function () {
$currPage.off(animEndEventName);
endCurrPage = true;
if (endNextPage) {
onEndAnimation($currPage, $nextPage);
}
});
$nextPage.addClass(inClass).on(animEndEventName, function () {
$nextPage.off(animEndEventName);
endNextPage = true;
if (endCurrPage) {
onEndAnimation($currPage, $nextPage);
}
});
if (!support) {
onEndAnimation($currPage, $nextPage);
}
}
function nextPager() {
if (current < pagesCount - 1) {
goToPager(current + 1);
}
}
function previousPager() {
if (current > 0) {
goToPager(current - 1);
}
}
function onEndAnimation($outpage, $inpage) {
endCurrPage = false;
endNextPage = false;
resetPage($outpage, $inpage);
isAnimating = false;
//animazione di transizione completata.-> da inserire qui animazione dei progetti (se la facciamo).
}
function resetPage($outpage, $inpage) {
$outpage.attr('class', $outpage.data('originalClassList'));
$inpage.attr('class', $inpage.data('originalClassList') + ' pt-page-current');
}
//funzione per lo scroll
function responsive() {
$(document).bind("swipeRight", function (event) {
event.preventDefault();
nextPager();
}).bind("swipeLeft", function (event) {
event.preventDefault();
previousPager();
});
$(document).bind('mousewheel DOMMouseScroll', function (event) {
event.preventDefault();
var delta = event.originalEvent.deltaX;
init_scroll(event, delta);
});
}
//funzione accessoria per lo scroll
function init_scroll(event, delta) {
// Cancel scroll if currently animating or within quiet period
if (isAnimating) {
event.preventDefault();
return;
}
if (delta < 0) {
nextPager();
} else {
if (delta > 0) {
previousPager();
}
}
}
//mappatura con le freccie su/giù
$(document).keydown(function (e) {
var tag = e.target.tagName.toLowerCase();
switch (e.which) {
case 37:
if (tag != 'input' && tag != 'textarea') previousPager();
break;
case 39:
if (tag != 'input' && tag != 'textarea') nextPager();
break;
default: return;
}
});
//gestione dei tab singolo progetto
init();
return { init: init };
}

I've solved!
I don't know why, but for IE the piece of code:
$(document).keydown(function (e) {
var tag = e.target.tagName.toLowerCase();
switch (e.which) {
case 37:
if (tag != 'input' && tag != 'textarea') previousPager();
break;
case 39:
if (tag != 'input' && tag != 'textarea') nextPager();
break;
default: return;
}
});
Inside the internal script causes syntax error.
I have the same code in the main page with other (e.which) and there it works. Such a mistery!

jQuery: How can I put two of these elements on the same page?

I am using the following script, but if I put more than 1 occurrence on the same page, it breaks. I am trying to get it to where I can put multiple carousels on the same page.
HTML:
<div class="carousel_outer">
<div class="portfolio-carousel horizontal">
<div class="carousel" id="carousel1">
<div class="carousel_container carousel1">
<ul class="portfolio-wrap carousel1">
<li><a class="gall_thumb" href="#" title="First Pic"><img src="#" alt="First Pic" /></a></li>
<li><a class="gall_thumb" href="#" title="Second Pic"><img src="#" alt="Second Pic" /></a></li>
</ul>
</div>
<a class="carousel_prev" href="#">Previous</a>
<a class="carousel_next" href="#">Next</a>
</div>
</div>
</div>
Javascript on the page:
$('.carousel').mycarousel({
delay: 150,
fade:300,
slide: 700,
effect:'slide',
orientation:'horizontal',
loop: false,
autoplay: false
});
And the actual carousel javascript:
(function ($) {
$.fn.extend({
mycarousel: function (options) {
var defaults = {
delay: 150,
fade: 300,
slide: 500,
effect: "fade",
orientation: "horizontal",
captionFade: 150,
loop: false,
autoplay: true,
time: 3000
};
var options = $.extend(defaults, options);
return this.each(function () {
var o = options;
var carousel = this;
$carousel_container = $(carousel).find(".carousel_container");
$li = $(carousel).find(".carousel_container ul li");
var visible_width = parseInt($carousel_container.css("width"), 10);
var visible_height = parseInt($carousel_container.css("height"), 10);
var number_items = $li.size();
var item_width = parseInt($li.css("width"), 10);
var item_height = parseInt($li.css("height"), 10);
var item_marginRight = parseInt($li.css("marginRight"), 10);
var item_marginLeft = parseInt($li.css("marginLeft"), 10);
var item_marginTop = parseInt($li.css("marginTop"), 10);
var item_marginBottom = parseInt($li.css("marginBottom"), 10);
if (o.orientation == "horizontal") {
var visible_items = Math.ceil(visible_width / (item_width + item_marginRight + item_marginLeft));
} else {
var visible_items = Math.ceil(visible_height / (item_height + item_marginTop + item_marginBottom));
}
var slides = Math.ceil(number_items / visible_items);
$float_easing = "easeInOutQuart";
function set_item_classes_visibility() {
$li.each(function (index) {
var class_number = Math.floor((index + visible_items) / visible_items);
$(this).addClass("visible_" + class_number);
if (class_number == "1") {
$(this).css("display", "block");
$(this).find(".inner").css("display", "block");
} else {
$(this).css("display", "none");
$(this).find(".inner").css("display", "none");
}
});
}
set_item_classes_visibility();
function set_next_prev_classes() {
var visible_item_class = $(carousel).find(".carousel_container ul li:visible").attr("class");
var visible_id = visible_item_class.split("_");
if (!o.loop) {
if (visible_id[1] == "1") {
$(".carousel_prev").addClass("disable");
} else {
$(".carousel_prev").removeClass("disable");
}
if (visible_id[1] == slides) {
$(".carousel_next").addClass("disable");
} else {
$(".carousel_next").removeClass("disable");
}
}
}
set_next_prev_classes();
function set_item_position() {
$li.each(function () {
$(this).css("display", "none");
$(this).css("position", "absolute");
if (o.orientation == "horizontal") {
$(this).css("top", "0");
$(this).css("left", visible_width + parseInt($carousel_container.css("paddingLeft")) + parseInt($carousel_container.css("paddingRight")), 10);
} else {
if (o.orientation == "vertical") {
$(this).css("left", "0");
$(this).css("top", visible_height + parseInt($carousel_container.css("paddingTop")) + parseInt($carousel_container.css("paddingBottom")), 10);
}
}
});
$carousel_container.find("li.visible_1").each(function (index) {
$(this).css("display", "block");
if (o.orientation == "horizontal") {
var left_position = (index * (item_width + item_marginRight + item_marginLeft)) + parseInt($carousel_container.css("paddingLeft"), 10);
$(this).css("left", left_position);
} else {
if (o.orientation == "vertical") {
var top_position = (index * (item_height + item_marginTop + item_marginBottom)) + parseInt($carousel_container.css("paddingTop"), 10);
$(this).css("top", top_position);
}
}
});
}
if (o.effect == "slide") {
set_item_position();
}
function show_next_prev(method) {
function show_items_fade(id) {
var next_class_name = "visible_" + id;
$carousel_container.find("li." + next_class_name).css("display", "block");
$carousel_container.find("li." + next_class_name).each(function (index) {
var delay = (index) * o.delay;
if (method == "prev") {
var delay = ((visible_items - 1) - index) * o.delay;
}
var index_item = (index + 1);
$(this).find(".inner").delay(delay).fadeIn(o.fade, function () {
if (index_item == visible_items || id == slides) {
set_next_prev_classes();
}
});
});
}
function show_items_slide(id) {
var next_class_name = "visible_" + id;
$carousel_container.find("li." + next_class_name + " .inner").css("display", "block");
$carousel_container.find("li." + next_class_name).each(function (index) {
$(this).css("display", "block");
var delay = (index) * o.delay;
if (method == "prev") {
var delay = ((visible_items - 1) - index) * o.delay;
}
var index_item = (index + 1);
if (o.orientation == "horizontal") {
var left_position = (index * (item_width + item_marginRight + item_marginLeft)) + parseInt($carousel_container.css("paddingLeft"), 10);
$(this).delay(delay).animate({
left: left_position
}, o.slide, $float_easing, function () {
if (index_item == visible_items || id == slides) {
set_next_prev_classes();
}
});
} else {
if (o.orientation == "vertical") {
var top_position = (index * (item_height + item_marginTop + item_marginBottom)) + parseInt($carousel_container.css("paddingTop"), 10);
$(this).delay(delay).animate({
top: top_position
}, o.slide, $float_easing, function () {
if (index_item == visible_items || id == slides) {
set_next_prev_classes();
}
});
}
}
});
}
var visible_item_class = $carousel_container.find("li:visible").attr("class");
visible_id = visible_item_class.split("_");
var next_id = parseInt(visible_id[1], 10) + 1;
var prev_id = parseInt(visible_id[1], 10) - 1;
if (visible_id[1] == 1) {
prev_id = slides;
}
if (visible_id[1] == slides) {
next_id = 1;
}
switch (o.effect) {
case "fade":
$carousel_container.find("li:visible").each(function (index) {
var delay = (index) * o.delay;
var index_item = (index + 1);
var last_item = $carousel_container.find("li." + visible_item_class).size();
if (method == "prev") {
delay = ((visible_items - 1) - index) * o.delay;
last_item = 1;
}
$(this).find(".inner").delay(delay).fadeOut(o.fade, function () {
if (index_item == last_item) {
$("li." + visible_item_class).css("display", "none");
if (method == "next") {
show_items_fade(next_id);
} else {
if (method == "prev") {
show_items_fade(prev_id);
}
}
}
});
});
break;
case "slide":
$carousel_container.find("li.visible_" + prev_id).each(function (index) {
if (o.orientation == "horizontal") {
if (method == "next") {
var left_position = visible_width + parseInt($carousel_container.css("paddingLeft"), 10) + parseInt($carousel_container.css("paddingRight"), 10);
} else {
if (method == "prev") {
var left_position = "-" + item_width + "px";
}
}
$(this).css("left", left_position);
} else {
if (o.orientation == "vertical") {
if (method == "next") {
var top_position = visible_height + parseInt($carousel_container.css("paddingTop"), 10) + parseInt($carousel_container.css("paddingBottom"), 10);
} else {
if (method == "prev") {
var top_position = "-" + item_height + "px";
}
}
$(this).css("top", top_position);
}
}
});
$carousel_container.find("li." + visible_item_class).each(function (index) {
var delay = (index) * o.delay;
var zindex = index + 10;
var index_item = (index + 1);
var last_item = $carousel_container.find("li." + visible_item_class).size();
if (method == "prev") {
delay = ((visible_items - 1) - index) * o.delay;
zindex = ((visible_items - 1) - index) + 10;
last_item = 1;
}
$(this).css("z-index", zindex);
if (o.orientation == "horizontal") {
if (method == "next") {
var left_position = "-" + item_width;
} else {
if (method == "prev") {
var left_position = visible_width + parseInt($carousel_container.css("paddingLeft"), 10) + parseInt($carousel_container.css("paddingRight"), 10);
}
}
$(this).delay(delay).animate({
left: left_position
}, o.slide, $float_easing, function () {
if (index_item == last_item) {
$("li." + visible_item_class).css("display", "none");
if (method == "next") {
show_items_slide(next_id);
} else {
if (method == "prev") {
show_items_slide(prev_id);
}
}
}
});
} else {
if (o.orientation == "vertical") {
if (method == "next") {
var top_position = "-" + item_height;
} else {
if (method == "prev") {
var top_position = visible_height + parseInt($carousel_container.css("paddingTop"), 10) + parseInt($carousel_container.css("paddingBottom"), 10);
}
}
$(this).delay(delay).animate({
top: top_position
}, o.slide, $float_easing, function () {
if (index_item == last_item) {
$("li." + visible_item_class).css("display", "none");
if (method == "next") {
show_items_slide(next_id);
} else {
if (method == "prev") {
show_items_slide(prev_id);
}
}
}
});
}
}
});
break;
}
}
if (o.autoplay) {
var interval = setInterval(function () {
var visible_item_class = $(carousel).find(".carousel_container ul li:visible").attr("class");
var visible_id = visible_item_class.split("_");
if (!o.loop) {
if (visible_id[1] == slides) {
clearInterval(interval);
} else {
show_next_prev("next");
}
} else {
show_next_prev("next");
}
}, o.time);
}
$(carousel).find(".carousel_next").click(function () {
clearInterval(interval);
show_next_prev("next");
return (false);
});
$(carousel).find(".carousel_prev").click(function () {
clearInterval(interval);
show_next_prev("prev");
return (false);
});
$li.hover(function () {
clearInterval(interval);
$(this).find(".caption").fadeIn(o.captionFade);
}, function () {
$(this).find(".caption").fadeOut(o.captionFade);
});
});
}
});
})(jQuery);
I'm thinking if there is some way I can identify each carousel with an ID and the script only executes things within each ID it would work, but I can't figure out how to get it done.
EDIT: I am getting the following js console error when I click a next/prev button: visible_item_class is undefined

Give them each an unique ID and call them by that.
$('#carousel1').mycarousel({
theid: $(this).attr('id'),
delay: 150,
fade:300,
slide: 700,
effect:'slide',
orientation:'horizontal',
loop: false,
autoplay: false
});
$('#carousel2').mycarousel({
theid: $(this).attr('id'),
delay: 150,
fade:300,
slide: 700,
effect:'slide',
orientation:'horizontal',
loop: false,
autoplay: false
});
On a side note is the following line necessary:
theid: $(this).attr('id')
I don't see it used anywhere in the carousel code.

Based on the function set_next_prev_classes in the plugin, the problem is probably that your 'next' and 'previous' buttons share a common class. (The plugin shouldn't do things this way, but there it is anyway.)
The solution should be as simple as giving each carousel DISTINCT class names for their 'next' and 'previous' buttons -- this can be as simple as appending the numbers 1 and 2 to each. (And then tell the plugin author that this approach is causing problems.)

Two ways to fix the problem.
Change the carousel code to take id of the div used as carousel , and carousel controls.
Copy the carousel code two times.Replace ".carousel" with "#Id1" in first and "#Id2" in second.Then the controls will be "#Id1_next", "#Id1_prev".
This is kind of hacky but cant help it.

Too much recursion Error in jQuery-1.7.2,is jquery error?

too much recursion error occur when i execute autocomplete.js today.Before today i never see like this error in jquery when i execute autocomplete.js. i am using jQuery 1.7.2
$(function(){
$("#search_text").keyup(function(e){
var sVal = $(this).val();
if(e.which == 27) {
$('#sresult_container').remove();
return;
}
if(e.which != 40 && e.which != 38) {
$("#search").removeAttr('disabled');
$.post('http://localhost/website/index.php/search/ajaxResults',{Search:sVal},function(data){
if(data != "$$$" && data.length != 0) {
var sData = data;
var flag1 = 0;
var flag2 = 0;
var tabindex = -1;
var aFarray = sData.split('$$$');
$('#sresult_container').remove();
var $sresult_container = $('<div id="sresult_container"></div>')
.css({'position':'absolute','border':'1px solid','background-color':'white','z-index':'10000000','width':'309px'});
for(var i=0;i<aFarray.length;i++) {
var a = aFarray[i].split('|||');
if(i == 0 && a[0] != "") {
flag1 = 1;
$pages = $('<div id="pages"></div>');
$text1 = $('<p></p>').css({'background-color':'silver','text-align':'center','padding':'3px'}).text("Pages");
$pages.append($text1);
if(a.length > 5) {
a = a.slice(0,5);
}
for(var j=1;j<a.length+1;j++) {
tabindex++;
$('<div>/div>').css({'padding':'5px','text-align':'center'}).text(a[j-1]).attr({'tabindex':tabindex,'class':'result'}).appendTo($pages);
}
}
if(i == 1 && a[0] != "") {
flag2 = 1;
$articles = $('<div id="articles"></div>');
$text2 = $("<p></p>").css({'background-color':'silver','text-align':'center','padding':'3px'}).text("Articles");
$articles.append($text2);
if(a.length > 5) {
a = a.slice(0,5);
}
for(var j=0;j<a.length;j++) {
tabindex++;
$('<div></div>').css({'padding':'5px','text-align':'center'}).text(a[j]).attr({'tabindex':tabindex,'class':'result'}).appendTo($articles);
}
}
}
if(flag1 == 0)
{
$articles.children().first().remove();
$div = $sresult_container.append($articles);
}else if(flag2 == 0)
{
$pages.children().first().remove();
$div = $sresult_container.append($pages);
}else
{
$div = $sresult_container.append($pages,$articles);
}
tabindex++;
$allresluts = $('<div id="allresults"></div>').css({'padding':'5px','text-align':'center','background-color':'#FBEE92','color':'#CC3333'}).text("See All Results").attr('tabindex',tabindex).appendTo($div);
var bottom = $('#search_text').offset();
var height = $('#search_text').outerHeight();
var left = bottom.left;
var top = bottom.top+height;
$div.offset({'top':top,'left':left});
$('body').append($div);
}
else
{
$('#sresult_container').remove();
$("#search").attr('disabled','true');
}
});
}
else
{
$con_div = $('#sresult_container').children().children('div').add($('#sresult_container').children().last());
var tabindex = $con_div.length - 1;
if(e.which == 40)
{
$con_div.first().addClass("selected").focus();
var index = $con_div.first().index(this)+1;
$con_div.bind({
keydown: function(e) {
e.preventDefault();
var key = e.keyCode;
var target = $(e.target);
switch(key) {
case 38: // arrow up
if(index == 0)
{
index = tabindex+1;
}
$con_div[--index].focus();
break;
case 40: // arrow down
if(index > tabindex-1)
{
index = -1;
}
$con_div[++index].focus();
break;
case 13: //Enter
if(target.hasClass('result') == true)
{
$("#search_text").val(target.text());
$("#search").focus();
}
else
{
$('#search').click();
}
$div.remove();
break;
case 27://Esc
$div.remove();
$("#search_text").focus();
break;
}
},
focusin: function(e) {
$(e.currentTarget).addClass("selected");
},
focusout: function(e) {
$con_div.removeClass("selected");
$(e.currentTarget).removeClass("selected");
}
});
}
}
setTimeout(function()
{
$con_div = $('#sresult_container').children().children('div').add($('#sresult_container').children().last());
$con_div.live({
click : function(e){
var $target = $(e.target);
if($target.hasClass('result') == true)
{
$("#search_text").val($target.text());
$("#search").focus();
}
else
{
$('#search').click();
}
$('#sresult_container').remove();
},
mouseover : function(e){
var $target = $(e.target);
if($target.hasClass('result') == true || $target.is('#allresults'))
{
$(e.target).css('cursor','pointer');
$con_div.removeClass("selected");
$(e.target).addClass("selected");
}
},
mouseout : function(){
$con_div.removeClass("selected");
}
});
}, 200 );
});
$("#search_text").blur(function(e){
$con_div = $('#sresult_container').children().children('div').add($('#sresult_container').children().last());
if($con_div.hasClass('selected') != true)
{
$("#sresult_container").remove();
}
});
});
I got error in $('#search').click(); inside the code.

Ok, can you spot a syntax error here?

Eclipse is givign me a syntax error along these lines but I don't see anything wrong there:
$('.addNewFolder').click(function() {
showModal('modal_div', 'Nový adresár');
var id = '<?php echo ToHtml($idFolder); ?>';
$('.folders .trow1').each(function() {
if ($(this).css('backgroundColor') == 'rgb(52, 108, 182)' || $(this).css('backgroundColor') == '#346cb6') {
id = $(this).attr('rel');
}
});
ajaxElementCall('modal_div', 'body/obsah/obrazy/folderAdd.php?idFolder='+id);
});
After PHP parsing:
$('.addNewFolder').click(function() {
showModal('modal_div', 'Nový adresár');
var id = '';
$('.folders .trow1').each(function() {
if ($(this).css('backgroundColor') == 'rgb(52, 108, 182)' || $(this).css('backgroundColor') == '#346cb6') {
id = $(this).attr('rel');
}
});
ajaxElementCall('modal_div', 'body/obsah/obrazy/folderAdd.php?idFolder='+id);
});
This is what IDE says:
Syntax error on token "}", invalid MethodHeaderName
I've been staring at that code for at least half an hour. I am either blind or going crazy.
EDIT:
The whole javascript on the page:
<script type="text/javascript">
//<!--
$(document).ready(function() {
function in_array (needle, haystack, argStrict) {
var key = '', strict = !!argStrict;
if (strict) {
for (key in haystack) {
if (haystack[key] === needle) {
return true; }
}
} else {
for (key in haystack) {
if (haystack[key] == needle) {
return true;
}
}
}
return false;
}
var openedFolders = new Array();
<?php if (count($_SESSION['ECM']['openedSlideFolders']) > 0) : ?>
<?php $i = 0; foreach ($_SESSION['ECM']['openedSlideFolders'] as $aVal): ?>
<?php echo "openedFolders[$i] = '$aVal';\n"; ?>
<?php ++$i; endforeach; ?>
<?php endif; ?>
var start = 0;
var stop = 0;
$('.drag').each(function() {
var draggables = $(this).parents('table').find('.drag');
var $next = draggables.filter(':gt(' + draggables.index(this) + ')').first();
var width = $(this).css('width');
var nextWidth = $next.css('width');
if (nextWidth > width && 30 == parseInt(width)) {
$(this).removeClass('ordinaryFolderClosed');
$(this).removeClass('ordinaryFolderOpened');
if (in_array($(this).attr('rel'), openedFolders)) {
$(this).addClass('ordinaryFolderOpened');
} else {
$(this).addClass('ordinaryFolderClosed');
}
}
if (in_array($(this).attr('rel'), openedFolders)) {
start = 1;
}
if (1 == start && stop < 2) {
if (30 == parseInt(width)) {
stop++;
}
} else {
start = 0;
stop = 0;
if (parseInt(width) > 30) {
$(this).parent().parent().hide();
}
}
});
function dragDrop()
{
$('.folders .trow1').hover(
function () {
if ($(this).css('backgroundColor') != 'rgb(52, 108, 182)' && $(this).css('backgroundColor') != '#346cb6') {
$(this).css('background', "#C2E3EF");
}
},
function () {
if ($(this).css('backgroundColor') != 'rgb(52, 108, 182)' && $(this).css('backgroundColor') != '#346cb6') {
$(this).css('background', 'transparent');
}
}
);
$('.drag').click(function() {
var draggables = $(this).parents('table').find('.drag');
var $next = draggables.filter(':gt(' + draggables.index(this) + ')').first();
var width = $(this).css('width');
var nextWidth = $next.css('width');
if (nextWidth > width && 30 == parseInt(width)) {
var isVisible = $next.is(':visible');
if (isVisible) {
$(this).removeClass('ordinaryFolderClosed');
$(this).removeClass('ordinaryFolderOpened');
$(this).addClass('ordinaryFolderClosed');
} else {
$(this).removeClass('ordinaryFolderClosed');
$(this).removeClass('ordinaryFolderOpened');
$(this).addClass('ordinaryFolderOpened');
}
clickedId = $(this).attr('rel');
$.ajax({
type: 'POST',
url: 'body/obsah/obrazy/setOpenedFolder.php',
data: 'id='+clickedId,
success: function(msg){
//alert(msg);
}
});
var start = 0;
var stop = 0;
var i = 0;
$('.drag').each(function() {
if (0 == start) {
iteratedId = $(this).attr('rel');
if (iteratedId == clickedId) {
start = 1;
}
}
if (1 == start && stop < 2) {
if ($(this).css('width') > width) {
if (isVisible) {
$(this).parent().parent().hide();
} else {
$(this).parent().parent().show();
}
} else {
stop++;
}
}
i++;
});
}
});
var dragId = 0;
var dropId = 0;
var isFile = false;
$('.drag').mousedown(function() {
if ($(this).attr('rel') !== undefined) {
dragId = $(this).attr('rel');
dragId = dragId.split(',');
dragId = dragId[0];
}
isFile = false;
});
$('.drag2').mousedown(function() {
if ($(this).attr('rel') !== undefined) {
dragId = $(this).attr('rel');
dragId = dragId.split(',');
dragId = dragId[0];
}
isFile = true;
});
$('.drag').draggable({
revert: true,
cursorAt: {top: 0, left: 0}
});
$('.drag2').draggable({
revert: true,
cursorAt: {top: 0, left: 0}
});
$('.drop').droppable({
tolerance: 'pointer',
drop: function() {
if ($(this).attr('rel') !== undefined) {
dropId = $(this).attr('rel');
dropId = dropId.split(',');
dropId = dropId[0];
if (dropId != dragId) {
if (false == isFile) {
$.ajax({
type: 'POST',
url: 'body/obsah/obrazy/folderMove.php',
data: 'nid='+dragId+'&pid='+dropId,
success: function(msg){
<?php echo $aJsOnDrop; ?>;
dragDrop();
}
});
} else if (true == isFile) {
$.ajax({
type: 'POST',
url: 'body/obsah/obrazy/slideMove.php',
data: 'fid='+dragId+'&did='+dropId,
success: function(msg){
<?php echo $aJsOnDrop; ?>;
dragDrop();
}
});
}
}
}
}
});
}
dragDrop();
$('.folderListOnclick').click(function() {
var append = 'idFolder='+$(this).attr('rel')+'&browse=<?php echo $browse; ?>';
ajaxElementCall('obrazy_list', '<?php echo $dirPrefixBody; ?>/listBase.php?'+append);
dragDrop();
$('.trow1').css('background', 'transparent');
$('.trow1').css('color', '#3e4245');
$(this).parent().css('background', "#346cb6 url('img/menuButtonOver.png') left top repeat-x");
$(this).parent().css('color', 'white');
});
$('.rootFolderListOnclick').click(function() {
window.location = 'navigator.php?kam=obrazy';
dragDrop();
});
$('.folderEditOnclick').click(function() {
var append = 'idFolder='+$(this).attr('rel');
showModal('modal_div', 'Editácia adresára');
ajaxElementCall('modal_div', '<?php echo $dirPrefixBody; ?>/folderEdit.php?kam=edit1&'+append);
});
$('.folderDeleteOnclick').click(function() {
var append = 'idFolder='+$(this).attr('rel');
showModal('modal_div', 'Vymazanie adresára');
// TODO 0 Nemam sajnu, aka chyba je tuna - Eclipse mi tu hadze syntax error
ajaxElementCall('modal_div', '<?php echo $dirPrefixBody; ?>/folderDelete.php?kam=del1&'+append);
});
$('.addNewFolder').click(function() {
showModal('modal_div', 'Nový adresár');
var id = '<?php echo ToHtml($idFolder); ?>';
$('.folders .trow1').each(function() {
if ($(this).css('backgroundColor') == 'rgb(52, 108, 182)' || $(this).css('backgroundColor') == '#346cb6') {
id = $(this).attr('rel');
}
});
ajaxElementCall('modal_div', 'body/obsah/obrazy/folderAdd.php?idFolder='+id);
});
}); //-->
</script>
After PHP parsing:
<script type="text/javascript">
//<!--
$(document).ready(function() {
function in_array (needle, haystack, argStrict) {
var key = '', strict = !!argStrict;
if (strict) {
for (key in haystack) {
if (haystack[key] === needle) {
return true; }
}
} else {
for (key in haystack) {
if (haystack[key] == needle) {
return true;
}
}
}
return false;
}
var openedFolders = new Array();
openedFolders[0] = '3';
var start = 0;
var stop = 0;
$('.drag').each(function() {
var draggables = $(this).parents('table').find('.drag');
var $next = draggables.filter(':gt(' + draggables.index(this) + ')').first();
var width = $(this).css('width');
var nextWidth = $next.css('width');
if (nextWidth > width && 30 == parseInt(width)) {
$(this).removeClass('ordinaryFolderClosed');
$(this).removeClass('ordinaryFolderOpened');
if (in_array($(this).attr('rel'), openedFolders)) {
$(this).addClass('ordinaryFolderOpened');
} else {
$(this).addClass('ordinaryFolderClosed');
}
}
if (in_array($(this).attr('rel'), openedFolders)) {
start = 1;
}
if (1 == start && stop < 2) {
if (30 == parseInt(width)) {
stop++;
}
} else {
start = 0;
stop = 0;
if (parseInt(width) > 30) {
$(this).parent().parent().hide();
}
}
});
function dragDrop()
{
$('.folders .trow1').hover(
function () {
if ($(this).css('backgroundColor') != 'rgb(52, 108, 182)' && $(this).css('backgroundColor') != '#346cb6') {
$(this).css('background', "#C2E3EF");
}
},
function () {
if ($(this).css('backgroundColor') != 'rgb(52, 108, 182)' && $(this).css('backgroundColor') != '#346cb6') {
$(this).css('background', 'transparent');
}
}
);
$('.drag').click(function() {
var draggables = $(this).parents('table').find('.drag');
var $next = draggables.filter(':gt(' + draggables.index(this) + ')').first();
var width = $(this).css('width');
var nextWidth = $next.css('width');
if (nextWidth > width && 30 == parseInt(width)) {
var isVisible = $next.is(':visible');
if (isVisible) {
$(this).removeClass('ordinaryFolderClosed');
$(this).removeClass('ordinaryFolderOpened');
$(this).addClass('ordinaryFolderClosed');
} else {
$(this).removeClass('ordinaryFolderClosed');
$(this).removeClass('ordinaryFolderOpened');
$(this).addClass('ordinaryFolderOpened');
}
clickedId = $(this).attr('rel');
$.ajax({
type: 'POST',
url: 'body/obsah/obrazy/setOpenedFolder.php',
data: 'id='+clickedId,
success: function(msg){
//alert(msg);
}
});
var start = 0;
var stop = 0;
var i = 0;
$('.drag').each(function() {
if (0 == start) {
iteratedId = $(this).attr('rel');
if (iteratedId == clickedId) {
start = 1;
}
}
if (1 == start && stop < 2) {
if ($(this).css('width') > width) {
if (isVisible) {
$(this).parent().parent().hide();
} else {
$(this).parent().parent().show();
}
} else {
stop++;
}
}
i++;
});
}
});
var dragId = 0;
var dropId = 0;
var isFile = false;
$('.drag').mousedown(function() {
if ($(this).attr('rel') !== undefined) {
dragId = $(this).attr('rel');
dragId = dragId.split(',');
dragId = dragId[0];
}
isFile = false;
});
$('.drag2').mousedown(function() {
if ($(this).attr('rel') !== undefined) {
dragId = $(this).attr('rel');
dragId = dragId.split(',');
dragId = dragId[0];
}
isFile = true;
});
$('.drag').draggable({
revert: true,
cursorAt: {top: 0, left: 0}
});
$('.drag2').draggable({
revert: true,
cursorAt: {top: 0, left: 0}
});
$('.drop').droppable({
tolerance: 'pointer',
drop: function() {
if ($(this).attr('rel') !== undefined) {
dropId = $(this).attr('rel');
dropId = dropId.split(',');
dropId = dropId[0];
if (dropId != dragId) {
if (false == isFile) {
$.ajax({
type: 'POST',
url: 'body/obsah/obrazy/folderMove.php',
data: 'nid='+dragId+'&pid='+dropId,
success: function(msg){
ajaxElementCall('__folderList', 'body/obsah/obrazy/folders.php?browse=0&idFolder=', 'obrazy_list', 'body/obsah/obrazy/listBase.php?browse=0&idFolder=');
dragDrop();
}
});
} else if (true == isFile) {
$.ajax({
type: 'POST',
url: 'body/obsah/obrazy/slideMove.php',
data: 'fid='+dragId+'&did='+dropId,
success: function(msg){
ajaxElementCall('__folderList', 'body/obsah/obrazy/folders.php?browse=0&idFolder=', 'obrazy_list', 'body/obsah/obrazy/listBase.php?browse=0&idFolder=');
dragDrop();
}
});
}
}
}
}
});
}
dragDrop();
$('.folderListOnclick').click(function() {
var append = 'idFolder='+$(this).attr('rel')+'&browse=0';
ajaxElementCall('obrazy_list', 'body/obsah/obrazy/listBase.php?'+append);
dragDrop();
$('.trow1').css('background', 'transparent');
$('.trow1').css('color', '#3e4245');
$(this).parent().css('background', "#346cb6 url('img/menuButtonOver.png') left top repeat-x");
$(this).parent().css('color', 'white');
});
$('.rootFolderListOnclick').click(function() {
window.location = 'navigator.php?kam=obrazy';
dragDrop();
});
$('.folderEditOnclick').click(function() {
var append = 'idFolder='+$(this).attr('rel');
showModal('modal_div', 'Editácia adresára');
ajaxElementCall('modal_div', 'body/obsah/obrazy/folderEdit.php?kam=edit1&'+append);
});
$('.folderDeleteOnclick').click(function() {
var append = 'idFolder='+$(this).attr('rel');
showModal('modal_div', 'Vymazanie adresára');
// TODO 0 Nemam sajnu, aka chyba je tuna - Eclipse mi tu hadze syntax error
ajaxElementCall('modal_div', 'body/obsah/obrazy/folderDelete.php?kam=del1&'+append);
});
$('.addNewFolder').click(function() {
showModal('modal_div', 'Nový adresár');
var id = '';
$('.folders .trow1').each(function() {
if ($(this).css('backgroundColor') == 'rgb(52, 108, 182)' || $(this).css('backgroundColor') == '#346cb6') {
id = $(this).attr('rel');
}
});
ajaxElementCall('modal_div', 'body/obsah/obrazy/folderAdd.php?idFolder='+id);
});
}); //-->
</script>

Having looked at the whole code (and pasted it, minus the PHP content, into The Online Lint), I'd still say that there's no syntax error in the Javascript, and that if that if Eclipse is telling you that there is, then Eclipse is wrong. Sometimes tools aren't perfect.
Does the code run, in different browsers? Chances are relatively good that if it does, then there's not actually a syntax error there.
(Posted as answer as requested. Ta.)

Try removing the accented characters in your quotes, you can still output accents, but use the corresponding HTML code.
A list of accented characters' HTML codes are found here:
http://www.w3schools.com/tags/ref_entities.asp