function WinAnimClass() { var d = this; this.BClassName = ""; this.$body = $('#zoominbox'); this.AniFrom = { left: 0, top: 0, width: 0, height: 0 }; this.AniTo = { left: 0, top: 0, width: 0, height: 0 }; this.zoomIn = function () { d.$body.show(); this.$body.animate({ 'opacity': 1, 'left': this.AniFrom.left, 'top': this.AniFrom.top, 'width': this.AniFrom.width, 'height': this.AniFrom.height }, function () { d.$body.hide() }) }; this.zoomOut = function (a, b, c) { this.$body = $('#zoominbox'); this.AniFrom.left = a.offset().left; this.AniFrom.top = a.offset().top; this.AniFrom.width = a.outerWidth(); this.AniFrom.height = a.outerHeight(); this.AniTo.width = b.outerWidth(); this.AniTo.height = b.outerHeight(); this.AniTo.left = ($(window).width() - this.AniTo.width) / 2 + $(window).scrollLeft(); this.AniTo.top = ($(window).height() - this.AniTo.height) / 2 + $(window).scrollTop(); this.$body.width(this.AniFrom.height).height(this.AniFrom.width).css('left', this.AniFrom.left).css('top', this.AniFrom.top); this.$body.show().animate({ 'opacity': 1, 'left': this.AniTo.left, 'top': this.AniTo.top, 'width': this.AniTo.width, 'height': this.AniTo.height }, function () { d.$body.hide(); if ($.isFunction(c)) { c() } }) } } function WinPicViewClass() { var j = this; this.BClassName = ""; this.AnimHandler = new WinAnimClass(); this.divName = 'picwin'; this.$body = $('#' + this.divName); this.$ImgContainer = $([]); this.isloaded = false; this.PicId = null; this.PicOwnerId = null; this.PicOwnerUrl = null; this.ListOfImages = new Array(); var k = function () { j.SetResize() }; var l = function () { j.SetResize() }; this.BuildItem = function (a) { if (!a) return; this.PicOwnerId = a.OwnerId; this.PicOwnerUrl = a.OwnerURL; var s = new Array(); if (a.LocationText) { s[s.length] = '<span style="display:inline-block;width:168px;">'; s[s.length] = a.LocationText.substr(0, 150) + '...'; s[s.length] = '</span>' } s[s.length] = '<span style="display:inline-block;width:68px;float:left;font-weight:bold;">Fotograaf</span>'; s[s.length] = '<span style="display:inline-block;width:100px;float:left;"><a href="' + a.OwnerURL + '">' + a.OwnerName + '</a></span>'; if (a.PictureDate) { s[s.length] = '<span style="display:inline-block;width:68px;float:left;font-weight:bold;">Fotodatum</span>'; s[s.length] = '<span style="display:inline-block;width:100px;float:left;">' + a.PictureDate + '</span>' }; if (a.PictureOf) { s[s.length] = '<span style="display:inline-block;width:68px;float:left;font-weight:bold;">Foto van</span>'; s[s.length] = '<span style="display:inline-block;width:100px;float:left;">' + a.PictureOf + '</span>' }; s[s.length] = '<div class="IlikesCont">'; if (a.ilikeinfo) { s[s.length] = '<br>' + a.ilikeinfo }; s[s.length] = '</div>'; this.$body.find('#picwin-title').html(a.Title); this.$body.find('#picwin-info-top-title').html(a.Location); this.$body.find('#picwin-info-top-txt').html(s.join('')); this.$body.find('#picwin-info-mnu-allpics').attr('href', a.OwnerURL + '/Fotos'); this.$body.find('#picwin-info-mnu-rate').attr('href', 'fotos/beoordelen/' + a.Id); this.$body.find('#picwin-info-mnu-msg').attr('href', a.OwnerURL + '/Berichten'); this.$body.find('#picwin-info-mnu-idol').attr('href', a.OwnerURL + '/Volgen'); if (!a.ilike) a.ilike = false; var b = this.$body.find('#picwin-info-mnu-ilike'); if (a.ilike) { b.html('Vind ik niet leuk meer') } else { b.html('Vind ik leuk') } b.attr('valuetype', 'pic'); b.attr('value', a.Id); b.attr('href', a.OwnerURL + '/Volgen'); b = null; s = null }; this.GetPicData = function () { var b = new Object(); b["__RequestVerificationToken"] = $('[name=__RequestVerificationToken]').val(); b["id"] = this.PicId; hollandgroen.Getdata('/Fotos/GetPic', b, function (a) { j.BuildItem(a) }); SendData = null }; this.DelComment = function (o) { hollandgroen.LoaderShow(); var c = $(o); if (c.attr('value') == '') { return }; var d = new Object(); d["id"] = c.attr('value'); hollandgroen.Getdata('/Fotos/DelComment', d, function (a) { c.parent().parent().remove(); var b = j.$body.find('.picwin-comments-msgs .picwin-comments-msg'); if (b.length == 0) { j.$body.find('.picwin-comments-msgs').html('Geen reacties.') }; c = null; b = null; hollandgroen.LoaderHide() }, function (a) { hollandgroen.LoaderHide() }); SendData = null }; this.BuildComments = function (a) { if (!a) return; if (!a.msglist) return; var a = a.msglist; var s = new Array(); if (a.length > 0) { for (var i = 0; i < a.length; i++) { s[s.length] = '<div class="picwin-comments-msg">'; if (a[i].isDel) { s[s.length] = '<div class="picwin-comments-btn">'; s[s.length] = '<a class="btndelcomment" style="float:left;display:inline-block;" value="' + a[i].Id + '" href="#">verwijderen</a> '; s[s.length] = '</div>' } s[s.length] = '<div class="picwin-comments-msg-pic">'; s[s.length] = '<img class="picwin-comments-msg-pic-img" alt="' + a[i].FromName + '" src="' + a[i].FromAvatarUrl + '" />'; s[s.length] = '</div>'; s[s.length] = '<div class="picwin-comments-msg-txt">'; s[s.length] = '<a href="' + a[i].FromURL + '">' + a[i].FromName + '</a> '; s[s.length] = a[i].Text; s[s.length] = '</div>'; s[s.length] = '</div>' } this.$body.find('.picwin-comments-msgs').html(s.join('')); this.$body.find('.btndelcomment').unbind('click'); this.$body.find('.btndelcomment').bind('click', function () { j.DelComment(this); return false }) } else { this.$body.find('.picwin-comments-msgs').html('Geen reacties.') }; s = null; hollandgroen.LoaderHide(); this.$body.find('#picwin-bk').show(); this.$body.find('#picwin-comments').show(); j.$body.find('#picwin-message').hide() }; this.AddComment = function (a) { if (!a) return; var s = new Array(); if (a) { s[s.length] = '<div class="picwin-comments-msg">'; if (a.isDel) { s[s.length] = '<div class="picwin-comments-btn">'; s[s.length] = '<a class="btndelcomment" value="' + a.Id + '" href="#">verwijderen</a> '; s[s.length] = '</div>' } s[s.length] = '<div class="picwin-comments-msg-pic">'; s[s.length] = '<img class="picwin-comments-msg-pic-img" alt="' + a.FromName + '" src="' + a.FromAvatarUrl + '" />'; s[s.length] = '</div>'; s[s.length] = '<div class="picwin-comments-msg-txt">'; s[s.length] = '<a href="' + a.FromURL + '">' + a.FromName + '</a> '; s[s.length] = a.Text; s[s.length] = '</div>'; s[s.length] = '</div>'; var b = this.$body.find('.picwin-comments-msgs .picwin-comments-msg'); if (b.length == 0) { this.$body.find('.picwin-comments-msgs').html(s.join('')) } else { this.$body.find('.picwin-comments-msgs').append(s.join('')) } }; s = null; this.$body.find('.btndelcomment').unbind('click'); this.$body.find('.btndelcomment').bind('click', function () { j.DelComment(this); return false }); hollandgroen.LoaderHide() }; this.SendComment = function () { var b = this.$body.find('#picwin-comments-frm-comment').val(); if (!b || b == '') { alert('Geen reacktie ingevuld.') } else { hollandgroen.LoaderShow(); var c = new Object(); c["id"] = this.PicId; c["txt"] = this.$body.find('#picwin-comments-frm-comment').val(); hollandgroen.Getdata('/Fotos/SetComment', c, function (a) { j.AddComment(a) }, function (a) { hollandgroen.LoaderHide() }); SendData = null } }; this.ShowComments = function () { hollandgroen.LoaderShow(); var b = new Object(); b["id"] = this.PicId; hollandgroen.Getdata('/Fotos/GetPicMsgs', b, function (a) { j.BuildComments(a) }, function (a) { hollandgroen.LoaderHide() }); SendData = null }; this.SendMessageForm = function () { var b = this.$body.find('#picwin-message-frm-title').val(); var c = this.$body.find('#picwin-message-frm-text').val(); if (b == '' || c == '') { alert('Formulier niet volledig ingevuld.') } else { hollandgroen.LoaderShow(); var d = new Object(); d["id"] = this.PicOwnerId; d["tit"] = b; d["txt"] = c; hollandgroen.Getdata(this.PicOwnerUrl + '/SendPersonMsg', d, function (a) { hollandgroen.LoaderHide(); alert('Bericht verzonden.'); j.ShowTab(j.EnumTabs.Picture) }, function (a) { hollandgroen.LoaderHide() }); SendData = null } }; this.ShowMessageForm = function () { if (hollandgroen.IsAuthorized()) { this.$body.find('#picwin-message-frm-title').val(''); this.$body.find('#picwin-message-frm-text').val(''); j.ShowTab(j.EnumTabs.Message) } else { hollandgroen.ShowUnauthorizedWindow() } }; this.SetFlollower = function () { hollandgroen.LoaderShow(); hollandgroen.Getdata(this.PicOwnerUrl + '/SetFollow', {}, function (a) { hollandgroen.LoaderHide(); alert(a); j.ShowTab(j.EnumTabs.Picture) }, function () { hollandgroen.LoaderHide() }); SendData = null }; this.Initialize = function () { this.$body = $('#' + this.divName); this.$ImgContainer = this.$body.find('#picwin-picture'); this.$ImgContainer.click(function () { j.WinDlgDispose() }); this.$body.find('#picwin-close').click(function () { j.WinDlgDispose() }); this.$body.find('#picwin-info-mnu-msg').click(function () { j.ShowTab(j.EnumTabs.Message); return false }); this.$body.find('#picwin-message-frm-btnSend').click(function () { j.SendMessageForm(); return false }); this.$body.find('#picwin-message-frm-btnCancel').click(function () { j.ShowTab(j.EnumTabs.Picture) }); this.$body.find('#picwin-info-mnu-rate').click(function () { j.ShowTab(j.EnumTabs.Comments); return false }); this.$body.find('#picwin-comments-frm-btnsend').click(function () { j.SendComment(); return false }); this.$body.find('#picwin-comments-frm-btncancel').click(function () { j.ShowTab(j.EnumTabs.Picture) }); this.$body.find('#picwin-info-mnu-idol').click(function () { j.SetFlollower(); return false }); this.isloaded = true }; this.WinDlgDispose = function () { this.$body.hide(); $(window).unbind('resize', k).unbind('scroll', l); j.$body.hide(); hollandgroen.LoaderHide(); hollandgroen.BackGroundHide(); this.AnimHandler.zoomIn() }; this.imgW = 0; this.imgH = 0; this.SetResize = function () { var a = 226; var b = 63; var c = this.imgW + a; var d = this.imgH + b; var e = this.imgW; var f = this.imgH; if (c > $(window).width()) c = $(window).width() - 10; if (d > $(window).height()) d = $(window).height() - 10; if (this.imgW > this.imgH) { e = c - a; var g = e / (this.imgW); f = Math.round(this.imgH * g) } else { f = d - b; var h = f / (this.imgH); e = Math.round(this.imgW * h) } j.$body.find('#picwin-pic').width(c - a); j.$body.find('#picwin-pic').height(d - b); j.$body.find('#picwin-comments').width(c - a - 16); j.$body.find('#picwin-comments').height(d - b - 16); j.$body.find('#picwin-bk').width(c - a - 16); j.$body.find('#picwin-bk').height(d - b - 16); j.$body.find('#picwin-message').width(c - a - 16); j.$body.find('#picwin-message').height(d - b - 16); j.$body.find('#picwin-info-top').height(d - b - 134); this.$ImgContainer.width(e).height(f).position({ of: j.$body.find('#picwin-pic'), at: "center center", my: "center center" }); this.$body.find('#picwin-title').width(c - 23); this.$body.width(c); this.$body.height(d); this.$body.center() }; this.GetTargetImg = function (a) { a = a.replace('http://www.hollandgroen.nl', ''); a = a.replace('http://www.lutfiuzun.nl', ''); var b = a.split("/").pop().split("_").shift(); var c = ''; for (i = 0; i <= a.split("/").length - 2; i++) { if (c.length > 0) { c += '/' }; c += a.split("/")[i] } c = '/' + c + '/' + b + '_xxl.jpg'; return c }; this.EnumTabs = { Picture: 1, Comments: 2, Message: 3 }; this.ShowTab = function (a) { if (!a) a = this.EnumTabs.Picture; if (a == this.EnumTabs.Message) { if (hollandgroen.IsAuthorized()) { this.$body.find('#picwin-message-frm-title').val(''); this.$body.find('#picwin-message-frm-text').val(''); this.$body.find('#picwin-bk').show(); this.$body.find('#picwin-message').show(); this.$body.find('#picwin-comments').hide() } else { hollandgroen.ShowUnauthorizedWindow() } } else if (a == this.EnumTabs.Comments) { this.$body.find('#picwin-comments-frm-comment').val(''); this.ShowComments() } else if (a == this.EnumTabs.Picture) { this.$body.find('#picwin-bk').hide(); this.$body.find('#picwin-comments').hide(); this.$body.find('#picwin-message').hide() } else { this.$body.find('#picwin-bk').hide(); this.$body.find('#picwin-comments').hide(); this.$body.find('#picwin-message').hide() } }; this.Show = function (a, b) { hollandgroen.LoaderShow(); var c = $(a); if (c.length == 0) { hollandgroen.LoaderHide(); alert('Incorrect image tag.'); return } var d = c.attr('valueurl'); var e = c.attr('value'); if (!d || !e) { var f = ""; f = c.attr('Id'); e = parseInt(f.replace('img', '')); d = this.GetTargetImg(c.attr('src')); if (!d || !e) { hollandgroen.LoaderHide(); alert('Incorrect image tag.'); return } }; this.PicId = e; if (this.isloaded == false) this.Initialize(); $(window).bind('resize', k); $(window).bind('scroll', l); this.$body.find('#picwin-title').html(''); this.$body.find('#picwin-info-top-title').html(''); this.$body.find('#picwin-info-top-txt').html(''); this.GetPicData(); var g = new Image(); $(g).load(function () { j.imgW = g.width; j.imgH = g.height; j.SetResize(); j.$ImgContainer.hide().attr('src', g.src).show(); j.AnimHandler.zoomOut(c, j.$body, function () { hollandgroen.BackGroundShow(); j.ShowTab(b); j.$body.center().show(); hollandgroen.LoaderHide() }) }).error(function () { alert("Error img load") }).attr('src', d) } } var oPicView = new WinPicViewClass(); oPicView.BClassName = "oPicView"; $(document).ready(function () { $('.imgS').click(function () { oPicView.Show(this) }); $('.imgWeek').click(function () { oPicView.Show(this) }); $('.imgM').click(function () { oPicView.Show(this) }); $('.imgThumb').click(function () { oPicView.Show(this) }); $('.imgXM').click(function () { oPicView.Show(this) }); $('.nplist-img').click(function () { oPicView.Show(this) }); $('.btnIComment').click(function () { oPicView.Show(this, oPicView.EnumTabs.Comments); return false }) });