Image files are unable to load after camera stream.

Image files are unable to load after camera stream.

@jywarren , please i can't seem to diagnose the source of this unexpected behavior. Could you help me please?

f7cea621-a077-4cfe-a1ac-f0bc38c5.mp4

Originally posted by @Forchapeatl in #439 (comment)

OK, so i think when we start video mode, we begin a loop to fetch images from the video element. When we try to go back to upload mode, we need to find and halt that loop. Let me look...

Yes, we do it in this function:

infragram/src/Infragram.js

Lines 34 to 45 in f15add6

    
           // split into processor.video() methods 
        
           options.video = function video() { 
        
             options.camera.initialize(); 
        
             var interval; 
        
             if (options.processor.type == "webgl") interval = 15; 
        
             else interval = 150; 
        
             setInterval(function() { 
        
               if (image) options.run(options.mode); 
        
               options.camera.getSnapshot(); 
        
               //if (options.colorized) return options.colorize(); 
        
             }, interval); 
        
           }

And that function is called from here:

infragram/src/ui/interface.js

Lines 89 to 97 in 577ff12

    
           $("#webcam-activate").click(function() { 
        
             $('.choose-prompt').hide(); 
        
             $("#save-modal-btn").show(); 
        
             $("#save-zone").show(); 
        
             save_infragrammar_inputs(); 
        
             options.video(); 
        
             $('#preset-modal').modal('show'); 
        
             return true; 
        
           });

So we have to save the setInterval object and stop it with clearInterval(). Intervals are a little weird but they are just repeated timers. You can read how they work here! https://developer.mozilla.org/en-US/docs/Web/API/setInterval#return_value There are good examples lower on that page that you can model to use here. But, I think we could also solve this in a separate PR - i don't think it's your code that's causing it, it's already the case in the main branch!

And, solving it may be a little more complex, we have to think carefully about where we store the interval return value so that we can make a stopVideo() function, probably? I can help you figure that out too but we might as well move this whole comment thread to its own issue, what do you think?

HI @Forchapeatl I would like to try ...if no one else is

	// split into processor.video() methods
	options.video = function video() {
	options.camera.initialize();
	var interval;
	if (options.processor.type == "webgl") interval = 15;
	else interval = 150;
	setInterval(function() {
	if (image) options.run(options.mode);
	options.camera.getSnapshot();
	//if (options.colorized) return options.colorize();
	}, interval);
	}

	$("#webcam-activate").click(function() {
	$('.choose-prompt').hide();
	$("#save-modal-btn").show();
	$("#save-zone").show();
	save_infragrammar_inputs();
	options.video();
	$('#preset-modal').modal('show');
	return true;
	});