function firstStripZoom() {
$("#AddBeatAnnotation").hide();
$("#editBeatAnnotation").hide();
isOverviewImage = true;
var paramEvent = '{"eventId":"' + eventId + '"}';
var eventLengthZoom;
$.ajax({
url: '<%=ResolveUrl("~/User/Services/WebServices.asmx/GetEventPreferences") %>',
data: paramEvent,
async: true,
dataType: "json",
type: "POST",
contentType: "application/json;",
success: function (message) {
var success = message.d;
if (success != null) {
from = success.StartingPoint;
}
$.ajax({
url: '<%=ResolveUrl("~/User/Services/WebServices.asmx/GetEventData") %>',
data: paramEvent,
async: true,
dataType: "json",
type: "POST",
contentType: "application/json;",
success: function (message) {
var success = message.d;
eventOccuredAtSampleReport = parseInt(success[0]);
deviceId = parseInt(success[1]);
eventName = success[2];
eventLength = parseInt(success[3]);
eventLengthZoom = parseInt(success[3]);
eventDescription = success[4];
let positionImage = 0;
if (eventDescription == "RRDDR") {
let test = startingPoint;
if (from > 8000) {
positionImage = parseInt(from / 8000);
currentBoxPosition = positionImage + 1;
}
}
var width = $("#overviewImage" + positionImage).width();
$('.zoomContainer').remove();
$('.zoomWindowContainer').remove();
$("#overviewImage" + positionImage).removeData('elevateZoom');
$("#overviewImage" + positionImage).removeData('zoomImage');
$("#overviewImage" + positionImage).elevateZoom({
zoomWindowPosition: "stripContainer0",
zoomWindowHeight: 280,
zoomWindowWidth: width,
borderSize: 0,
easing: true,
lensFadeIn: 500,
lensFadeOut: 500,
tintOpacity: 0.2,
// scrollZoom: true,
scrollZoom: false,
responsive: true,
minZoomLevel: false,
maxZoomLevel: 1,
onZoomedImageLoaded: function (self) {
elevateZoomInstance = self;
var imageElementId = self.$elem[0].id;
var imageElement = document.getElementById(imageElementId);
var fromInPixels = $('#' + self.$elem[0].id).offset().left;
//We have to calculate the position of the lens in pixels: $('#' + self.$elem[0].id).width() is the image size (taking in consideration the resolution and the size of the browser), 46080: the total number of samples in the image, from: the start of the highlighted window
if (eventDescription == "RRDDR") {
if (from > 8000)
from = from % 8000;
fromInPixels = fromInPixels + from * $('#' + self.$elem[0].id).width() / 8000;
}
else {
fromInPixels = fromInPixels + from * $('#' + self.$elem[0].id).width() / eventLengthZoom;
}
fromInPixels = fromInPixels + self.zoomLens.width() / 2;
if (fromInPixels >
($('#' + self.$elem[0].id).offset().left +
$('#' + self.$elem[0].id).width() -
(self.zoomLens.width() / 2))) {
fromInPixels =
($('#' + self.$elem[0].id).offset().left +
$('#' + self.$elem[0].id).width() -
(self.zoomLens.width() / 2));
} else if (fromInPixels < ($('#' + self.$elem[0].id).offset().left)) {
fromInPixels = $('#' + self.$elem[0].id).offset().left;
}
var event = {
'altKey': false,
clientX:
fromInPixels,
clientY:
$('#' + self.$elem[0].id).offset().top,
ctrlKey:
false,
currentTarget:
$('#zoomContainer'),
data:
null,
delegateTarget:
$('#zoomContainer'),
eventPhase:
2,
fromElement:
null,
handleObj:
Object,
isDefaultPrevented:
true,
jQuery17108341866639103588:
true,
metaKey:
false,
offsetX:
0,
offsetY:
0,
originalEvent:
'MouseEvent',
pageX:
fromInPixels,
pageY:
$('#' + self.$elem[0].id).offset().top,
relatedNode:
undefined,
relatedTarget:
null,
shiftKey:
false,
srcElement:
$('#zoomContainer'),
target:
$('#zoomContainer'),
timeStamp:
99277.45,
toElement:
$('#zoomContainer'),
type:
"mousemove",
view:
'Window',
which:
0
};
self.setPosition(event);
self.currentLoc = event;
if (self.overWindow == false) {
self.setElements("show");
}
// self.changeZoomLevel(1.1);
shouldMove = false; //A variable defined in the elevateZoom library
self.zoomLens.css("border-color", "red");
$('.EventLoading2').css('display', 'none');
}
});
}
});
}
});
}
$("#AddBeatAnnotation").hide();
$("#editBeatAnnotation").hide();
isOverviewImage = true;
var paramEvent = '{"eventId":"' + eventId + '"}';
var eventLengthZoom;
$.ajax({
url: '<%=ResolveUrl("~/User/Services/WebServices.asmx/GetEventPreferences") %>',
data: paramEvent,
async: true,
dataType: "json",
type: "POST",
contentType: "application/json;",
success: function (message) {
var success = message.d;
if (success != null) {
from = success.StartingPoint;
}
$.ajax({
url: '<%=ResolveUrl("~/User/Services/WebServices.asmx/GetEventData") %>',
data: paramEvent,
async: true,
dataType: "json",
type: "POST",
contentType: "application/json;",
success: function (message) {
var success = message.d;
eventOccuredAtSampleReport = parseInt(success[0]);
deviceId = parseInt(success[1]);
eventName = success[2];
eventLength = parseInt(success[3]);
eventLengthZoom = parseInt(success[3]);
eventDescription = success[4];
let positionImage = 0;
if (eventDescription == "RRDDR") {
let test = startingPoint;
if (from > 8000) {
positionImage = parseInt(from / 8000);
currentBoxPosition = positionImage + 1;
}
}
var width = $("#overviewImage" + positionImage).width();
$('.zoomContainer').remove();
$('.zoomWindowContainer').remove();
$("#overviewImage" + positionImage).removeData('elevateZoom');
$("#overviewImage" + positionImage).removeData('zoomImage');
$("#overviewImage" + positionImage).elevateZoom({
zoomWindowPosition: "stripContainer0",
zoomWindowHeight: 280,
zoomWindowWidth: width,
borderSize: 0,
easing: true,
lensFadeIn: 500,
lensFadeOut: 500,
tintOpacity: 0.2,
// scrollZoom: true,
scrollZoom: false,
responsive: true,
minZoomLevel: false,
maxZoomLevel: 1,
onZoomedImageLoaded: function (self) {
elevateZoomInstance = self;
var imageElementId = self.$elem[0].id;
var imageElement = document.getElementById(imageElementId);
var fromInPixels = $('#' + self.$elem[0].id).offset().left;
//We have to calculate the position of the lens in pixels: $('#' + self.$elem[0].id).width() is the image size (taking in consideration the resolution and the size of the browser), 46080: the total number of samples in the image, from: the start of the highlighted window
if (eventDescription == "RRDDR") {
if (from > 8000)
from = from % 8000;
fromInPixels = fromInPixels + from * $('#' + self.$elem[0].id).width() / 8000;
}
else {
fromInPixels = fromInPixels + from * $('#' + self.$elem[0].id).width() / eventLengthZoom;
}
fromInPixels = fromInPixels + self.zoomLens.width() / 2;
if (fromInPixels >
($('#' + self.$elem[0].id).offset().left +
$('#' + self.$elem[0].id).width() -
(self.zoomLens.width() / 2))) {
fromInPixels =
($('#' + self.$elem[0].id).offset().left +
$('#' + self.$elem[0].id).width() -
(self.zoomLens.width() / 2));
} else if (fromInPixels < ($('#' + self.$elem[0].id).offset().left)) {
fromInPixels = $('#' + self.$elem[0].id).offset().left;
}
var event = {
'altKey': false,
clientX:
fromInPixels,
clientY:
$('#' + self.$elem[0].id).offset().top,
ctrlKey:
false,
currentTarget:
$('#zoomContainer'),
data:
null,
delegateTarget:
$('#zoomContainer'),
eventPhase:
2,
fromElement:
null,
handleObj:
Object,
isDefaultPrevented:
true,
jQuery17108341866639103588:
true,
metaKey:
false,
offsetX:
0,
offsetY:
0,
originalEvent:
'MouseEvent',
pageX:
fromInPixels,
pageY:
$('#' + self.$elem[0].id).offset().top,
relatedNode:
undefined,
relatedTarget:
null,
shiftKey:
false,
srcElement:
$('#zoomContainer'),
target:
$('#zoomContainer'),
timeStamp:
99277.45,
toElement:
$('#zoomContainer'),
type:
"mousemove",
view:
'Window',
which:
0
};
self.setPosition(event);
self.currentLoc = event;
if (self.overWindow == false) {
self.setElements("show");
}
// self.changeZoomLevel(1.1);
shouldMove = false; //A variable defined in the elevateZoom library
self.zoomLens.css("border-color", "red");
$('.EventLoading2').css('display', 'none');
}
});
}
});
}
});
}