var whiteboardId = getQueryVariable("whiteboardid"); whiteboardId = whiteboardId || "myNewWhiteboard"; var myUsername = getQueryVariable("username"); myUsername = myUsername || "unkonwn"; var url = document.URL.substr(0,document.URL.lastIndexOf('/')); var signaling_socket = null; var urlSplit = url.split("/"); var subdir = ""; for(var i=3;i 1) { url = url[1]; } else { url = ""; } isValidImageUrl(fileUrl, function(isImage) { if(isImage && isImageFileName(url)) { whiteboard.addImgToCanvasByUrl(fileUrl); } else { isValidImageUrl(url, function(isImage) { if(isImage) { if(isImageFileName(url)) { whiteboard.addImgToCanvasByUrl(url); } else { var blob = items[i].getAsFile(); uploadImgAndAddToWhiteboard(url); } } else { console.error("Can only upload imagedata!"); } }); } }); } } dragCounter = 0; whiteboard.dropIndicator.hide(); }); $('#whiteboardColorpicker').colorPicker({ renderCallback : function(elm) { whiteboard.drawcolor = elm.val(); } }); }); //Prevent site from changing tab on drag&drop window.addEventListener("dragover",function(e){ e = e || event; e.preventDefault(); },false); window.addEventListener("drop",function(e){ e = e || event; e.preventDefault(); },false); function uploadImgAndAddToWhiteboard(base64data) { var date = (+new Date()); $.ajax({ type: 'POST', url: document.URL.substr(0,document.URL.lastIndexOf('/'))+'/upload', data: { 'imagedata': base64data, 'whiteboardId' : whiteboardId, 'date' : date }, success: function(msg){ var filename = whiteboardId+"_"+date+".png"; whiteboard.addImgToCanvasByUrl(document.URL.substr(0,document.URL.lastIndexOf('/'))+"/uploads/"+filename); //Add image to canvas console.log("Image uploaded!"); }, error : function(err) { console.error("Failed to upload frame: "+JSON.stringify(err)); } }); } function isImageFileName(filename) { var ending = filename.split(".")[filename.split(".").length-1]; if(ending.toLowerCase()=="png" || ending.toLowerCase()=="jpg" || ending.toLowerCase()=="jpeg" || ending.toLowerCase()=="gif" || ending.toLowerCase()=="tiff") { return true; } return false; } function isValidImageUrl(url, callback) { //Check if given url it is a vaild img url var img = new Image(); var timer = null; img.onerror = img.onabort = function () { clearTimeout(timer); callback(false); }; img.onload = function () { clearTimeout(timer); callback(true); }; timer = setTimeout(function () { callback(false); }, 2000); img.src = url; } window.addEventListener("paste", function(e) { //Even do copy & paste from clipboard if (e.clipboardData) { var items = e.clipboardData.items; if (items) { // Loop through all items, looking for any kind of image for (var i = 0; i < items.length; i++) { if (items[i].type.indexOf("image") !== -1) { // We need to represent the image as a file, var blob = items[i].getAsFile(); var reader = new window.FileReader(); reader.readAsDataURL(blob); reader.onloadend = function() { console.log("Uploading image!"); base64data = reader.result; uploadImgAndAddToWhiteboard(base64data); } } } } } }); function getQueryVariable(variable) { var query = window.location.search.substring(1); var vars = query.split("&"); for (var i=0;i