1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
|
describe('viewMode (option)', () => {
it('should not have any restrictions by default', (done) => {
const image = window.createImage();
const cropper = new Cropper(image, {
ready() {
const canvasData = {
left: 100,
top: 100,
width: 160,
height: 90,
};
const changedCanvasData = cropper.setCanvasData(canvasData).getCanvasData();
expect(changedCanvasData.left).to.equal(canvasData.left);
expect(changedCanvasData.top).to.equal(canvasData.top);
expect(changedCanvasData.width).to.equal(canvasData.width);
expect(changedCanvasData.height).to.equal(canvasData.height);
done();
},
});
expect(cropper.options.viewMode).to.equal(0);
});
it('should restrict the crop box to not exceed the size of the canvas', (done) => {
const image = window.createImage();
const cropper = new Cropper(image, {
viewMode: 1,
ready() {
let canvasData = cropper.zoom(-0.5).getCanvasData();
let cropBoxData = cropper.getCropBoxData();
expect(canvasData.width).to.be.least(cropBoxData.width);
expect(canvasData.height).to.be.least(cropBoxData.height);
canvasData = cropper.clear().moveTo(-160, -90).getCanvasData();
cropBoxData = cropper.crop().setCropBoxData({
width: canvasData.naturalWidth,
height: canvasData.naturalHeight,
}).getCropBoxData();
expect(canvasData.width).to.be.above(cropBoxData.width);
expect(canvasData.height).to.be.above(cropBoxData.height);
done();
},
});
expect(cropper.options.viewMode).to.equal(1);
});
it('should restrict the minimum canvas size to fit within the container.', (done) => {
const image = window.createImage();
const cropper = new Cropper(image, {
viewMode: 2,
ready() {
const canvasData = cropper.zoom(-0.5).getCanvasData();
const containerData = cropper.getContainerData();
expect(canvasData.width >= containerData.width
|| canvasData.height >= containerData.height).to.be.true;
done();
},
});
expect(cropper.options.viewMode).to.equal(2);
});
it('should restrict the minimum canvas size to full fit the container.', (done) => {
const image = window.createImage();
const cropper = new Cropper(image, {
viewMode: 3,
ready() {
const canvasData = cropper.zoom(-0.5).getCanvasData();
const containerData = cropper.getContainerData();
expect(canvasData.left).to.be.most(0);
expect(canvasData.top).to.be.most(0);
expect(canvasData.width).to.be.least(containerData.width);
expect(canvasData.height).to.be.least(containerData.height);
done();
},
});
expect(cropper.options.viewMode).to.equal(3);
});
});
|