Commit 5a6b7e46 authored by Nezael's avatar Nezael
Browse files

Merge branch 'paperboard' into 165-supprimer-un-objet

parents 412f7bfc e06832b5
<button class="pull-right"
ng-click="leaveBoard()"
ui-sref="project.workshops.overview">{{::_labels.disconnectWorkshopBtn}}
</button>
<div class="clearfix group-overview">
<div class="group-overview-title">
<h4 style="text-align: center"><span ng-bind="::_labels.workshops"></span></h4>
......@@ -7,11 +13,11 @@
<canvas id="drawZone" width="500" height="500" style="border: thin solid black; margin: 0 auto"></canvas>
<div id="commands">
<input type="color" name="personnalized-color" id="personnalized-color">
<button>Black</button>
<button>Blue</button>
<button>Red</button>
<button ng-click="paperBoardCtrl.blackPaint()">Black</button>
<button ng-click="paperBoardCtrl.bluePaint()">Blue</button>
<button ng-click="paperBoardCtrl.redPaint()">Red</button>
<button>Cursor</button>
<button>Pen</button>
<button ng-click="paperBoardCtrl.penMode()">Pen</button>
<button>Circle</button>
<button>Square</button>
<button>Add Post-It</button>
......@@ -21,4 +27,4 @@
</label>
</div>
</div>
</div>
\ No newline at end of file
</div>
/*
/*
* To change this license header, choose License Headers in Project Properties.
* To change this template file, choose Tools | Templates
* and open the template in the editor.
......@@ -7,30 +7,125 @@
/* Controllers */
root.controller('DetailsPaperBoardCtrl', ['$scope', '$stateParams', '$http', '$state', '$paperboardFactory', '$languageFactory', '$utilsFactory', function ($scope, $stateParams, $http, $state, $paperboardFactory, $languageFactory, $utilsFactory) {
var detailsPaperBoardCtrl = this;
root.controller('PaperBoardCtrl', ['$scope', '$stateParams', '$http', '$state', '$paperboardFactory', '$languageFactory', '$utilsFactory', function ($scope, $stateParams, $http, $state, $paperboardFactory, $languageFactory, $utilsFactory) {
let paperBoardCtrl = this;
detailsPaperBoardCtrl.getPaperBoardDetails = function (paperBoardDetails) {
let canvas = document.querySelector('#drawZone');
let ctx = canvas.getContext("2d");
let rect;
let mouseX = 0;
let mouseY = 0;
let lineWidth = 3;
let isDrawing = false;
let style = "#000";
let pen = false;
paperBoardCtrl.getPaperBoardDetails = function (paperBoardDetails) {
if (!paperBoardDetails) var paperBoardDetails = {"id": $stateParams.elementId};
$scope._showAlert({status: 2, message: $languageFactory._labels.alerts_loadingpaperBoardDetails});
$paperboardFactory.getPaperBoardDetails($scope._getProject(), paperBoardDetails.id, function (data)
$paperboardFactory.getPaperBoardDetails($scope._getProject(), paperBoardDetails.id, function (data)
{
if (data.status == "success")
if (data.status == "success")
{
var paperboard = data.details[0];
detailsPaperBoardCtrl.paperboard = JSON.parse(paperboard.params);
detailsPaperBoardCtrl.paperboard.id = paperboard.id;
detailsPaperBoardCtrl.paperboard.type = 1;
let paperboard = data.details[0];
paperBoardCtrl.paperboard = JSON.parse(paperboard.params);
paperBoardCtrl.paperboard.id = paperboard.id;
paperBoardCtrl.paperboard.type = 1;
$scope._showAlert({status: 1, message: $languageFactory._labels.alerts_loadingpaperBoardDetailsSuccess});
}
else
}
else
{
$scope._showAlert({status: 3, message: $languageFactory._labels.alerts_loadingpaperBoardDetailsFailure});
}
});
}
detailsPaperBoardCtrl.getPaperBoardDetails();
paperBoardCtrl.lineDraw = function (ctx, x1, y1, x2, y2, styleColor, lineWidth)
{
ctx.beginPath();
ctx.moveTo(x1, y1);
ctx.lineTo(x2, y2);
ctx.lineCap = ctx.lineJoin = 'round';
ctx.strokeStyle = styleColor;
ctx.shadowColor = styleColor;
ctx.lineWidth = lineWidth;
ctx.stroke();
ctx.closePath();
}
paperBoardCtrl.penMode = function ()
{
pen = true;
}
$scope.leaveBoard = function(){
alert("Vous venez de quitter l'atelier");
}
paperBoardCtrl.getPaperBoardDetails();
document.querySelector('#lineWidth').addEventListener('change', e =>
{
lineWidth = document.querySelector('#lineWidth').value;
});
canvas.addEventListener('mousedown', e=>
{
rect = canvas.getBoundingClientRect();
mouseX = e.clientX - rect.left;
mouseY = e.clientY - rect.top;
console.log("position souris X: " + e.clientX + "position canvas X: " + rect.left);
console.log("position souris Y: " + e.clientY + "position canvas Y: " + rect.top)
console.log("X: " + mouseX + " : Y: " + mouseY);
isDrawing = true;
});
canvas.addEventListener('mousemove', e=>
{
if(isDrawing)
{
if(pen)
{
console.log("après dessin X: " + mouseX + " : Y: " + mouseY);
paperBoardCtrl.lineDraw(ctx,mouseX,mouseY,e.clientX - rect.left, e.clientY - rect.top, style, lineWidth);
mouseX = e.clientX - rect.left;
mouseY = e.clientY - rect.top;
}
}
});
canvas.addEventListener('mouseup', e =>
{
isDrawing = false;
});
document.querySelector('#personnalized-color').addEventListener('change', e =>
{
style = document.querySelector('#personnalized-color').value;
})
paperBoardCtrl.blackPaint = function ()
{
style = "#000";
document.querySelector('#personnalized-color').value = "#000";
}
paperBoardCtrl.bluePaint = function ()
{
style = "#0000FF";
document.querySelector('#personnalized-color').value = "#0000FF";
}
paperBoardCtrl.redPaint = function ()
{
style = "#FF0000";
document.querySelector('#personnalized-color').value = "#FF0000";
}
}]);
}]);
\ No newline at end of file
......@@ -434,8 +434,8 @@ angular.module('myApp', [
$stateProvider.state('project.workshops.paperboard', {
url: '/:elementId',
templateUrl: __root + 'components/projects/workshops/paperboard.html',
controller: 'DetailsPaperBoardCtrl',
controllerAs: "detailsPaperBoardCtrl",
controller: 'PaperBoardCtrl',
controllerAs: "paperBoardCtrl",
params: {
section: {
elementId: true,
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment