initial commit

Author: daraosn

CanvasCamera/CanvasCamera.h

@@ -0,0 +1,24 @@
+//
+//  CanvasCamera.js
+//  PhoneGap iOS Cordova Plugin to capture Camera streaming into a HTML5 Canvas or an IMG tag.
+//
+//  Created by Diego Araos <[email protected]> on 12/29/12.
+//
+//  MIT License
+
+#import <Cordova/CDVPlugin.h>
+#import <UIKit/UIKit.h>
+#import <CoreMedia/CoreMedia.h>
+#import <CoreVideo/CoreVideo.h>
+#import <AVFoundation/AVFoundation.h>
+
+@interface CanvasCamera : CDVPlugin
+
+@property (nonatomic, strong) AVCaptureSession *session;
+@property (nonatomic, strong) AVCaptureDevice *device;
+@property (nonatomic, strong) AVCaptureDeviceInput *input;
+@property (nonatomic, strong) AVCaptureVideoDataOutput *output;
+
+- (void)startCapture:(NSMutableArray*)arguments withDict:(NSMutableDictionary*)options;
+
+@end

CanvasCamera/CanvasCamera.js

@@ -0,0 +1,20 @@
+//
+//  CanvasCamera.js
+//  PhoneGap iOS Cordova Plugin to capture Camera streaming into a HTML5 Canvas or an IMG tag.
+//
+//  Created by Diego Araos <[email protected]> on 12/29/12.
+//
+//  MIT License
+
+CanvasCamera = {
+  start: function(options) {
+    // TODO: add support for options (fps, capture quality, capture format, etc.)
+    cordova.exec(false, false, "CanvasCamera", "startCapture", [""]);
+  },
+  capture: function(data) {
+    // LAZYME: Override this function with something like...
+    // CanvasCamera.capture = function(data) {
+    //   document.getElementById('camera').src = data;
+    // }
+  }
+};

CanvasCamera/CanvasCamera.m

@@ -0,0 +1,70 @@
+//
+//  CanvasCamera.js
+//  PhoneGap iOS Cordova Plugin to capture Camera streaming into a HTML5 Canvas or an IMG tag.
+//
+//  Created by Diego Araos <[email protected]> on 12/29/12.
+//
+//  MIT License
+
+#import "CanvasCamera.h"
+
+@implementation CanvasCamera
+
+- (void)startCapture:(NSMutableArray*)arguments withDict:(NSMutableDictionary*)options
+{
+    // TODO: add support for options (fps, capture quality, capture format, etc.)
+    self.session = [[AVCaptureSession alloc] init];
+    self.session.sessionPreset = AVCaptureSessionPreset352x288;
+    
+    self.device = [AVCaptureDevice defaultDeviceWithMediaType:AVMediaTypeVideo];
+    self.input = [AVCaptureDeviceInput deviceInputWithDevice:self.device error:nil];
+    
+    self.output = [[AVCaptureVideoDataOutput alloc] init];
+    self.output.videoSettings = [NSDictionary dictionaryWithObject:[NSNumber numberWithInt:kCVPixelFormatType_32BGRA] forKey:(id)kCVPixelBufferPixelFormatTypeKey];
+    
+    dispatch_queue_t queue;
+    queue = dispatch_queue_create("canvas_camera_queue", NULL);
+    
+    [self.output setSampleBufferDelegate:(id)self queue:queue];
+    
+    [self.session addInput:self.input];
+    [self.session addOutput:self.output];
+    
+    [self.session startRunning];
+}
+
+- (void)captureOutput:(AVCaptureOutput *)captureOutput didOutputSampleBuffer:(CMSampleBufferRef)sampleBuffer fromConnection:(AVCaptureConnection *)connection
+{
+    NSAutoreleasePool * pool = [[NSAutoreleasePool alloc] init];
+    
+    CVImageBufferRef imageBuffer = CMSampleBufferGetImageBuffer(sampleBuffer);
+    CVPixelBufferLockBaseAddress(imageBuffer,0);
+    uint8_t *baseAddress = (uint8_t *)CVPixelBufferGetBaseAddress(imageBuffer);
+    size_t bytesPerRow = CVPixelBufferGetBytesPerRow(imageBuffer);
+    size_t width = CVPixelBufferGetWidth(imageBuffer);
+    size_t height = CVPixelBufferGetHeight(imageBuffer);
+    
+    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
+    CGContextRef newContext = CGBitmapContextCreate(baseAddress, width, height, 8, bytesPerRow, colorSpace, kCGBitmapByteOrder32Little | kCGImageAlphaPremultipliedFirst);
+    
+    CGImageRef newImage = CGBitmapContextCreateImage(newContext);
+    
+    CGContextRelease(newContext);
+    CGColorSpaceRelease(colorSpace);
+    
+    UIImage *image= [UIImage imageWithCGImage:newImage scale:1.0 orientation:UIImageOrientationUp];
+    
+    NSData *imageData = UIImageJPEGRepresentation(image, 1.0);
+    NSString *encodedString = [imageData base64Encoding];
+    
+    NSString *javascript = @"CanvasCamera.capture('data:image/jpeg;base64,";
+    javascript = [javascript stringByAppendingString:encodedString];
+    javascript = [javascript stringByAppendingString:@"');"];
+    [self.webView performSelectorOnMainThread:@selector(stringByEvaluatingJavaScriptFromString:) withObject:javascript waitUntilDone:YES];
+    
+    CGImageRelease(newImage);
+    CVPixelBufferUnlockBaseAddress(imageBuffer,0);
+    [pool drain];
+}
+
+@end

README.md

@@ -0,0 +1,69 @@
+# [CanvasCamera](http://github.com/daraosn/Cordova-CanvasCamera)
+### for iOS PhoneGap / Cordova
+***
+
+Plugin to capture Camera streaming into a HTML5 Canvas or an IMG tag.
+
+It uses *AVCaptureVideoDataOutput* to create a capture session. Each frame is base64 encoded and passed to the Cordova *UIWebView*. Please note this is mostly experimental and is slower than any native approach.
+
+### How to Install
+***
+
+1. Copy **CanvasCamera.h** and **CanvasCamera.m** to *Plugins* directory inside your PhoneGap project.
+2. Edit your *Cordova.plist* and add **CanvasCamera** key into your *Plugins* array.
+3. Copy **CanvasCamera.js** into your *www* directory and add a script tag for it in your *index.html*.
+
+### How to Use
+***
+
+Configuration for ````<img>````:
+
+    <img id="camera" width="352" height="288" />
+    <script>
+      CanvasCamera.capture = function(data) {
+        document.getElementById('camera').src = data;
+      }
+    </script>
+
+Configuration for ````<canvas>````: 
+
+    <canvas id="camera" width="352" height="288"></canvas>
+    <script>
+        var context = document.getElementById('camera').getContext("2d");
+        var camImage = new Image();
+        camImage.onload = function() {
+          context.drawImage(camImage, 0, 0);
+        };
+        CanvasCamera.capture = function(data) {
+          camImage.src = data;
+        };
+    </script>
+
+Start capture:
+
+    <script>
+      document.addEventListener("deviceready", function() {
+        CanvasCamera.start();
+      });
+    </script>
+
+
+### Known Issues & Roadmap/TODO
+***
+
+* Capture has some delay. This could be improved using another approach instead of base64 JPEG encoding.
+* Capture runs at low quality (352x288), but this can be changed using a different *sessionPreset*.
+* Missing configuration options for fps, quality, orientation, size, formats, etc.
+
+
+### Author & Contributions
+***
+
+Diego Araos <[email protected]>
+
+Feel free to fork & contribute!
+
+### License
+***
+
+MIT