kurokida / jspsych-psychophysics

A jsPsych plugin for psychophysics
https://kurokida.github.io/jspsych-psychophysics/
MIT License
51 stars 13 forks source link

'manual property' does not display on Macintosh desktop. How to fix it? #16

Closed prashantig25 closed 3 years ago

prashantig25 commented 3 years ago

Hi! I used the manual property to draw the fixation cross and stimuli for my experiment. When I run the experiment on some laptops, the fixation and stimuli appear on the center of the screen. However, when I run the same code in a particular Macintosh desktop, the stimuli and fixation appear elsewhere on the screen. Additionally, I change the contrast level of my stimulus on every trial. The changes occur on all devices expect for the macintosh system. Is there anyway I can fix these issues? Here is the code:

<script>
var fixation = {
        obj_type: 'manual',
        startX: 0, // location of the cross's center in the canvas
        startY: 0,
        origin_center: true,
        show_start_time: 0,
        motion_end_time: 2000,
        line_color: '#000000',// You can use the HTML color name instead of the HEX color.
        drawFunc() {
            context = jsPsych.currentTrial().context;
            context.beginPath();
            context.moveTo(752.5, 380); //horizontal line
            context.lineTo(797.5, 380);
            context.moveTo(775, 355); //vertical line
            context.lineTo(775, 405);
            context.filter = 'contrast(1)';
            context.lineWidth = 5;
            context.stroke();
        }
    }

var stim = {
        gabor: function draw(x1, y1, x2, y2, x, y, con) {  //x1, y1, x2, y2 are the coordinates for the start and end of the gradient.
            context = jsPsych.currentTrial().context; // x, y are the position of the gabor on the screen. Con is the contrast level.
            const gradLength = 100;
            const my_gradient = context.createLinearGradient(x1, y1, x2, y2);
            const bands = 10;
            const colors = ["#000", "#FFF"];
            const stops = bands * colors.length;
            var pos = 0;
            while (pos <= stops) {
                my_gradient.addColorStop(pos / stops, colors[pos % colors.length]);
                pos++;
            }
            context.fillStyle = my_gradient;
            context.filter = 'contrast(' + con + ')'
            context.fillRect(x, y, gradLength, gradLength);
            context.stroke()
        }
    }
    var Left0 = {
        obj_type: 'manual', show_start_time: 0, origin_center: true, motion_end_time: 2000,
        startX: -225, startY: 0, endX: -425, endY: 0,// location in the canvas
        width: 300, height: 200, // of the rectangle
        drawFunc: function () {
            stim.gabor(400, 0, 600, 0, 500, 325, jsPsych.currentTrial().contrast)
        }
    };
kurokida commented 3 years ago

I'm sorry, but I don't know the details at the moment.

At first, please check whether you use the latest jspsych-psychophysics plugin. The version is 2.1.

Next, please rewrite your code according to https://github.com/kurokida/jspsych-psychophysics/issues/17