File size: 4,736 Bytes
0d6ddfa
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
48bd371
 
0d6ddfa
 
 
 
48bd371
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
0d6ddfa
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
48bd371
 
 
 
0d6ddfa
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
48bd371
0d6ddfa
 
 
 
 
 
 
 
 
 
 
 
 
 
 
48bd371
 
 
0d6ddfa
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
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
$(document).ready(function() {
    /* Video Lightbox */
    if (!!$.prototype.simpleLightboxVideo) {
        $('.video').simpleLightboxVideo();
    }

    /*ScrollUp*/
    if (!!$.prototype.scrollUp) {
        $.scrollUp();
    }

    /*Responsive Navigation*/
    $("#nav-mobile").html($("#nav-main").html());
    $("#nav-trigger span").on("click", function() {
        if ($("nav#nav-mobile ul").hasClass("expanded")) {
            $("nav#nav-mobile ul.expanded").removeClass("expanded").slideUp(250);
            $(this).removeClass("open");
        } else {
            $("nav#nav-mobile ul").addClass("expanded").slideDown(250);
            $(this).addClass("open");
        }
    });

    $("#nav-mobile").html($("#nav-main").html());
    $("#nav-mobile ul a").on("click", function() {
        if ($("nav#nav-mobile ul").hasClass("expanded")) {
            $("nav#nav-mobile ul.expanded").removeClass("expanded").slideUp(250);
            $("#nav-trigger span").removeClass("open");
        }
    });

    /* Sticky Navigation */
    if (!!$.prototype.stickyNavbar) {
        $('#header').stickyNavbar();
    }

    $('#content').waypoint(function(direction) {
        if (direction === 'down') {
            $('#header').addClass('nav-solid fadeInDown');
        } else {
            $('#header').removeClass('nav-solid fadeInDown');
        }
    });

});


/* Preloader and animations */
$(window).load(function() { // makes sure the whole site is loaded
    $('#status').fadeOut(); // will first fade out the loading animation
    $('#preloader').delay(350).fadeOut('slow'); // will fade out the white DIV that covers the website.
    $('body').delay(450).css({ 'overflow-y': 'visible' });

    /* WOW Elements */
    if (typeof WOW == 'function') {
        new WOW().init();
    }

    /* Parallax Effects */
    if (!!$.prototype.enllax) {
        $(window).enllax();
    }

});
document.addEventListener('DOMContentLoaded', function() {
    var canvasContainer = document.getElementById('canvas-container');
    var canvas = new fabric.Canvas('c3', { width: canvasContainer.offsetWidth, height: canvasContainer.offsetHeight });

    var image = document.getElementById('my-image');
    var originalScale;

    function resizeCanvas() {
        canvas.setWidth(canvasContainer.offsetWidth);
        canvas.setHeight(canvasContainer.offsetHeight);

        if (canvas.item(0)) {
            var fabricImg = canvas.item(0);
            var scaleX = canvas.width / fabricImg.width;
            var scaleY = canvas.height / fabricImg.height;
            var minScale = Math.min(scaleX, scaleY);

            originalScale = minScale;

            fabricImg.set({
                left: canvas.width / 2 - (fabricImg.width * minScale) / 2,
                top: canvas.height / 2 - (fabricImg.height * minScale) / 2,
                scaleX: minScale,
                scaleY: minScale
            });

            canvas.renderAll();
        }
    }

    fabric.Image.fromURL(image.src, function(fabricImg) {
        var scaleX = canvas.width / fabricImg.width;
        var scaleY = canvas.height / fabricImg.height;
        var minScale = Math.min(scaleX, scaleY);

        originalScale = minScale;

        fabricImg.set({
            left: canvas.width / 2 - (fabricImg.width * minScale) / 2,
            top: canvas.height / 2 - (fabricImg.height * minScale) / 2,
            scaleX: minScale,
            scaleY: minScale
        });

        canvas.add(fabricImg);
    });

    window.addEventListener('resize', function() {
        resizeCanvas();
    });

    canvas.on('mouse:down', function(options) {
        if (options.target) {
            options.target.set({
                opacity: 0.5,
                borderColor: 'red',
                cornerColor: 'green',
                cornerSize: 6,
                transparentCorners: false
            });
            canvas.renderAll();
        }
    });

    canvas.on('mouse:up', function(options) {
        if (options.target) {
            options.target.set({
                opacity: 1,
                borderColor: null,
                cornerColor: null
            });
            canvas.renderAll();
        }
    });

    document.getElementById('reset-button').addEventListener('click', function() {
        if (canvas.item(0)) {
            canvas.item(0).set({
                scaleX: originalScale,
                scaleY: originalScale
            });
            canvas.renderAll();
        }
    });

    canvas.on('object:moving', function(options) {
        // Handle object moving (dragging)
    });

    canvas.on('object:scaling', function(options) {
        // Handle object scaling
    });

    // Initial canvas resize
    resizeCanvas();
});