File: /var/www/html/tmpr/..//tmpr/../tmpr/../pages/elementjs2.php
<script type="text/javascript">
var basic, full, fullInit, fullDestroy, changed = [];
$(function(){
basic = $('#basic .plugin img').imagist({
width: 600,
height: 600
});
var theUpdate = $('#update').val();
var theUpdate = encodeURIComponent(theUpdate);
var theUsername = "<?php echo ucwords($user_nameX); ?>";
var theUrl = "thebrand.co.ke/<?php echo $user_nameX; ?>";
var theName = "<?php echo $catalognameX; ?>";
var onerror = function() {
alert('"' + this.src + '" could not load');
};
(fullInit = function() {
full = $('#full .plugin img').imagist({
canvasWidth: 600,
canvasHeight: 600,
positionX: 0,
positionY: 0,
width: 600,
error: onerror,
background: '<?php echo $layerbg ?>',
loading: function(process) {
$('#full .progress-bar').css('width', process + '%');
},
change: function(allOpts, changedProps) {
changed = changedProps;
if (is_changed("layer")) {
// Layer list
var list = $('#full .layer-list').html('');
var sameOrigin = true;
var template = $(''
+ ' <tr class="list-group-item h5" draggable="true">'
+ ' <td style="max-width:400px;overflow:hidden"> <span class="src "></span></td> '
+ '<td width=150 align=right><a class="remove"><i class="icon-trash "></i></a> '
+ ' <a class="down"><i class="icon-arrow-down"></i></a> '
+ ' <a class="up"><i class="icon-arrow-up"></i></a> </td> '
+ '</tr>');
for (var i = 0; i < allOpts.layers.length; i++) {
$('#type').val(allOpts.layers[i].src);
/*if(allOpts.layers.length >5) { alert("maximum layers");}*/
/*allOpts.layers.length replced by 4*/
if ( ! this.layers[ allOpts.layers[i].index ].sameOrigin ) {
sameOrigin = false;
}
list.prepend(
template.clone()
.data('index', allOpts.layers[i].index)
.find('.src').html(<?php /*?>i+<?php */?>" <img class='img-circle' style='margin:0; background-color:#333; height:40px;padding:0px' src='"+allOpts.layers[i].src+"' width='40' > "+checkLayerType(allOpts.layers[i].src)+" "+ allOpts.layers[i].index)
.addClass(allOpts.layers[i].active ? 'active' : '')
.attr('href', allOpts.layers[i].src)
.attr('id', i)
.parents('tr')
);
}
// Same-origin policy warning
if (!sameOrigin) {
$('#full .same-origin-warning').show();
} else {
$('#full .same-origin-warning').hide();
}
}
// Active layer parameters
is_changed("layer") && $('#full .active-layer-src').attr('href', allOpts.src).html(allOpts.src);
is_changed("layer") && $('#full .updateUrl').val(allOpts.src);
is_changed("layer") && $('#full .active-layer-src').attr('href', allOpts.src).html(allOpts.src);
is_changed("layer") && $('#full .active-layer-category').val(allOpts.category);
/*
is_changed("layer") && $('#full .active-layer-src')
{
var str = allOpts.src;
var n = str.indexOf("processFont");
if (n < 0) { is_changed("layer") && $('#full .active-layer-category').val("nothing"); }
}*/
/* */
if (allOpts.src.indexOf("theUpdate") >= 0)
{
is_changed("layer") ;
$('#theLayouts').hide();
$('#theComments').show();
$('#properties').hide();
$('#textProperties').show();
full.disableResize();
full.disableRotate();
$('#update').val("<?php echo $text ?>");
}
else if (allOpts.src.indexOf("theUrl") >= 0)
{
is_changed("layer") ;
$('#theLayouts').hide();
$('#theComments').show();
$('#properties').hide();
$('#textProperties').show();
full.disableResize();
full.disableRotate();
$('#update').val("<?php echo "thebrand.co.ke/".$slugX ?>");
}
else if (allOpts.src.indexOf("theName") >= 0)
{
is_changed("layer") ;
$('#theLayouts').hide();
$('#theComments').show();
$('#properties').hide();
$('#textProperties').show();
full.disableResize();
full.disableRotate();
$('#update').val("<?php echo $catalognameX;?>");
}
else if (allOpts.src.indexOf("theUsername") >= 0)
{
is_changed("layer") ;
$('#theLayouts').hide();
$('#theComments').show();
$('#properties').hide();
$('#textProperties').show();
full.disableResize();
full.disableRotate();
$('#update').val("<?php echo $user_nameX;?>");
}
else
{
is_changed("layer") ;
$('#theComments').hide();$('#theLayouts').show();$('#textProperties').hide(); $('#properties').show();full.enableResize(); full.enableRotate();
}
$('.count').html(i);
$('.upload-image').attr('id', i);
is_changed("canvasWidth") && $('#full input.canvas-width').val(allOpts.canvasWidth);
is_changed("canvasHeight") && $('#full input.canvas-height').val(allOpts.canvasHeight);
is_changed("opacity") && $('#full input.opacity').val(allOpts.opacity);
is_changed("positionX") && $('#full input.position-x').val(allOpts.positionX);
is_changed("positionY") && $('#full input.position-y').val(allOpts.positionY);
is_changed("width") && $('#full input.width').val(allOpts.width);
is_changed("height") && $('#full input.height').val(allOpts.height);
is_changed("rotation") && $('#full input.rotation').val(allOpts.rotation);
is_changed("category") && $('#full input.category').val(allOpts.category);
is_changed("background") && $('#full input.background').val(allOpts.background);
is_changed("flipV") && $('#full input.flip-v').prop('checked', allOpts.flipV);
is_changed("flipH") && $('#full input.flip-h').prop('checked', allOpts.flipH);
}
})
<?php if(!empty($layer1)){if (strpos($layer1, 'route=theUpdate') !== false || strpos($layer1, 'route=theName') !== false || strpos($layer1, 'route=theUrl') !== false) {$output = "";}else {$output = "width:$layer1h ,
height: $layer1h ,"; }?>
.addLayer('<?php echo $layer1;?>', {
rotation: <?php echo $layer1r ?>,
positionX:<?php echo $layer1x ?>,
positionY: <?php echo $layer1y ?>,
<?php echo $output; ?>
category: "0",
opacity: <?php echo $layer1opacity ?>
})
<?php }?>
<?php if(!empty($layer2)){if (strpos($layer2, 'route=theUpdate') !== false || strpos($layer2, 'route=theName') !== false || strpos($layer2, 'route=theUrl') !== false) {$output = "";}else {$output = "width:$layer2h ,
height: $layer2h ,"; }?>
.addLayer('<?php echo $layer2;?>', {
rotation: <?php echo $layer2r ?>,
positionX:<?php echo $layer2x ?>,
positionY: <?php echo $layer2y ?>,
<?php echo $output; ?>
category: "0",
opacity: <?php echo $layer2opacity ?>
})
<?php }?>
<?php if(!empty($layer3)){ if (strpos($layer3, 'route=theUpdate') !== false || strpos($layer3, 'route=theName') !== false || strpos($layer3, 'route=theUrl') !== false) {$output = "";}else {$output = "width:$layer3h ,
height: $layer3h ,"; }?>
.addLayer('<?php echo $layer3;?>', {
rotation: <?php echo $layer3r ?>,
positionX:<?php echo $layer3x ?>,
positionY: <?php echo $layer3y ?>,
<?php echo $output; ?>
category: "0",
opacity: <?php echo $layer3opacity ?>
})
<?php }?>
<?php if(!empty($layer4)){ if (strpos($layer4, 'route=theUpdate') !== false || strpos($layer4, 'route=theName') !== false || strpos($layer4, 'route=theUrl') !== false) {$output = "";}else {$output = "width:$layer4h ,
height: $layer4h ,"; }?>
.addLayer('<?php echo $layer4;?>', {
rotation: <?php echo $layer4r ?>,
positionX:<?php echo $layer4x ?>,
positionY: <?php echo $layer4y ?>,
<?php echo $output; ?>
category: "0",
opacity: <?php echo $layer4opacity ?>
})
<?php }?>
<?php if(!empty($layer5)){ if (strpos($layer5, 'route=theUpdate') !== false || strpos($layer5, 'route=theName') !== false || strpos($layer5, 'route=theUrl') !== false) {$output = "";}else {$output = "width:$layer5h ,
height: $layer5h ,"; }?>
.addLayer('<?php echo $layer5;?>', {
rotation: <?php echo $layer5r ?>,
positionX:<?php echo $layer5x ?>,
positionY: <?php echo $layer5y ?>,
<?php echo $output; ?>
category: "0",
opacity: <?php echo $layer5opacity ?>
})
<?php }?>
$('#full .controls-destroyed').hide();
$('#full .controls-initialized').show();
// Fix static inputs with defaults
$('#full input.enabled').prop('checked', true);
$('#full input.rotate').prop('checked', true);
$('#full input.move').prop('checked', true);
$('#full input.resize').prop('checked', true);
$('#full input.overflow').prop('checked', true);
$('#full input.layer').val('');
})();
/**
* Destroy function
*/
fullDestroy = function() {
full.destroy();
full = null;
$('#full .controls-destroyed').show();
$('#full .controls-initialized').hide();
};
/**
* Init
*/
$('#full .controls-destroyed button.init').click(fullInit);
/**
* Destroy
*/
$('#full .controls-initialized button.destroy').click(fullDestroy);
/**
* Save as
*/
$('#full .controls-initialized button.saveas').parents("form").submit(function() {
$(this).find("input[type='hidden']").val(full.render());
});
/**
* Add layer (layer list)
*/
$('.addlayout').click(function() {
loading_show();
var effect = $(this).attr("id");
var str = effect;
var res = str.replace(".png", "");
$("#check").html("Loading "+res+"...");
<?php /*?> full && full.removeLayer($(this).parents('tr').data('index'));<?php */?>
$('#full input.layer').val("<?php echo $siteaddress3 ?>taswira.php?quality=100&nocache=1&width=600&height=600&cropratio=1:1&image=/filters/mood/"+effect+".png");
full && full.addLayer($('#full input.layer').val(), {
error: onerror
});
loading_hide();
$("#check").html(" ");
})
$('.addlayout2').click(function() {
loading_show();
var updateUrl = $("#updateUrl").val();
var themeid = $(this).attr("id");
var update = $("#update").val();
var setFontSize = $("#setFontSize").val();
var layerid = $("#level").val();
var removelayerid = $("#level").val();
var removelayerid = removelayerid-1;
var setLineHeight = $("#setLineHeight").val();
var setHAlignment = $("#setHAlignment").val();
var opacity = $("#opacity").val();
var setPadding = $("#setPadding").val();
var setWidth = $("#setWidth").val();
var text_color = $("#text_color").val();
var positionx = $("#position-x").val();
var positiony = $("#position-y").val();
var font_Text = $("#myFont").val();
<?php /*?> $('#theComments').hide();$('#theLayouts').hide();$('#textProperties').hide();<?php */?>
$("#check").html("Updating Text Layer "+layerid+"...");
<?php /*?> var list = $('#updateUrl').val();
var newsrc = '<?php echo $siteaddress3 ?>processFont.php?route=text&action=update&fontid='+themeid+'&myfont='+layerid+'&fontcatalogid=<?php echo $catalogidX ?>&themeid='+themeid+'&font_Username='+font_Text+'&font_Name='+font_Text+'&font_Url='+font_Text+'&font_Text='+font_Text+'&text_w='+setWidth+'&text_h=0&text_x='+positionx+'&text_y='+positiony+'&text_align='+setHAlignment+'&text_size='+setFontSize+'&text_color='+text_color+'&url_color='+text_color+'&name_color='+text_color+'&username_color='+text_color+'&url_size='+setFontSize+'&name_size='+setFontSize+'&username_size='+setFontSize+'&text_pad='+setPadding+'&text_line_height='+setLineHeight+'&text='+update;
$('img[src="'+list+'"]').attr('src',newsrc);
$('#update').val(newsrc);
$('#updateUrl').val(newsrc);
<?php */?>
var level= encodeURI(document.getElementById('level').value);
full && full.bringFront($(this).parents('tr').data(level));
full && full.removeLayer($(this).parents('tr').data(level));
<?php /*?> $('#full input.layer').val('<?php echo $siteaddress3 ?>processFont.php?route=text&action=update&fontid='+themeid+'&myfont='+layerid+'&fontcatalogid='+catalogid+'&themeid='+themeid+'&font_Username='+font_Text+'&font_Name='+font_Text+'&font_Url='+font_Text+'&font_Text='+font_Text+'&text_w='+setWidth+'&text_h=0&text_x='+positionx+'&text_y='+positiony+'&text_align='+setHAlignment+'&text_size='+setFontSize+'&text_color='+text_color+'&url_color='+text_color+'&name_color='+text_color+'&username_color='+text_color+'&url_size='+setFontSize+'&name_size='+setFontSize+'&username_size='+setFontSize+'&text_pad='+setPadding+'&text_line_height='+setLineHeight+'&text='+update);
<?php */?>
var newText = '<?php echo $siteaddress3 ?>processFont.php?route=text&action=update&fontid='+themeid+'&myfont='+layerid+'&fontcatalogid=<?php echo $catalogidX ?>&themeid='+themeid+'&font_Username='+font_Text+'&font_Name='+font_Text+'&font_Url='+font_Text+'&font_Text='+font_Text+'&text_w='+setWidth+'&text_h=0&text_x='+positionx+'&text_y='+positiony+'&text_align='+setHAlignment+'&text_size='+setFontSize+'&text_color='+text_color+'&url_color='+text_color+'&name_color='+text_color+'&username_color='+text_color+'&url_size='+setFontSize+'&name_size='+setFontSize+'&username_size='+setFontSize+'&text_pad='+setPadding+'&text_line_height='+setLineHeight+'&text='+update;
full && full.addLayer('<?php echo $siteaddress3 ?>processFont.php?route=theUpdate&fontid='+themeid+'&myfont='+layerid+'&fontcatalogid=<?php echo $catalogidX ?>&themeid='+themeid+'&font_Username='+font_Text+'&font_Name='+font_Text+'&font_Url='+font_Text+'&font_Text='+font_Text+'&text_w='+setWidth+'&text_h=0&text_x='+positionx+'&text_y='+positiony+'&text_align='+setHAlignment+'&text_size='+setFontSize+'&text_color='+text_color+'&url_color='+text_color+'&name_color='+text_color+'&username_color='+text_color+'&url_size='+setFontSize+'&name_size='+setFontSize+'&username_size='+setFontSize+'&text_pad='+setPadding+'&text_line_height='+setLineHeight+'&text='+update, {
rotation: <?php echo $layer5r ?>,
positionX:<?php echo $layer5x ?>,
positionY: <?php echo $layer5y ?>,
category: "0",
opacity: <?php echo $layer5opacity ?>
})
$("#update").val(update);$("#setWidth").val(setWidth);
<?php /*?> $("#setFontSize").val(setFontSize);
$("#setLineHeight").val(setLineHeight);
$("#setHAlignment").val(setHAlignment);
$("#opacity").val(opacity);
$("#setPadding").val(setPadding);
$("#text_color").val(text_color);
$("#position-x").val(position-x);
$("#position-y").val(position-y); <?php */?>
loading_hide(); $("#check").html("Successfully updated");return;
<?php /*?> $("#position-y").val(positiony);<?php */?>
})
$('#full button.add-new-layer').click(function(){
full && full.addLayer($('#full input.layer').val(), {
error: onerror
});
});
$('#full input.layer').on('keydown', function(e) {
full && e.keyCode === 13 && $('#full button.layer-btn').click();
});
$('#full .upload-image').uploader({
xhr: {/* */
success: function(response) {
var rotation= encodeURI(document.getElementById('rotation').value);
var level= encodeURI(document.getElementById('level').value);
$.ajax({
type: 'POST',
url: 'v/uploadParameters.php?themeid=<?php echo $msg_id2 ?>&catalogid=<?php echo $catalogid5 ?>',
data: {'uploadedLayer': response.file,'level': level},
success: function(msg) {
full && full.addLayer(response.file);
var level= encodeURI(document.getElementById('level').value);
var level= level-1;
full && full.sendBack(level);
/**/
$("#check").html("<i class='icon-bell text-danger'></i> "+msg);
/*alert(msg);*/
}
});
}
}
});
/**
* Remove layer (layer list)
*/
$('#full .layer-list').on('click', 'a.remove', function() {
var layerId = $(this).parents('tr').data('index');
var dataString = 'layer_id='+ layerId;
if(layerId == 0)
{
$("#check").html("<i class='icon-bell text-danger'></i> Only layers above the Background can be deleted");
return false;
}
if(confirm("Do you want to Delete Layer"+layerId+"?"))
{
full && full.removeLayer($(this).parents('tr').data('index')); alert(layerId);
/* $('#full button.export').click();*/
$.ajax({
type: "POST",
url: mimiServer+"service/social/delete_layer_ajax.php?themeid=<?php echo $themeid ?>&catalogid=<?php echo $catalogid5 ?>",
data: dataString,
cache: false,
success: function(html){
$("#check").html(html);
}
});
}
return false;
});
/**
* Bring front (layer list)
*/
$('#full .layer-list').on('click', 'a.up', function() {
var level = $(this).parents('tr').data('index') ;
if (level != 0){
full && full.bringFront($(this).parents('tr').data('index'));
}
else
{
$("#check").html("<i class='icon-bell text-danger'></i>Sorry: Background can't be moved to front");
}
});
/**
* Send back (layer list)
*/
$('#full .layer-list').on('click', 'a.down', function() {
var level = $(this).parents('tr').data('index') ;
if (level != 1){
full && full.sendBack($(this).parents('tr').data('index'));
}
else
{
$("#check").html("<i class='icon-bell text-danger'></i>Sorry: Backgrounds cannot be replaced. ");
}
});
/**
* Activate layer (layer list)
*/
$('#full .layer-list').on('click', '.src', function(ev) {
ev.preventDefault();
full && full.activateLayer($(this).parents('tr').data('index') * 1);
});
/**
* Set canvas width, height
*/
$('#full .set-canvas-sizes').click(function() {
full && full.set({
canvasWidth: $('#full .canvas-width').val() * 1,
canvasHeight: $('#full .canvas-height').val() * 1
});
});
/**
* Set active layer's width and height
*/
$('#full .set-sizes').click(function() {
full && full.set({
width: $('#full .width').val() * 1,
height: $('#full .height').val() * 1
});
});
/**
* Set active layer's positionX and positionY
*/
$('#full .set-position').click(function() {
full && full.set({
positionX: $('#full .position-x').val() * 1,
positionY: $('#full .position-y').val() * 1
});
});
/**
* Set active layer's rotation
*/
$('#full .set-rotation').click(function() {
full && full.set({ rotation: $('#full .rotation').val() * 1 });
});
/**
* Set active layer's opacity
*/
$('#full .set-opacity').click(function() {
full && full.set({ opacity: $('#full .opacity').val() * 1 });
});
/**
* Set active layer's background
*/
$('#full .set-background').click(function() {
full && full.set({ background: $('#full .background').val() });
});
/**
* Flip active layer
*/
$('#full .flip-h').change(function() {
full && full.activeLayer.flipHorizontal( $(this).is(':checked') );
});
$('#full .flip-v').change(function() {
full && full.activeLayer.flipVertical( $(this).is(':checked') );
});
/**
* Remove active layer
*/
$('#full button.remove-layer-btn').click(function() {
full && full.removeLayer();
});
/**
* Bring front (active layer)
*/
$('#full button.bring-front').on('click', function() {
full && full.bringFront();
});
/**
* Send back (active layer)
*/
$('#full button.send-back').on('click', function() {
full && full.sendBack();
});
/**
* Export parameters (active layer)
*/
$('#full button.export').on('click', function() {
$("#check").html("<i class='icon-bell text-danger'></i> Exporting design..." );
<?php /*?>full && alert( JSON.stringify(full.get()) );<?php */?>
/*$("#check").html( JSON.stringify(full.get()));return;*/
var startag= encodeURI(document.getElementById('startag').value);
/*alert(startag); return;*/
var themeid = $("#msg_id2").val();
var update = $("#update").val();
var setFontSize = $("#setFontSize").val();
var layerid = $("#level").val();
var setLineHeight = $("#setLineHeight").val();
var setHAlignment = $("#setHAlignment").val();
var opacity = $("#opacity").val();
var setPadding = $("#setPadding").val();
alert
var setWidth = $("#setWidth").val();
var text_color = $("#text_color").val();
var positionx = $("#position-x").val();
var positiony = $("#position-y").val();
var font_Text = $("#myFont").val();
var parameters= JSON.stringify(full.get());
$.ajax({
type: 'POST',
url: 'v/uploadParameters.php?themeid=<?php echo $msg_id2 ?>&catalogid=<?php echo $catalogid5 ?>&startag='+startag+'&action=update&fontid='+themeid+'&myfont='+layerid+'&fontcatalogid=<?php echo $catalogidX ?>&themeid='+themeid+'&font_Username='+font_Text+'&font_Name='+font_Text+'&font_Url='+font_Text+'&font_Text='+font_Text+'&text_w='+setWidth+'&text_h=0&text_x='+positionx+'&text_y='+positiony+'&text_align='+setHAlignment+'&text_size='+setFontSize+'&text_color='+text_color+'&url_color='+text_color+'&name_color='+text_color+'&username_color='+text_color+'&url_size='+setFontSize+'&name_size='+setFontSize+'&username_size='+setFontSize+'&text_pad='+setPadding+'&text_line_height='+setLineHeight+'&text='+update,
data: {'params': parameters},
success: function(msg) {
$("#check").html("<i class='icon-bell text-danger'></i> "+msg);
/*alert(msg);*/
/*$("#startag").hide();*/
$("#finish").show();
}
});
});
$('#full input.enabled').on('change', function() {
if ( full ) {
if ( $(this).is(':checked') ) {
full.enable();
} else {
full.disable();
}
}
});
$('#full input.rotate').on('change', function() {
if ( full ) {
if ( $(this).is(':checked') ) {
full.enableRotate();
} else {
full.disableRotate();
}
}
});
$('#full input.move').on('change', function() {
if ( full ) {
if ( $(this).is(':checked') ) {
full.enableMove();
} else {
full.disableMove();
}
}
});
$('#full input.resize').on('change', function() {
if ( full ) {
if ( $(this).is(':checked') ) {
full.enableResize();
} else {
full.disableResize();
};
};
});
$('#full input.overflow').on('change', function() {
if ( full ) {
if ( $(this).is(':checked') ) {
full.showOverflow();
} else {
full.hideOverflow();
};
};
});
$('#full-modal').on('show.bs.modal', function(ev) {
$('img', this).attr('src', full.render());
});
function is_changed(propName) {
;
return changed.indexOf("all") > -1 ||
changed.indexOf("layer") > -1 ||
changed.indexOf(propName) > -1;
}
function checkLayerType(imageUrl) {
if (imageUrl.indexOf("theUpdate") >= 0)
{
var LayerType = "<strong>Text Caption: </strong> <?php echo $text; ?> ";
return LayerType;
}
else if (imageUrl.indexOf("mood") >= 0)
{
var LayerType = "<strong>Overlay: </strong> Graphics ";
return LayerType;
}
else if (imageUrl.indexOf("theUrl") >= 0)
{
var LayerType = "<strong>Text URL: </strong> thebrand.co.ke/<?php echo $slugX; ?> ";
return LayerType;
}
else if (imageUrl.indexOf("theName") >= 0)
{
var LayerType = "<strong>Name: </strong> <?php echo $catalognameX; ?> ";
return LayerType;
}
else if (imageUrl.indexOf("theUsername") >= 0)
{
var LayerType = "<strong>User Name: </strong> <?php echo $user_nameX; ?> ";
return LayerType;
}
else if (imageUrl.indexOf("ProfilePic") >= 0)
{
var LayerType = "<strong>Image: </strong> Profile Picture ";
return LayerType;
}
else{
var LayerType = "<strong>Image: </strong> ";
return LayerType;
}
}
$('#my_image').on({
'click': function(){
$('#my_image').attr('src','second.jpg');
}
});
<?php /*?>
alert(list);<?php */?>
function DropDown(el) {
this.dd = el;
this.placeholder = this.dd.children('span');
this.opts = this.dd.find('ul.dropdown > li');
this.val = '';
this.index = -1;
this.initEvents();
}
DropDown.prototype = {
initEvents : function() {
var obj = this;
obj.dd.on('click', function(event){
$(this).toggleClass('active');
return false;
});
obj.opts.on('click',function(){
var opt = $(this);
obj.val = opt.text();
obj.index = opt.index();
obj.placeholder.text(obj.val);
$("#myFont").val(obj.val);
});
},
getValue : function() {
return this.val;
},
getIndex : function() {
return this.index;
}
}
$(function() {
var dd = new DropDown( $('#dd') );
$(document).click(function() {
// all dropdowns
$('.dropdownit-3').removeClass('active');
});
var dd = new DropDown( $('#dd2') );
$(document).click(function() {
// all dropdowns
$('.dropdownit-3').removeClass('active');
});
});
});
</script>