mrflos/memo
1
0
Fork 0
Code Issues 9 Pull requests Projects Releases Packages Wiki Activity Actions

change spacing

Browse source
This commit is contained in:
ali asaria 2014-09-13 02:04:27 -04:00
parent 29bca82aa9
commit 557703e0d8
1 changed files with 541 additions and 581 deletions
Download patch file Download diff file Expand all files Collapse all files

370
client/script.js
View file

@ -9,8 +9,7 @@ var socket = io.connect();
//an action has happened, send it to the //an action has happened, send it to the
//server //server
function sendAction(a, d) function sendAction(a, d) {
{
//console.log('--> ' + a); //console.log('--> ' + a);
var message = { var message = {
@ -18,10 +17,10 @@ function sendAction(a, d)
data: d data: d
}; };
socket.json.send ( message ); socket.json.send(message);
} }
socket.on('connect', function(){ socket.on('connect', function() {
//console.log('successful socket.io connect'); //console.log('successful socket.io connect');
//let the path be the room name //let the path be the room name
@ -31,22 +30,20 @@ socket.on('connect', function(){
sendAction('joinRoom', path); sendAction('joinRoom', path);
}); });
socket.on('disconnect', function(){ socket.on('disconnect', function() {
blockUI("Server disconnected. Refresh page to try and reconnect..."); blockUI("Server disconnected. Refresh page to try and reconnect...");
//$('.blockOverlay').click($.unblockUI); //$('.blockOverlay').click($.unblockUI);
}); });
socket.on('message', function(data){ socket.on('message', function(data) {
getMessage(data); getMessage(data);
}); });
function unblockUI() function unblockUI() {
{
$.unblockUI(); $.unblockUI();
} }
function blockUI(message) function blockUI(message) {
{
message = message || 'Waiting...'; message = message || 'Waiting...';
$.blockUI({ $.blockUI({
@ -66,16 +63,14 @@ function blockUI(message)
} }
//respond to an action event //respond to an action event
function getMessage( m ) function getMessage(m) {
{
var message = m; //JSON.parse(m); var message = m; //JSON.parse(m);
var action = message.action; var action = message.action;
var data = message.data; var data = message.data;
//console.log('<-- ' + action); //console.log('<-- ' + action);
switch (action) switch (action) {
{
case 'roomAccept': case 'roomAccept':
//okay we're accepted, then request initialization //okay we're accepted, then request initialization
//(this is a bit of unnessary back and forth but that's okay for now) //(this is a bit of unnessary back and forth but that's okay for now)
@ -96,12 +91,15 @@ function getMessage( m )
case 'createCard': case 'createCard':
//console.log(data); //console.log(data);
drawNewCard(data.id, data.text, data.x, data.y, data.rot, data.colour, null); drawNewCard(data.id, data.text, data.x, data.y, data.rot, data.colour,
null);
break; break;
case 'deleteCard': case 'deleteCard':
$("#" + data.id).fadeOut(500, $("#" + data.id).fadeOut(500,
function() {$(this).remove();} function() {
$(this).remove();
}
); );
break; break;
@ -134,15 +132,15 @@ function getMessage( m )
break; break;
case 'nameChangeAnnounce': case 'nameChangeAnnounce':
updateName( message.data.sid, message.data.user_name ); updateName(message.data.sid, message.data.user_name);
break; break;
case 'addSticker': case 'addSticker':
addSticker( message.data.cardId, message.data.stickerId ); addSticker(message.data.cardId, message.data.stickerId);
break; break;
case 'setBoardSize': case 'setBoardSize':
resizeBoard( message.data ); resizeBoard(message.data);
break; break;
default: default:
@ -158,16 +156,18 @@ $(document).bind('keyup', function(event) {
keyTrap = event.which; keyTrap = event.which;
}); });
function drawNewCard(id, text, x, y, rot, colour, sticker, animationspeed) function drawNewCard(id, text, x, y, rot, colour, sticker, animationspeed) {
{
//cards[id] = {id: id, text: text, x: x, y: y, rot: rot, colour: colour}; //cards[id] = {id: id, text: text, x: x, y: y, rot: rot, colour: colour};
var h = '<div id="' + id + '" class="card ' + colour + var h = '<div id="' + id + '" class="card ' + colour +
' draggable" style="-webkit-transform:rotate(' + rot + 'deg);\ ' draggable" style="-webkit-transform:rotate(' + rot +
'deg);\
">\ ">\
<img src="/images/icons/token/Xion.png" class="card-icon delete-card-icon" />\ <img src="/images/icons/token/Xion.png" class="card-icon delete-card-icon" />\
<img class="card-image" src="/images/' + colour + '-card.png">\ <img class="card-image" src="/images/' +
<div id="content:' + id + '" class="content stickertarget droppable">' + colour + '-card.png">\
<div id="content:' + id +
'" class="content stickertarget droppable">' +
text + '</div><span class="filler"></span>\ text + '</div><span class="filler"></span>\
</div>'; </div>';
@ -185,26 +185,24 @@ function drawNewCard(id, text, x, y, rot, colour, sticker, animationspeed)
// $(this).focus(); // $(this).focus();
// } ); // } );
card.draggable( card.draggable({
{
snap: false, snap: false,
snapTolerance: 5, snapTolerance: 5,
containment: [0,0,2000,2000], containment: [0, 0, 2000, 2000],
stack: ".card", stack: ".card",
start: function (event, ui) { start: function(event, ui) {
keyTrap = null; keyTrap = null;
}, },
drag: function (event, ui) { drag: function(event, ui) {
if (keyTrap == 27) { if (keyTrap == 27) {
ui.helper.css(ui.originalPosition); ui.helper.css(ui.originalPosition);
return false; return false;
} }
} }
} });
);
//After a drag: //After a drag:
card.bind( "dragstop", function(event, ui) { card.bind("dragstop", function(event, ui) {
if (keyTrap == 27) { if (keyTrap == 27) {
keyTrap = null; keyTrap = null;
return; return;
@ -219,16 +217,18 @@ function drawNewCard(id, text, x, y, rot, colour, sticker, animationspeed)
sendAction('moveCard', data); sendAction('moveCard', data);
}); });
card.children(".droppable").droppable( card.children(".droppable").droppable({
{
accept: '.sticker', accept: '.sticker',
drop: function( event, ui ) { drop: function(event, ui) {
var stickerId = ui.draggable.attr("id"); var stickerId = ui.draggable.attr("id");
var cardId = $(this).parent().attr('id'); var cardId = $(this).parent().attr('id');
addSticker( cardId, stickerId ); addSticker(cardId, stickerId);
var data = { cardId: cardId, stickerId: stickerId }; var data = {
cardId: cardId,
stickerId: stickerId
};
sendAction('addSticker', data); sendAction('addSticker', data);
//remove hover state to everything on the board to prevent //remove hover state to everything on the board to prevent
@ -236,16 +236,15 @@ function drawNewCard(id, text, x, y, rot, colour, sticker, animationspeed)
$('.card-hover-draggable').removeClass('card-hover-draggable'); $('.card-hover-draggable').removeClass('card-hover-draggable');
}, },
hoverClass: 'card-hover-draggable' hoverClass: 'card-hover-draggable'
} });
);
var speed = Math.floor(Math.random() * 1000); var speed = Math.floor(Math.random() * 1000);
if (typeof(animationspeed) != 'undefined') speed = animationspeed; if (typeof(animationspeed) != 'undefined') speed = animationspeed;
var startPosition = $("#create-card").position(); var startPosition = $("#create-card").position();
card.css( 'top' , startPosition.top - card.height() * 0.5 ); card.css('top', startPosition.top - card.height() * 0.5);
card.css('left', startPosition.left - card.width() * 0.5 ); card.css('left', startPosition.left - card.width() * 0.5);
card.animate({ card.animate({
left: x + "px", left: x + "px",
@ -253,87 +252,87 @@ function drawNewCard(id, text, x, y, rot, colour, sticker, animationspeed)
}, speed); }, speed);
card.hover( card.hover(
function(){ function() {
$(this).addClass('hover'); $(this).addClass('hover');
$(this).children('.card-icon').fadeIn(10); $(this).children('.card-icon').fadeIn(10);
}, },
function(){ function() {
$(this).removeClass('hover'); $(this).removeClass('hover');
$(this).children('.card-icon').fadeOut(150); $(this).children('.card-icon').fadeOut(150);
} }
); );
card.children('.card-icon').hover( card.children('.card-icon').hover(
function(){ function() {
$(this).addClass('card-icon-hover'); $(this).addClass('card-icon-hover');
}, },
function(){ function() {
$(this).removeClass('card-icon-hover'); $(this).removeClass('card-icon-hover');
} }
); );
card.children('.delete-card-icon').click( card.children('.delete-card-icon').click(
function(){ function() {
$("#" + id).remove(); $("#" + id).remove();
//notify server of delete //notify server of delete
sendAction( 'deleteCard' , { 'id': id }); sendAction('deleteCard', {
'id': id
});
} }
); );
card.children('.content').editable(function(value, settings) { card.children('.content').editable(function(value, settings) {
onCardChange( id, value ); onCardChange(id, value);
return(value); return (value);
}, { }, {
type : 'textarea', type: 'textarea',
submit : 'OK', submit: 'OK',
style : 'inherit', style: 'inherit',
cssclass : 'card-edit-form', cssclass: 'card-edit-form',
placeholder : 'Double Click to Edit.', placeholder: 'Double Click to Edit.',
onblur: 'submit', onblur: 'submit',
event: 'dblclick', //event: 'mouseover' event: 'dblclick', //event: 'mouseover'
}); });
//add applicable sticker //add applicable sticker
if (sticker !== null) if (sticker !== null)
addSticker( id, sticker ); addSticker(id, sticker);
} }
function onCardChange( id, text ) function onCardChange(id, text) {
{ sendAction('editCard', {
sendAction('editCard', { id: id, value: text }); id: id,
value: text
});
} }
function moveCard(card, position) { function moveCard(card, position) {
card.animate({ card.animate({
left: position.left+"px", left: position.left + "px",
top: position.top+"px" top: position.top + "px"
}, 500); }, 500);
} }
function addSticker ( cardId , stickerId ) function addSticker(cardId, stickerId) {
{
stickerContainer = $('#' + cardId + ' .filler'); stickerContainer = $('#' + cardId + ' .filler');
if (stickerId === "nosticker") if (stickerId === "nosticker") {
{
stickerContainer.html(""); stickerContainer.html("");
return; return;
} }
if ( Array.isArray( stickerId ) ) if (Array.isArray(stickerId)) {
{ for (var i in stickerId) {
for (var i in stickerId) stickerContainer.prepend('<img src="images/stickers/' + stickerId[i] +
{ '.png">');
stickerContainer.prepend('<img src="images/stickers/' + stickerId[i] + '.png">');
} }
} } else {
else if (stickerContainer.html().indexOf(stickerId) < 0)
{ stickerContainer.prepend('<img src="images/stickers/' + stickerId +
if ( stickerContainer.html().indexOf(stickerId) < 0 ) '.png">');
stickerContainer.prepend('<img src="images/stickers/' + stickerId + '.png">');
} }
} }
@ -342,8 +341,7 @@ function addSticker ( cardId , stickerId )
//---------------------------------- //----------------------------------
// cards // cards
//---------------------------------- //----------------------------------
function createCard( id, text, x, y, rot, colour ) function createCard(id, text, x, y, rot, colour) {
{
drawNewCard(id, text, x, y, rot, colour, null); drawNewCard(id, text, x, y, rot, colour, null);
var action = "createCard"; var action = "createCard";
@ -361,8 +359,7 @@ function createCard( id, text, x, y, rot, colour )
} }
function randomCardColour() function randomCardColour() {
{
var colours = ['yellow', 'green', 'blue', 'white']; var colours = ['yellow', 'green', 'blue', 'white'];
var i = Math.floor(Math.random() * colours.length); var i = Math.floor(Math.random() * colours.length);
@ -371,15 +368,13 @@ function randomCardColour()
} }
function initCards( cardArray ) function initCards(cardArray) {
{
//first delete any cards that exist //first delete any cards that exist
$('.card').remove(); $('.card').remove();
cards = cardArray; cards = cardArray;
for (var i in cardArray) for (var i in cardArray) {
{
card = cardArray[i]; card = cardArray[i];
drawNewCard( drawNewCard(
@ -402,24 +397,24 @@ function initCards( cardArray )
// cols // cols
//---------------------------------- //----------------------------------
function drawNewColumn (columnName) function drawNewColumn(columnName) {
{
var cls = "col"; var cls = "col";
if (totalcolumns === 0) if (totalcolumns === 0) {
{
cls = "col first"; cls = "col first";
} }
$('#icon-col').before('<td class="' + cls + '" width="10%" style="display:none"><h2 id="col-' + (totalcolumns+1) + '" class="editable">' + columnName + '</h2></td>'); $('#icon-col').before('<td class="' + cls +
'" width="10%" style="display:none"><h2 id="col-' + (totalcolumns + 1) +
'" class="editable">' + columnName + '</h2></td>');
$('.editable').editable(function(value, settings) { $('.editable').editable(function(value, settings) {
onColumnChange( this.id, value ); onColumnChange(this.id, value);
return(value); return (value);
}, { }, {
style : 'inherit', style: 'inherit',
cssclass : 'card-edit-form', cssclass: 'card-edit-form',
type : 'textarea', type: 'textarea',
placeholder : 'New', placeholder: 'New',
onblur: 'submit', onblur: 'submit',
width: '', width: '',
height: '', height: '',
@ -429,11 +424,10 @@ function drawNewColumn (columnName)
$('.col:last').fadeIn(1500); $('.col:last').fadeIn(1500);
totalcolumns ++; totalcolumns++;
} }
function onColumnChange( id, text ) function onColumnChange(id, text) {
{
var names = Array(); var names = Array();
//console.log(id + " " + text ); //console.log(id + " " + text );
@ -444,13 +438,10 @@ function onColumnChange( id, text )
//get ID of current column we are traversing over //get ID of current column we are traversing over
var thisID = $(this).children("h2").attr('id'); var thisID = $(this).children("h2").attr('id');
if (id == thisID) if (id == thisID) {
{ names.push(text);
names.push( text ); } else {
} names.push($(this).text());
else
{
names.push( $(this).text() );
} }
}); });
@ -458,24 +449,22 @@ function onColumnChange( id, text )
updateColumns(names); updateColumns(names);
} }
function displayRemoveColumn() function displayRemoveColumn() {
{
if (totalcolumns <= 0) return false; if (totalcolumns <= 0) return false;
$('.col:last').fadeOut( 150, $('.col:last').fadeOut(150,
function() { function() {
$(this).remove(); $(this).remove();
} }
); );
totalcolumns --; totalcolumns--;
} }
function createColumn( name ) function createColumn(name) {
{
if (totalcolumns >= 8) return false; if (totalcolumns >= 8) return false;
drawNewColumn( name ); drawNewColumn(name);
columns.push(name); columns.push(name);
var action = "updateColumns"; var action = "updateColumns";
@ -485,8 +474,7 @@ function createColumn( name )
sendAction(action, data); sendAction(action, data);
} }
function deleteColumn() function deleteColumn() {
{
if (totalcolumns <= 0) return false; if (totalcolumns <= 0) return false;
displayRemoveColumn(); displayRemoveColumn();
@ -499,8 +487,7 @@ function deleteColumn()
sendAction(action, data); sendAction(action, data);
} }
function updateColumns( c ) function updateColumns(c) {
{
columns = c; columns = c;
var action = "updateColumns"; var action = "updateColumns";
@ -510,21 +497,18 @@ function updateColumns( c )
sendAction(action, data); sendAction(action, data);
} }
function deleteColumns( next ) function deleteColumns(next) {
{
//delete all existing columns: //delete all existing columns:
$('.col').fadeOut( 'slow', next() ); $('.col').fadeOut('slow', next());
} }
function initColumns( columnArray ) function initColumns(columnArray) {
{
totalcolumns = 0; totalcolumns = 0;
columns = columnArray; columns = columnArray;
$('.col').remove(); $('.col').remove();
for (var i in columnArray) for (var i in columnArray) {
{
column = columnArray[i]; column = columnArray[i];
drawNewColumn( drawNewColumn(
@ -534,8 +518,7 @@ function initColumns( columnArray )
} }
function changeThemeTo( theme ) function changeThemeTo(theme) {
{
currentTheme = theme; currentTheme = theme;
$("link[title=cardsize]").attr("href", "/css/" + theme + ".css"); $("link[title=cardsize]").attr("href", "/css/" + theme + ".css");
} }
@ -547,60 +530,52 @@ function changeThemeTo( theme )
function setCookie(c_name,value,exdays) function setCookie(c_name, value, exdays) {
{ var exdate = new Date();
var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays); exdate.setDate(exdate.getDate() + exdays);
var c_value=escape(value) + ((exdays===null) ? "" : "; expires="+exdate.toUTCString()); var c_value = escape(value) + ((exdays === null) ? "" : "; expires=" +
document.cookie=c_name + "=" + c_value; exdate.toUTCString());
document.cookie = c_name + "=" + c_value;
} }
function getCookie(c_name) function getCookie(c_name) {
{ var i, x, y, ARRcookies = document.cookie.split(";");
var i,x,y,ARRcookies=document.cookie.split(";"); for (i = 0; i < ARRcookies.length; i++) {
for (i=0;i<ARRcookies.length;i++) x = ARRcookies[i].substr(0, ARRcookies[i].indexOf("="));
{ y = ARRcookies[i].substr(ARRcookies[i].indexOf("=") + 1);
x=ARRcookies[i].substr(0,ARRcookies[i].indexOf("=")); x = x.replace(/^\s+|\s+$/g, "");
y=ARRcookies[i].substr(ARRcookies[i].indexOf("=")+1); if (x == c_name) {
x=x.replace(/^\s+|\s+$/g,"");
if (x==c_name)
{
return unescape(y); return unescape(y);
} }
} }
} }
function setName( name ) function setName(name) {
{ sendAction('setUserName', name);
sendAction( 'setUserName', name );
setCookie('scrumscrum-username', name, 365); setCookie('scrumscrum-username', name, 365);
} }
function displayInitialUsers (users) function displayInitialUsers(users) {
{ for (var i in users) {
for (var i in users)
{
//console.log(users); //console.log(users);
displayUserJoined(users[i].sid, users[i].user_name); displayUserJoined(users[i].sid, users[i].user_name);
} }
} }
function displayUserJoined ( sid, user_name ) function displayUserJoined(sid, user_name) {
{
name = ''; name = '';
if (user_name) if (user_name)
name = user_name; name = user_name;
else else
name = sid.substring(0,5); name = sid.substring(0, 5);
$('#names-ul').append('<li id="user-' + sid + '">' + name + '</li>'); $('#names-ul').append('<li id="user-' + sid + '">' + name + '</li>');
} }
function displayUserLeft ( sid ) function displayUserLeft(sid) {
{
name = ''; name = '';
if (name) if (name)
name = user_name; name = user_name;
@ -609,34 +584,32 @@ function displayUserLeft ( sid )
var id = '#user-' + sid.toString(); var id = '#user-' + sid.toString();
$('#names-ul').children(id).fadeOut( 1000 , function() { $('#names-ul').children(id).fadeOut(1000, function() {
$(this).remove(); $(this).remove();
}); });
} }
function updateName ( sid, name ) function updateName(sid, name) {
{
var id = '#user-' + sid.toString(); var id = '#user-' + sid.toString();
$('#names-ul').children(id).text( name ); $('#names-ul').children(id).text(name);
} }
////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////
////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////
function boardResizeHappened(event, ui) function boardResizeHappened(event, ui) {
{
var newsize = ui.size; var newsize = ui.size;
sendAction( 'setBoardSize', newsize); sendAction('setBoardSize', newsize);
} }
function resizeBoard (size) { function resizeBoard(size) {
$( ".board-outline" ).animate( { $(".board-outline").animate({
height: size.height, height: size.height,
width: size.width width: size.width
} ); });
} }
////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////
////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////
@ -647,10 +620,11 @@ function calcCardOffset() {
var card = $(this); var card = $(this);
$(".col").each(function(i) { $(".col").each(function(i) {
var col = $(this); var col = $(this);
if(col.offset().left + col.outerWidth() > card.offset().left + card.outerWidth() || i === $(".col").size() - 1) { if (col.offset().left + col.outerWidth() > card.offset().left +
card.outerWidth() || i === $(".col").size() - 1) {
offsets[card.attr('id')] = { offsets[card.attr('id')] = {
col: col, col: col,
x: ( (card.offset().left - col.offset().left) / col.outerWidth() ) x: ((card.offset().left - col.offset().left) / col.outerWidth())
}; };
return false; return false;
} }
@ -707,30 +681,26 @@ $(function() {
//setTimeout($.unblockUI, 2000); //setTimeout($.unblockUI, 2000);
$( "#create-card" ) $("#create-card")
.click(function() { .click(function() {
var rotation = Math.random() * 10 - 5; //add a bit of random rotation (+/- 10deg) var rotation = Math.random() * 10 - 5; //add a bit of random rotation (+/- 10deg)
uniqueID = Math.round(Math.random()*99999999); //is this big enough to assure uniqueness? uniqueID = Math.round(Math.random() * 99999999); //is this big enough to assure uniqueness?
//alert(uniqueID); //alert(uniqueID);
createCard( createCard(
'card' + uniqueID, 'card' + uniqueID,
'', '',
58, $('div.board-outline').height(),// hack - not a great way to get the new card coordinates, but most consistant ATM 58, $('div.board-outline').height(), // hack - not a great way to get the new card coordinates, but most consistant ATM
rotation, rotation,
randomCardColour()); randomCardColour());
}); });
// Style changer // Style changer
$("#smallify").click(function(){ $("#smallify").click(function() {
if (currentTheme == "bigcards") if (currentTheme == "bigcards") {
{
changeThemeTo('smallcards'); changeThemeTo('smallcards');
} } else if (currentTheme == "smallcards") {
else if (currentTheme == "smallcards")
{
changeThemeTo('bigcards'); changeThemeTo('bigcards');
} }
/*else if (currentTheme == "nocards") /*else if (currentTheme == "nocards")
@ -757,14 +727,14 @@ $(function() {
); );
$('#add-col').click( $('#add-col').click(
function(){ function() {
createColumn('New'); createColumn('New');
return false; return false;
} }
); );
$('#delete-col').click( $('#delete-col').click(
function(){ function() {
deleteColumn(); deleteColumn();
return false; return false;
} }
@ -785,10 +755,8 @@ $(function() {
$("#yourname-input").focus(function() $("#yourname-input").focus(function() {
{ if ($(this).val() == 'unknown') {
if ($(this).val() == 'unknown')
{
$(this).val(""); $(this).val("");
} }
@ -796,10 +764,8 @@ $(function() {
}); });
$("#yourname-input").blur(function() $("#yourname-input").blur(function() {
{ if ($(this).val() === "") {
if ($(this).val() === "")
{
$(this).val('unknown'); $(this).val('unknown');
} }
$(this).removeClass('focused'); $(this).removeClass('focused');
@ -812,33 +778,31 @@ $(function() {
$("#yourname-li").hide(); $("#yourname-li").hide();
$("#yourname-input").keypress(function(e) $("#yourname-input").keypress(function(e) {
{ code = (e.keyCode ? e.keyCode : e.which);
code= (e.keyCode ? e.keyCode : e.which); if (code == 10 || code == 13) {
if (code == 10 || code == 13)
{
$(this).blur(); $(this).blur();
} }
}); });
$( ".sticker" ).draggable({ $(".sticker").draggable({
revert: true, revert: true,
zIndex: 1000 zIndex: 1000
}); });
$( ".board-outline" ).resizable( { $(".board-outline").resizable({
ghost: false, ghost: false,
minWidth: 700, minWidth: 700,
minHeight: 400 , minHeight: 400,
maxWidth: 3200, maxWidth: 3200,
maxHeight: 1800, maxHeight: 1800,
} ); });
//A new scope for precalculating //A new scope for precalculating
(function() { (function() {
var offsets; var offsets;
$(".board-outline").bind("resizestart", function() { $(".board-outline").bind("resizestart", function() {
@ -851,26 +815,22 @@ $( ".board-outline" ).resizable( {
boardResizeHappened(event, ui); boardResizeHappened(event, ui);
adjustCard(offsets, true); adjustCard(offsets, true);
}); });
})(); })();
$('#marker').draggable( $('#marker').draggable({
{
axis: 'x', axis: 'x',
containment: 'parent' containment: 'parent'
} });
);
$('#eraser').draggable( $('#eraser').draggable({
{
axis: 'x', axis: 'x',
containment: 'parent' containment: 'parent'
} });
);
//disable image dragging //disable image dragging
//window.ondragstart = function() { return false; }; //window.ondragstart = function() { return false; };
}); });