Current File : /home/pacjaorg/wpt.pacja.org/cop/administrator/components/com_uniterevolution2/js/edit_layers.js |
/*!
* VERSION: beta 0.2.3
* DATE: 2013-07-10
* UPDATES AND DOCS AT: http://www.greensock.com
*
* @license Copyright (c) 2008-2013, GreenSock. All rights reserved.
* SplitText is a Club GreenSock membership benefit; You must have a valid membership to use
* this code without violating the terms of use. Visit http://www.greensock.com/club/ to sign up or get more details.
* This work is subject to the software agreement that was issued with your membership.
*
* @author: Jack Doyle, jack@greensock.com
*/
(function (t) {
"use strict";
var e = t.GreenSockGlobals || t, i = function (t) {
var i, s = t.split("."), r = e;
for (i = 0; s.length > i; i++)r[s[i]] = r = r[s[i]] || {};
return r
}, s = i("com.greensock.utils"), r = function (t) {
var e = t.nodeType, i = "";
if (1 === e || 9 === e || 11 === e) {
if ("string" == typeof t.textContent)return t.textContent;
for (t = t.firstChild; t; t = t.nextSibling)i += r(t)
} else if (3 === e || 4 === e)return t.nodeValue;
return i
}, n = document, a = n.defaultView ? n.defaultView.getComputedStyle : function () {
}, o = /([A-Z])/g, h = function (t, e, i, s) {
var r;
return (i = i || a(t, null)) ? (t = i.getPropertyValue(e.replace(o, "-$1").toLowerCase()), r = t || i.length ? t : i[e]) : t.currentStyle && (i = t.currentStyle, r = i[e]), s ? r : parseInt(r, 10) || 0
}, l = function (t) {
return t.length && t[0] && (t[0].nodeType && t[0].style && !t.nodeType || t[0].length && t[0][0]) ? !0 : !1
}, _ = function (t) {
var e, i, s, r = [], n = t.length;
for (e = 0; n > e; e++)if (i = t[e], l(i))for (s = i.length, s = 0; i.length > s; s++)r.push(i[s]); else r.push(i);
return r
}, u = ")eefec303079ad17405c", c = /(?:<br>|<br\/>|<br \/>)/gi, p = n.all && !n.addEventListener, f = "<div style='position:relative;display:inline-block;" + (p ? "*display:inline;*zoom:1;'" : "'"), m = function (t) {
t = t || "";
var e = -1 !== t.indexOf("++"), i = 1;
return e && (t = t.split("++").join("")), function () {
return f + (t ? " class='" + t + (e ? i++ : "") + "'>" : ">")
}
}, d = s.SplitText = e.SplitText = function (t, e) {
if ("string" == typeof t && (t = d.selector(t)), !t)throw"cannot split a null element.";
this.elements = l(t) ? _(t) : [t], this.chars = [], this.words = [], this.lines = [], this._originals = [], this.vars = e || {}, this.split(e)
}, g = function (t, e, i, s, o) {
c.test(t.innerHTML) && (t.innerHTML = t.innerHTML.replace(c, u));
var l, _, p, f, d, g, v, y, T, w, b, x, P, S = r(t), C = e.type || e.split || "chars,words,lines", k = -1 !== C.indexOf("lines") ? [] : null, R = -1 !== C.indexOf("words"), A = -1 !== C.indexOf("chars"), D = "absolute" === e.position || e.absolute === !0, O = D ? "­ " : " ", M = -999, L = a(t), I = h(t, "paddingLeft", L), E = h(t, "borderBottomWidth", L) + h(t, "borderTopWidth", L), N = h(t, "borderLeftWidth", L) + h(t, "borderRightWidth", L), F = h(t, "paddingTop", L) + h(t, "paddingBottom", L), U = h(t, "paddingLeft", L) + h(t, "paddingRight", L), X = h(t, "textAlign", L, !0), z = t.clientHeight, B = t.clientWidth, j = S.length, Y = "</div>", q = m(e.wordsClass), V = m(e.charsClass), Q = -1 !== (e.linesClass || "").indexOf("++"), G = e.linesClass;
for (Q && (G = G.split("++").join("")), p = q(), f = 0; j > f; f++)g = S.charAt(f), ")" === g && S.substr(f, 20) === u ? (p += Y + "<BR/>", f !== j - 1 && (p += " " + q()), f += 19) : " " === g && " " !== S.charAt(f - 1) && f !== j - 1 ? (p += Y, f !== j - 1 && (p += O + q())) : p += A && " " !== g ? V() + g + "</div>" : g;
for (t.innerHTML = p + Y, d = t.getElementsByTagName("*"), j = d.length, v = [], f = 0; j > f; f++)v[f] = d[f];
if (k || D)for (f = 0; j > f; f++)y = v[f], _ = y.parentNode === t, (_ || D || A && !R) && (T = y.offsetTop, k && _ && T !== M && "BR" !== y.nodeName && (l = [], k.push(l), M = T), D && (y._x = y.offsetLeft, y._y = T, y._w = y.offsetWidth, y._h = y.offsetHeight), k && (R !== _ && A || (l.push(y), y._x -= I), _ && f && (v[f - 1]._wordEnd = !0)));
for (f = 0; j > f; f++)y = v[f], _ = y.parentNode === t, "BR" !== y.nodeName ? (D && (b = y.style, R || _ || (y._x += y.parentNode._x, y._y += y.parentNode._y), b.left = y._x + "px", b.top = y._y + "px", b.position = "absolute", b.display = "block", b.width = y._w + 1 + "px", b.height = y._h + "px"), R ? _ ? s.push(y) : A && i.push(y) : _ ? (t.removeChild(y), v.splice(f--, 1), j--) : !_ && A && (T = !k && !D && y.nextSibling, t.appendChild(y), T || t.appendChild(n.createTextNode(" ")), i.push(y))) : k || D ? (t.removeChild(y), v.splice(f--, 1), j--) : R || t.appendChild(y);
if (k) {
for (D && (w = n.createElement("div"), t.appendChild(w), x = w.offsetWidth + "px", T = w.offsetParent === t ? 0 : t.offsetLeft, t.removeChild(w)), b = t.style.cssText, t.style.cssText = "display:none;"; t.firstChild;)t.removeChild(t.firstChild);
for (P = !D || !R && !A, f = 0; k.length > f; f++) {
for (l = k[f], w = n.createElement("div"), w.style.cssText = "display:block;text-align:" + X + ";position:" + (D ? "absolute;" : "relative;"), G && (w.className = G + (Q ? f + 1 : "")), o.push(w), j = l.length, d = 0; j > d; d++)"BR" !== l[d].nodeName && (y = l[d], w.appendChild(y), P && (y._wordEnd || R) && w.appendChild(n.createTextNode(" ")), D && (0 === d && (w.style.top = y._y + "px", w.style.left = I + T + "px"), y.style.top = "0px", T && (y.style.left = y._x - T + "px")));
R || A || (w.innerHTML = r(w).split(String.fromCharCode(160)).join(" ")), D && (w.style.width = x, w.style.height = y._h + "px"), t.appendChild(w)
}
t.style.cssText = b
}
D && (z > t.clientHeight && (t.style.height = z - F + "px", z > t.clientHeight && (t.style.height = z + E + "px")), B > t.clientWidth && (t.style.width = B - U + "px", B > t.clientWidth && (t.style.width = B + N + "px")))
}, v = d.prototype;
v.split = function (t) {
this.isSplit && this.revert(), this.vars = t || this.vars, this._originals.length = this.chars.length = this.words.length = this.lines.length = 0;
for (var e = 0; this.elements.length > e; e++)this._originals[e] = this.elements[e].innerHTML, g(this.elements[e], this.vars, this.chars, this.words, this.lines);
return this.isSplit = !0, this
}, v.revert = function () {
if (!this._originals)throw"revert() call wasn't scoped properly.";
for (var t = this._originals.length; --t > -1;)this.elements[t].innerHTML = this._originals[t];
return this.chars = [], this.words = [], this.lines = [], this.isSplit = !1, this
}, d.selector = t.$ || t.jQuery || function (e) {
return t.$ ? (d.selector = t.$, t.$(e)) : n ? n.getElementById("#" === e.charAt(0) ? e.substr(1) : e) : e
}
})(window || {});
/*! ROTATABLE */
// ROTATABLE
(function ($, undefined) {
$.widget("ui.rotatable", $.ui.mouse, {
options: {
handle: false,
angle: false,
// callbacks
start: null,
rotate: null,
stop: null
},
handle: function (handle) {
if (handle === undefined) {
return this.options.handle;
}
this.options.handle = handle;
},
angle: function (angle) {
if (angle === undefined) {
return this.options.angle;
}
this.options.angle = angle;
this.performRotation(this.options.angle);
},
_create: function () {
var handle;
if (!this.options.handle) {
handle = $(document.createElement('div'));
handle.addClass('ui-rotatable-handle');
}
else {
handle = this.options.handle;
}
this.listeners = {
rotateElement: $.proxy(this.rotateElement, this),
startRotate: $.proxy(this.startRotate, this),
stopRotate: $.proxy(this.stopRotate, this)
};
handle.draggable({helper: 'clone', start: this.dragStart, handle: handle});
handle.bind('mousedown', this.listeners.startRotate);
handle.appendTo(this.element);
if (this.options.angle != false) {
this.elementCurrentAngle = this.options.angle;
this.performRotation(this.elementCurrentAngle);
}
else {
this.elementCurrentAngle = 0;
}
},
_destroy: function () {
this.element.removeClass('ui-rotatable');
this.element.find('.ui-rotatable-handle').remove();
},
performRotation: function (angle) {
var deg = angle * 180 / Math.PI;
this.element.css('transform', 'rotate(' + deg + 'deg)');
this.element.css('-moz-transform', 'rotate(' + deg + 'deg)');
this.element.css('-webkit-transform', 'rotate(' + deg + 'deg)');
this.element.css('-o-transform', 'rotate(' + deg + 'deg)');
/* this.element.css('transform','rotate(' + angle + 'rad)');
this.element.css('-moz-transform','rotate(' + angle + 'rad)');
this.element.css('-webkit-transform','rotate(' + angle + 'rad)');
this.element.css('-o-transform','rotate(' + angle + 'rad)');*/
},
getElementOffset: function () {
this.performRotation(0);
var offset = this.element.offset();
this.performRotation(this.elementCurrentAngle);
return offset;
},
getElementCenter: function () {
var elementOffset = this.getElementOffset();
var elementCentreX = elementOffset.left + this.element.width() / 2;
var elementCentreY = elementOffset.top + this.element.height() / 2;
return Array(elementCentreX, elementCentreY);
},
dragStart: function (event) {
if (this.element) {
return false;
}
},
startRotate: function (event) {
var center = this.getElementCenter();
var startXFromCenter = event.pageX - center[0];
var startYFromCenter = event.pageY - center[1];
this.mouseStartAngle = Math.atan2(startYFromCenter, startXFromCenter);
this.elementStartAngle = this.elementCurrentAngle;
this.hasRotated = false;
this._propagate("start", event);
$(document).bind('mousemove', this.listeners.rotateElement);
$(document).bind('mouseup', this.listeners.stopRotate);
return false;
},
rotateElement: function (event) {
if (!this.element) {
return false;
}
var center = this.getElementCenter();
var xFromCenter = event.pageX - center[0];
var yFromCenter = event.pageY - center[1];
var mouseAngle = Math.atan2(yFromCenter, xFromCenter);
var rotateAngle = mouseAngle - this.mouseStartAngle + this.elementStartAngle;
this.performRotation(rotateAngle);
var previousRotateAngle = this.elementCurrentAngle;
this.elementCurrentAngle = rotateAngle;
// Plugins callbacks need to be called first.
this._propagate("rotate", event);
if (previousRotateAngle != rotateAngle) {
this._trigger("rotate", event, this.ui());
this.hasRotated = true;
}
return false;
},
stopRotate: function (event) {
if (!this.element) {
return;
}
$(document).unbind('mousemove', this.listeners.rotateElement);
$(document).unbind('mouseup', this.listeners.stopRotate);
this.elementStopAngle = this.elementCurrentAngle;
if (this.hasRotated) {
this._propagate("stop", event);
}
setTimeout(function () {
this.element = false;
}, 10);
return false;
},
_propagate: function (n, event) {
$.ui.plugin.call(this, n, [event, this.ui()]);
(n !== "rotate" && this._trigger(n, event, this.ui()));
},
plugins: {},
ui: function () {
return {
element: this.element,
angle: {
start: this.elementStartAngle,
current: this.elementCurrentAngle,
stop: this.elementStopAngle
}
};
}
});
})(jQuery);
//ver 3.2
function UniteLayersRev() {
var initTop = 100;
var initLeft = 100;
var initSpeed = 300;
var initTopVideo = 20;
var initLeftVideo = 20;
var g_startTime = 500;
var g_stepTime = 0;
var g_slideTime;
var initText = "Caption Text";
//init system vars"
//init system vars
var t = this;
var initArrFontTypes = [];
var containerID = "#divLayers";
var container;
var arrLayers = {};
var id_counter = 0;
var initLayers = null;
var initDemoLayers = null;
var initDemoSettings = null;
var selectedLayerSerial = -1;
var sortMode = "time"; //can be "depth" or "time"
var layerGeneralParamsStatus = false;
//Layer Animations
var initLayerAnims = [];
var currentAnimationType = 'customin';
var curDemoSlideID = 0;
/**
* set init layers object (from db)
*/
this.setInitLayersJson = function(jsonLayers) {
initLayers = jQuery.parseJSON(jsonLayers);
}
/**
* set init demo layers object (from db)
*/
this.setInitDemoLayersJson = function(jsonLayers) {
initDemoLayers = jQuery.parseJSON(jsonLayers);
}
/**
* set init demo settings object (from db)
*/
this.setInitDemoSettingsJson = function(jsonLayers) {
initDemoSettings = jQuery.parseJSON(jsonLayers);
}
/**
* set init layer animations (from db)
*/
this.setInitLayerAnim = function (jsonLayersAnims) {
initLayerAnims = jQuery.parseJSON(jsonLayersAnims);
}
/**
* update init layer animations (from db)
*/
this.updateInitLayerAnim = function (layerAnims) {
initLayerAnims = [];
initLayerAnims = layerAnims;
}
/**
* set init captions classes array (from the captions.css)
*/
this.setInitCaptionClasses = function (jsonClasses) {
initArrCaptionClasses = jQuery.parseJSON(jsonClasses);
}
/**
* set init font family types array
*/
this.setInitFontTypes = function (jsonClasses) {
initArrFontTypes = jQuery.parseJSON(jsonClasses);
}
/**
* insert button by class and text
*/
this.insertButton = function (buttonClass, buttonText) {
if (selectedLayerSerial == -1)
return (false);
var html = "<a href='#' class='tp-button " + buttonClass + " small'>" + buttonText + "</a>";
//jQuery("#layer_caption").val("");
jQuery("#layer_text").val(jQuery("#layer_text").val() + html);
t.updateLayerFromFields();
jQuery("#dialog_insert_button").dialog("close");
}
/**
* insert template to editor
*/
this.insertTemplate = function (text) {
if (selectedLayerSerial == -1)
return (false);
jQuery("#layer_text").val(jQuery("#layer_text").val() + '%' + text + '%');
t.updateLayerFromFields();
jQuery("#dialog_template_insert").dialog("close");
}
this.refreshGridSize = function () {
var grid_size = jQuery('#rs-grid-sizes option:selected').val();
var snapto = jQuery('#rs-grid-snapto option:selected').val();
var wrapper = jQuery('#divLayers');
if (grid_size == 1) {
wrapper.find('#helpergrid').remove();
grid_size = 1;
} else {
wrapper.css({position: "relative"});
wrapper.find('#helpergrid').remove();
wrapper.append('<div id="helpergrid" style="position:absolute;top:0px;left:0px;position:absolute;z-index:0;width:100%;height:100%"></div>');
var hg = wrapper.find('#helpergrid');
if (grid_size > 4) {
for (var i = 1; i < (wrapper.height() / grid_size); i++) {
var jump = i * grid_size;
hg.append('<div class="helplines" style="background-color:#4affff;width:100%;height:1px;position:absolute;left:0px;top:' + jump + 'px"></div>');
}
for (var i = 1; i < (wrapper.width() / grid_size); i++) {
var jump = i * grid_size;
hg.append('<div class="helplines" style="background-color:#4affff;height:100%;width:1px;position:absolute;top:0px;left:' + jump + 'px"></div>');
}
}
}
for (var key in arrLayers) {
var layer = getHtmlLayerFromSerial(key);
//update layer events.
layer.draggable({
drag: onLayerDrag, //set ondrag event
//grid: [grid_size,grid_size], //set the grid to 1 pixel
snap: snapto,
snapMode: "outer"
});
}
}
//======================================================
// Init Functions
//======================================================
function _________INIT___________(){}
/*! INITIALISATION */
/**
* init the layout
*/
this.init = function (slideTime) {
if (jQuery().draggable == undefined || jQuery().autocomplete == undefined) {
jQuery("#jqueryui_error_message").show();
}
g_slideTime = Number(slideTime);
container = jQuery(containerID);
//add all layers from init
if (initDemoLayers) {
var len = initDemoLayers.length;
if (len) {
for (var i = 0; i < len; i++) {
for (var key in initDemoLayers[i]) {
curDemoSlideID = i;
addLayer(initDemoLayers[i][key], true, true);
}
}
} else {
for (var i in initDemoLayers) {
for (var key in initDemoLayers[i]) {
curDemoSlideID = i;
addLayer(initDemoLayers[i][key], true, true);
}
}
}
}
//add all layers from init
if (initLayers) {
var len = initLayers.length;
if (len) {
for (var i = 0; i < len; i++)
addLayer(initLayers[i], true);
} else {
for (key in initLayers)
addLayer(initLayers[key], true);
}
}
//disable the properties box
disableFormFields();
//init elements
initMainEvents();
initSortbox();
initButtons();
initHtmlFields();
initAlignTable();
scaleImage();
positionChanged();
//initScaleImage();
preparePeviewAnimations();
initBackgroundFunctions();
initLoopFunctions();
prepareAnimateCreator();
jQuery('.bgsrcchanger').each(function () {
if (jQuery(this).is(':checked'))
initSliderBackgroundOptions(jQuery(this));
});
jQuery("#select_bg_source").change(function(){
var option = jQuery(this).children("option:selected");
initSliderBackgroundOptions(option);
});
/*
jQuery('.bgsrcchanger').click(function () {
initSliderBackgroundOptions(jQuery(this));
});
*/
initDisallowCaptionsOnClick();
showHideTimeines();
// OPEN LEFT PANEL TO FULL
jQuery('.open_right_panel').click(function () {
var orp = jQuery('.layer_props_wrapper')
if (orp.hasClass("openeed")) {
orp.removeClass("openeed");
} else {
orp.addClass("openeed");
}
})
jQuery('#rs-grid-sizes, #rs-grid-snapto').change(function () {
t.refreshGridSize();
});
jQuery('select[name="rev_show_the_slides"]').change(function () {
jQuery('.demo_layer').hide();
jQuery("#divbgholder").addClass("trans_bg");
jQuery("#divbgholder").css("background-image", "none");
jQuery("#divbgholder").css("background-color", "transparent");
jQuery("#divbgholder").css("background-position", "top center");
jQuery("#divbgholder").css("background-size", "cover"); //100% 100%
jQuery("#divbgholder").css("background-repeat", "no-repeat");
if (jQuery(this).val() !== 'none') {
var sv = jQuery(this).val();
jQuery('.demo_layer_' + sv).show();
if (typeof initDemoSettings[sv] !== 'undefined') {
var bgfit = (initDemoSettings[sv]['bg_fit'] == 'percentage') ? initDemoSettings[sv]['bg_fit_x'] + '% ' + initDemoSettings[sv]['bg_fit_y'] + '% ' : initDemoSettings[sv]['bg_fit'];
var bgpos = (initDemoSettings[sv]['bg_position'] == 'percentage') ? initDemoSettings[sv]['bg_position_x'] + '% ' + initDemoSettings[sv]['bg_position_y'] + '% ' : initDemoSettings[sv]['bg_position'];
if (initDemoSettings[sv]['bg_fit'] == 'contain') {
//jQuery('#divLayers-wrapper').css('maxWidth', jQuery('#divbgholder').css('minWidth'));
} else {
//jQuery('#divLayers-wrapper').css('maxWidth', 'none');
}
//trace(bgfit);
switch (initDemoSettings[sv]['background_type']) {
case "image":
var urlImage = initDemoSettings[sv]['image'];
jQuery("#divbgholder").css("background-image", "url('" + urlImage + "')");
jQuery("#divbgholder").css("background-color", "transparent");
jQuery("#divbgholder").css("background-size", bgfit);
jQuery("#divbgholder").css("background-position", bgpos);
jQuery("#divbgholder").css("background-repeat", initDemoSettings[sv]['bg_repeat']);
jQuery("#divbgholder").removeClass("trans_bg");
break;
case "trans":
jQuery("#divbgholder").css("background-image", "none");
jQuery("#divbgholder").css("background-color", "transparent");
jQuery("#divbgholder").addClass("trans_bg");
break;
case "solid":
jQuery("#divbgholder").css("background-image", "none");
jQuery("#divbgholder").removeClass("trans_bg");
var bgColor = initDemoSettings[sv]['slide_bg_color'];
jQuery("#divbgholder").css("background-color", bgColor);
break;
case "external":
var urlImage = initDemoSettings[sv]['slide_bg_external'];
jQuery("#divbgholder").css("background-image", "url('" + urlImage + "')");
jQuery("#divbgholder").css("background-color", "transparent");
jQuery("#divbgholder").css("background-size", bgfit);
jQuery("#divbgholder").css("background-position", bgpos);
jQuery("#divbgholder").css("background-repeat", initDemoSettings[sv]['bg_repeat']);
jQuery("#divbgholder").removeClass("trans_bg");
break;
}
}
}
});
//update size on init
sceneSize();
jQuery(document).resize(sceneSize);
}
var initDisallowCaptionsOnClick = function () {
jQuery('.slide_layer.tp-caption a').on('click', function () {
return false;
});
}
/**
* init background options
*/
function initSliderBackgroundOptions(jQueryObj) {
jQuery('.bgsrcchanger-div').each(function () {
if (jQuery(this).attr('id') != "tp-bgimagesettings" || (jQuery(this).attr('id') == "tp-bgimagesettings" && jQueryObj.data('imgsettings') != "on")) {
if (jQuery(this).attr('id') == "tp-bgimagesettings")
jQuery(this).slideUp(200)
else
jQuery(this).css({display: "none"});
}
});
jQuery('#' + jQueryObj.data('callid')).css({display: "block"});
if (jQueryObj.data('imgsettings') == "on")
jQuery('#tp-bgimagesettings').slideDown(200);
}
/*! LAYER ANIMATION */
/******************************
- ANIMATION CREATOR -
********************************/
function _________LAYER_ANIMATION___________(){}
function prepareAnimateCreator() {
var cic = jQuery('#caption-inout-controll');
cic.data('direction', 0);
jQuery('#caption-inout-controll').click(function () {
if (cic.data('direction') == 0) {
cic.data('direction', 1);
jQuery('#revshowmetheinanim').removeClass("reviconinaction");
jQuery('#revshowmetheoutanim').addClass("reviconinaction");
} else if (cic.data('direction') == 1) {
cic.data('direction', 2);
jQuery('#revshowmetheinanim').addClass("reviconinaction");
jQuery('#revshowmetheoutanim').addClass("reviconinaction");
} else if (cic.data('direction') == 2) {
cic.data('direction', 0);
jQuery('#revshowmetheinanim').addClass("reviconinaction");
jQuery('#revshowmetheoutanim').removeClass("reviconinaction");
}
});
startAnimationInCreator();
}
function startAnimationInCreator() {
stopAnimationInPreview();
animateCreatorIn();
}
function killAnimationInCreator() {
var nextcaption = jQuery('#caption_custon_anim_preview');
punchgs.TweenLite.killTweensOf(nextcaption, false);
}
function animateCreatorIn() {
var nextcaption = jQuery('#caption_custon_anim_preview');
var cic = jQuery('#caption-inout-controll');
var transx = jQuery('input[name="movex"]').val();
var transy = jQuery('input[name="movey"]').val();
var transz = jQuery('input[name="movez"]').val();
var rotatex = jQuery('input[name="rotationx"]').val();
var rotatey = jQuery('input[name="rotationy"]').val();
var rotatez = jQuery('input[name="rotationz"]').val();
var scalex = jQuery('input[name="scalex"]').val() / 100;
var scaley = jQuery('input[name="scaley"]').val() / 100;
var skewx = jQuery('input[name="skewx"]').val();
var skewy = jQuery('input[name="skewy"]').val();
var opac = jQuery('input[name="captionopacity"]').val() / 100;
var tper = jQuery('input[name="captionperspective"]').val();
//var tper = 600;
var originx = jQuery('input[name="originx"]').val() + "%";
var originy = jQuery('input[name="originy"]').val() + "%";
var origin = originx + " " + originy;
var speed = parseInt(jQuery('input[name="captionspeed"]').val(), 0);
if (speed < 100) speed = 100;
var easedata = jQuery('#caption-easing-demo').val();
speed = speed / 1000;
var mdelay = (jQuery('input[name="captionsplitdelay"]').val() / 100);
var $split = jQuery('#caption-split-demo').val();
var animobject = nextcaption;
if (nextcaption.data('mySplitText') != undefined)
if ($split != "none") nextcaption.data('mySplitText').revert();
if ($split == "chars" || $split == "words" || $split == "lines") {
if (nextcaption.find('a').length > 0)
nextcaption.data('mySplitText', new SplitText(nextcaption.find('a'), {type: "lines,words,chars"}));
else
nextcaption.data('mySplitText', new SplitText(nextcaption, {type: "lines,words,chars"}));
}
if ($split == "chars") {
animobject = nextcaption.data('mySplitText').chars;
}
if ($split == "words") {
animobject = nextcaption.data('mySplitText').words;
}
if ($split == "lines") {
animobject = nextcaption.data('mySplitText').lines;
}
var timedelay = ((animobject.length * mdelay) + speed) * 1000;
punchgs.TweenLite.killTweensOf(animobject, false);
if (animobject != nextcaption)
punchgs.TweenLite.set(nextcaption, {
opacity: 1,
scaleX: 1,
scaleY: 1,
rotationX: 0,
rotationY: 0,
rotationZ: 0,
skewX: 0,
skewY: 0,
z: 0,
x: 0,
y: 0,
visibility: 'visible',
opacity: 1,
overwrite: "all"
});
var tl = new punchgs.TimelineLite();
tl.staggerFromTo(animobject, speed,
{
scaleX: scalex,
scaleY: scaley,
rotationX: rotatex,
rotationY: rotatey,
rotationZ: rotatez,
x: transx,
y: transy,
z: transz + 1,
skewX: skewx,
skewY: skewy,
opacity: opac,
transformPerspective: tper,
transformOrigin: origin,
visibility: 'hidden'
},
{
x: 0,
y: 0,
scaleX: 1,
scaleY: 1,
rotationX: 0,
rotationY: 0,
rotationZ: 0,
skewX: 0,
skewY: 0,
z: 1,
visibility: 'visible',
opacity: 1,
ease: easedata,
overwrite: "all",
}, mdelay);
setTimeout(function () {
if (cic.data('direction') == 0)
animateCreatorIn();
else if (cic.data('direction') == 1 || cic.data('direction') == 2)
animateCreatorOut()
}, (timedelay) + 500)
}
function animateCreatorOut() {
var nextcaption = jQuery('#caption_custon_anim_preview');
var cic = jQuery('#caption-inout-controll');
var transx = jQuery('input[name="movex"]').val();
var transy = jQuery('input[name="movey"]').val();
var transz = jQuery('input[name="movez"]').val();
var $split = jQuery('#caption-split-demo').val();
var rotatex = jQuery('input[name="rotationx"]').val();
var rotatey = jQuery('input[name="rotationy"]').val();
var rotatez = jQuery('input[name="rotationz"]').val();
var scalex = jQuery('input[name="scalex"]').val() / 100;
var scaley = jQuery('input[name="scaley"]').val() / 100;
var skewx = jQuery('input[name="skewx"]').val();
var skewy = jQuery('input[name="skewy"]').val();
var opac = jQuery('input[name="captionopacity"]').val() / 100;
var tper = jQuery('input[name="captionperspective"]').val();
//var tper = 600;
var originx = jQuery('input[name="originx"]').val() + "%";
var originy = jQuery('input[name="originy"]').val() + "%";
var origin = originx + " " + originy;
var speed = parseInt(jQuery('input[name="captionspeed"]').val(), 0);
if (speed < 100) speed = 100;
var easedata = jQuery('#caption-easing-demo').val();
speed = speed / 1000;
var xx = 258, yy = 58;
var mdelay = (jQuery('input[name="captionsplitdelay"]').val() / 100);
var animobject = nextcaption;
if (nextcaption.data('mySplitText') != undefined)
if ($split != "none") nextcaption.data('mySplitText').revert();
if ($split == "chars" || $split == "words" || $split == "lines") {
if (nextcaption.find('a').length > 0)
nextcaption.data('mySplitText', new SplitText(nextcaption.find('a'), {type: "lines,words,chars"}));
else
nextcaption.data('mySplitText', new SplitText(nextcaption, {type: "lines,words,chars"}));
}
if ($split == "chars")
animobject = nextcaption.data('mySplitText').chars;
if ($split == "words")
animobject = nextcaption.data('mySplitText').words;
if ($split == "lines")
animobject = nextcaption.data('mySplitText').lines;
var timedelay = ((animobject.length * mdelay) + speed) * 1000;
punchgs.TweenLite.killTweensOf(animobject, false);
if (animobject != nextcaption)
punchgs.TweenLite.set(nextcaption, {
opacity: 1,
scaleX: 1,
scaleY: 1,
rotationX: 0,
rotationY: 0,
rotationZ: 0,
skewX: 0,
skewY: 0,
z: 0,
x: 0,
y: 0,
visibility: 'visible',
opacity: 1,
overwrite: "all"
});
var tl = new punchgs.TimelineLite();
punchgs.TweenLite.killTweensOf(animobject, false);
tl.staggerFromTo(animobject, speed,
{
x: 0,
y: 0,
scaleX: 1,
scaleY: 1,
rotationX: 0,
rotationY: 0,
rotationZ: 0,
skewX: 0,
skewY: 0,
z: 1,
visibility: 'visible',
opacity: 1
},
{
scaleX: scalex,
scaleY: scaley,
rotationX: rotatex,
rotationY: rotatey,
rotationZ: rotatez,
x: transx,
y: transy,
z: transz + 1,
skewX: skewx,
skewY: skewy,
opacity: opac,
transformPerspective: tper,
transformOrigin: origin,
ease: easedata,
overwrite: "all",
delay: 0.3,
}, mdelay);
setTimeout(function () {
if (cic.data('direction') == 0)
animateCreatorIn();
else if (cic.data('direction') == 2)
animateCreatorIn();
else if (cic.data('direction') == 1)
animateCreatorOut();
}, (timedelay) + 500)
}
/*********************************
- PREPARE THE ANIMATIONS -
********************************/
function _________PREPARE_ANIMATIONS___________(){}
function preparePeviewAnimations() {
jQuery('#preview_looper').click(function () {
var pl = jQuery(this);
if (pl.hasClass("deactivated")) {
pl.removeClass("deactivated");
pl.data('loop', 0);
pl.find('.replyinfo').html("ON");
setInAnimOfPreview();
} else {
pl.addClass("deactivated");
setInAnimOfPreview();
pl.data('loop', 0);
pl.find('.replyinfo').html("OFF");
}
})
var nextcaption = jQuery('#preview_caption_animateme');
var startanim = jQuery('#layer_animation');
var startspeed = jQuery('#layer_speed');
var startease = jQuery('#layer_easing');
var endanim = jQuery('#layer_endanimation');
var endspeed = jQuery('#layer_endspeed');
var endease = jQuery('#layer_endeasing');
startanim.on('change', function () {
setInAnimOfPreview();
});
startspeed.on('change', function () {
setInAnimOfPreview();
});
startease.on('change', function () {
setInAnimOfPreview();
});
endanim.on('change', function () {
setInAnimOfPreview();
});
endspeed.on('change', function () {
setInAnimOfPreview();
});
endease.on('change', function () {
setInAnimOfPreview();
});
}
/******************************
- PLAY IN ANIMATION -
********************************/
function _________PLAY_ANIMATIONS___________(){}
function stopAnimationInPreview() {
var nextcaption = jQuery('#preview_caption_animateme');
punchgs.TweenLite.killTweensOf(nextcaption, false);
if (nextcaption.data("timer")) clearTimeout(nextcaption.data('timer'));
if (nextcaption.data("timera")) clearTimeout(nextcaption.data('timera'));
}
function setInAnimOfPreview() {
var nextcaption = jQuery('#preview_caption_animateme');
var startanim = jQuery('#layer_animation');
var startspeed = jQuery('#layer_speed');
var startease = jQuery('#layer_easing');
var endanim = jQuery('#layer_endanimation');
var endspeed = jQuery('#layer_endspeed');
var endease = jQuery('#layer_endeasing');
var anim = startanim.val();
var speed = startspeed.val() / 1000;
var easedata = startease.val();
var mdelay = (jQuery('input[name="layer_splitdelay"]').val() / 100);
var $split = jQuery('#layer_split').val();
var animobject = nextcaption;
if (nextcaption.data('mySplitText') != undefined)
if ($split != "none") nextcaption.data('mySplitText').revert();
if ($split == "chars" || $split == "words" || $split == "lines") {
if (nextcaption.find('a').length > 0)
nextcaption.data('mySplitText', new SplitText(nextcaption.find('a'), {type: "lines,words,chars"}));
else
nextcaption.data('mySplitText', new SplitText(nextcaption, {type: "lines,words,chars"}));
}
if ($split == "chars") {
animobject = nextcaption.data('mySplitText').chars;
}
if ($split == "words") {
animobject = nextcaption.data('mySplitText').words;
}
if ($split == "lines") {
animobject = nextcaption.data('mySplitText').lines;
}
var timedelay = ((animobject.length * mdelay) + speed) * 1000;
punchgs.TweenLite.killTweensOf(nextcaption, false);
punchgs.TweenLite.killTweensOf(animobject, false);
punchgs.TweenLite.set(nextcaption, {clearProps: "transform"});
punchgs.TweenLite.set(animobject, {clearProps: "transform"});
if (animobject != nextcaption)
punchgs.TweenLite.set(nextcaption, {
opacity: 1,
scaleX: 1,
scaleY: 1,
rotationX: 0,
rotationY: 0,
rotationZ: 0,
skewX: 0,
skewY: 0,
z: 0,
x: 0,
y: 0,
visibility: 'visible',
opacity: 1,
overwrite: "all"
});
var tl = new punchgs.TimelineLite();
if (nextcaption.data("timer")) clearTimeout(nextcaption.data('timer'));
if (nextcaption.data("timera")) clearTimeout(nextcaption.data('timera'));
var tlop = 0,
tlxx = 198, tlyy = 82, tlzz = 2,
tlsc = 1, tlro = 0,
sc = 1, scX = 1, scY = 1,
ro = 0, roX = 0, roY = 0, roZ = 0,
skwX = 0, skwY = 0,
opa = 0,
trorig = "center,center",
tper = 300,
repeatV = 0,
yoyoV = false,
repeatdelayV = 0,
calcx = 198,
calcy = 82;
if (anim == null) anim = "fade";
if (anim == "randomrotate") {
sc = Math.random() * 3 + 1;
ro = Math.round(Math.random() * 200 - 100);
transx = Math.round(Math.random() * 200 - 100);
transy = Math.round(Math.random() * 200 - 100);
}
if (anim == ('lfr') || anim == ('skewfromright')) transx = 560;
if (anim == ('lfl') || anim == ('skewfromleft')) transx = -100;
if (anim == ('sfl') | anim == ('skewfromleftshort')) transx = -50;
if (anim == ('sfr') | anim == ('skewfromrightshort')) transx = 50;
if (anim == ('lft')) transy = -50;
if (anim == ('lfb')) transy = 250;
if (anim == ('sft')) transy = -50;
if (anim == ('sfb')) transy = 50;
if (anim == ('skewfromright') || anim == ('skewfromrightshort')) skwX = -85;
if (anim == ('skewfromleft') || anim == ('skewfromleftshort')) skwX = 85;
if (anim.split('custom').length > 1) {
var id = anim.split("-")[1];
var params = new Object;
params = getCutCustomParams(id);
var transx = params.movex;
var transy = params.movey;
var transz = params.movez;
var rotatex = params.rotationx;
var rotatey = params.rotationy;
var rotatez = params.rotationz;
var scalex = params.scalex / 100;
var scaley = params.scaley / 100;
var skewx = params.skewx;
var skewy = params.skewy;
var opac = params.captionopacity / 100;
var tper = params.captionperspective;
//var tper = 600;
var originx = params.originx + "%";
var originy = params.originy + "%";
var origin = originx + " " + originy;
nextcaption.data('newanim', tl.staggerFromTo(animobject, speed,
{
scaleX: scalex,
scaleY: scaley,
rotationX: rotatex,
rotationY: rotatey,
rotationZ: rotatez,
x: transx,
y: transy,
z: transz + 1,
skewX: skewx,
skewY: skewy,
opacity: opac,
transformPerspective: tper,
transformOrigin: origin,
visibility: 'hidden'
},
{
x: 0,
y: 0,
scaleX: 1,
scaleY: 1,
rotationX: 0,
rotationY: 0,
rotationZ: 0,
skewX: 0,
skewY: 0,
z: 1,
visibility: 'visible',
opacity: 1,
ease: easedata,
overwrite: "all",
}, mdelay));
nextcaption.data('timera', setTimeout(function () {
if (!jQuery('#preview_looper').hasClass("deactivated") && jQuery('#preview_looper').data('loop') != 2) setOutAnimOfPreview();
}, (timedelay) + 500));
} else {
nextcaption.data('newanim', tl.staggerFromTo(animobject, speed,
{
scale: sc,
rotation: ro,
rotationX: 0,
rotationY: 0,
rotationZ: 0,
x: transx,
y: transy,
opacity: 0,
z: 1,
skewX: skwX,
skewY: 0,
transformPerspective: 600,
transformOrigin: "50% 50%",
visibility: 'visible'
},
{
scale: 1,
skewX: 0,
rotation: 0,
z: 1,
x: 0,
y: 0,
visibility: 'visible',
opacity: 1,
ease: easedata,
overwrite: "all",
}, mdelay));
nextcaption.data('timera', setTimeout(function () {
if (!jQuery('#preview_looper').hasClass("deactivated") && jQuery('#preview_looper').data('loop') != 2) setOutAnimOfPreview();
}, (timedelay) + 500));
}
}
function getCutCustomParams(id) {
var params = new Object;
jQuery.each(initLayerAnims, function (i, curobj) {
if (parseInt(curobj.id, 0) == parseInt(id, 0)) params = curobj.params;
})
return params;
}
/******************************
- PLAY OUT ANIMATION -
********************************/
function setOutAnimOfPreview() {
var nextcaption = jQuery('#preview_caption_animateme');
var startanim = jQuery('#layer_animation');
var startspeed = jQuery('#layer_speed');
var startease = jQuery('#layer_easing');
var endanim = jQuery('#layer_endanimation');
var endspeed = jQuery('#layer_endspeed');
var endease = jQuery('#layer_endeasing');
var anim = endanim.val();
var speed = endspeed.val() / 1000;
var easedata = endease.val();
var xx = 0;
var yy = 0;
skwX = 0;
var mdelay = (jQuery('input[name="layer_endsplitdelay"]').val() / 100);
var $split = jQuery('#layer_endsplit').val();
var animobject = nextcaption;
if (nextcaption.data('mySplitText') != undefined)
if ($split != "none") nextcaption.data('mySplitText').revert();
if ($split == "chars" || $split == "words" || $split == "lines") {
if (nextcaption.find('a').length > 0)
nextcaption.data('mySplitText', new SplitText(nextcaption.find('a'), {type: "lines,words,chars"}));
else
nextcaption.data('mySplitText', new SplitText(nextcaption, {type: "lines,words,chars"}));
}
if ($split == "chars") {
animobject = nextcaption.data('mySplitText').chars;
}
if ($split == "words") {
animobject = nextcaption.data('mySplitText').words;
}
if ($split == "lines") {
animobject = nextcaption.data('mySplitText').lines;
}
var timedelay = ((animobject.length * mdelay) + speed) * 1000;
punchgs.TweenLite.killTweensOf(animobject, false);
if (animobject != nextcaption)
punchgs.TweenLite.set(nextcaption, {
opacity: 1,
scaleX: 1,
scaleY: 1,
rotationX: 0,
rotationY: 0,
rotationZ: 0,
skewX: 0,
skewY: 0,
z: 0,
x: 0,
y: 0,
visibility: 'visible',
opacity: 1,
overwrite: "all"
});
var tl = new punchgs.TimelineLite();
if (anim == null) anim = "auto";
if (anim == ('fadeout') ||
anim == ('ltr') ||
anim == ('ltl') ||
anim == ('str') ||
anim == ('stl') ||
anim == ('ltt') ||
anim == ('ltb') ||
anim == ('stt') ||
anim == ('stb') ||
anim == ('skewtoright') ||
anim == ('skewtorightshort') ||
anim == ('skewtoleft') ||
anim == ('skewtoleftshort')) {
if (anim == ('skewtoright') || anim == ('skewtorightshort'))
skwX = 35
if (anim == ('skewtoleft') || anim == ('skewtoleftshort'))
skwX = -35
if (anim == ('ltr') || anim == ('skewtoright'))
xx = 560;
else if (anim == ('ltl') || anim == ('skewtoleft'))
xx = -100;
else if (anim == ('ltt'))
yy = -50;
else if (anim == ('ltb'))
yy = 250;
else if (anim == ('str') || anim == ('skewtorightshort')) {
xx = 50;
oo = 0;
} else if (anim == ('stl') || anim == ('skewtoleftshort')) {
xx = -50;
oo = 0;
} else if (anim == ('stt')) {
yy = -50;
oo = 0;
} else if (anim == ('stb')) {
yy = 50;
oo = 0;
}
if (anim == ('skewtorightshort'))
xx = 400;
if (anim == ('skewtoleftshort'))
xx = 0
nextcaption.data('newanim', tl.staggerTo(animobject, speed,
{
scale: 1,
rotation: 0,
skewX: skwX,
opacity: 0,
x: xx,
y: yy,
z: 2,
overwrite: "auto",
ease: easedata,
}, mdelay));
nextcaption.data('timera', setTimeout(function () {
if (jQuery('#preview_looper').hasClass("deactivated")) jQuery('#preview_looper').data('loop', 2);
setInAnimOfPreview();
}, (timedelay) + 500));
} else if (anim.split('custom').length > 1) {
var id = anim.split("-")[1];
var params = new Object;
params = getCutCustomParams(id);
var transx = params.movex;
var transy = params.movey;
var transz = params.movez;
var rotatex = params.rotationx;
var rotatey = params.rotationy;
var rotatez = params.rotationz;
var scalex = params.scalex / 100;
var scaley = params.scaley / 100;
var skewx = params.skewx;
var skewy = params.skewy;
var opac = params.captionopacity / 100;
var tper = params.captionperspective;
//var tper = 600;
var originx = params.originx + "%";
var originy = params.originy + "%";
var origin = originx + " " + originy;
nextcaption.data('newanim', tl.staggerFromTo(animobject, speed,
{
x: 0,
y: 0,
scaleX: 1,
scaleY: 1,
rotationX: 0,
rotationY: 0,
rotationZ: 0,
skewX: 0,
skewY: 0,
transformPerspective: tper,
transformOrigin: origin,
z: 1,
visibility: 'visible',
opacity: 1,
},
{
scaleX: scalex,
scaleY: scaley,
rotationX: rotatex,
rotationY: rotatey,
rotationZ: rotatez,
x: transx,
y: transy,
z: transz + 1,
skewX: skewx,
skewY: skewy,
opacity: opac,
transformPerspective: tper,
transformOrigin: origin,
ease: easedata,
}, mdelay));
nextcaption.data('timera', setTimeout(function () {
if (jQuery('#preview_looper').hasClass("deactivated")) jQuery('#preview_looper').data('loop', 2);
setInAnimOfPreview();
}, (timedelay) + 500));
} else {
nextcaption.data('newanim').reverse();
nextcaption.data('timer', setTimeout(function () {
if (jQuery('#preview_looper').hasClass("deactivated")) jQuery('#preview_looper').data('loop', 2);
setInAnimOfPreview();
}, (speed * 1000) + 1000))
}
}
/*! ALIGN TABLE HANDLING */
/**
* init the align table
*/
function initAlignTable() {
jQuery("#align_table a").click(function () {
var obj = jQuery(this);
if (jQuery("#align_table").hasClass("table_disabled"))
return (false);
if (obj.hasClass("selected"))
return (false);
var alignHor = obj.data("hor");
var alignVert = obj.data("vert");
jQuery("#align_table a").removeClass("selected");
obj.addClass("selected");
jQuery("#layer_align_hor").val(alignHor);
jQuery("#layer_align_vert").val(alignVert);
var objLayerXText = jQuery("#layer_left_text");
var objLayerYText = jQuery("#layer_top_text");
switch (alignHor) {
case "left":
objLayerXText.html(objLayerXText.data("textnormal")).css("width", "auto");
jQuery("#layer_left").val("10");
break;
case "right":
objLayerXText.html(objLayerXText.data("textoffset")).css("width", "42px");
jQuery("#layer_left").val("10");
break;
case "center":
objLayerXText.html(objLayerXText.data("textoffset")).css("width", "42px");
jQuery("#layer_left").val("0");
break;
}
switch (alignVert) {
case "top":
objLayerYText.html(objLayerYText.data("textnormal")).css("width", "auto");
jQuery("#layer_top").val("10");
break;
case "bottom":
objLayerYText.html(objLayerYText.data("textoffset")).css("width", "42px");
jQuery("#layer_top").val("10");
break;
case "middle":
objLayerYText.html(objLayerYText.data("textoffset")).css("width", "42px");
jQuery("#layer_top").val("0");
break;
}
t.updateLayerFromFields();
updateHtmlLayersFromObject(getSerialFromID(jQuery('.layer_selected').attr('id')), true);
});
}
/**
* init general events
*/
function initMainEvents() {
//unselect layers on container click
container.click(unselectLayers);
}
/*! INIT HTML FIELDS */
/**
* init events (update) for html properties change.
*/
function initHtmlFields() {
//show / hide slide link offset
jQuery("#layer_slide_link").change(function () {
showHideOffsetRow();
});
//set layers autocompolete
jQuery("#layer_caption").autocomplete({
position: { my : "right top", at: "right bottom" },
source: initArrCaptionClasses,
minLength: 0,
close: t.updateLayerFromFields
}).data("ui-autocomplete")._renderItem = function (ul, item) {
var listItem = jQuery("<li></li>")
.data("item.autocomplete", item)
.append("<a>" + item.label + "</a>")
.appendTo(ul);
listItem.attr('original-title', item.value);
return listItem;
};
//open the list on right button
jQuery("#layer_captions_down").click(function (event) {
event.stopPropagation();
jQuery("#css_editor_expert").hide();
jQuery("#css_editor_wrap").hide();
//if opened - close autocomplete
if (jQuery('#layer_caption').data("is_open") == true)
jQuery("#layer_caption").autocomplete("close");
else //else open autocomplete
if (jQuery(this).hasClass("ui-state-active"))
jQuery("#layer_caption").autocomplete("search", "").data("ui-autocomplete")._renderItem = function (ul, item) {
var listItem = jQuery("<li></li>")
.data("item.autocomplete", item)
.append("<a>" + item.label + "</a>")
.appendTo(ul);
listItem.attr('original-title', item.value);
return listItem;
};
});
//handle autocomplete close
jQuery('#layer_caption').bind('autocompleteopen', function () {
jQuery(this).data('is_open', true);
//handle tooltip
jQuery('.ui-autocomplete li').tipsy({
delayIn: 70,
html: true,
gravity: "e",
//trigger:"manual",
title: function () {
setTimeout(function () {
jQuery('.tp-present-caption-small').parent().addClass("tp-present-wrapper-small");
jQuery('.tp-present-caption-small').parent().parent().addClass("tp-present-wrapper-parent-small");
}, 10)
return '<div class="tp-present-caption-small"><div class="tp-caption ' + this.getAttribute('original-title') + '">example</div></div>';
}
});
});
jQuery('#layer_caption').bind('autocompleteclose', function () {
jQuery(this).data('is_open', false);
});
//set layers autocompolete
jQuery("#font_family").autocomplete({
source: initArrFontTypes,
minLength: 0,
close: t.updateLayerFromFields
});
//open the list on right button
jQuery("#font_family_down").click(function (event) {
event.stopPropagation();
//if opened - close autocomplete
if (jQuery('#font_family').data("is_open") == true)
jQuery("#font_family").autocomplete("close");
else //else open autocomplete
if (jQuery(this).hasClass("ui-state-active"))
jQuery("#font_family").autocomplete("search", "").data("ui-autocomplete");
});
//handle autocomplete close
jQuery('#font_family').bind('autocompleteopen', function () {
jQuery(this).data('is_open', true);
});
jQuery('#font_family').bind('autocompleteclose', function () {
jQuery(this).data('is_open', false);
});
jQuery("body").click(function () {
jQuery("#layer_caption").autocomplete("close");
jQuery("#font_family").autocomplete("close");
});
//set events:
jQuery("#form_layers select, #layer_proportional_scale").change(function () {
t.updateLayerFromFields();
});
// UPDATE LAYER TEXT FIELD
jQuery("#layer_text").keyup(function () {
updateLayerTextField("", jQuery('#sortlist li.ui-state-hover .tl-fullanim'), jQuery(this).val());
t.updateLayerFromFields();
});
var pressEnterFields = "#form_layers input, #form_layers textarea";
jQuery(pressEnterFields).blur(function () {
t.updateLayerFromFields();
});
jQuery(pressEnterFields).keypress(function (event) {
if (event.keyCode == 13) {
t.updateLayerFromFields();
}
});
//end time validation
jQuery("#layer_endtime").blur(validateCurrentLayerTimes).keypress(function (event) {
if (event.keyCode == 13)
validateCurrentLayerTimes();
});
//end speed update
jQuery("#layer_endspeed").blur(validateCurrentLayerTimes).keypress(function (event) {
updateCurTimer("", jQuery('#sortlist li.ui-state-hover .tl-fullanim'));
});
jQuery("#layer_endspeed").blur(function () {
updateCurTimer("", jQuery('#sortlist li.ui-state-hover .tl-fullanim'));
});
jQuery("#delay").keypress(function (event) {
if (Number(jQuery('#delay').val()) > 0)
g_slideTime = jQuery('#delay').val();
updateCurTimer("", jQuery('#sortlist li.ui-state-hover .tl-fullanim'));
});
jQuery("#delay").blur(function () {
if (Number(jQuery('#delay').val()) > 0)
g_slideTime = jQuery('#delay').val();
updateCurTimer("", jQuery('#sortlist li.ui-state-hover .tl-fullanim'));
});
}
/**
* init buttons actions
*/
function initButtons() {
//set event buttons actions:
jQuery("#button_add_layer").click(function () {
if (jQuery(this).data('isstatic') == true) {
addLayerText('static');
sceneSize();
} else {
addLayerText();
sceneSize();
}
});
jQuery("#button_add_layer_image").click(function () {
if (jQuery(this).data('isstatic') == true) {
UniteAdminRev.openAddImageDialog("Select Static Layer Image", function (urlImage) {
addLayerImage(urlImage, 'static');
});
sceneSize();
} else {
UniteAdminRev.openAddImageDialog("Select Layer Image", function (urlImage) {
addLayerImage(urlImage);
});
sceneSize();
}
});
//add youtube actions:
jQuery("#button_add_layer_video").click(function () {
if (jQuery(this).data('isstatic') == true) {
UniteAdminRev.openVideoDialog(function (videoData) {
addLayerVideo(videoData, 'static');
});
sceneSize();
} else {
UniteAdminRev.openVideoDialog(function (videoData) {
addLayerVideo(videoData);
});
sceneSize();
}
});
// BUILD THE LAYER ANIMATION DIALOG
jQuery('#add_customanimation_in').click(function () {
if (!t.getLayerGeneralParamsStatus()) return false; //false if fields are disabled
currentAnimationType = 'customin';
stopAnimationInPreview();
initLayerAnimationDialog();
setNewAnimObj();
});
// BUILD THE LAYER ANIMATION DIALOG
jQuery('#add_customanimation_out').click(function () {
if (!t.getLayerGeneralParamsStatus()) return false; //false if fields are disabled
currentAnimationType = 'customout';
initLayerAnimationDialog();
setNewAnimObj();
});
//build the random animation button
jQuery('#set-random-animation').click(function () {
jQuery('input[name="movex"]').val((Math.floor(Math.random() * 101) - 50) * 10);
jQuery('input[name="movey"]').val((Math.floor(Math.random() * 101) - 50) * 10);
jQuery('input[name="movez"]').val((Math.floor(Math.random() * 11) - 5) * 10);
jQuery('input[name="rotationx"]').val((Math.floor(Math.random() * 101) - 50) * 10);
jQuery('input[name="rotationy"]').val((Math.floor(Math.random() * 101) - 50) * 10);
jQuery('input[name="rotationz"]').val((Math.floor(Math.random() * 101) - 50) * 10);
jQuery('input[name="scalex"]').val((Math.floor(Math.random() * 31)) * 10);
jQuery('input[name="scaley"]').val((Math.floor(Math.random() * 31)) * 10);
jQuery('input[name="skewx"]').val(Math.floor(Math.random() * 61));
jQuery('input[name="skewy"]').val(Math.floor(Math.random() * 61));
jQuery('input[name="captionopacity"]').val(0);
jQuery('input[name="captionperspective"]').val(600);
jQuery('input[name="originx"]').val((Math.floor(Math.random() * 41) - 20) * 10);
jQuery('input[name="originy"]').val((Math.floor(Math.random() * 41) - 20) * 10);
jQuery("#caption-movex-slider").slider("value", jQuery('input[name="movex"]').val());
jQuery("#caption-movey-slider").slider("value", jQuery('input[name="movey"]').val());
jQuery("#caption-movez-slider").slider("value", jQuery('input[name="movez"]').val());
jQuery("#caption-rotationx-slider").slider("value", jQuery('input[name="rotationx"]').val());
jQuery("#caption-rotationy-slider").slider("value", jQuery('input[name="rotationy"]').val());
jQuery("#caption-rotationz-slider").slider("value", jQuery('input[name="rotationz"]').val());
jQuery("#caption-scalex-slider").slider("value", jQuery('input[name="scalex"]').val());
jQuery("#caption-scaley-slider").slider("value", jQuery('input[name="scaley"]').val());
jQuery("#caption-skewx-slider").slider("value", jQuery('input[name="skewx"]').val());
jQuery("#caption-skewy-slider").slider("value", jQuery('input[name="skewy"]').val());
jQuery("#caption-opacity-slider").slider("value", jQuery('input[name="captionopacity"]').val());
jQuery("#caption-perspective-slider").slider("value", jQuery('input[name="captionperspective"]').val());
jQuery("#caption-originx-slider").slider("value", jQuery('input[name="originx"]').val());
jQuery("#caption-originy-slider").slider("value", jQuery('input[name="originy"]').val());
jQuery('input[name="captionspeed"]').val((Math.floor(Math.random() * 11) + 5) * 100);
transition = jQuery('#caption-easing-demo option');
var random = Math.floor(transition.length * (Math.random() % 1));
transition.attr('selected', false).eq(random).attr('selected', true);
});
//edit video actions
jQuery("#button_edit_video").click(function () {
var objCurrentLayer = getCurrentLayer();
var objVideoData = objCurrentLayer.video_data;
//open video dialog
UniteAdminRev.openVideoDialog(function (videoData) {
//update video layer
var objLayer = getVideoObjLayer(videoData);
updateCurrentLayer(objLayer);
updateHtmlLayersFromObject(selectedLayerSerial);
updateLayerFormFields(selectedLayerSerial);
redrawLayerHtml(selectedLayerSerial);
},
objVideoData);
});
//change image source actions
jQuery("#button_change_image_source").click(function () {
UniteAdminRev.openAddImageDialog("Select Layer Image", function (urlImage) {
var objData = {};
objData.image_url = urlImage;
updateCurrentLayer(objData);
redrawLayerHtml(selectedLayerSerial);
});
});
//delete layer actions:
jQuery(".timeline-layer-delete").live('click', function () {
if (jQuery(this).hasClass("button-disabled"))
return (false);
//delete selected layer
deleteCurrentLayer();
sceneSize();
});
//delete layer actions:
jQuery(".timeline-layer-duplicate").live('click', function () {
if (jQuery(this).hasClass("button-disabled"))
return (false);
//delete selected layer
duplicateCurrentLayer();
sceneSize();
});
//delete all layers actions:
jQuery("#button_delete_all").click(function () {
if (confirm("Do you really want to delete all the layers?") == false)
return (true);
if (jQuery(this).hasClass("button-disabled"))
return (false);
deleteAllLayers();
jQuery('.edit_layers_left').addClass("hidden").removeClass("visible");
sceneSize();
});
//insert button link - open the dialog
jQuery("#linkInsertButton").click(function () {
if (jQuery(this).hasClass("disabled"))
return (false);
var buttons = {
"Cancel": function () {
jQuery("#dialog_insert_button").dialog("close")
}
}
jQuery("#dialog_insert_button").dialog({
buttons: buttons,
minWidth: 500,
dialogClass: "tpdialogs",
modal: true
});
});
//insert button link - open the dialog
jQuery("#linkInsertTemplate").click(function () {
if (jQuery(this).hasClass("disabled"))
return (false);
var buttons = {
"Cancel": function () {
jQuery("#dialog_template_insert").dialog("close")
}
}
jQuery("#dialog_template_insert").dialog({
buttons: buttons,
minWidth: 500,
dialogClass: "tpdialogs",
modal: true
});
});
}
//======================================================
// Init Function End
//======================================================
function _________LAYER_ANIMATION_DIALOG___________(){}
/**************************************
- INIT LAYER ANIMATION DIALOG -
**************************************/
function initLayerAnimationDialog() {
var curAnimHandle = (currentAnimationType == 'customin') ? jQuery('#layer_animation').val() : jQuery('#layer_endanimation').val();
var curAnimText = (currentAnimationType == 'customin') ? jQuery('#layer_animation option:selected').text() : jQuery('#layer_endanimation option:selected').text();
var isOriginal = (curAnimHandle.indexOf('custom') > -1) ? false : true;
var layerEasing = (currentAnimationType == 'customin') ? jQuery('#layer_easing option:selected').val() : jQuery('#layer_endeasing option:selected').val();
var layerSpeed = (currentAnimationType == 'customin') ? jQuery('#layer_speed').val() : jQuery('#layer_endspeed').val();
if (layerEasing == 'nothing') layerEasing = jQuery('#layer_easing option:selected').val();
jQuery('#caption-easing-demo').val(layerEasing);
if (parseInt(layerSpeed) == 0) layerSpeed = 600;
jQuery('input[name="captionspeed"]').val(layerSpeed);
var cic = jQuery('#caption-inout-controll');
cic.data('direction', 0);
jQuery('#revshowmetheinanim').addClass("reviconinaction");
jQuery('#revshowmetheoutanim').removeClass("reviconinaction");
//set the transition direction to out
if (currentAnimationType == 'customout') jQuery('#caption-inout-controll').click();
jQuery("#layeranimeditor_wrap").dialog({
modal: true,
resizable: false,
title: 'Layer Animation Editor',
minWidth: 700,
minHeight: 500,
closeOnEscape: true,
open: function () {
jQuery(this).closest(".ui-dialog")
.find(".ui-button").each(function (i) {
var cl;
if (i == 0) cl = "revgray";
if (i == 1) cl = "revgreen";
if (i == 2) cl = "revred";
if (i == 3) cl = "revred";
jQuery(this).addClass(cl).addClass("button-primary").addClass("rev-uibuttons");
})
},
close: function () {
setInAnimOfPreview();
},
buttons: {
"Save/Change": function () {
var animObj = createNewAnimObj();
UniteAdminRev.setErrorMessageID("dialog_error_message");
jQuery('#current-layer-handle').text(curAnimText);
jQuery('input[name="layeranimation_save_as"]').val(curAnimText);
jQuery("#dialog-change-layeranimation").dialog({
modal: true,
buttons: {
'Save as': function () {
jQuery("#dialog-change-layeranimation-save-as").dialog({
modal: true,
buttons: {
'Save as new': function () {
var id = checkIfAnimExists(jQuery('input[name="layeranimation_save_as"]').val());
var update = true;
if (id !== false) {
update = false;
if (confirm("Animation already exists, overwrite?")) {
updateAnimInDb(jQuery('input[name="layeranimation_save_as"]').val(), animObj, id);
update = true;
}
} else {
updateAnimInDb(jQuery('input[name="layeranimation_save_as"]').val(), animObj, false);
}
if (update) {
jQuery("#dialog-change-layeranimation-save-as").dialog("close");
jQuery("#dialog-change-layeranimation").dialog("close");
jQuery(this).dialog("close");
jQuery("#layeranimeditor_wrap").dialog("close");
setInAnimOfPreview();
}
}
}
});
},
Save: function () {
var id = checkIfAnimExists(jQuery('input[name="layeranimation_save_as"]').val());
if (id !== false) {
if (confirm("Really overwrite animation?")) {
updateAnimInDb(jQuery('input[name="layeranimation_save_as"]').val(), animObj, id);
jQuery(this).dialog("close");
jQuery("#layeranimeditor_wrap").dialog("close");
setInAnimOfPreview();
}
} else {
updateAnimInDb(jQuery('input[name="layeranimation_save_as"]').val(), animObj, false);
jQuery(this).dialog("close");
jQuery("#layeranimeditor_wrap").dialog("close");
setInAnimOfPreview();
}
}
}
});
},
"Cancel": function () {
jQuery(this).dialog("close");
setInAnimOfPreview();
},
Delete: function () {
if (isOriginal) {
alert("Default animations can't be deleted");
} else {
if (confirm('Really delete the animation "' + curAnimText + '"?')) {
deleteAnimInDb(curAnimHandle);
setInAnimOfPreview();
jQuery("#layeranimeditor_wrap").dialog("close");
}
}
}
}
});
jQuery("#caption-rotationx-slider").slider({
range: "min",
min: -980,
max: 980,
step: 10,
slide: function (event, ui) {
jQuery('input[name="rotationx"]').val(ui.value);
}
});
jQuery("#caption-rotationy-slider").slider({
range: "min",
min: -980,
max: 980,
step: 10,
slide: function (event, ui) {
jQuery('input[name="rotationy"]').val(ui.value);
}
});
jQuery("#caption-rotationz-slider").slider({
range: "min",
min: -980,
max: 980,
step: 10,
slide: function (event, ui) {
jQuery('input[name="rotationz"]').val(ui.value);
}
});
jQuery("#caption-movex-slider").slider({
range: "min",
min: -2000,
max: 2000,
step: 10,
slide: function (event, ui) {
jQuery('input[name="movex"]').val(ui.value);
}
});
jQuery("#caption-movey-slider").slider({
range: "min",
min: -2000,
max: 2000,
step: 10,
slide: function (event, ui) {
jQuery('input[name="movey"]').val(ui.value);
}
});
jQuery("#caption-movez-slider").slider({
range: "min",
min: -2000,
max: 2000,
step: 10,
slide: function (event, ui) {
jQuery('input[name="movez"]').val(ui.value);
}
});
jQuery("#caption-scalex-slider").slider({
range: "min",
min: 0,
max: 800,
step: 10,
slide: function (event, ui) {
jQuery('input[name="scalex"]').val(ui.value);
}
});
jQuery("#caption-scaley-slider").slider({
range: "min",
min: 0,
max: 800,
step: 10,
slide: function (event, ui) {
jQuery('input[name="scaley"]').val(ui.value);
}
});
jQuery("#caption-skewx-slider").slider({
range: "min",
min: -180,
max: 180,
step: 1,
slide: function (event, ui) {
jQuery('input[name="skewx"]').val(ui.value);
}
});
jQuery("#caption-skewy-slider").slider({
range: "min",
min: -180,
max: 180,
step: 1,
slide: function (event, ui) {
jQuery('input[name="skewy"]').val(ui.value);
}
});
jQuery("#caption-opacity-slider").slider({
range: "min",
min: -0,
max: 100,
step: 1,
slide: function (event, ui) {
jQuery('input[name="captionopacity"]').val(ui.value);
}
});
jQuery("#caption-perspective-slider").slider({
range: "min",
min: -3000,
max: 3000,
step: 1,
slide: function (event, ui) {
jQuery('input[name="captionperspective"]').val(ui.value);
}
});
jQuery("#caption-originx-slider").slider({
range: "min",
min: -200,
max: 200,
step: 10,
slide: function (event, ui) {
jQuery('input[name="originx"]').val(ui.value);
}
});
jQuery("#caption-originy-slider").slider({
range: "min",
min: -200,
max: 200,
step: 10,
slide: function (event, ui) {
jQuery('input[name="originy"]').val(ui.value);
}
});
}
/**
* get the values of custom animation dialog
*/
function createNewAnimObj() {
var customAnim = new Object;
customAnim['movex'] = jQuery('input[name="movex"]').val();
customAnim['movey'] = jQuery('input[name="movey"]').val();
customAnim['movez'] = jQuery('input[name="movez"]').val();
customAnim['rotationx'] = jQuery('input[name="rotationx"]').val();
customAnim['rotationy'] = jQuery('input[name="rotationy"]').val();
customAnim['rotationz'] = jQuery('input[name="rotationz"]').val();
customAnim['scalex'] = jQuery('input[name="scalex"]').val();
customAnim['scaley'] = jQuery('input[name="scaley"]').val();
customAnim['skewx'] = jQuery('input[name="skewx"]').val();
customAnim['skewy'] = jQuery('input[name="skewy"]').val();
customAnim['captionopacity'] = jQuery('input[name="captionopacity"]').val();
customAnim['captionperspective'] = jQuery('input[name="captionperspective"]').val();
customAnim['originx'] = jQuery('input[name="originx"]').val();
customAnim['originy'] = jQuery('input[name="originy"]').val();
return customAnim;
}
/**
* set the values of custom animation dialog
*/
function setNewAnimObj() {
var customAnim = new Object;
var selectedLayer = (currentAnimationType == 'customin') ? jQuery('#layer_animation').val() : jQuery('#layer_endanimation').val();
if (selectedLayer.indexOf('customin') > -1 || selectedLayer.indexOf('customout') > -1) {
selectedLayer = selectedLayer.replace('customin-', '').replace('customout-', '');
if (typeof initLayerAnims === 'object' && !jQuery.isEmptyObject(initLayerAnims)) {
for (var key in initLayerAnims) {
if (initLayerAnims[key]['id'] == selectedLayer) {
customAnim = initLayerAnims[key]['params'];
}
}
}
}
if (!jQuery.isEmptyObject(customAnim)) {
jQuery('input[name="movex"]').val(customAnim['movex']);
jQuery('input[name="movey"]').val(customAnim['movey']);
jQuery('input[name="movez"]').val(customAnim['movez']);
jQuery('input[name="rotationx"]').val(customAnim['rotationx']);
jQuery('input[name="rotationy"]').val(customAnim['rotationy']);
jQuery('input[name="rotationz"]').val(customAnim['rotationz']);
jQuery('input[name="scalex"]').val(customAnim['scalex']);
jQuery('input[name="scaley"]').val(customAnim['scaley']);
jQuery('input[name="skewx"]').val(customAnim['skewx']);
jQuery('input[name="skewy"]').val(customAnim['skewy']);
jQuery('input[name="captionopacity"]').val(customAnim['captionopacity']);
jQuery('input[name="captionperspective"]').val(customAnim['captionperspective']);
jQuery('input[name="originx"]').val(customAnim['originx']);
jQuery('input[name="originy"]').val(customAnim['originy']);
} else {
jQuery('input[name="movex"]').val(0);
jQuery('input[name="movey"]').val(0);
jQuery('input[name="movez"]').val(0);
jQuery('input[name="rotationx"]').val(0);
jQuery('input[name="rotationy"]').val(0);
jQuery('input[name="rotationz"]').val(0);
jQuery('input[name="scalex"]').val(100);
jQuery('input[name="scaley"]').val(100);
jQuery('input[name="skewx"]').val(0);
jQuery('input[name="skewy"]').val(0);
jQuery('input[name="captionopacity"]').val(0);
jQuery('input[name="captionperspective"]').val(600);
jQuery('input[name="originx"]').val(50);
jQuery('input[name="originy"]').val(50);
}
jQuery("#caption-movex-slider").slider("value", jQuery('input[name="movex"]').val());
jQuery("#caption-movey-slider").slider("value", jQuery('input[name="movey"]').val());
jQuery("#caption-movez-slider").slider("value", jQuery('input[name="movez"]').val());
jQuery("#caption-rotationx-slider").slider("value", jQuery('input[name="rotationx"]').val());
jQuery("#caption-rotationy-slider").slider("value", jQuery('input[name="rotationy"]').val());
jQuery("#caption-rotationz-slider").slider("value", jQuery('input[name="rotationz"]').val());
jQuery("#caption-scalex-slider").slider("value", jQuery('input[name="scalex"]').val());
jQuery("#caption-scaley-slider").slider("value", jQuery('input[name="scaley"]').val());
jQuery("#caption-skewx-slider").slider("value", jQuery('input[name="skewx"]').val());
jQuery("#caption-skewy-slider").slider("value", jQuery('input[name="skewy"]').val());
jQuery("#caption-opacity-slider").slider("value", jQuery('input[name="captionopacity"]').val());
jQuery("#caption-perspective-slider").slider("value", jQuery('input[name="captionperspective"]').val());
jQuery("#caption-originx-slider").slider("value", jQuery('input[name="originx"]').val());
jQuery("#caption-originy-slider").slider("value", jQuery('input[name="originy"]').val());
}
/**
* check if anim handle already exists
*/
function checkIfAnimExists(handle) {
if (typeof initLayerAnims === 'object' && !jQuery.isEmptyObject(initLayerAnims)) {
for (var key in initLayerAnims) {
if (initLayerAnims[key]['handle'] == handle) return initLayerAnims[key]['id'];
}
}
return false;
}
/**
* update animation in database
*/
function deleteAnimInDb(handle) {
UniteAdminRev.setErrorMessageID("dialog_error_message");
handle = jQuery.trim(handle);
if (handle != '') {
var animSelect = (currentAnimationType == 'customin') ? jQuery('#layer_animation option') : jQuery('#layer_endanimation option');
UniteAdminRev.ajaxRequest("delete_custom_anim", handle, function (response) {
jQuery("#dialog_success_message").show().html(response.message);
//update html select (got from response)
t.updateInitLayerAnim(response.customfull);
updateLayerAnimsInput(response.customin, 'customin');
updateLayerAnimsInput(response.customout, 'customout');
});
}
}
/**
* update animation in database
*/
function updateAnimInDb(handle, animObj, id) {
UniteAdminRev.setErrorMessageID("dialog_error_message");
animObj['handle'] = handle;
if (id === false) { //create new
//insert in database
UniteAdminRev.ajaxRequest("insert_custom_anim", animObj, function (response) {
jQuery("#dialog_success_message").show().html(response.message);
//update html select (got from response)
t.updateInitLayerAnim(response.customfull);
updateLayerAnimsInput(response.customin, 'customin');
updateLayerAnimsInput(response.customout, 'customout');
selectLayerAnim(handle);
});
} else { //update existing
//update to database
UniteAdminRev.ajaxRequest("update_custom_anim", animObj, function (response) {
jQuery("#dialog_success_message").show().html(response.message);
//update html select (got from response)
t.updateInitLayerAnim(response.customfull);
updateLayerAnimsInput(response.customin, 'customin');
updateLayerAnimsInput(response.customout, 'customout');
selectLayerAnim(handle);
});
}
}
/**
* update the layer animation inputs
*/
function selectLayerAnim(handle) {
var animSelect = (currentAnimationType == 'customin') ? jQuery('#layer_animation option') : jQuery('#layer_endanimation option');
animSelect.each(function () {
if (jQuery(this).text() == handle)
jQuery(this).prop('selected', true);
else
jQuery(this).prop('selected', false);
});
}
/**
* update the layer animation inputs
*/
function updateLayerAnimsInput(customAnim, type) {
if (type == 'customin') {
var animSelect = jQuery('#layer_animation');
var animOption = jQuery('#layer_animation option');
var current = jQuery('#layer_animation option:selected').val();
} else {
var animSelect = jQuery('#layer_endanimation');
var animOption = jQuery('#layer_endanimation option');
var current = jQuery('#layer_endanimation option:selected').val();
}
animOption.each(function () {
if (jQuery(this).val().indexOf(type) > -1) {
jQuery(this).remove();
}
});
if (typeof customAnim === 'object' && !jQuery.isEmptyObject(customAnim)) {
for (key in customAnim) {
animSelect.append(new Option(customAnim[key], key));
}
}
animSelect.val(current);
}
/**
* show / hide offset row accorging the slide link value
*/
function showHideOffsetRow() {
var value = jQuery("#layer_slide_link").val();
var offsetRow = jQuery("#layer_scrolloffset_row");
if (value == "scroll_under")
offsetRow.show();
else
offsetRow.hide();
}
/**
* do various form validations
*/
function doCurrentLayerValidations() {
if (selectedLayerSerial == -1)
return (false);
validateCurrentLayerTimes();
}
/**
* validate times (start and end times) of the current layer
*/
function validateCurrentLayerTimes() {
var currentLayer = getCurrentLayer();
if (!currentLayer)
return (false);
var startTime = currentLayer.time;
var endTime = jQuery("#layer_endtime").val();
endTime = jQuery.trim(endTime);
if (!endTime || endTime == "") {
unmarkFieldError("#layer_endtime");
return (false);
}
startTime = Number(startTime);
endTime = Number(endTime);
if (startTime >= endTime)
markFieldError("#layer_endtime", "Must be greater then start time (" + startTime + ")");
else
unmarkFieldError("#layer_endtime");
}
/**
* mark some field as error field and give it a error title
*/
function markFieldError(field_selector, errorTitle) {
jQuery(field_selector).addClass("field_error");
if (errorTitle)
jQuery(field_selector).prop("title", errorTitle);
}
/**
* unmark field error class and title
*/
function unmarkFieldError(field_selector) {
jQuery(field_selector).removeClass("field_error");
jQuery(field_selector).prop("title", "");
}
/**
* get the first style from the styles list (from autocomplete)
*/
function getFirstStyle() {
var arrClasses = jQuery("#layer_caption").autocomplete("option", "source");
var firstStyle = "";
if (arrClasses == null || arrClasses.length == 0)
return ("");
var firstStyle = arrClasses[0];
return (firstStyle);
}
/**
* clear layer html fields, and disable buttons
*/
function disableFormFields() {
//clear html form
jQuery("#form_layers")[0].reset();
jQuery("#form_layers input, #form_layers select, #form_layers textarea").attr("disabled", "disabled").addClass("setting-disabled");
jQuery("#button_delete_layer").addClass("button-disabled");
jQuery("#button_duplicate_layer").addClass("button-disabled");
jQuery("#form_layers label, #form_layers .setting_text, #form_layers .setting_unit").addClass("text-disabled");
jQuery("#layer_captions_down").removeClass("ui-state-active").addClass("ui-state-default");
jQuery("#font_family_down").removeClass("ui-state-active").addClass("ui-state-default");
jQuery("#linkInsertButton").addClass("disabled");
jQuery("#linkInsertTemplate").addClass("disabled");
jQuery("#align_table").addClass("table_disabled");
if (!jQuery('#preview_looper').hasClass("deactivated")) jQuery('#preview_looper').click();
layerGeneralParamsStatus = false;
}
/**
* enable buttons and form fields.
*/
function enableFormFields() {
jQuery("#form_layers input, #form_layers select, #form_layers textarea").removeAttr("disabled").removeClass("setting-disabled");
jQuery("#button_delete_layer").removeClass("button-disabled");
jQuery("#button_duplicate_layer").removeClass("button-disabled");
jQuery("#form_layers label, #form_layers .setting_text, #form_layers .setting_unit").removeClass("text-disabled");
jQuery("#layer_captions_down").removeClass("ui-state-default").addClass("ui-state-active");
jQuery("#font_family_down").removeClass("ui-state-default").addClass("ui-state-active");
jQuery("#linkInsertButton").removeClass("disabled");
jQuery("#linkInsertTemplate").removeClass("disabled");
jQuery("#align_table").removeClass("table_disabled");
if (jQuery('#preview_looper').hasClass("deactivated")) jQuery('#preview_looper').click();
layerGeneralParamsStatus = true;
}
/**
* update z-index of the layers by order value
*/
function updateZIndexByOrder() {
for (var key in arrLayers) {
var layer = arrLayers[key];
if (layer.order !== undefined) {
var zindex = layer.order + 100;
jQuery("#slide_layer_" + key).css("z-index", zindex);
}
}
;
}
/**
* get layers array
*/
this.getLayers = function () {
if (selectedLayerSerial != -1) {
t.updateLayerFromFields();
}
//update sizes in images
updateLayersImageSizes();
return (arrLayers);
}
/**
* update image sizes
*/
function updateLayersImageSizes() {
for (serial in arrLayers) {
var layer = arrLayers[serial];
if (layer.type == "image") {
var htmlLayer = getHtmlLayerFromSerial(serial);
var objUpdate = {};
objUpdate.width = htmlLayer.width();
objUpdate.height = htmlLayer.height();
updateLayer(serial, objUpdate);
}
}
}
/*! LAYER EVENTS */
/**
* refresh layer events
*/
function refreshEvents(serial) {
var layer = getHtmlLayerFromSerial(serial);
var grid_size = jQuery('#rs-grid-sizes option:selected').val();
//update layer events.
layer.draggable({
drag: onLayerDrag, //set ondrag event
grid: [grid_size, grid_size], //set the grid to 1 pixel
/* stop: function() {
updateHtmlLayersFromObject(getSerialFromID(jQuery(this).attr("id")),true);
}*/
});
layer.click(function (event) {
if (!isLayerLocked(serial)) {
setLayerSelected(serial);
event.stopPropagation();
setInAnimOfPreview();
}
});
}
/**
* Resize slider window
*/
function sceneSize(){
var sortboxWrapper = jQuery(".layer_sortbox");
//var height = sortboxWrapper.height();
var layerHeight = jQuery(document).height() - jQuery('#sortlist').outerHeight() - 173;
jQuery('#divLayers-wrapper').css({"height": layerHeight + "px"});
}
/**
* Hide/show remove thumb button
*/
function removebtnShow(){
if (jQuery('#slide_thumb_button_preview').html() === ""){
jQuery("#slide_thumb_button_remove").hide();
jQuery("#slide_thumb_button").css('opacity','1');
} else {
jQuery("#slide_thumb_button_remove").show();
jQuery("#slide_thumb_button").css('opacity','0');
}
}
/**
* Hide/show remove thumb button
*/
function hideAccordion(){
var handles = "#slide_params_holder, #slide_main_img_bg, #slide_main_advanced, #slide_main_link, #slide_main_transition";
if (jQuery('.edit_layers_left').css('display') === 'none'){
jQuery(handles).show();
} else if (jQuery('.edit_layers_left').css('display') === 'block'){
jQuery(handles).hide();
}
}
/**
* get layer serial from id
*/
function getSerialFromID(layerID) {
var layerSerial = layerID.replace("slide_layer_", "");
return (layerSerial);
}
/**
* get serial from sortID
*/
function getSerialFromSortID(sortID) {
var layerSerial = sortID.replace("layer_sort_", "");
return (layerSerial);
}
/**
* get html layer from serial
*/
function getHtmlLayerFromSerial(serial, isDemo) {
if (!isDemo)
isDemo = false;
if (!isDemo)
var htmlLayer = jQuery("#slide_layer_" + serial);
else
var htmlLayer = jQuery("#demo_layer_" + serial);
if (htmlLayer.length == 0)
UniteAdminRev.showErrorMessage("Html Layer with serial: " + serial + " not found!");
return (htmlLayer);
}
/**
* get sort field element from serial
*/
function getHtmlSortItemFromSerial(serial) {
var htmlSortItem = jQuery("#layer_sort_" + serial);
if (htmlSortItem.length == 0) {
UniteAdminRev.showErrorMessage("Html sort field with serial: " + serial + " not found!");
return (false);
}
return (htmlSortItem);
}
/**
* get layer object by id
*/
function getLayer(serial) {
var layer = arrLayers[serial];
if (!layer)
UniteAdminRev.showErrorMessage("getLayer error, Layer with serial:" + serial + "not found");
//modify some data
layer.speed = Number(layer.speed);
layer.endspeed = Number(layer.endspeed);
return layer;
}
/**
* get current layer object
*/
function getCurrentLayer() {
if (selectedLayerSerial == -1) {
UniteAdminRev.showErrorMessage("Selected layer not set");
return (null);
}
return getLayer(selectedLayerSerial);
}
/**
* set layer object to array
*/
function setLayer(layerID, layer) {
if (!arrLayers[layerID]) {
UniteAdminRev.showErrorMessage("setLayer error, Layer with ID:" + layerID + "not found");
return (false);
}
arrLayers[layerID] = jQuery.extend({}, layer);
}
/*! MAKE HTML LAYER */
/**
* make layer html, with params from the object
*/
function makeLayerHtml(serial, objLayer, isDemo) {
if (!isDemo)
isDemo = false;
var type = "text";
if (objLayer.type)
type = objLayer.type;
var zIndex = Number(objLayer.order) + 1;
var style = "z-index:" + zIndex + ";position:absolute;";
var stylerot = "";
switch (type) {
case 'text':
case 'image':
if (parseFloat(objLayer['2d_rotation']) !== 0) {
stylerot += ' -moz-transform: rotate(' + objLayer['2d_rotation'] + 'deg); -ms-transform: rotate(' + objLayer['2d_rotation'] + 'deg); -o-transform: rotate(' + objLayer['2d_rotation'] + 'deg); -webkit-transform: rotate(' + objLayer['2d_rotation'] + 'deg); transform: rotate(' + objLayer['2d_rotation'] + 'deg);';
stylerot += ' -moz-transform-origin: ' + parseFloat(objLayer['2d_origin_x']) + '% ' + parseFloat(objLayer['2d_origin_x']) + '%; -ms-transform-origin: ' + parseFloat(objLayer['2d_origin_x']) + '% ' + parseFloat(objLayer['2d_origin_x']) + '%; -o-transform-origin: ' + parseFloat(objLayer['2d_origin_x']) + '% ' + parseFloat(objLayer['2d_origin_x']) + '%; -webkit-transform-origin: ' + parseFloat(objLayer['2d_origin_x']) + '% ' + parseFloat(objLayer['2d_origin_x']) + '%; transform-origin: ' + parseFloat(objLayer['2d_origin_x']) + '% ' + parseFloat(objLayer['2d_origin_x']) + '%;';
}
break;
}
if (objLayer.max_width !== 'auto')
style += ' width: ' + objLayer.max_width + ';';
if (objLayer.max_height !== 'auto')
style += ' height: ' + objLayer.max_height + ';';
//if(objLayer.whitespace !== 'normal')
style += ' white-space: ' + objLayer.whitespace + ';';
var static_class = '';
if (typeof objLayer.special_type !== 'undefined' && objLayer.special_type == 'static') static_class = ' static_layer';
if (type == "image") style += "line-height:0;";
if (!isDemo)
var html = '<div id="slide_layer_' + serial + '" style="' + style + '" class="slide_layer"><div style="' + stylerot + '" class="innerslide_layer tp-caption ' + objLayer.style + static_class + '" >';
else
var html = '<div id="demo_layer_' + serial + '" style="' + style + ' display: none;" class="demo_layer demo_layer_' + curDemoSlideID + ' slide_layer tp-caption ' + objLayer.style + static_class + '" >';
//add layer specific html
switch (type) {
case "image":
var addStyle = '';
if (objLayer.scaleX != "") addStyle += "width: " + objLayer.scaleX + "px; ";
if (objLayer.scaleY != "") addStyle += "height: " + objLayer.scaleY + "px;";
html += '<img src="' + objLayer.image_url + '" alt="' + objLayer.alt + '" style="' + addStyle + '"></img>';
break;
default:
case "text":
html += objLayer.text;
break;
case "video":
var styleVideo = "width:" + objLayer.video_width + "px;height:" + objLayer.video_height + "px;";
if (typeof (objLayer.video_data) !== "undefined") {
var useImage = (jQuery.trim(objLayer.video_data.previewimage) != '') ? objLayer.video_data.previewimage : objLayer.video_image_url;
} else {
var useImage = objLayer.video_image_url;
}
switch (objLayer.video_type) {
case "youtube":
case "vimeo":
styleVideo += ";background-image:url(" + useImage + ");";
break;
case "html5":
if (useImage !== undefined && useImage != "")
styleVideo += ";background-image:url(" + useImage + ");";
break;
}
html += "<div class='slide_layer_video' style='" + styleVideo + "'><div class='video-layer-inner video-icon-" + objLayer.video_type + "'>"
html += "<div class='layer-video-title'>" + objLayer.video_title + "</div>";
html += "</div></div>";
break;
}
html += "</div>";
//add cross icon:
html += "<div class='icon_cross'></div>";
html += '</div>';
return (html);
}
/**
* update layer by data object
*/
function updateLayer(serial, objData) {
var layer = getLayer(serial);
if (!layer) {
return (false);
}
for (key in objData) {
layer[key] = objData[key];
}
setLayer(serial, layer);
}
/**
* update current layer
*/
function updateCurrentLayer(objData) {
if (!arrLayers[selectedLayerSerial]) {
UniteAdminRev.showErrorMessage("error! the layer with serial: " + selectedLayerSerial + " don't exists");
return (false);
}
updateLayer(selectedLayerSerial, objData);
}
/**
* add image layer
*/
function addLayerImage(urlImage, special_type) {
objLayer = {
style: "",
text: "Image " + (id_counter + 1),
type: "image",
image_url: urlImage
};
if (typeof special_type !== 'undefined')
objLayer['special_type'] = special_type;
addLayer(objLayer);
}
/**
* get video layer object from video data
*/
function getVideoObjLayer(videoData) {
var objLayer = {
type: "video",
style: "",
video_type: videoData.video_type,
video_width: videoData.width,
video_height: videoData.height,
video_data: videoData
};
if (objLayer.video_type == "youtube" || objLayer.video_type == "vimeo") {
objLayer.video_id = videoData.id;
objLayer.video_title = videoData.title;
objLayer.video_image_url = videoData.thumb_medium.url;
objLayer.video_args = videoData.args;
}
//set sortbox text
switch (objLayer.video_type) {
case "youtube":
objLayer.text = "Youtube: " + videoData.title;
break;
case "vimeo":
objLayer.text = "Vimeo: " + videoData.title;
break;
case "html5":
objLayer.text = "Html5 Video";
objLayer.video_title = objLayer.text;
objLayer.video_image_url = "";
if (videoData.urlPoster != "")
objLayer.video_image_url = videoData.urlPoster;
break;
}
return (objLayer);
}
/**
* add video layer
*/
function addLayerVideo(videoData, special_type) {
var objLayer = getVideoObjLayer(videoData);
if (typeof special_type !== 'undefined')
objLayer['special_type'] = special_type;
addLayer(objLayer);
}
/**
* add text layer
*/
function addLayerText(special_type) {
var objLayer = {
text: initText + (id_counter + 1),
type: "text"
};
if (typeof special_type !== 'undefined')
objLayer['special_type'] = special_type;
addLayer(objLayer);
}
/*! ADD LAYER */
/**
* add layer
*/
function addLayer(objLayer, isInit, isDemo) {
if (!isInit)
var isInit = false;
if (!isDemo)
var isDemo = false;
//set init fields (if not set):
if (objLayer.order == undefined)
objLayer.order = (id_counter);
objLayer.order = Number(objLayer.order);
//set init position
if (objLayer.type == "video") {
if (objLayer.left == undefined)
objLayer.left = initLeftVideo;
if (objLayer.top == undefined)
objLayer.top = initTopVideo;
objLayer = checkUpdateFullwidthVideo(objLayer);
} else {
if (objLayer.left == undefined)
objLayer.left = initLeft;
if (objLayer.top == undefined)
objLayer.top = initTop;
}
//set Loop Animations
if (objLayer.loop_animation == undefined)
objLayer.loop_animation = jQuery("#layer_loop_animation option:selected").val();
if (objLayer.loop_easing == undefined)
objLayer.loop_easing = jQuery("#layer_loop_easing").val();
if (objLayer.loop_speed == undefined)
objLayer.loop_speed = jQuery("#layer_loop_speed").val();
if (objLayer.loop_startdeg == undefined)
objLayer.loop_startdeg = jQuery("#layer_loop_startdeg").val();
if (objLayer.loop_enddeg == undefined)
objLayer.loop_enddeg = jQuery("#layer_loop_enddeg").val();
if (objLayer.loop_xorigin == undefined)
objLayer.loop_xorigin = jQuery("#layer_loop_xorigin").val();
if (objLayer.loop_yorigin == undefined)
objLayer.loop_yorigin = jQuery("#layer_loop_yorigin").val();
if (objLayer.loop_xstart == undefined)
objLayer.loop_xstart = jQuery("#layer_loop_xstart").val();
if (objLayer.loop_xend == undefined)
objLayer.loop_xend = jQuery("#layer_loop_xend").val();
if (objLayer.loop_ystart == undefined)
objLayer.loop_ystart = jQuery("#layer_loop_ystart").val();
if (objLayer.loop_yend == undefined)
objLayer.loop_yend = jQuery("#layer_loop_yend").val();
if (objLayer.loop_zoomstart == undefined)
objLayer.loop_zoomstart = jQuery("#layer_loop_zoomstart").val();
if (objLayer.loop_zoomend == undefined)
objLayer.loop_zoomend = jQuery("#layer_loop_zoomend").val();
if (objLayer.loop_angle == undefined)
objLayer.loop_angle = jQuery("#layer_loop_angle").val();
if (objLayer.loop_radius == undefined)
objLayer.loop_radius = jQuery("#layer_loop_radius").val();
//set animation:
if (objLayer.animation == undefined)
objLayer.animation = jQuery("#layer_animation option:selected").val();
//set easing:
if (objLayer.easing == undefined)
objLayer.easing = jQuery("#layer_easing").val();
if (objLayer.split == undefined)
objLayer.split = jQuery("#layer_split").val();
if (objLayer.endsplit == undefined)
objLayer.endsplit = jQuery("#layer_endsplit").val();
if (objLayer.splitdelay == undefined)
objLayer.splitdelay = jQuery("#layer_splitdelay").val();
if (objLayer.endsplitdelay == undefined)
objLayer.endsplitdelay = jQuery("#layer_endsplitdelay").val();
if (objLayer.max_height == undefined && isInit)
objLayer.max_height = jQuery("#layer_max_height").val();
if (objLayer.max_width == undefined && isInit)
objLayer.max_width = jQuery("#layer_max_width").val();
if (objLayer['2d_rotation'] == undefined && isInit)
objLayer['2d_rotation'] = jQuery("#layer_2d_rotation").val();
if (objLayer['2d_origin_x'] == undefined)
objLayer['2d_origin_x'] = jQuery("#layer_2d_origin_x").val();
if (objLayer['2d_origin_y'] == undefined)
objLayer['2d_origin_y'] = jQuery("#layer_2d_origin_x").val();
if (objLayer.parallax_level == undefined)
objLayer.parallax_level = jQuery("#parallax_level").val();
if (objLayer.whitespace == undefined)
objLayer.whitespace = jQuery("#layer_whitespace option:selected").val();
if (objLayer.static_start == undefined)
objLayer.static_start = jQuery("#layer_static_start option:selected").val();
if (objLayer.static_end == undefined)
objLayer.static_end = jQuery("#layer_static_end option:selected").val();
//set speed:
if (objLayer.speed == undefined)
objLayer.speed = initSpeed;
if (objLayer.align_hor == undefined)
objLayer.align_hor = "left";
if (objLayer.align_vert == undefined)
objLayer.align_vert = "top";
//set animation:
if (objLayer.hiddenunder == undefined)
objLayer.hiddenunder = "";
if (objLayer.resizeme == undefined)
objLayer.resizeme = "true";
//set image link
if (objLayer.link == undefined)
objLayer.link = "";
//set image link open in
if (objLayer.link_open_in == undefined)
objLayer.link_open_in = "same";
//set slide link:
if (objLayer.link_slide == undefined)
objLayer.link_slide = "nothing";
//set scroll under offset
if (objLayer.scrollunder_offset == undefined)
objLayer.scrollunder_offset = "";
//set style, if empty, add first style from the list
if (objLayer.style == undefined)
objLayer.style = jQuery("#layer_caption").val();
objLayer.style = jQuery.trim(objLayer.style);
if (isInit == false && objLayer.type == "text" && (!objLayer.style || objLayer.style == "")) {
objLayer.style = getFirstStyle();
}
//add time
if (objLayer.time == undefined)
objLayer.time = getNextTime();
objLayer.time = Number(objLayer.time); //casting
//end time:
if (objLayer.endtime == undefined)
objLayer.endtime = "";
if (objLayer.endspeed == undefined)
objLayer.endspeed = initSpeed;
//set end animation:
if (objLayer.endanimation == undefined)
objLayer.endanimation = jQuery("#layer_endanimation").val();
//set end easing:
if (objLayer.endeasing == undefined)
objLayer.endeasing = jQuery("#layer_endeasing").val();
//set corners
if (objLayer.corner_left == undefined)
objLayer.corner_left = "nothing";
if (objLayer.corner_right == undefined)
objLayer.corner_right = "nothing";
if (objLayer.width == undefined)
objLayer.width = -1;
objLayer.width = Number(objLayer.width);
if (objLayer.height == undefined)
objLayer.height = -1;
objLayer.height = Number(objLayer.height);
//round position
objLayer.top = Math.round(objLayer.top);
objLayer.left = Math.round(objLayer.left);
objLayer.serial = id_counter;
if (!isDemo)
arrLayers[id_counter] = jQuery.extend({}, objLayer);
//add html
var htmlLayer = makeLayerHtml(id_counter, objLayer, isDemo);
container.append(htmlLayer);
var objHtmlLayer = getHtmlLayerFromSerial(id_counter, isDemo);
//update layer position
updateHtmlLayerPosition(isInit, objHtmlLayer, objLayer, objLayer.top, objLayer.left, objLayer.align_hor, objLayer.align_vert);
//update corners
updateHtmlLayerCorners(objHtmlLayer, objLayer);
//update cross position
updateCrossIconPosition(objHtmlLayer, objLayer);
//add layer to sortbox
if (!isDemo)
addToSortbox(id_counter, objLayer);
//refresh draggables
if (!isDemo)
refreshEvents(id_counter);
id_counter++;
//enable "delete all" button, not event, but anyway :)
jQuery("#button_delete_all").removeClass("button-disabled");
//select the layer
if (isInit == false && !isDemo) {
setLayerSelected(objLayer.serial);
jQuery("#layer_text").focus();
}
}
/**
*
* delete layer from layers object
*/
function deleteLayerFromObject(serial) {
var arrLayersNew = {};
var flagFound = false;
for (key in arrLayers) {
if (key != serial)
arrLayersNew[key] = arrLayers[key];
else
flagFound = true;
}
if (flagFound == false)
UniteAdminRev.showErrorMessage("Can't delete layer, serial: " + serial + " not found");
arrLayers = jQuery.extend({}, arrLayersNew);
}
/**
* delete the layer from html.
*/
function deleteLayerFromHtml(serial) {
var htmlLayer = getHtmlLayerFromSerial(serial);
htmlLayer.remove();
}
/**
* delete all representation of some layer
*/
function deleteLayer(serial) {
deleteLayerFromObject(serial);
deleteLayerFromHtml(serial);
deleteLayerFromSortbox(serial);
}
/**
*
* call "deleteLayer" function with selected serial
*/
function deleteCurrentLayer() {
if (selectedLayerSerial == -1)
return (false);
deleteLayer(selectedLayerSerial);
//set unselected
selectedLayerSerial = -1;
//clear form and disable buttons
//disableFormFields();
}
/**
* duplicate layer, set it a little aside of the layer position
*/
function duplicateLayer(serial) {
var obj = arrLayers[serial];
var obj2 = jQuery.extend(true, {}, obj); //duplicate object
obj2.left += 5;
obj2.top += 5;
obj2.order = undefined;
obj2.time = undefined;
addLayer(obj2);
redrawSortbox();
//initDisallowCaptionsOnClick();
}
/**
* call "duplicateLayer" function with selected serial
*/
function duplicateCurrentLayer() {
if (selectedLayerSerial == -1)
return (false);
duplicateLayer(selectedLayerSerial);
}
/**
* delete all layers
*/
function deleteAllLayers() {
arrLayers = {};
container.html("");
emptySortbox();
selectedLayerSerial = -1;
disableFormFields();
jQuery("#button_delete_all").addClass("button-disabled");
//add all layers from init
if (initDemoLayers) {
var len = initDemoLayers.length;
if (len) {
for (var i = 0; i < len; i++) {
for (var key in initDemoLayers[i]) {
curDemoSlideID = i;
addLayer(initDemoLayers[i][key], true, true);
}
}
} else {
for (var i in initDemoLayers) {
for (var key in initDemoLayers[i]) {
curDemoSlideID = i;
addLayer(initDemoLayers[i][key], true, true);
}
}
}
jQuery('select[name="rev_show_the_slides"] option[value="none"]').attr("selected", "selected");
jQuery("#divbgholder").addClass("trans_bg");
jQuery("#divbgholder").css("background-image", "none");
jQuery("#divbgholder").css("background-color", "transparent");
}
}
/**
* update the corners
*/
function updateHtmlLayerCorners(htmlLayer, objLayer) {
htmlLayer = htmlLayer.find('.innerslide_layer');
var ncch = htmlLayer.outerHeight();
var bgcol = htmlLayer.css('backgroundColor');
switch (objLayer.corner_left) {
case "curved":
htmlLayer.append("<div class='frontcorner'></div>");
break;
case "reverced":
htmlLayer.append("<div class='frontcornertop'></div>");
break;
}
switch (objLayer.corner_right) {
case "curved":
htmlLayer.append("<div class='backcorner'></div>");
break;
case "reverced":
htmlLayer.append("<div class='backcornertop'></div>");
break;
}
htmlLayer.find(".frontcorner").css({
'borderWidth': ncch + "px",
'left': (0 - ncch) + 'px',
'borderRight': '0px solid transparent',
'borderTopColor': bgcol
});
htmlLayer.find(".frontcornertop").css({
'borderWidth': ncch + "px",
'left': (0 - ncch) + 'px',
'borderRight': '0px solid transparent',
'borderBottomColor': bgcol
});
htmlLayer.find('.backcorner').css({
'borderWidth': ncch + "px",
'right': (0 - ncch) + 'px',
'borderLeft': '0px solid transparent',
'borderBottomColor': bgcol
});
htmlLayer.find('.backcornertop').css({
'borderWidth': ncch + "px",
'right': (0 - ncch) + 'px',
'borderLeft': '0px solid transparent',
'borderTopColor': bgcol
});
}
/**
* update the position of html cross
*/
function updateCrossIconPosition(objHtmlLayer, objLayer) {
var htmlCross = objHtmlLayer.find(".icon_cross");
var crossWidth = htmlCross.width();
var crossHeight = htmlCross.height();
var totalWidth = objHtmlLayer.outerWidth();
var totalHeight = objHtmlLayer.outerHeight();
var crossHalfW = Math.round(crossWidth / 2);
var crossHalfH = Math.round(crossHeight / 2);
var posx = 0;
var posy = 0;
switch (objLayer.align_hor) {
case "left":
posx = -crossHalfW;
break;
case "center":
posx = (totalWidth - crossWidth) / 2;
break;
case "right":
posx = totalWidth - crossHalfW;
break;
}
switch (objLayer.align_vert) {
case "top":
posy = -crossHalfH;
break;
case "middle":
posy = (totalHeight - crossHeight) / 2;
break;
case "bottom":
posy = totalHeight - crossHalfH;
break;
}
htmlCross.css({"left": posx + "px", "top": posy + "px"});
}
/*! UPDATE HTML LAYER POSITION */
/**
* update html layer position
*/
function updateHtmlLayerPosition(isInit, htmlLayer, objLayer, top, left, align_hor, align_vert) {
//update positions by align
var width = htmlLayer.outerWidth();
var height = htmlLayer.outerHeight();
//get sizes from saved if on get
if (isInit == true && objLayer.type == "image") {
if (objLayer.width != -1)
width = objLayer.width;
if (objLayer.height != -1)
height = objLayer.height;
}
var totalWidth = container.width();
var totalHeight = container.height();
var objCss = {};
//handle horizontal
switch (align_hor) {
default:
case "left":
objCss["right"] = "auto";
objCss["left"] = left + "px";
break;
case "right":
objCss["left"] = "auto";
objCss["right"] = left + "px";
break;
case "center":
var realLeft = (totalWidth - width) / 2;
realLeft = Math.round(realLeft) + left;
objCss["left"] = realLeft + "px";
objCss["right"] = "auto";
break;
}
//handle vertical
switch (align_vert) {
default:
case "top":
objCss["bottom"] = "auto";
objCss["top"] = top + "px";
break;
case "middle":
var realTop = (totalHeight - height) / 2;
realTop = Math.round(realTop) + top;
objCss["top"] = realTop + "px";
objCss["bottom"] = "auto";
break;
case "bottom":
objCss["top"] = "auto";
objCss["bottom"] = top + "px";
break;
}
//objCss["top"] = top+"px";
//objCss["top"] = top+"px";
htmlLayer.css(objCss);
}
/**
* check / update full width video position and size
*/
function checkUpdateFullwidthVideo(objLayer) {
if (objLayer.type != "video")
return (objLayer);
if (typeof (objLayer.video_data) !== "undefined") {
if (objLayer.video_data && objLayer.video_data.fullwidth && objLayer.video_data.fullwidth == true) {
objLayer.top = 0;
objLayer.left = 0;
objLayer.align_hor = "left";
objLayer.align_vert = "top";
objLayer.video_width = container.width();
objLayer.video_height = container.height();
}
}
return (objLayer);
}
/*! UPDATE HTML LAYER */
/**
* update html layers from object
*/
function updateHtmlLayersFromObject(serial, posresets) {
if (!serial)
serial = selectedLayerSerial
var objLayer = getLayer(serial);
if (!objLayer)
return (false);
var htmlLayer = getHtmlLayerFromSerial(serial);
//set class name
var className = "innerslide_layer tp-caption";
if (serial == selectedLayerSerial)
htmlLayer.addClass("layer_selected");
className += " " + objLayer.style;
htmlLayer.find('.innerslide_layer').attr("class", className);
//set html
var type = "text";
if (objLayer.type)
type = objLayer.type;
//update layer by type:
switch (type) {
case "image":
break;
case "video": //update fullwidth position
objLayer = checkUpdateFullwidthVideo(objLayer);
break;
default:
case "text":
htmlLayer.find('.innerslide_layer').rotatable("destroy");
htmlLayer.find('.innerslide_layer').html(objLayer.text);
htmlLayer.find('.innerslide_layer').rotatable({
angle: htmlLayer.find('.innerslide_layer').data('angle'),
start: function (event, ui) {
},
rotate: function (event, ui) {
jQuery('#layer_2d_rotation').val(getRotationDegrees(ui.element));
ui.element.data('angle', ui.angle.current);
},
stop: function (event, ui) {
t.updateLayerFromFields();
}
});
updateHtmlLayerCorners(htmlLayer, objLayer);
break;
}
//set position
// KRISZTIAN REMOVED THE CALL BASED ON DRAG ISSUES
if (posresets)
updateHtmlLayerPosition(false, htmlLayer, objLayer, objLayer.top, objLayer.left, objLayer.align_hor, objLayer.align_vert);
updateCrossIconPosition(htmlLayer, objLayer);
}
/**
THE CHANGE OF POSITION FIELD TRIGGERS THE REPOSITIONINNG OF THE LAYER
**/
function positionChanged() {
jQuery("#layer_top, #layer_left").change(function () {
setTimeout(function () {
updateHtmlLayersFromObject(getSerialFromID(jQuery('.layer_selected').attr('id')), true);
}, 19);
});
}
/**
* update layer from html fields
*/
this.updateLayerFromFields = function () {
if (selectedLayerSerial == -1) {
//UniteAdminRev.showErrorMessage("No layer selected, can't update.");
return (false);
}
var objUpdate = {};
objUpdate.style = jQuery("#layer_caption").val();
objUpdate.text = jQuery("#layer_text").val();
objUpdate.top = Number(jQuery("#layer_top").val());
objUpdate.left = Number(jQuery("#layer_left").val());
objUpdate.whitespace = jQuery("#layer_whitespace option:selected").val();
objUpdate.max_height = jQuery("#layer_max_height").val();
objUpdate.max_width = jQuery("#layer_max_width").val();
objUpdate.parallax_level = jQuery("#parallax_level").val();
objUpdate['2d_rotation'] = jQuery("#layer_2d_rotation").val();
objUpdate['2d_origin_x'] = jQuery("#layer_2d_origin_x").val();
objUpdate['2d_origin_y'] = jQuery("#layer_2d_origin_y").val();
objUpdate['static_start'] = jQuery("#layer_static_start option:selected").val();
objUpdate['static_end'] = jQuery("#layer_static_end option:selected").val();
//set Loop Animations
objUpdate.loop_animation = jQuery("#layer_loop_animation option:selected").val();
objUpdate.loop_easing = jQuery("#layer_loop_easing").val();
objUpdate.loop_speed = jQuery("#layer_loop_speed").val();
objUpdate.loop_startdeg = jQuery("#layer_loop_startdeg").val();
objUpdate.loop_enddeg = jQuery("#layer_loop_enddeg").val();
objUpdate.loop_xorigin = jQuery("#layer_loop_xorigin").val();
objUpdate.loop_yorigin = jQuery("#layer_loop_yorigin").val();
objUpdate.loop_xstart = jQuery("#layer_loop_xstart").val();
objUpdate.loop_xend = jQuery("#layer_loop_xend").val();
objUpdate.loop_ystart = jQuery("#layer_loop_ystart").val();
objUpdate.loop_yend = jQuery("#layer_loop_yend").val();
objUpdate.loop_zoomstart = jQuery("#layer_loop_zoomstart").val();
objUpdate.loop_zoomend = jQuery("#layer_loop_zoomend").val();
objUpdate.loop_angle = jQuery("#layer_loop_angle").val();
objUpdate.loop_radius = jQuery("#layer_loop_radius").val();
objUpdate.animation = jQuery("#layer_animation option:selected").val();
objUpdate.speed = jQuery("#layer_speed").val();
objUpdate.align_hor = jQuery("#layer_align_hor").val();
objUpdate.align_vert = jQuery("#layer_align_vert").val();
objUpdate.hiddenunder = jQuery("#layer_hidden").is(":checked");
objUpdate.resizeme = jQuery("#layer_resizeme").is(":checked");
objUpdate.easing = jQuery("#layer_easing").val();
objUpdate.split = jQuery("#layer_split").val();
objUpdate.endsplit = jQuery("#layer_endsplit").val();
objUpdate.splitdelay = jQuery("#layer_splitdelay").val();
objUpdate.endsplitdelay = jQuery("#layer_endsplitdelay").val();
objUpdate.link_slide = jQuery("#layer_slide_link").val();
objUpdate.scrollunder_offset = jQuery("#layer_scrolloffset").val();
objUpdate.alt = jQuery("#layer_alt").val();
objUpdate.scaleX = jQuery("#layer_scaleX").val();
objUpdate.scaleY = jQuery("#layer_scaleY").val();
objUpdate.scaleProportional = jQuery("#layer_proportional_scale").is(":checked");
objUpdate.attrID = jQuery("#layer_id").val();
objUpdate.attrClasses = jQuery("#layer_classes").val();
objUpdate.attrTitle = jQuery("#layer_title").val();
objUpdate.attrRel = jQuery("#layer_rel").val();
objUpdate.link = jQuery("#layer_image_link").val();
objUpdate.link_open_in = jQuery("#layer_link_open_in").val();
objUpdate.link_id = jQuery("#layer_link_id").val();
objUpdate.link_class = jQuery("#layer_link_class").val();
objUpdate.link_title = jQuery("#layer_link_title").val();
objUpdate.link_rel = jQuery("#layer_link_rel").val();
objUpdate.endtime = jQuery("#layer_endtime").val();
objUpdate.endanimation = jQuery("#layer_endanimation").val();
objUpdate.endspeed = jQuery("#layer_endspeed").val();
objUpdate.endeasing = jQuery("#layer_endeasing").val();
objUpdate.corner_left = jQuery("#layer_cornerleft").val();
objUpdate.corner_right = jQuery("#layer_cornerright").val();
//update object
updateCurrentLayer(objUpdate);
//update html layers
updateHtmlLayersFromObject();
//update html sortbox
updateHtmlSortboxFromObject();
//update the timeline with the new data
updateCurrentLayerTimeline();
UniteCssEditorRev.setCssPreviewLive();
//event on element for href
initDisallowCaptionsOnClick();
var type = "text";
var objLayer = getCurrentLayer();
if (objLayer.type)
type = objLayer.type;
switch (type) {
case 'text':
if (objUpdate.whitespace == "nowrap") {
jQuery("#layer_max_height").val("auto");
jQuery("#layer_max_width").val("auto");
objUpdate.max_width = "none";
objUpdate.max_height = "none;"
}
jQuery('#slide_layer_' + selectedLayerSerial + ' .innerslide_layer').css({'maxWidth': objUpdate.max_width});
jQuery('#slide_layer_' + selectedLayerSerial + ' .innerslide_layer').css({'maxHeight': objUpdate.max_height});
jQuery('#slide_layer_' + selectedLayerSerial + ' .innerslide_layer').css({'whiteSpace': objUpdate.whitespace});
jQuery('#slide_layer_' + selectedLayerSerial).css({'width': "auto"});
jQuery('#slide_layer_' + selectedLayerSerial).css({'height': "auto"});
break;
case 'image':
jQuery('#slide_layer_' + selectedLayerSerial + ' .innerslide_layer').css({'maxWidth': objUpdate.max_width});
jQuery('#slide_layer_' + selectedLayerSerial + ' .innerslide_layer').css({'maxHeight': objUpdate.max_height});
break;
}
switch (type) {
case 'text':
case 'image':
var rotation = parseFloat(objUpdate['2d_rotation']),
trorigin = parseFloat(objUpdate['2d_origin_x']) + '% ' + parseFloat(objUpdate['2d_origin_y']) + '%',
element = jQuery('#slide_layer_' + selectedLayerSerial + ' .innerslide_layer');
angle = rotation;
punchgs.TweenLite.set(jQuery('#slide_layer_' + selectedLayerSerial + ' .innerslide_layer'), {
transformOrigin: trorigin,
overwrite: "auto"
});
element.css('transform', 'rotate(' + angle + 'deg)');
element.css('-moz-transform', 'rotate(' + angle + 'deg)');
element.css('-webkit-transform', 'rotate(' + angle + 'deg)');
element.css('-o-transform', 'rotate(' + angle + 'deg)');
break;
}
//update title line
updateLayerTitleLine(objLayer);
}
/**
* update layer text
*/
function updateLayerTitleLine(objLayer){
jQuery("#left-layer-title-line span").html(objLayer.text);
}
/**
* redraw some layer html
*/
function redrawLayerHtml(serial) {
var objLayer = getLayer(serial);
var html = makeLayerHtml(serial, objLayer)
var htmlInner = jQuery(html).html();
var htmlLayer = getHtmlLayerFromSerial(serial);
htmlLayer.html(htmlInner);
}
/**
* update layer parameters from the object
*/
function updateLayerFormFields(serial) {
var objLayer = arrLayers[serial];
jQuery("#layer_caption").val(objLayer.style);
jQuery("#layer_text").val(UniteAdminRev.stripslashes(objLayer.text));
jQuery("#layer_alt").val(objLayer.alt);
jQuery("#layer_scaleX").val(objLayer.scaleX);
jQuery("#layer_scaleY").val(objLayer.scaleY);
jQuery("#layer_max_height").val(objLayer.max_height);
jQuery("#layer_max_width").val(objLayer.max_width);
jQuery("#layer_2d_rotation").val(objLayer['2d_rotation']);
jQuery("#layer_2d_origin_x").val(objLayer['2d_origin_x']);
jQuery("#layer_2d_origin_y").val(objLayer['2d_origin_y']);
jQuery("#layer_static_start option[value='" + objLayer.static_start + "']").attr('selected', 'selected');
changeEndStaticFunctions();
jQuery("#layer_static_end option[value='" + objLayer.static_end + "']").attr('selected', 'selected');
jQuery("#parallax_level").val(objLayer.parallax_level);
jQuery("#layer_whitespace option[value='" + objLayer.whitespace + "']").attr('selected', 'selected');
if (objLayer.scaleProportional == "true" || objLayer.scaleProportional == true)
jQuery("#layer_proportional_scale").prop("checked", true);
else
jQuery("#layer_proportional_scale").prop("checked", false);
jQuery("#layer_top").val(objLayer.top);
jQuery("#layer_left").val(objLayer.left);
//set Loop Animations
jQuery("#layer_loop_animation option[value='" + objLayer.loop_animation + "']").attr('selected', 'selected');
jQuery("#layer_loop_easing").val(objLayer.loop_easing);
jQuery("#layer_loop_speed").val(objLayer.loop_speed);
jQuery("#layer_loop_startdeg").val(objLayer.loop_startdeg);
jQuery("#layer_loop_enddeg").val(objLayer.loop_enddeg);
jQuery("#layer_loop_xorigin").val(objLayer.loop_xorigin);
jQuery("#layer_loop_yorigin").val(objLayer.loop_yorigin);
jQuery("#layer_loop_xstart").val(objLayer.loop_xstart);
jQuery("#layer_loop_xend").val(objLayer.loop_xend);
jQuery("#layer_loop_ystart").val(objLayer.loop_ystart);
jQuery("#layer_loop_yend").val(objLayer.loop_yend);
jQuery("#layer_loop_zoomstart").val(objLayer.loop_zoomstart);
jQuery("#layer_loop_zoomend").val(objLayer.loop_zoomend);
jQuery("#layer_loop_angle").val(objLayer.loop_angle);
jQuery("#layer_loop_radius").val(objLayer.loop_radius);
jQuery("#layer_animation option[value='" + objLayer.animation + "']").attr('selected', 'selected');
jQuery("#layer_easing").val(objLayer.easing);
jQuery("#layer_split").val(objLayer.split);
jQuery("#layer_endsplit").val(objLayer.endsplit);
jQuery("#layer_splitdelay").val(objLayer.splitdelay);
jQuery("#layer_endsplitdelay").val(objLayer.endsplitdelay);
jQuery("#layer_slide_link").val(objLayer.link_slide);
jQuery("#layer_scrolloffset").val(objLayer.scrollunder_offset);
jQuery("#layer_speed").val(objLayer.speed);
jQuery("#layer_align_hor").val(objLayer.align_hor);
jQuery("#layer_align_vert").val(objLayer.align_vert);
if (objLayer.hiddenunder == "true" || objLayer.hiddenunder == true)
jQuery("#layer_hidden").prop("checked", true);
else
jQuery("#layer_hidden").prop("checked", false);
if (objLayer.resizeme == "true" || objLayer.resizeme == true)
jQuery("#layer_resizeme").prop("checked", true);
else
jQuery("#layer_resizeme").prop("checked", false);
jQuery("#layer_image_link").val(objLayer.link);
jQuery("#layer_link_open_in").val(objLayer.link_open_in);
jQuery("#layer_link_id").val(objLayer.link_id);
jQuery("#layer_link_class").val(objLayer.link_class);
jQuery("#layer_link_title").val(objLayer.link_title);
jQuery("#layer_link_rel").val(objLayer.link_rel);
jQuery("#layer_endtime").val(objLayer.endtime);
jQuery("#layer_endanimation").val(objLayer.endanimation);
jQuery("#layer_endeasing").val(objLayer.endeasing);
jQuery("#layer_endspeed").val(objLayer.endspeed);
//set advanced params
jQuery("#layer_cornerleft").val(objLayer.corner_left);
jQuery("#layer_cornerright").val(objLayer.corner_right);
//set align table
var alignClass = "#linkalign_" + objLayer.align_hor + "_" + objLayer.align_vert;
jQuery("#align_table a").removeClass("selected");
jQuery(alignClass).addClass("selected");
jQuery("#layer_id").val(objLayer.attrID);
jQuery("#layer_classes").val(objLayer.attrClasses);
jQuery("#layer_title").val(objLayer.attrTitle);
jQuery("#layer_rel").val(objLayer.attrRel);
//show / hide go under slider offset row
showHideOffsetRow();
showHideLoopFunctions(); //has to be the last thing done to not interrupt settings
updateLayerTitleLine(objLayer);
}
/**
* unselect all html layers
*/
function unselectHtmlLayers() {
jQuery(containerID + " .slide_layer.layer_selected").each(function () {
try {
jQuery(this).resizable("destroy");
jQuery(this).find('.innerslide_layer').rotatable("destroy");
} catch (e) {
}
});
jQuery(containerID + " .slide_layer").removeClass("layer_selected");
jQuery('.edit_layers_left').addClass("hidden").removeClass("visible");
}
/**
* set all layers unselected
*/
function unselectLayers() {
unselectHtmlLayers();
unselectSortboxItems();
selectedLayerSerial = -1;
disableFormFields();
//reset elements
jQuery("#layer_alt_row").hide();
jQuery("#layer_scale_title_row").hide();
jQuery("#layer_max_width_row").hide();
jQuery("#layer_max_height_row").hide();
jQuery("#layer_whitespace_row").hide();
jQuery("#layer_scaleX_row").hide();
jQuery("#layer_scaleY_row").hide();
jQuery("#layer_proportional_scale_row").hide();
jQuery("#button_edit_video_row").hide();
jQuery("#button_change_image_source_row").hide();
jQuery("#layer_text").css("height", "80px");
jQuery("#layer_image_link_row").hide();
jQuery("#layer_link_id_row").hide();
jQuery("#layer_link_class_row").hide();
jQuery("#layer_link_title_row").hide();
jQuery("#layer_link_rel_row").hide();
jQuery("#layer_link_open_in_row").hide();
}
/*! SET LAYER SELECTED */
/**
* set layer selected representation
*/
function setLayerSelected(serial) {
if (selectedLayerSerial == serial)
return (false);
objLayer = getLayer(serial);
var layer = getHtmlLayerFromSerial(serial);
//unselect all other layers
unselectHtmlLayers();
//set selected class
layer.addClass("layer_selected");
jQuery('.edit_layers_left').addClass("visible").removeClass("hidden");
hideAccordion();
setSortboxItemSelected(serial);
//update selected serial var
selectedLayerSerial = serial;
//update bottom fields
updateLayerFormFields(serial);
//enable form fields
enableFormFields();
jQuery('#sortlist').scrollTop(jQuery('#sortlist').scrollTop()+jQuery('.ui-state-hover').position().top);
//do specific operations depends on type
switch (objLayer.type) {
case "video": //show edit video button
jQuery("#linkInsertButton").addClass("disabled");
jQuery("#linkInsertTemplate").addClass("disabled");
jQuery("#button_edit_video_row").show();
jQuery("#layer_text").css("height", "25px");
jQuery("#layer_2d_rotation_row").hide();
jQuery("#layer_2d_origin_x_row").hide();
jQuery("#layer_2d_origin_y_row").hide();
jQuery("#layer_2d_title_row").hide();
break;
case "image":
//disable the insert button
jQuery("#linkInsertButton").addClass("disabled");
jQuery("#linkInsertTemplate").addClass("disabled");
//show / hide some elements
jQuery("#layer_alt_row").show();
jQuery("#layer_scale_title_row").show();
jQuery("#layer_scaleX_row").show();
jQuery("#layer_scaleY_row").show();
//initScaleImage();
jQuery("#layer_proportional_scale_row").show();
jQuery("#button_change_image_source_row").show();
jQuery("#layer_text").css("height", "25px");
jQuery("#layer_image_link_row").show();
jQuery("#layer_link_open_in_row").show();
jQuery("#layer_link_id_row").show();
jQuery("#layer_link_class_row").show();
jQuery("#layer_link_title_row").show();
jQuery("#layer_link_rel_row").show();
jQuery("#layer_2d_rotation_row").show();
jQuery("#layer_2d_origin_x_row").show();
jQuery("#layer_2d_origin_y_row").show();
if (jQuery("#layer_proportional_scale").is(":checked"))
var aspectratio = true;
else
var aspectratio = false;
layer.resizable({
aspectRatio: aspectratio,
handles: "all",
start: function (event, ui) {
ui.element.css({width: ui.originalSize.width, height: ui.originalSize.height});
ui.element.find('img').css({width: "100%", height: "100%"});
ui.element.find('.innerslide_layer').css({width: "100%", height: "100%"});
},
resize: function (event, ui) {
jQuery('#layer_scaleX').val(ui.size.width);
jQuery('#layer_scaleY').val(ui.size.height);
},
stop: function (event, ui) {
t.updateLayerFromFields();
}
});
layer.find('.innerslide_layer').rotatable({
angle: layer.find('.innerslide_layer').data('angle'),
start: function (event, ui) {
},
rotate: function (event, ui) {
jQuery('#layer_2d_rotation').val(getRotationDegrees(ui.element));
ui.element.data('angle', ui.angle.current);
},
stop: function (event, ui) {
t.updateLayerFromFields();
}
});
break;
default: //set layer text to default height
jQuery("#layer_text").css("height", "80px");
jQuery("#layer_max_width_row").show();
jQuery("#layer_max_height_row").show();
jQuery("#layer_whitespace_row").show();
jQuery("#layer_2d_rotation_row").show();
jQuery("#layer_2d_origin_x_row").show();
jQuery("#layer_2d_origin_y_row").show();
layer.resizable({
handles: "all",
resize: function (event, ui) {
var il = ui.element.find('.innerslide_layer');
il.css({"maxWidth": ui.size.width, "maxHeight": ui.size.height});
jQuery('#layer_max_width').val(ui.size.width + "px");
jQuery('#layer_max_height').val(ui.size.height + "px");
},
stop: function (event, ui) {
var il = ui.element.find('.innerslide_layer');
layer.css({width: il.outerWidth(), height: il.outerHeight()});
il.css({"maxWidth": "auto", "maxHeight": "auto"});
setTimeout(function () {
il.css({"maxWidth": il.outerWidth(), "maxHeight": il.outerHeight()});
jQuery('#layer_max_width').val(il.width() + "px");
jQuery('#layer_max_height').val(il.height() + "px");
layer.css({width: il.outerWidth(), height: il.outerHeight()});
t.updateLayerFromFields();
}, 50)
}
});
layer.find('.innerslide_layer').rotatable({
angle: layer.find('.innerslide_layer').data('angle'),
start: function (event, ui) {
},
rotate: function (event, ui) {
jQuery('#layer_2d_rotation').val(getRotationDegrees(ui.element));
ui.element.data('angle', ui.angle.current);
},
stop: function (event, ui) {
t.updateLayerFromFields();
}
});
break;
}
//hide edit video button
if (objLayer.type != "video") {
jQuery("#button_edit_video_row").hide();
}
//hide image layer related fields
if (objLayer.type != "image") {
jQuery("#layer_alt_row").hide();
jQuery("#layer_scale_title_row").hide();
jQuery("#layer_scaleX_row").hide();
jQuery("#layer_scaleY_row").hide();
jQuery("#layer_proportional_scale_row").hide();
jQuery("#layer_image_link_row").hide();
jQuery("#layer_link_open_in_row").hide();
jQuery("#button_change_image_source_row").hide();
}
//show/hide text related layers
if (objLayer.type == "text") {
jQuery("#layer_cornerleft_row").show();
jQuery("#layer_cornerright_row").show();
jQuery("#layer_resizeme_row").show();
jQuery("#layer_max_width_row").show();
jQuery("#layer_max_height_row").show();
jQuery("#layer_whitespace_row").show();
} else {
jQuery("#layer_cornerleft_row").hide();
jQuery("#layer_cornerright_row").hide();
jQuery("#layer_resizeme_row").hide();
jQuery("#layer_max_width_row").hide();
jQuery("#layer_max_height_row").hide();
jQuery("#layer_whitespace_row").hide();
}
//hide autocomplete
jQuery("#layer_caption").autocomplete("close");
//make layer form validations
doCurrentLayerValidations();
//update timeline of the layer
updateCurrentLayerTimeline();
//set focus to text editor
//jQuery("#layer_text").focus();
}
/**
* get rotation degrees
*/
function getRotationDegrees(obj) {
var matrix = obj.css("-webkit-transform") ||
obj.css("-moz-transform") ||
obj.css("-ms-transform") ||
obj.css("-o-transform") ||
obj.css("transform");
if (matrix !== 'none') {
var values = matrix.split('(')[1].split(')')[0].split(',');
var a = values[0];
var b = values[1];
var angle = Math.round(Math.atan2(b, a) * (180 / Math.PI));
} else {
var angle = 0;
}
return (angle < 0) ? angle += 360 : angle;
}
/**
*
* return if the layer is selected or not
*/
function isLayerSelected(serial) {
return (serial == selectedLayerSerial);
}
/**
* hide in html and sortbox
*/
function hideLayer(serial, skipGlobalButton) {
var htmlLayer = jQuery("#slide_layer_" + serial);
htmlLayer.hide();
setSortboxItemHidden(serial);
if (skipGlobalButton != true) {
if (isAllLayersHidden())
jQuery("#button_sort_visibility").addClass("e-disabled");
}
}
/**
* show layer in html and sortbox
*/
function showLayer(serial, skipGlobalButton) {
var htmlLayer = jQuery("#slide_layer_" + serial);
htmlLayer.show();
setSortboxItemVisible(serial);
if (skipGlobalButton != true)
jQuery("#button_sort_visibility").removeClass("e-disabled");
}
/**
* show all layers
*/
function showAllLayers() {
for (serial in arrLayers)
showLayer(serial, true);
}
/**
* hide all layers
*/
function hideAllLayers() {
for (serial in arrLayers)
hideLayer(serial, true);
}
/**
* hide in html and sortbox
*/
function lockAllLayers(serial) {
for (serial in arrLayers)
lockLayer(serial);
}
/**
* show layer in html and sortbox
*/
function unlockAllLayers(serial) {
for (serial in arrLayers)
unlockLayer(serial);
}
/**
* get true / false if the layer is hidden
*/
function isLayerVisible(serial) {
var htmlLayer = jQuery("#slide_layer_" + serial);
var isVisible = htmlLayer.is(":visible");
return (isVisible);
}
/**
* get true / false if all layers hidden
*/
function isAllLayersHidden() {
for (serial in arrLayers) {
if (isLayerVisible(serial) == true)
return (false);
}
return (true);
}
/**
* get true / false if the layer can be moved
*/
function isLayerLocked(serial) {
var htmlLayer = jQuery("#slide_layer_" + serial);
var isLocked = htmlLayer.attr('aria-disabled');
if (typeof(isLocked) == 'undefined')
return false;
else
return (isLocked == 'false') ? false : true;
}
/**
* hide in html and sortbox
*/
function lockLayer(serial) {
setSortboxItemLocked(serial);
var layer = getHtmlLayerFromSerial(serial);
layer.draggable('disable');
try {
layer.resizable("destroy");
} catch (e) {
}
try {
layer.find('.innerslide_layer').rotatable("destroy");
} catch (e) {
}
layer.removeClass("layer_selected");
jQuery('.edit_layers_left').addClass("hidden").removeClass("visible");
hideAccordion();
// setTimeout(function() {
layer.blur();
layer.addClass("ui-state-disabled");
layer.attr('aria-disabled', true);
// },10)
}
/**
* show layer in html and sortbox
*/
function unlockLayer(serial) {
setSortboxItemUnlocked(serial);
var layer = getHtmlLayerFromSerial(serial);
layer.attr('aria-disabled', false);
layer.draggable('enable');
}
//======================================================
// Sortbox Functions
//======================================================
function _________SORTBOX___________(){}
/**
* init the sortbox
*/
function initSortbox() {
redrawSortbox();
//set the sortlist sortable
jQuery("#sortlist").sortable({
handle: '.sort_content_container .eg-icon-sort',
axis: 'y',
update: function () {
onSortboxSorted();
}
});
//set input time events:
jQuery("#sortlist").delegate(".sortbox_time", "keyup", function (event) {
if (event.keyCode == 13)
onSortboxTimeChange(jQuery(this));
});
jQuery("#sortlist").delegate(".sortbox_time", "blur", function (event) {
onSortboxTimeChange(jQuery(this));
});
//set click event
jQuery("#sortlist").delegate("li", "mousedown", function () {
var serial = getSerialFromSortID(this.id);
setLayerSelected(serial);
});
//on show / hide layer icon click - show / hide layer
jQuery("#sortlist").delegate(".sortbox_eye", "mousedown", function (event) {
var sortboxID = jQuery(this).parent().parent().parent().attr("id");
var serial = getSerialFromSortID(sortboxID);
if (isLayerVisible(serial))
hideLayer(serial);
else
showLayer(serial);
//prevnt the layer from selecting
event.stopPropagation();
});
//on show / hide layer icon click - show / hide layer
jQuery("#sortlist").delegate(".sortbox_lock", "mousedown", function (event) {
var sortboxID = jQuery(this).parent().parent().parent().attr("id");
var serial = getSerialFromSortID(sortboxID);
if (isLayerLocked(serial))
unlockLayer(serial);
else
lockLayer(serial);
//prevent the layer from selecting
event.stopPropagation();
});
//show / hide all layers
jQuery("#button_sort_visibility").click(function () {
var button = jQuery(this);
if (button.hasClass("e-disabled")) { //show all
button.removeClass("e-disabled");
showAllLayers();
} else { //hide all
button.addClass("e-disabled");
hideAllLayers();
}
});
//Lock / Unlock all layers
jQuery("#button_sort_lock").click(function () {
var button = jQuery(this);
if (button.hasClass("e-disabled")) { //show all
button.removeClass("e-disabled");
unlockAllLayers();
} else { //hide all
button.addClass("e-disabled");
lockAllLayers();
}
});
//on show / hide layer icon click - show / hide layer
jQuery("#sortlist").delegate(".till_slideend", "mousedown", function (event) {
var sortboxID = jQuery(this).parent().parent().parent().attr("id");
var serial = getSerialFromSortID(sortboxID);
var objLayer = getLayer(serial);
var button = jQuery(this);
if (button.hasClass("tillendon")) {
button.removeClass("tillendon")
// KRIKI
if (objLayer.realEndTime == g_slideTime) {
objLayer.realEndTime = g_slideTime - 200;
button.closest('li').find('.sortbox_timeend').val(g_slideTime - 200);
updateCurrentLayerTimeline();
}
} else {
button.addClass("tillendon");
objLayer.realEndTime = g_slideTime;
button.closest('li').find('.sortbox_timeend').val(g_slideTime);
updateCurrentLayerTimeline();
}
});
}
/**
* set sortbox items selected
*/
function setSortboxItemSelected(serial) {
var sortItem = getHtmlSortItemFromSerial(serial);
unselectSortboxItems();
sortItem.removeClass("ui-state-default").addClass("ui-state-hover");
}
/**
* set sortbox item hidden mode
*/
function setSortboxItemHidden(serial) {
var sortItem = getHtmlSortItemFromSerial(serial);
sortItem.addClass("sortitem-hidden");
}
/**
* set sortbox item visible mode
*/
function setSortboxItemVisible(serial) {
var sortItem = getHtmlSortItemFromSerial(serial);
sortItem.removeClass("sortitem-hidden");
}
/**
* set sortbox item locked mode
*/
function setSortboxItemLocked(serial) {
var sortItem = getHtmlSortItemFromSerial(serial);
sortItem.addClass("sortitem-locked");
}
/**
* set sortbox item unlocked mode
*/
function setSortboxItemUnlocked(serial) {
var sortItem = getHtmlSortItemFromSerial(serial);
sortItem.removeClass("sortitem-locked");
}
/**
*
* add layer to sortbox
*/
function addToSortbox(serial, objLayer) {
if (objLayer.realEndTime == "undefined" || objLayer.realEndTime == undefined)
objLayer = getLayerExtendedParams(objLayer);
var endslideclass = "";
if (objLayer.endSpeed == 0 || objLayer.endSpeed == undefined || objLayer.realEndTime >= g_slideTime || objLayer.endWithSlide) {
objLayer.endWithSlide = true;
var endslideclass = "tillendon";
}
var isVisible = isLayerVisible(serial);
var classLI = "";
if (isVisible == false)
classLI = " sortitem-hidden";
var sortboxText = getSortboxText(objLayer.text);
var depth = Number(objLayer.order) + 1;
var htmlSortbox = '<li id="layer_sort_' + serial + '" class="ui-state-default' + classLI + '">';
htmlSortbox += '<div class="sort_content_container">';
htmlSortbox += '<span style="display:table-cell"><i class="eg-icon-sort"></i></span>';
htmlSortbox += '<div class="layer_sort_input_depth sortbox-tablecell">';
htmlSortbox += '<input type="text" class="sortbox_depth" readonly title="Edit Depth" value="' + depth + '">';
htmlSortbox += '</div>';
htmlSortbox += '<div class="sortbox-tablecell sort-iconcollection">';
htmlSortbox += '<span class="sortbox_eye" title="Show / Hide Layer" class="tipsy_enabled_top"><i class="eg-icon-eye"></i><i class="eg-icon-eye-off"></i></span>';
htmlSortbox += '<span class="sortbox_lock" title="Lock / Unlock Layer" class="tipsy_enabled_top"><i class="eg-icon-lock-open"></i><i class="eg-icon-lock"></i></span>';
htmlSortbox += '<span class="till_slideend ' + endslideclass + '" title="Snap to Slide End / Custom End" class="tipsy_enabled_top"><i class="eg-icon-back-in-time"></i><i class="eg-icon-minus"></i></span>';
htmlSortbox += '</div>';
htmlSortbox += '<div style="position:relative;" class="sort-hover-part layer_sort_layer_text_field sortbox-tablecell" <span class="sortbox_text"><i style="margin:0px 10px" class="';
switch (objLayer.type) {
case "text":
htmlSortbox += 'fa fa-font';
break;
case "image":
htmlSortbox += 'fa fa-camera';
break;
case "video":
htmlSortbox += 'fa fa-video-camera';
break;
}
htmlSortbox += '"></i><span class="timer-layer-text">' + sortboxText + '</span></span>';
htmlSortbox += '<div class="timeline">';
htmlSortbox += '<div class="tl-fullanim"><div class="tl-startanim"></div><div class="tl-endanim"></div></div>';
htmlSortbox += '</div>';
htmlSortbox += '</div>';
htmlSortbox += '<div class="layer_sort_inputs sortbox-tablecell">';
htmlSortbox += '<input type="text" class="sortbox_time" title="Edit Layer Start" value="' + objLayer.time + '">';
htmlSortbox += '<input type="text" class="sortbox_timeend" title="Edit Layer End" value="' + objLayer.realEndTime + '">';
htmlSortbox += '</div>';
htmlSortbox += '<div class="layer_sort_inputs metabox-tablecell">';
htmlSortbox += '<a href="javascript:void(0)" id="button_duplicate_layer" class="timeline-layer-duplicate"><i class="fa fa-clone" aria-hidden="true"></i></a>';
htmlSortbox += '<a href="javascript:void(0)" id="button_delete_layer" class="timeline-layer-delete"><i class="fa fa-trash-o" aria-hidden="true"></i></a>';
htmlSortbox += '</div>';
htmlSortbox += '</div>';
htmlSortbox += '</li>';
jQuery("#sortlist").append(htmlSortbox);
var cur = jQuery('#layer_sort_' + serial + " .timeline"),
dragfull = cur.find('.tl-fullanim');
setCurTimer(dragfull);
dragfull.draggable({
containment: "parent",
//snap:".tl-fullanim",
axis: "x",
stop: function () {
updateCurTimer("stop", jQuery(this));
},
drag: function () {
updateCurTimer("resize", jQuery(this));
}
})
dragfull.resizable({
containment: "parent",
handles: "w,e",
stop: function () {
updateCurTimer("stop", jQuery(this));
},
resize: function () {
updateCurTimer("resize", jQuery(this));
}
//snap:".tl-fullanim"
});
var iwrapper = jQuery('#layer_sort_' + serial + " .layer_sort_inputs");
iwrapper.find('input').keypress(function (event) {
if (event.keyCode == 13)
changeTimerInputs();
}).blur(changeTimerInputs);
}
/**
check if the Layer should go till Slide End, or should animate our before.
if objLayer.endWithSlide == true -> the Layer should not get any "data-end" output !!
*/
function checkTillSlideEnd(li, objLayer) {
if (objLayer.realEndTime >= g_slideTime) {
objLayer.endWithSlide = true;
li.find('.till_slideend').addClass("tillendon");
} else {
objLayer.endWithSlide = false;
li.find('.till_slideend').removeClass("tillendon");
}
}
/**
on Input Change we need to resize and reposition all available Timer lines
*/
function changeTimerInputs() {
var li = jQuery(this).closest("li"),
sortLayerID = li.attr("id"),
serial = getSerialFromSortID(sortLayerID);
objLayer = getLayer(serial),
iwrapper = jQuery(this).closest('.layer_sort_inputs'),
times = iwrapper.find('.sortbox_time'),
timee = iwrapper.find('.sortbox_timeend');
if (Number(timee.val()) < Number(times.val())) {
timee.val((parseInt(times.val(), 0) + 1000 + objLayer.speed + objLayer.endspeed));
}
objLayer.time = Number(times.val());
objLayer.realEndTime = Number(timee.val());
checkTillSlideEnd(li, objLayer);
setCurTimer(li.find('.tl-fullanim'));
jQuery('#layer_endtime').val((objLayer.realEndTime - objLayer.endSpeedFinal));
}
/**
* update timeline of current layer
*/
function updateCurrentLayerTimeline() {
jQuery('#sortlist').find('.tl-fullanim').each(function () {
setCurTimer(jQuery(this));
});
}
/**
Set the Current Timer Line to Position end start/end time should be set as well
*/
function setCurTimer(timer) {
var li = timer.closest("li"),
sortLayerID = li.attr("id"),
serial = getSerialFromSortID(sortLayerID);
objLayer = getLayer(serial);
var tl = li.find('.timeline'),
tw = tl.width(),
dragfull = li.find('.tl-fullanim'),
dragstart = dragfull.find('.tl-startanim'),
dragend = dragfull.find('.tl-endanim'),
ft = g_slideTime;
if (objLayer.realEndTime == "undefined" || objLayer.realEndTime == undefined)
objLayer = getLayerExtendedParams(objLayer);
dragfull.css({
width: ((objLayer.realEndTime - objLayer.time) / ft) * 100 + "%",
left: ((objLayer.time) / ft) * 100 + "%"
});
dragstart.css({width: (objLayer.speed / ft) * tw + "px"});
dragend.css({width: (objLayer.endspeed / ft) * tw + "px"});
checkTillSlideEnd(li, objLayer);
jQuery('#layer_endtime').val((objLayer.realEndTime - objLayer.endSpeedFinal));
}
/**
* update layer text field
*/
function updateLayerTextField(event, timerobj, txt) {
var li = timerobj.closest("li");
txt = getSortboxText(txt);
li.find('.timer-layer-text').html(txt);
}
/**
Update the Current Timelines
*/
function updateCurTimer(event, timer) {
var li = timer.closest("li"),
sortLayerID = li.attr("id"),
serial = getSerialFromSortID(sortLayerID),
objLayer = getLayer(serial),
l = timer.position().left,
w = timer.width(),
tl = li.find('.timeline'),
tw = tl.width(),
dragstart = tl.find('.tl-startanim'),
dragend = tl.find('.tl-endanim');
objLayer = getLayerExtendedParams(objLayer);
if (l + w > tw) timer.css({left: (tw - w)});
if (l < 0) timer.css({left: "0px"});
if (w > tw) timer.width(tw);
var ft = g_slideTime,
ns = Math.round(((l / tl.width()) * ft) / 50) * 50,
ne = ns + Math.round(((w / tl.width()) * ft) / 50) * 50,
dif = ne - ns;
if (ne > ft) {
ne = ft;
ns = ne - dif;
}
if (ns < 0) ns = 0;
li.find('.sortbox_time').val(ns);
li.find('.sortbox_timeend').val(ne);
if (event == "stop") {
timer.css({
left: (timer.position().left / tw) * 100 + "%",
width: (timer.width() / tw) * 100 + "%"
})
}
dragstart.css({width: (objLayer.speed / ft) * tw + "px"});
dragend.css({width: (objLayer.endspeed / ft) * tw + "px"});
objLayer.endTimeFinal = ne - objLayer.endSpeedFinal;
objLayer.endtime = ne - objLayer.endSpeedFinal;
objLayer.realEndTime = ne;
objLayer.time = ns;
objLayer.timeLast = objLayer.endTimeFinal;
jQuery('#layer_endtime').val((objLayer.realEndTime - objLayer.endSpeedFinal));
checkTillSlideEnd(li, objLayer);
}
/**
Show / HIde The Timelines
*/
function showHideTimeines() {
/* HIDE / SHOW TIMELINES */
jQuery('#button_sort_timing').click(function () {
var bst = jQuery(this);
if (bst.hasClass("off")) {
bst.removeClass("off");
bst.find('.onoff').html('- on');
punchgs.TweenLite.to(jQuery('#sortlist .timeline'), 0.5, {autoAlpha: 0.5, overwrite: "auto"});
} else {
punchgs.TweenLite.to(jQuery('#sortlist .timeline'), 0.5, {autoAlpha: 0, overwrite: "auto"});
bst.addClass("off");
bst.find('.onoff').html('- off');
}
})
}
/**
*
* delete layer from sortbox
*/
function deleteLayerFromSortbox(serial) {
var sortboxLayer = getHtmlSortItemFromSerial(serial);
sortboxLayer.remove();
}
/**
*
* unselect all items in sortbox
*/
function unselectSortboxItems() {
jQuery("#sortlist li").removeClass("ui-state-hover").addClass("ui-state-default");
}
/**
* update layers order from sortbox elements
*/
function updateOrderFromSortbox() {
var arrSortLayers = jQuery("#sortlist").sortable("toArray");
for (var i = 0; i < arrSortLayers.length; i++) {
var sortID = arrSortLayers[i];
var serial = getSerialFromSortID(sortID);
var objUpdate = {order: i};
updateLayer(serial, objUpdate);
//update sortbox order input
var depth = i + 1;
jQuery("#" + sortID + " input.sortbox_depth").val(depth);
}
//update z-index of the html window by order
updateZIndexByOrder();
}
/**
* shift order among all the layers, push down all order num beyong the given
* need to redraw after this function
*/
function shiftOrder(orderToFree) {
for (key in arrLayers) {
var obj = arrLayers[key];
if (obj.order >= orderToFree) {
obj.order = Number(obj.order) + 1;
arrLayers[key] = obj;
}
}
}
/**
* get sortbox text from layer html
*/
function getSortboxText(text) {
sorboxTextSize = 20;
var textSortbox = UniteAdminRev.stripTags(text);
//if no content - escape html
if (textSortbox.length < 2)
textSortbox = UniteAdminRev.htmlspecialchars(text);
//short text
if (textSortbox.length > sorboxTextSize)
textSortbox = textSortbox.slice(0, sorboxTextSize) + "...";
return (textSortbox);
}
/**
*
* redraw the sortbox
*/
function redrawSortbox(mode) {
if (mode == undefined)
mode = sortMode;
emptySortbox();
var layers_array = getLayersSorted("depth");
if (layers_array.length == 0)
return (false);
for (var i = 0; i < layers_array.length; i++) {
var objLayer = layers_array[i];
addToSortbox(objLayer.serial, objLayer);
}
if (selectedLayerSerial != -1)
setSortboxItemSelected(selectedLayerSerial);
}
/**
* remove all from sortbox
*/
function emptySortbox() {
jQuery("#sortlist").html("");
}
/**
*
* update sortbox text from object
*/
function updateHtmlSortboxFromObject(serial) {
if (!serial)
serial = selectedLayerSerial;
var objLayer = getLayer(serial);
if (!objLayer)
return (false);
var htmlSortItem = getHtmlSortItemFromSerial(serial);
if (!htmlSortItem)
return (false);
var sortboxText = getSortboxText(objLayer.text);
htmlSortItem.children(".sortbox_text").text(sortboxText);
}
/**
* on sortbox sorted event.
*/
function onSortboxSorted() {
updateOrderFromSortbox();
}
//======================================================
// Sortbox Functions End
//======================================================
//======================================================
// Time Functions
//======================================================
function _________TIME___________(){}
/**
* get next available time
*/
function getNextTime() {
var maxTime = 0;
//get max time
for (key in arrLayers) {
var layer = arrLayers[key];
layerTime = (layer.time) ? Number(layer.time) : 0;
if (layerTime > maxTime)
maxTime = layerTime;
}
var outputTime;
if (maxTime == 0)
outputTime = g_startTime;
else
outputTime = Number(maxTime) + Number(g_stepTime);
return (outputTime);
}
/**
* change time on the layer from the sortbox and reorder
*/
function onSortboxTimeChange(inputBox) {
//update the time by inputbox:
var timeValue = inputBox.val();
timeValue = Number(timeValue);
var sortLayerID = inputBox.parent().parent().parent().attr("id");
var serial = getSerialFromSortID(sortLayerID);
var objUpdate = {time: timeValue};
updateLayer(serial, objUpdate);
validateCurrentLayerTimes();
}
/**
* change time on the layer from the sortbox and reorder
*/
function onSortboxDepthChange(inputBox) {
//update the time by inputbox:
var depthValue = inputBox.val();
depthValue = Number(depthValue);
var order = depthValue - 1;
var sortLayerID = inputBox.parent().attr("id");
var serial = getSerialFromSortID(sortLayerID);
var objUpdate = {order: order};
updateLayer(serial, objUpdate);
redrawSortbox();
updateOrderFromSortbox();
}
/**
* order layers by time
* type can be [time] or [order]
*/
function getLayersSorted(type) {
if (type == undefined)
type = "time";
//convert to array
var layers_array = [];
for (key in arrLayers) {
var obj = arrLayers[key];
obj.serial = key;
layers_array.push(obj);
}
if (layers_array.length == 0)
return (layers_array);
//sort layers array
layers_array.sort(function (layer1, layer2) {
switch (type) {
case "time":
if (Number(layer1.time) == Number(layer2.time)) {
if (layer1.order == layer2.order)
return (0);
if (layer1.order > layer2.order)
return (1);
return (-1);
}
if (Number(layer1.time) > Number(layer2.time))
return (1);
break;
case "depth":
if (layer1.order == layer2.order)
return (0);
if (layer1.order > layer2.order)
return (1);
break;
default:
trace("wrong sort type: " + type);
break;
}
return (-1);
});
return (layers_array);
}
/**
* reditribute times between the layers sorted from small to big
*/
function redistributeTimes() {
//collect times to array:
var arrTimes = [];
for (key in arrLayers)
arrTimes.push(Number(arrLayers[key].time));
arrTimes.sort(function (a, b) {
return a - b
}); //sort number
var arrSortLayers = jQuery("#sortlist").sortable("toArray");
for (var i = 0; i < arrSortLayers.length; i++) {
var sortID = arrSortLayers[i];
var serial = getSerialFromSortID(sortID);
//update time:
var newTime = arrTimes[i];
var objUpdate = {time: newTime};
updateLayer(serial, objUpdate);
//update input box:
jQuery("#" + sortID + " input.sortbox_time").val(newTime);
}
}
//======================================================
// Time Functions End
//======================================================
function _________EVENTS___________(){}
/**
*
* on layer drag event - update layer position
*/
function onLayerDrag() {
var layerSerial = getSerialFromID(this.id);
var htmlLayer = jQuery(this);
var position = htmlLayer.position();
var objLayer = getLayer(layerSerial);
var posTop = Math.round(position.top);
var posLeft = Math.round(position.left);
var layerWidth = htmlLayer.outerWidth();
var totalWidth = container.width();
var layerHeight = htmlLayer.outerHeight();
var totalHeight = container.height();
var updateY, updateX;
setLayerSelected(layerSerial);
switch (objLayer.align_hor) {
case "left":
updateX = posLeft;
break;
case "right":
updateX = totalWidth - posLeft - layerWidth;
break;
case "center":
updateX = posLeft - (totalWidth - layerWidth) / 2;
updateX = Math.round(updateX);
break;
}
switch (objLayer.align_vert) {
case "top":
updateY = posTop;
break;
case "bottom":
updateY = totalHeight - posTop - layerHeight;
break;
case "middle":
updateY = posTop - (totalHeight - layerHeight) / 2;
updateY = Math.round(updateY);
break;
}
var objUpdate = {top: updateY, left: updateX, width: layerWidth, height: layerHeight};
updateLayer(layerSerial, objUpdate);
//update the position back with the rounded numbers (improve precision)
updateHtmlLayerPosition(false, htmlLayer, objLayer, objUpdate.top, objUpdate.left, "left", "top");
//update bottom fields (only if selected)
if (isLayerSelected(layerSerial))
updateLayerFormFields(layerSerial);
}
/**
* move some layer
*/
function moveLayer(serial, dir, step) {
var layer = getLayer(serial);
if (!layer)
return (false);
switch (dir) {
case "down":
arrLayers[serial].top += step;
break;
case "up":
arrLayers[serial].top -= step;
break;
case "right":
arrLayers[serial].left += step;
break;
case "left":
arrLayers[serial].left -= step;
break;
default:
UniteAdminRev.showErrorMessage("wrong direction: " + dir);
return (false);
break;
}
updateHtmlLayersFromObject(serial);
if (isLayerSelected(serial))
updateLayerFormFields(serial);
}
function _________TIMELINE___________(){}
/**
* get some calculations like real end time
*/
function getLayerExtendedParams(layer) {
var endSpeed = layer.endspeed;
if (!endSpeed)
endSpeed = layer.speed;
endSpeed = Number(endSpeed);
var endTime = layer.endtime;
var realEndTime;
if (!endTime || endTime == undefined || endTime == "") { //end time does not given
endTime = g_slideTime - Number(layer.speed);
realEndTime = g_slideTime;
} else { //end time given
realEndTime = Number(endTime) + Number(endSpeed);
}
layer.endTimeFinal = Number(endTime); //time caption stay - without end transition
layer.endSpeedFinal = Number(endSpeed);
layer.realEndTime = Number(realEndTime); //time with end transition
layer.timeLast = layer.realEndTime - layer.time; //time that the whole caption last
return (layer);
}
function _________SCALE___________(){}
/**
* calculate image height/width
*/
function scaleImage() {
jQuery("#layer_scaleX").change(function () {
if (jQuery("#layer_proportional_scale").is(":checked"))
scaleProportional(true);
else
scaleNormal();
});
jQuery("#layer_scaleY").change(function () {
if (jQuery("#layer_proportional_scale").is(":checked"))
scaleProportional(false);
else
scaleNormal();
});
jQuery("#layer_proportional_scale").click(function () {
var serial = selectedLayerSerial;
var layer = jQuery("#slide_layer_" + serial);
if (jQuery(this).is(":checked")) {
scaleProportional(true);
var aspectratio = true;
} else {
scaleNormal();
var aspectratio = false;
}
layer.resizable("destroy").resizable({
aspectRatio: aspectratio,
resize: function (event, ui) {
ui.element.find('img').css({width: "100%", height: "100%"});
jQuery('#layer_scaleX').val(ui.size.width);
jQuery('#layer_scaleY').val(ui.size.height);
},
stop: function (event, ui) {
t.updateLayerFromFields();
}
});
});
jQuery("#reset-scale").click(function () {
resetImageDimensions();
jQuery("#layer_proportional_scale").attr('checked', false);
jQuery("#layer_scaleX_text").html(jQuery("#layer_scaleX_text").data("textnormal")).css("width", "10px");
jQuery("#layer_scaleX").val("");
jQuery("#layer_scaleY").val("");
jQuery("#slide_layer_" + selectedLayerSerial + " img").css("width", "");
jQuery("#slide_layer_" + selectedLayerSerial + " img").css("height", "");
t.updateLayerFromFields();
});
}
/**
* scale proportional
*/
function scaleProportional(useX) {
var serial = selectedLayerSerial;
resetImageDimensions();
var imgObj = new Image();
imgObj.src = jQuery("#slide_layer_" + serial + " img").attr("src");
if (useX) {
var x = parseInt(jQuery("#layer_scaleX").val());
if (isNaN(x)) x = imgObj.width;
var y = Math.round(100 / imgObj.width * x / 100 * imgObj.height, 0);
} else {
var y = parseInt(jQuery("#layer_scaleY").val());
if (isNaN(y)) y = imgObj.height;
var x = Math.round(100 / imgObj.height * y / 100 * imgObj.width, 0);
}
jQuery("#slide_layer_" + serial + " img").css("width", x + "px");
jQuery("#slide_layer_" + serial + " img").css("height", y + "px");
jQuery("#slide_layer_" + serial).css("width", jQuery("#slide_layer_" + serial + " img").width() + "px");
jQuery("#slide_layer_" + serial).css("height", jQuery("#slide_layer_" + serial + " img").height() + "px");
jQuery("#slide_layer_" + serial + " img").css("width", "100%");
jQuery("#slide_layer_" + serial + " img").css("height", "100%");
jQuery("#layer_scaleX").val(x);
jQuery("#layer_scaleY").val(y);
}
/**
* scale normal
*/
function scaleNormal() {
var serial = selectedLayerSerial;
var imgdims = resetImageDimensions();
jQuery("#slide_layer_" + serial + " img").css("width", jQuery("#layer_scaleX").val() + "px");
jQuery("#slide_layer_" + serial + " img").css("height", jQuery("#layer_scaleY").val() + "px");
jQuery("#slide_layer_" + serial).css("width", jQuery("#slide_layer_" + serial + " img").width() + "px");
jQuery("#slide_layer_" + serial).css("height", jQuery("#slide_layer_" + serial + " img").height() + "px");
jQuery("#slide_layer_" + serial + " img").css("width", "100%");
jQuery("#slide_layer_" + serial + " img").css("height", "100%");
}
function resetImageDimensions() {
var imgObj = new Image();
imgObj.src = jQuery("#slide_layer_" + selectedLayerSerial + " img").attr("src");
jQuery("#slide_layer_" + selectedLayerSerial).css("width", imgObj.width + "px");
jQuery("#slide_layer_" + selectedLayerSerial).css("height", imgObj.height + "px");
var imgdims = {width: imgObj.width, height: imgObj.height};
return imgdims;
}
/**
* get general layer params
*/
this.getLayerGeneralParamsStatus = function () {
return layerGeneralParamsStatus;
}
function _________MAIN_BACKGROUND___________(){}
function initBackgroundFunctions() {
jQuery('#slide_bg_fit').change(function () {
if (jQuery(this).val() == 'percentage') {
jQuery('#bg_fit_procent_row').show();
jQuery('input[name="bg_fit_x"]').show();
jQuery('input[name="bg_fit_y"]').show();
jQuery('#divbgholder').css('background-size', jQuery('input[name="bg_fit_x"]').val() + '% ' + jQuery('input[name="bg_fit_y"]').val() + '%');
} else {
jQuery('#bg_fit_procent_row').hide();
jQuery('input[name="bg_fit_x"]').hide();
jQuery('input[name="bg_fit_y"]').hide();
jQuery('#divbgholder').css('background-size', jQuery(this).val());
}
if (jQuery(this).val() == 'contain') {
//jQuery('#divLayers-wrapper').css('maxWidth', jQuery('#divbgholder').css('minWidth'));
} else {
//jQuery('#divLayers-wrapper').css('maxWidth', '100%');
}
});
//-----------
function updateBGFit(){
var fitX = jQuery('input[name="bg_fit_x"]').val();
var fitY = jQuery('input[name="bg_fit_y"]').val();
fitX = fitX.replace("%","");
fitY = fitY.replace("%","");
if(fitX != "auto")
fitX += "%";
if(fitY != "auto")
fitY += "%";
jQuery('#divbgholder').css('background-size',fitX+" "+fitY );
}
jQuery('input[name="bg_fit_x"]').change(updateBGFit);
jQuery('input[name="bg_fit_y"]').change(updateBGFit);
jQuery('#slide_bg_fit').change();
jQuery('#slide_bg_position').change(function () {
if (jQuery(this).val() == 'percentage') {
jQuery('input[name="bg_position_x"]').show();
jQuery('input[name="bg_position_y"]').show();
updateBGFit();
} else {
jQuery('input[name="bg_position_x"]').hide();
jQuery('input[name="bg_position_y"]').hide();
jQuery('#divbgholder').css('background-position', jQuery(this).val());
}
});
jQuery('input[name="bg_position_x"]').change(function () {
jQuery('#divbgholder').css('background-position', jQuery('input[name="bg_position_x"]').val() + '% ' + jQuery('input[name="bg_position_y"]').val() + '%');
});
jQuery('input[name="bg_position_y"]').change(function () {
jQuery('#divbgholder').css('background-position', jQuery('input[name="bg_position_x"]').val() + '% ' + jQuery('input[name="bg_position_y"]').val() + '%');
});
jQuery('#slide_bg_repeat').change(function () {
jQuery('#divbgholder').css('background-repeat', jQuery(this).val());
});
jQuery('input[name="kenburn_effect"]').change(function () {
if (jQuery(this).val() == "on") {
jQuery('#kenburn_wrapper').show();
jQuery('#bg-position-lbl').hide();
jQuery('#bg-start-position-wrapper').children().appendTo(jQuery('#bg-start-position-wrapper-kb'));
jQuery('#bg-setting-wrap').hide();
jQuery('#divbgholder').css('background-repeat', '');
jQuery('#divbgholder').css('background-position', '');
jQuery('#divbgholder').css('background-size', '');
jQuery('input[name="kb_start_fit"]').change();
//jQuery('#divLayers-wrapper').css('maxWidth', 'none');
jQuery('#slide_bg_position').change();
} else {
jQuery('#kenburn_wrapper').hide();
jQuery('#bg-position-lbl').show();
jQuery('#bg-start-position-wrapper-kb').children().appendTo(jQuery('#bg-start-position-wrapper'));
jQuery('#bg-setting-wrap').show();
jQuery('#slide_bg_repeat').change();
jQuery('#slide_bg_position').change();
jQuery('#slide_bg_fit').change();
if (jQuery('#slide_bg_fit').val() == 'contain') {
//jQuery('#divLayers-wrapper').css('maxWidth', jQuery('#divbgholder').css('minWidth'));
} else {
//jQuery('#divLayers-wrapper').css('maxWidth', '100%');
}
}
});
jQuery('input[name="kenburn_effect"]:checked').change();
jQuery('#slide_bg_end_position').change(function () {
if (jQuery(this).val() == 'percentage') {
jQuery('input[name="bg_end_position_x"]').show();
jQuery('input[name="bg_end_position_y"]').show();
} else {
jQuery('input[name="bg_end_position_x"]').hide();
jQuery('input[name="bg_end_position_y"]').hide();
}
});
jQuery('input[name="kb_start_fit"]').change(function () {
var fitVal = parseInt(jQuery(this).val());
var limg = new Image();
limg.onload = function () {
calculateKenBurnScales(fitVal, limg.width, limg.height, jQuery('#divbgholder'));
}
var urlImage = '';
if (jQuery('#radio_back_image').is(':checked'))
urlImage = jQuery("#image_url").val();
else if (jQuery('#radio_back_external').is(':checked'))
urlImage = jQuery("#slide_bg_external").val();
if (urlImage != '') {
limg.src = urlImage;
}
});
/**
* calc ken burnes scales
*/
function calculateKenBurnScales(proc, owidth, oheight, opt) {
var ow = owidth;
var oh = oheight;
var factor = (opt.width() / ow);
var factorh = (opt.height() / oh);
// if (factor>=1) {
var nheight = oh * factor;
proc = proc + "%";
var hfactor = "auto"; //(nheight / opt.height())*proc;
/*} else {
var nwidth = "auto" //ow * factorh;
var hfactor = proc+"%";
proc = "auto";
//proc = (nwidth / opt.width()) * proc;
}*/
jQuery('#divbgholder').css('background-size', proc + " " + hfactor);
}
jQuery(window).resize(function () {
if (jQuery('input[name="kenburn_effect"]:checked').val() == 'on') {
var fitVal = parseInt(jQuery('input[name="kb_start_fit"]').val());
var limg = new Image();
limg.onload = function () {
calculateKenBurnScales(fitVal, limg.width, limg.height, jQuery('#divbgholder'));
}
var urlImage = '';
if (jQuery('#radio_back_image').is(':checked'))
urlImage = jQuery("#image_url").val();
else if (jQuery('#radio_back_external').is(':checked'))
urlImage = jQuery("#slide_bg_external").val();
if (urlImage != '') {
limg.src = urlImage;
}
}
});
}
function _________LOOP___________(){}
function initLoopFunctions() {
jQuery('select[name="layer_loop_animation"]').change(function () {
showHideLoopFunctions();
});
jQuery('#layer_static_start').change(function () {
changeEndStaticFunctions();
});
}
/**
* show hide loops functions
*/
function showHideLoopFunctions() {
jQuery('select[name="layer_loop_animation"]').each(function () {
jQuery("#layer_easing_wrapper").hide();
jQuery("#layer_speed_wrapper").hide();
jQuery("#layer_degree_wrapper").hide();
jQuery("#layer_origin_wrapper").hide();
jQuery("#layer_x_wrapper").hide();
jQuery("#layer_y_wrapper").hide();
jQuery("#layer_zoom_wrapper").hide();
jQuery("#layer_angle_wrapper").hide();
jQuery("#layer_radius_wrapper").hide();
switch (jQuery(this).val()) {
case 'none':
break;
case 'rs-pendulum':
jQuery("#layer_easing_wrapper").show();
jQuery("#layer_speed_wrapper").show();
jQuery("#layer_degree_wrapper").show();
jQuery("#layer_origin_wrapper").show();
break;
case 'rs-rotate':
jQuery("#layer_easing_wrapper").show();
jQuery("#layer_speed_wrapper").show();
jQuery("#layer_degree_wrapper").show();
jQuery("#layer_origin_wrapper").show();
break;
case 'rs-slideloop':
jQuery("#layer_easing_wrapper").show();
jQuery("#layer_speed_wrapper").show();
jQuery("#layer_x_wrapper").show();
jQuery("#layer_y_wrapper").show();
break;
case 'rs-pulse':
jQuery("#layer_easing_wrapper").show();
jQuery("#layer_speed_wrapper").show();
jQuery("#layer_zoom_wrapper").show();
break;
case 'rs-wave':
jQuery("#layer_speed_wrapper").show();
jQuery("#layer_angle_wrapper").show();
jQuery("#layer_radius_wrapper").show();
jQuery("#layer_origin_wrapper").show();
break;
}
});
}
/**
* change end static functions
*/
function changeEndStaticFunctions() {
jQuery('#layer_static_start').each(function () {
var cur_att = parseInt(jQuery(this).val());
var cur_end = jQuery('#layer_static_end option:selected').val();
var go_max_up_to = parseInt(jQuery('#layer_static_end option:last-child').val());
var go_up_to = parseInt(jQuery('#layer_static_start option:last-child').val()) + 1;
jQuery('#layer_static_end').empty();
for (var cur = cur_att + 1; cur <= go_max_up_to; cur++) {
jQuery("#layer_static_end").append('<option value="' + cur + '">' + cur + '</option>');
}
jQuery("#layer_static_end option[value='" + cur_end + "']").attr('selected', 'selected');
});
}
jQuery(document).ready(function(){
removebtnShow();
hideAccordion();
jQuery(document).on("click", function(){
removebtnShow();
hideAccordion();
});
jQuery('.unselect_layer').on('click', function(e){
unselectLayers();
e.preventDefault();
});
});
}