|
|
@@ -3,6 +3,65 @@ app.controller('uploadCtrl', function ($scope, $http,video,notify) {
|
|
|
$scope.texto1="";
|
|
|
$scope.texto2="";
|
|
|
$scope.video = video;
|
|
|
+ $scope.diapos = [];
|
|
|
+ var canvas = document.getElementById('c');
|
|
|
+ var container = canvas.parentNode;
|
|
|
+ var ctx = canvas.getContext('2d');
|
|
|
+ var dpr = window.devicePixelRatio || 1;
|
|
|
+ var img = new Image();
|
|
|
+ var diapos = [];
|
|
|
+
|
|
|
+ img.src="https://curso.especificosba.com.ar/diapo/EBA/1.png"; //Cargo la imagen inicial, a espera de informacion
|
|
|
+ img.onload=function(){ //Cuando una imagen carga en mi obj imagen, quiero que se dibuje en canvas
|
|
|
+ ctx.drawImage(img,0,0,canvas.width, canvas.height);
|
|
|
+ }
|
|
|
+ $scope.updateDiapos = function(d) {
|
|
|
+ diapos = JSON.parse(d);
|
|
|
+ parseMessage(diapos[0]);
|
|
|
+ }
|
|
|
+ function respondCanvas(){
|
|
|
+ canvas.setAttribute('width', container.offsetWidth);
|
|
|
+ canvas.setAttribute('height', container.offsetWidth/4*3);
|
|
|
+ }
|
|
|
+
|
|
|
+ respondCanvas();
|
|
|
+
|
|
|
+ if (!String.prototype.format) {
|
|
|
+ String.prototype.format = function() {
|
|
|
+ var args = arguments;
|
|
|
+ return this.replace(/{(\d+)}/g, function(match, number) {
|
|
|
+ return
|
|
|
+ ( typeof args[number] != 'undefined' ? args[number] : match );
|
|
|
+ });
|
|
|
+ };
|
|
|
+ }
|
|
|
+
|
|
|
+ function parseMessage(msg){
|
|
|
+ if (msg==undefined)
|
|
|
+ return;
|
|
|
+ switch(msg.type){
|
|
|
+ case "draw":
|
|
|
+ drawOnCanvas(msg.points,msg.color);
|
|
|
+ break;
|
|
|
+ case "clean":
|
|
|
+ ctx.drawImage(img,0,0,canvas.width, canvas.height);
|
|
|
+ break;
|
|
|
+ case "diapo":
|
|
|
+ img.src="https://curso.especificosba.com.ar/diapo/{0}/{1}.png".format(msg.PDF,msg.slide);
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ function drawOnCanvas(points,color) {
|
|
|
+ if(points.length==0) return;
|
|
|
+ ctx.strokeStyle = color;
|
|
|
+ ctx.beginPath();
|
|
|
+ ctx.moveTo(points[0].x, points[0].y);
|
|
|
+
|
|
|
+ for(var i=1; i<points.length; i++) {
|
|
|
+ ctx.lineTo(points[i].x, points[i].y);
|
|
|
+ }
|
|
|
+ ctx.stroke();
|
|
|
+ }
|
|
|
|
|
|
$scope.post = function() {
|
|
|
var data = {
|
