Never-ending Pumpkin Mulch

    seeso

    0.1.10 • Public • Published

    SeeSo SDK Web - NPM Module

    Supported Environment

    • Browser Support
    chrome firefox edge safari
    80+ ✔︎ ᅠLatest ✔︎︎ ᅠLatest ✔︎︎ ᅠ✘︎︎

    Environment Set-ups

    • Download SDK files directly. The Following files should exist:

      1. Go to the path where you downloaded the SDK files. There should be the following files below.
        • SeeSo
          • dist
            • seeso.js
          • easy-seeso.js
    • Using npm:

    $ npm install seeso
    • Using CDN: It will be available soon.
    <script src="https://cdn.seeso.io/seeso.js"></script>

    Issue License key (Required)

    Get a license key from the SeeSo Console

    SIMD Setting (Chrome Optional)

    * Using this setting improves the performance of the SDK.
    * If SIMD option is off, high fps setting (ex: `30`) may drop CPU performance.  
    
    1. in chrome://flags/
    2. WebAssembly SIMD support set Enabled SIMD setting

    Sample App Implemetation

    Import SDK module and Check SDK status

    • If "afterInitialized" function is called, it means SDK is ready to use.
      // when SDK files download
      import EasySeeSo from './seeso/easy-seeso.js'  
      
      // when npm or cdn import
      import EasySeeSo from 'seeso/easy-seeso';
      
      (async () => {
        const seeso = new EasySeeSo();
        // Don't forget to enter your license key.
        await seeso.init('YOUR_LICENSE_KEY', afterInitialized, afterFailed)
      })()
      
      function afterInitialized () {
        console.log('sdk init success!')
      }
      
      function afterFailed () {
        console.log('sdk init fail!')
      }

    Call Calibration Page

        ...
        
        function callCalibrationPage() {
            // static function. 
            // Because the web page is moved. (https://calibration.seeso.io/#/service)
            EasySeeSo.openCalibrationPage('YOUR_LICENSE_KEY', 'YOUR_USER_ID', 'YOUR_REDIRECT_URL', 5); // 5 is number of calibration points
        }
        

    Set Calibration Data

        ...
    
        // in redirected page
        function parseCalibrationDataInQueryString () {
          const href = window.location.href
          const decodedURI = decodeURI(href)
          const queryString = decodedURI.split('?')[1];
    
          if (!queryString) return undefined
          const jsonString = queryString.slice("calibrationData=".length, queryString.length)
          return jsonString
        }
        
        function setCalibrationDataOnSeeSoSDK() {
            const calibrationData = parseCalibrationDataInQueryString();
            seeso.setCalibrationData(calibrationData)
        }
        

    Show Gaze Point

        import { TrackingState } from 'seeso';
        ... 
    
        //GazeCallback implementation
        function onGaze (gazeInfo) {
            if (gazeInfo.trackingState === TrackingState.SUCCESS){
                let canvas = document.getElementById("output")
                canvas.width = window.innerWidth
                canvas.height = window.innerHeight
                let ctx = canvas.getContext("2d");
                ctx.fillStyle = '#FF0000'
                ctx.clearRect(0, 0, canvas.width, canvas.height )
                ctx.beginPath();
                ctx.arc(gazeInfo.x, gazeInfo.y, 10, 0, Math.PI * 2, true);
                ctx.fill();
            }
        }
        

    Sample Project

    Here is a sample VanillaJS Demo

    Caution when deploying : Enable Cross-Origin Isolation

    • The content of this part is not necessary for development. However, it is required for deployment. seeso.js uses SharedArrayBuffer Object.

    Cross-Origin Isolation must be enabled to use SharedArrayBuffer in some browsers.

    Install

    npm i seeso

    DownloadsWeekly Downloads

    4

    Version

    0.1.10

    License

    MIT

    Unpacked Size

    448 kB

    Total Files

    7

    Last publish

    Collaborators

    • visualcamp