zoukankan      html  css  js  c++  java
  • electron photobooth.js

    <!DOCTYPE html>
    <html>
    	<head>
    		  <meta charset="UTF-8">
        <title>欢迎系统</title>
    
    		
    		<link type="text/css" rel="stylesheet" media="screen" href="page.css" />
    		<title>Photobooth.js</title>
    	</head>
    	<body>
    
    		<div id="wrapper">
    			<h1>
    				<a name="Demo">HTML5 Webcam for your website</a>
    			</h1>
    			<div id="example"></div>
    			<div id="gallery"></div>
    			
    			<div class="tab_container">
    			
    					<div class="tab_content standalone">
                           <code>
    			
    container = document.getElementById( "example" );
    gallery = document.getElementById( "gallery" );
    
    myPhotobooth = new Photobooth( container );
    
    myPhotobooth.onImage = function( dataUrl ){
    	var myImage = document.createElement( "img" );
    	myImage.src = dataUrl;
    	gallery.appendChild( myImage );
    };
            </code>
    				</div>
    			</div>
    
    			<!--
    			<h2><a name="dataUrl">Storing dataUrls as image</a></h2>
    			The user clicked the camera icon, your <code>onImage()</code> function get's called and receives a dataUrl... now what?
    
    			<h3>In the Browser</h3>
    
    			<h3>Sending the image to the server</h3>
    
    			<h3>Storing the image on the server</h3>
    			Storing your dataUrl as an image is easy when you know how. A dataUrl consists of two parts, seperated by a come: a meta-data section at 
    			the start and the actual data
    
    			<code>data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAA...</code>
    
    			The String after the comma is base64 encoded binary data. So in order to save it as an image you need to
    
    			1) Split the dataUrl on the first comma
    			2) base64 decode the data ( emphasize on DECODE, not encode )
    			Every major serverside language has a built in way of doing that. E.g.
    
    			PHP 
    			$dataUrlParts = explode( ",", $dataUrl);
    			base64_decode( $dataUrlParts[ 1 ] );
    
    			
    			Node.js
    			var dataUrl = "data:image/jpeg;base64,/9j/4AAQSkZJRgA...";
    			var buffer = new Buffer( dataUrl.split( "," )[ 1 ], 'base64');
    			require( "fs" ).writeFileSync( "image.jpg", buffer.toString( 'binary' ), "binary" );
    
    			3) Save the result to a file and name it yourImage.png ( or jpeg, depending on the dataUrl type )
    		-->
    		</div>
     <!-- Insert this line above script imports  -->
        <script>if (typeof module === 'object') {window.module = module; module = undefined;}</script>
    
        <!-- normal script imports etc  -->
        <!-- Mainly scripts -->
    		<script type="text/javascript" src="jquery.js"></script>
    		<script type="text/javascript" src="photobooth_min.js"></script>
    		<script type="text/javascript" src="script.js"></script>
     <!-- Insert this line after script imports -->
        	<script>if (window.module) module = window.module;</script>
     		
    	</body>
    	<script>
        // You can also require other files to run in this process
        require('./renderer.js')
      </script>
    </html>
    
  • 相关阅读:
    [UE4]创建对象的的几种姿势(C++)
    [UE4]IES光源概述文件
    [UE4]C++ STL总结
    [UE4]C++中引用(&)的用法和应用实例
    [UE4]单映射:TMap容器,字典表
    [UE4]集合:TSet容器
    [UE4]动态数组:TArray容器
    [UE4] 虚幻4学习---UE4中的字符串转换
    [UE4]使用PlayerController获取鼠标点击时的坐标
    [UE4]C 语言动态数组
  • 原文地址:https://www.cnblogs.com/mayidudu/p/6050137.html
Copyright © 2011-2022 走看看