0.0.248 • Published 10 months ago

@3cr/viewer-browser-development v0.0.248

Weekly downloads
-
License
-
Repository
bitbucket
Last release
10 months ago

@3cr/viewer-browser-development

npm.io npm.io

Ecosystem integration for installing and running 3DICOM Online Viewer (3CR-OV) within the Browser (client-side)

3DICOM Online Viewer (3CR-OV) Playground

Include @3cr/viewer-browser-development script

Choose one of the following ways

  • HTML Script Tag

    Insert this line into your index.html

    <script src="https://cdn.jsdelivr.net/npm/@3cr/viewer-browser-development@{{version}}/dist/Viewer3CR.umd.js"> </script>

    Note: Please ensure you replace the {{version}} with the version of the viewer you want.

  • JS/TS way

    You can also include it dynamically within your code.

    Typescript (.ts)

    export async function loadViewerScript(version: string): Promise<void> {
      return new Promise<void>((resolve) => {
        const s = document.createElement('script');
        s.onload = () => {
          resolve()
        }
        s.src = `https://cdn.jsdelivr.net/npm/@3cr/viewer-browser-development@${version}/dist/Viewer3CR.umd.js`;
        document.head.appendChild(s);
      })
    }
    
    // ...
    
    await loadViewerScript("1.0.0");

    Javascript (.js)

    export async function loadViewerScript(version) {
      return new Promise((resolve) => {
        const s = document.createElement('script');
        s.onload = () => {
          resolve()
        }
        s.src = `https://cdn.jsdelivr.net/npm/@3cr/viewer-browser-development@${version}/dist/Viewer3CR.umd.js`;
        document.head.appendChild(s);
      })
    }
     
    // ...
    
    await loadViewerScript("1.0.0");

Using the Package

  1. Register 3DICOM Online Viewer version

    Call the registerViewer function with the version of 3CR you would like to view. This will generate a new container to load the viewer within and register the 3CR Instance.

    Typescript (.ts) / Javascript (.js)

    const VERSION_3CR: string = '1.0.0';
    
    await window.registerViewer(VERSION_3CR)
  2. Load in the 3VXL file

    Generate the 3VXL file and Decryption Key/Iv and supply that to the loadViewer function

    Note: You can supply undefined/nothing to the loadViewer() function to display a default scan for testing purposes.

    Typescript (.ts) / Javascript (.js)

    const payload = {
      Url: "<Some presigned URL to a 3VXL file.>",
      DecryptionKey: {
        Iv: "<Initialisation Vector of the Key>",
        Key: "<Decryption Key>"
      }
    }
    await window.loadViewer(payload)
    
    // OR
    
    await window.loadViewer()
  3. (Optional) Clean up

    In order to ensure the css namespace and data from the viewer is cleaned up and removed after execution, call ejectViewer

    Note: You may also want to clean up the initial script you loaded on your site, by removing the nodes of the script you created in Include @3cr/viewer-browser-development script

    Typescript (.ts) / Javascript (.js)

    await window.ejectViewer()

Contributing

Pull requests are welcome. For changes, please open an issue first to discuss what you would like to change.

Please make sure to update tests as appropriate.

License

MIT

0.0.238

10 months ago

0.0.239

10 months ago

0.0.248

10 months ago

0.0.247

10 months ago

0.0.246

10 months ago

0.0.241

10 months ago

0.0.240

10 months ago

0.0.245

10 months ago

0.0.244

10 months ago

0.0.243

10 months ago

0.0.242

10 months ago

0.0.237

11 months ago

0.0.236

11 months ago

0.0.235

11 months ago

0.0.230

11 months ago

0.0.197

1 year ago

0.0.196

1 year ago

0.0.195

1 year ago

0.0.194

1 year ago

0.0.234

11 months ago

0.0.233

11 months ago

0.0.232

11 months ago

0.0.199

1 year ago

0.0.231

11 months ago

0.0.198

1 year ago

0.0.193

1 year ago

0.0.192

1 year ago

0.0.191

1 year ago

0.0.190

1 year ago

0.0.204

1 year ago

0.0.203

1 year ago

0.0.202

1 year ago

0.0.169

1 year ago

0.0.209

12 months ago

0.0.208

1 year ago

0.0.207

1 year ago

0.0.206

1 year ago

0.0.201

1 year ago

0.0.200

1 year ago

0.0.216

12 months ago

0.0.215

12 months ago

0.0.214

12 months ago

0.0.213

12 months ago

0.0.219

11 months ago

0.0.217

11 months ago

0.0.175

1 year ago

0.0.174

1 year ago

0.0.173

1 year ago

0.0.172

1 year ago

0.0.212

12 months ago

0.0.179

1 year ago

0.0.211

12 months ago

0.0.178

1 year ago

0.0.210

12 months ago

0.0.177

1 year ago

0.0.176

1 year ago

0.0.171

1 year ago

0.0.170

1 year ago

0.0.227

11 months ago

0.0.226

11 months ago

0.0.225

11 months ago

0.0.229

11 months ago

0.0.228

11 months ago

0.0.186

1 year ago

0.0.185

1 year ago

0.0.184

1 year ago

0.0.183

1 year ago

0.0.223

11 months ago

0.0.222

11 months ago

0.0.189

1 year ago

0.0.221

11 months ago

0.0.188

1 year ago

0.0.220

11 months ago

0.0.187

1 year ago

0.0.182

1 year ago

0.0.181

1 year ago

0.0.180

1 year ago

0.0.168

1 year ago

0.0.167

1 year ago

0.0.166

1 year ago

0.0.165

1 year ago

0.0.164

1 year ago

0.0.163

1 year ago

0.0.162

1 year ago