<commit_before>### Dependencies
These are the CSS and Javascript files JuiceboxJS depends on:

```JavaScript
<!-- CSS -->
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://igv.org/web/beta/igv-beta.css">
<link rel="stylesheet" href="http://igv.org/web/jb/test/dist/juicebox.css">

<!-- Javascript -->
<script src="https://igv.org/web/beta/igv-beta.min.js"></script>
<script src="http://igv.org/web/jb/test/dist/juicebox.js"></script>
```
### Usage
Create a `div` container with `id=app-container`:

```JavaScript
<div id="app-container">
<!-- Juicebox app will appear here -->
</div>
```

Add the following script

```JavaScript
<script type="text/javascript">
     document.addEventListener("DOMContentLoaded", function () {
        var appContainer = document.getElementById("app-container);
        var browser = hic.createBrowser(appContainer);
    });
</script>

```

To load a .hic map file 

```JavaScript
  
  browser.loadHicFile({
         url: url,    //  url string or File object
         name: name   //  display name for the map.  Optional, defaults to url
  }<commit_msg>Update embedding.md<commit_after>### Dependencies
Juicebox dependencies.  

```html
<!-- CSS -->
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://igv.org/web/beta/igv-beta.css">
<link rel="stylesheet" href="http://igv.org/web/jb/test/dist/juicebox.css">

<!-- Google fonts -- omit if using Bootstrap -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">

<!-- Javascript -->
<script src="https://igv.org/web/beta/igv-beta.min.js"></script>
<script src="http://igv.org/web/jb/test/dist/juicebox.js"></script>
```
### Usage
Create a `div` container with `id=app-container`:

```html
<div id="app-container">
<!-- Juicebox app will appear here -->
</div>
```

Add the following script in the page body

```js
<script type="text/javascript">
     document.addEventListener("DOMContentLoaded", function () {
        var appContainer = document.getElementById("app-container);
        var browser = hic.createBrowser(appContainer);
    });
</script>

```

To load a .hic map file 

```JavaScript
  
  browser.loadHicFile({
         url: url,    //  url string or File object
         name: name   //  display name for the map.  Optional, defaults to url
  }
{'fraction_non_alphanumeric': 0.18036809815950922, 'fraction_numerical': 0.00245398773006135, 'mean_word_length': 3.66793893129771, 'pattern_counts': {'":': 0, '<': 33, '<?xml version=': 0, '>': 33, 'https://': 5, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2176909', 'n_tokens_mistral': 828, 'n_tokens_neox': 779, 'n_words': 178}