fix spelling error and format code
This commit is contained in:
cracker
parent
200391c613
commit
3efb36ac19
|
|
@ -1,11 +1,13 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<title>Whiteboard</title>
|
||||
|
||||
<!--- JS References -!-->
|
||||
<script type="text/javascript" src="./js/jquery-3.2.1.min.js"></script>
|
||||
<script type="text/javascript" src="./js/jquery-ui.min.js"></script> <!--- for dragabbles -!-->
|
||||
<script type="text/javascript" src="./js/jquery-ui.min.js"></script>
|
||||
<!--- for dragabbles -!-->
|
||||
<script type="text/javascript" src="./js/socketio2.0.4.min.js"></script>
|
||||
<script type="text/javascript" src="./js/jqColorPicker.min.js"></script>
|
||||
|
||||
|
|
@ -16,8 +18,9 @@
|
|||
<link rel="stylesheet" href="./css/jquery-ui.min.css">
|
||||
<link href="./css/fontawesome-all.min.css" rel="stylesheet">
|
||||
<link href="./css/main.css" rel="stylesheet">
|
||||
|
||||
|
||||
</head>
|
||||
|
||||
<body style="position: relative; margin: 0px; height: 100vh; width: 100%; overflow: hidden;">
|
||||
<!---Whiteboard container -!-->
|
||||
<div style="height: 100vh; width: 100%;" id="whiteboardContainer"></div>
|
||||
|
|
@ -26,66 +29,68 @@
|
|||
<div style="position: absolute; top: 10px; left: 10px;">
|
||||
<div class="btn-group">
|
||||
<button id="whiteboardTrashBtn" title="Clears the whiteboard" type="button" class="whiteboardBtn">
|
||||
<i class="fa fa-trash"></i>
|
||||
</button>
|
||||
<button id="whiteboardUndoBtn" title="Undo your last step" type="button" class="whiteboardBtn">
|
||||
<i class="fa fa-undo"></i>
|
||||
</button>
|
||||
</div>
|
||||
<i class="fa fa-trash"></i>
|
||||
</button>
|
||||
<button id="whiteboardUndoBtn" title="Undo your last step" type="button" class="whiteboardBtn">
|
||||
<i class="fa fa-undo"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="btn-group">
|
||||
<div class="btn-group">
|
||||
<button tool="mouse" title="Take the mouse" type="button" class="whiteboardTool">
|
||||
<i class="fa fa-mouse-pointer"></i>
|
||||
</button>
|
||||
<button style="padding-bottom: 11px;" tool="recSelect" title="Select an area" type="button" class="whiteboardTool">
|
||||
<img src="./img/dottedRec.png">
|
||||
</button>
|
||||
<button tool="pen" title="Take the pen" type="button" class="whiteboardTool active">
|
||||
<i class="fa fa-pencil-alt"></i>
|
||||
</button>
|
||||
<button style="padding-bottom: 8px; padding-top: 7px;" tool="line" title="draw a line" type="button" class="whiteboardTool">
|
||||
╱
|
||||
</button>
|
||||
<button tool="rect" title="draw a rectangle" type="button" class="whiteboardTool">
|
||||
<i class="far fa-square"></i>
|
||||
</button>
|
||||
<button tool="circle" title="draw a circle" type="button" class="whiteboardTool">
|
||||
<i class="far fa-circle"></i>
|
||||
</button>
|
||||
<button tool="eraser" title="take the eraser" type="button" class="whiteboardTool">
|
||||
<i class="fa fa-eraser" aria-hidden="true"></i>
|
||||
</button>
|
||||
</div>
|
||||
<i class="fa fa-mouse-pointer"></i>
|
||||
</button>
|
||||
<button style="padding-bottom: 11px;" tool="recSelect" title="Select an area" type="button" class="whiteboardTool">
|
||||
<img src="./img/dottedRec.png">
|
||||
</button>
|
||||
<button tool="pen" title="Take the pen" type="button" class="whiteboardTool active">
|
||||
<i class="fa fa-pencil-alt"></i>
|
||||
</button>
|
||||
<button style="padding-bottom: 8px; padding-top: 7px;" tool="line" title="draw a line" type="button" class="whiteboardTool">
|
||||
╱
|
||||
</button>
|
||||
<button tool="rect" title="draw a rectangle" type="button" class="whiteboardTool">
|
||||
<i class="far fa-square"></i>
|
||||
</button>
|
||||
<button tool="circle" title="draw a circle" type="button" class="whiteboardTool">
|
||||
<i class="far fa-circle"></i>
|
||||
</button>
|
||||
<button tool="eraser" title="take the eraser" type="button" class="whiteboardTool">
|
||||
<i class="fa fa-eraser" aria-hidden="true"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div style="width: 190px; height: 44px; border: 1px solid green;" class="btn-group">
|
||||
<img style="position: absolute; left: 11px; top: 16px; height:14px; width:130px;" src="./img/slider-background.svg">
|
||||
<input title="Thickness" id="whiteboardThicknessSlider" style="position: absolute; left:9px; width: 130px; top: 15px;" type="range" min="1" max="50" value="3">
|
||||
<div title="Colorpicker" style="position: absolute; left: 155px; top: 10px; width: 26px; height: 23px; border-radius: 3px; overflow: hidden; border: 1px solid darkgrey;">
|
||||
<div id="whiteboardColorpicker" value="#000000" style="width: 40px; height: 35px; border: 0px; padding: 0px; position: relative; top: 0px; left: -5px;"></div>
|
||||
</div>
|
||||
<input title="Thickness" id="whiteboardThicknessSlider" style="position: absolute; left:9px; width: 130px; top: 15px;" type="range"
|
||||
min="1" max="50" value="3">
|
||||
<div title="Colorpicker" style="position: absolute; left: 155px; top: 10px; width: 26px; height: 23px; border-radius: 3px; overflow: hidden; border: 1px solid darkgrey;">
|
||||
<div id="whiteboardColorpicker" value="#000000" style="width: 40px; height: 35px; border: 0px; padding: 0px; position: relative; top: 0px; left: -5px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="btn-group">
|
||||
<button id="saveAsImageBtn" title="Save whiteboard as image" type="button" class="whiteboardBtn">
|
||||
<i class="fas fa-image"></i>
|
||||
<i style="position: absolute; top: 3px; left: 2px; color: #000000; background: grey; font-size: 0.5em; " class="fas fa-save"></i>
|
||||
</button>
|
||||
<button style="position: relative;" id="saveAsJSONBtn" title="Save whiteboard as JSON" type="button" class="whiteboardBtn">
|
||||
<i class="far fa-file-alt"></i>
|
||||
<i style="position: absolute; top: 3px; left: 2px; color: #000000; background: grey; font-size: 0.5em; " class="fas fa-save"></i>
|
||||
</button>
|
||||
<button id="saveAsImageBtn" title="Save whiteboard as image" type="button" class="whiteboardBtn">
|
||||
<i class="fas fa-image"></i>
|
||||
<i style="position: absolute; top: 3px; left: 2px; color: #000000; background: grey; font-size: 0.5em; " class="fas fa-save"></i>
|
||||
</button>
|
||||
<button style="position: relative;" id="saveAsJSONBtn" title="Save whiteboard as JSON" type="button" class="whiteboardBtn">
|
||||
<i class="far fa-file-alt"></i>
|
||||
<i style="position: absolute; top: 3px; left: 2px; color: #000000; background: grey; font-size: 0.5em; " class="fas fa-save"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="btn-group">
|
||||
<button id="addImgToCanvasBtn" title="Upload Image to whiteboard" type="button" class="whiteboardBtn">
|
||||
<i class="fas fa-image"></i>
|
||||
<i style="position: absolute; top: 3px; left: 2px; color: #000000; font-size: 0.5em; " class="fas fa-upload"></i>
|
||||
</button>
|
||||
<button style="position: relative;" id="uploadJsonBtn" title="Load saved JSON to whiteboard" type="button" class="whiteboardBtn">
|
||||
<i class="far fa-file-alt"></i>
|
||||
<i style="position: absolute; top: 3px; left: 2px; color: #000000; font-size: 0.5em; " class="fas fa-upload"></i>
|
||||
</button>
|
||||
<input style="display:none;" id="myFile" type="file"/>
|
||||
<button id="addImgToCanvasBtn" title="Upload Image to whiteboard" type="button" class="whiteboardBtn">
|
||||
<i class="fas fa-image"></i>
|
||||
<i style="position: absolute; top: 3px; left: 2px; color: #000000; font-size: 0.5em; " class="fas fa-upload"></i>
|
||||
</button>
|
||||
<button style="position: relative;" id="uploadJsonBtn" title="Load saved JSON to whiteboard" type="button" class="whiteboardBtn">
|
||||
<i class="far fa-file-alt"></i>
|
||||
<i style="position: absolute; top: 3px; left: 2px; color: #000000; font-size: 0.5em; " class="fas fa-upload"></i>
|
||||
</button>
|
||||
<input style="display:none;" id="myFile" type="file" />
|
||||
</div>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
@ -1,23 +1,23 @@
|
|||
var whiteboardId = getQueryVariable("whiteboardid");
|
||||
whiteboardId = whiteboardId || "myNewWhiteboard";
|
||||
var myUsername = getQueryVariable("username");
|
||||
myUsername = myUsername || "unkonwn"+(Math.random()+"").substring(2,6);
|
||||
myUsername = myUsername || "unknown" + (Math.random() + "").substring(2, 6);
|
||||
|
||||
var url = document.URL.substr(0,document.URL.lastIndexOf('/'));
|
||||
var url = document.URL.substr(0, document.URL.lastIndexOf('/'));
|
||||
var signaling_socket = null;
|
||||
var urlSplit = url.split("/");
|
||||
var subdir = "";
|
||||
for(var i=3;i<urlSplit.length;i++) {
|
||||
subdir = subdir+'/'+urlSplit[i];
|
||||
for (var i = 3; i < urlSplit.length; i++) {
|
||||
subdir = subdir + '/' + urlSplit[i];
|
||||
}
|
||||
if(subdir !="") {
|
||||
signaling_socket = io("",{"path":subdir+"/socket.io"}); //Connect even if we are in a subdir behind a reverse proxy
|
||||
if (subdir != "") {
|
||||
signaling_socket = io("", { "path": subdir + "/socket.io" }); //Connect even if we are in a subdir behind a reverse proxy
|
||||
} else {
|
||||
signaling_socket = io();
|
||||
}
|
||||
|
||||
signaling_socket.on('connect', function () {
|
||||
console.log("Websocket connected!");
|
||||
console.log("Websocket connected!");
|
||||
|
||||
signaling_socket.on('drawToWhiteboard', function (content) {
|
||||
whiteboard.handleEventsAndData(content, true);
|
||||
|
|
@ -30,16 +30,16 @@ signaling_socket.on('connect', function () {
|
|||
signaling_socket.emit('joinWhiteboard', whiteboardId);
|
||||
});
|
||||
|
||||
$(document).ready(function() {
|
||||
whiteboard.loadWhiteboard("#whiteboardContainer", { //Load the whiteboard
|
||||
whiteboardId : whiteboardId,
|
||||
username : myUsername,
|
||||
sendFunction : function(content) {
|
||||
signaling_socket.emit('drawToWhiteboard', content);
|
||||
$(document).ready(function () {
|
||||
whiteboard.loadWhiteboard("#whiteboardContainer", { //Load the whiteboard
|
||||
whiteboardId: whiteboardId,
|
||||
username: myUsername,
|
||||
sendFunction: function (content) {
|
||||
signaling_socket.emit('drawToWhiteboard', content);
|
||||
}
|
||||
});
|
||||
|
||||
$.get( subdir+"/loadwhiteboard", { wid: whiteboardId } ).done(function( data ) {
|
||||
$.get(subdir + "/loadwhiteboard", { wid: whiteboardId }).done(function (data) {
|
||||
whiteboard.loadData(data)
|
||||
});
|
||||
|
||||
|
|
@ -47,181 +47,180 @@ $(document).ready(function() {
|
|||
Whiteboard actions
|
||||
/----------------*/
|
||||
|
||||
$("#whiteboardTrashBtn").click(function() {
|
||||
whiteboard.clearWhiteboard();
|
||||
$("#whiteboardTrashBtn").click(function () {
|
||||
whiteboard.clearWhiteboard();
|
||||
});
|
||||
|
||||
$("#whiteboardUndoBtn").click(function() {
|
||||
whiteboard.undoWhiteboardClick();
|
||||
$("#whiteboardUndoBtn").click(function () {
|
||||
whiteboard.undoWhiteboardClick();
|
||||
});
|
||||
|
||||
$(".whiteboardTool").click(function() {
|
||||
|
||||
$(".whiteboardTool").click(function () {
|
||||
$(".whiteboardTool").removeClass("active");
|
||||
$(this).addClass("active");
|
||||
whiteboard.setTool($(this).attr("tool"));
|
||||
});
|
||||
|
||||
$("#addImgToCanvasBtn").click(function() {
|
||||
alert("Just drag and drop images in!");
|
||||
$("#addImgToCanvasBtn").click(function () {
|
||||
alert("Just drag and drop images in!");
|
||||
});
|
||||
|
||||
$("#saveAsImageBtn").click(function() {
|
||||
var imgData = whiteboard.getImageDataBase64();
|
||||
var a = document.createElement('a');
|
||||
a.href = imgData;
|
||||
a.download = 'whiteboard.png';
|
||||
document.body.appendChild(a);
|
||||
a.click();
|
||||
document.body.removeChild(a);
|
||||
$("#saveAsImageBtn").click(function () {
|
||||
var imgData = whiteboard.getImageDataBase64();
|
||||
var a = document.createElement('a');
|
||||
a.href = imgData;
|
||||
a.download = 'whiteboard.png';
|
||||
document.body.appendChild(a);
|
||||
a.click();
|
||||
document.body.removeChild(a);
|
||||
});
|
||||
|
||||
$("#saveAsJSONBtn").click(function() {
|
||||
var imgData = whiteboard.getImageDataJson();
|
||||
var a = window.document.createElement('a');
|
||||
a.href = window.URL.createObjectURL(new Blob([imgData], {type: 'text/json'}));
|
||||
a.download = 'whiteboard.json';
|
||||
// Append anchor to body.
|
||||
document.body.appendChild(a);
|
||||
a.click();
|
||||
// Remove anchor from body
|
||||
document.body.removeChild(a);
|
||||
});
|
||||
|
||||
$("#uploadJsonBtn").click(function() {
|
||||
$("#myFile").click();
|
||||
$("#saveAsJSONBtn").click(function () {
|
||||
var imgData = whiteboard.getImageDataJson();
|
||||
var a = window.document.createElement('a');
|
||||
a.href = window.URL.createObjectURL(new Blob([imgData], { type: 'text/json' }));
|
||||
a.download = 'whiteboard.json';
|
||||
// Append anchor to body.
|
||||
document.body.appendChild(a);
|
||||
a.click();
|
||||
// Remove anchor from body
|
||||
document.body.removeChild(a);
|
||||
});
|
||||
|
||||
$("#myFile").on("change", function() {
|
||||
var file = document.getElementById("myFile").files[0];
|
||||
var reader = new FileReader();
|
||||
reader.onload = function (e) {
|
||||
try {
|
||||
var j = JSON.parse(e.target.result);
|
||||
whiteboard.loadJsonData(j);
|
||||
} catch(e) {
|
||||
alert("File was not a valid JSON!");
|
||||
}
|
||||
};
|
||||
reader.readAsText(file);
|
||||
$(this).val("");
|
||||
$("#uploadJsonBtn").click(function () {
|
||||
$("#myFile").click();
|
||||
});
|
||||
|
||||
$("#myFile").on("change", function () {
|
||||
var file = document.getElementById("myFile").files[0];
|
||||
var reader = new FileReader();
|
||||
reader.onload = function (e) {
|
||||
try {
|
||||
var j = JSON.parse(e.target.result);
|
||||
whiteboard.loadJsonData(j);
|
||||
} catch (e) {
|
||||
alert("File was not a valid JSON!");
|
||||
}
|
||||
};
|
||||
reader.readAsText(file);
|
||||
$(this).val("");
|
||||
});
|
||||
|
||||
var dragCounter = 0;
|
||||
$('#whiteboardContainer').on("dragenter", function(e) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
$('#whiteboardContainer').on("dragenter", function (e) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
dragCounter++;
|
||||
whiteboard.dropIndicator.show();
|
||||
});
|
||||
|
||||
$('#whiteboardContainer').on("dragleave", function(e) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
dragCounter--;
|
||||
if (dragCounter === 0) {
|
||||
whiteboard.dropIndicator.hide();
|
||||
}
|
||||
});
|
||||
|
||||
$("#whiteboardThicknessSlider").on("change", function() {
|
||||
$('#whiteboardContainer').on("dragleave", function (e) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
dragCounter--;
|
||||
if (dragCounter === 0) {
|
||||
whiteboard.dropIndicator.hide();
|
||||
}
|
||||
});
|
||||
|
||||
$("#whiteboardThicknessSlider").on("change", function () {
|
||||
whiteboard.thickness = $(this).val();
|
||||
});
|
||||
|
||||
$('#whiteboardContainer').on('drop', function(e) { //Handle drag & drop
|
||||
if(e.originalEvent.dataTransfer){
|
||||
if(e.originalEvent.dataTransfer.files.length) { //File from harddisc
|
||||
|
||||
$('#whiteboardContainer').on('drop', function (e) { //Handle drag & drop
|
||||
if (e.originalEvent.dataTransfer) {
|
||||
if (e.originalEvent.dataTransfer.files.length) { //File from harddisc
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
|
||||
var filename = e.originalEvent.dataTransfer.files[0]["name"];
|
||||
if(isImageFileName(filename)) {
|
||||
var blob = e.originalEvent.dataTransfer.files[0];
|
||||
var reader = new window.FileReader();
|
||||
reader.readAsDataURL(blob);
|
||||
reader.onloadend = function() {
|
||||
console.log("Uploading image!");
|
||||
base64data = reader.result;
|
||||
uploadImgAndAddToWhiteboard(base64data);
|
||||
}
|
||||
} else {
|
||||
console.error("File must be an image!");
|
||||
}
|
||||
if (isImageFileName(filename)) {
|
||||
var blob = e.originalEvent.dataTransfer.files[0];
|
||||
var reader = new window.FileReader();
|
||||
reader.readAsDataURL(blob);
|
||||
reader.onloadend = function () {
|
||||
base64data = reader.result;
|
||||
uploadImgAndAddToWhiteboard(base64data);
|
||||
}
|
||||
} else {
|
||||
console.error("File must be an image!");
|
||||
}
|
||||
} else { //File from other browser
|
||||
var fileUrl = e.originalEvent.dataTransfer.getData('URL');
|
||||
var imageUrl = e.originalEvent.dataTransfer.getData('text/html');
|
||||
var rex = /src="?([^"\s]+)"?\s*/;
|
||||
var url = rex.exec(imageUrl);
|
||||
if(url && url.length > 1) {
|
||||
url = url[1];
|
||||
} else {
|
||||
url = "";
|
||||
}
|
||||
var fileUrl = e.originalEvent.dataTransfer.getData('URL');
|
||||
var imageUrl = e.originalEvent.dataTransfer.getData('text/html');
|
||||
var rex = /src="?([^"\s]+)"?\s*/;
|
||||
var url = rex.exec(imageUrl);
|
||||
if (url && url.length > 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!");
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
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();
|
||||
}
|
||||
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);
|
||||
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({
|
||||
var date = (+new Date());
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: document.URL.substr(0,document.URL.lastIndexOf('/'))+'/upload',
|
||||
data: {
|
||||
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
|
||||
'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));
|
||||
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") {
|
||||
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;
|
||||
|
|
@ -244,37 +243,37 @@ function isValidImageUrl(url, callback) { //Check if given url it is a vaild img
|
|||
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);
|
||||
}
|
||||
}
|
||||
}
|
||||
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<vars.length;i++) {
|
||||
var pair = vars[i].split("=");
|
||||
if (pair[0] == variable) {
|
||||
return pair[1];
|
||||
var query = window.location.search.substring(1);
|
||||
var vars = query.split("&");
|
||||
for (var i = 0; i < vars.length; i++) {
|
||||
var pair = vars[i].split("=");
|
||||
if (pair[0] == variable) {
|
||||
return pair[1];
|
||||
}
|
||||
}
|
||||
}
|
||||
return false;
|
||||
return false;
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue