<commit_before># ContextMenu
Context Menu plugin for Foundation 6.

## Usage
To embed Context Menu into your page, you just need to include the CSS and the JS files right after the Foundation includes.
```html
  <script src="js/contextMenu.js"></script>
  <link rel="stylesheet" type="text/css" href="css/contextMenu.css" />
```

To configure your menus, either render them in HTML following the Foundation menu structure, or use JavaScript to register different types of context menus.
```js
  Foundation.ContextMenu.prototype.addConfig('listitem', {
    accessible: true,
    single: true,
    structure: [{
      text: 'Move to',
      help: 'Alt + M',
      href: '#'
    }, {
      icon: 'fa fa-paper-plane',
      text: 'Send via mail',  
      click: function() {
        alert('Sending a mail!');
      }
    }, {
      class: 'divider',
    }, {
      text: 'More...',
      children: [{
        text: 'Delete',
        href: '#'
      }, {
        text: 'Download...',
        href: '#',
        children: [{
          text: 'Save as PDF',
          href: '#'
        }, {
          text: 'Save as PNG',
          href: '#'
        }]
      }]
    }]
  });
```
To add a context menu to one of your elements, e.g. elements within lists, simply add the `data-context-menu` attribute, having either a defined menu type or the reference to your rendered HTML list as a value.
```html
  <!-- This li uses the JSON from the config for "listitem" and renders it as the context menu -->
  <li data-context-menu="listitem">
    First item here
  </li>
  <!-- This li uses the JSON from the config for "listitem" and renders it as the context menu -->
  <li data-context-menu="#menu">
    Second item here
  </li>
```

## Accessibility
This plugin is partly accessible. To allow keyboard users to open the context menus, simply add the following buttons into your trigger elements. Elements having the `data-context-menu-trigger` attribute will trigger the context menu of their parent element when clicked.
```html
  <li data-context-menu="#menu">
    Second item here <button data-context-menu-trigger class="button tiny show-on-focus pull-right">Open menu</button>
  </li>
```
## Touch support
This plugin is also optimized for mobile and touch devices. You can toggle the context menu with a long-touch event, which duration can be adjusted in the plugin's options.
```

## Demo
Test the Context Menu on your own at the demo page!

http://Owlbertz.github.io/ContextMenu/

## Acknowledgments
As this project is a plugin for Foundation by ZURB, a big thanks for their stunning framework.

## License
Context Menu is available under the [MIT License](http://opensource.org/licenses/MIT).<commit_msg>Fixed syntax error in README<commit_after># ContextMenu
Context Menu plugin for Foundation 6.

## Usage
To embed Context Menu into your page, you just need to include the CSS and the JS files right after the Foundation includes.
```html
  <script src="js/contextMenu.js"></script>
  <link rel="stylesheet" type="text/css" href="css/contextMenu.css" />
```

To configure your menus, either render them in HTML following the Foundation menu structure, or use JavaScript to register different types of context menus.
```js
  Foundation.ContextMenu.prototype.addConfig('listitem', {
    accessible: true,
    single: true,
    structure: [{
      text: 'Move to',
      help: 'Alt + M',
      href: '#'
    }, {
      icon: 'fa fa-paper-plane',
      text: 'Send via mail',  
      click: function() {
        alert('Sending a mail!');
      }
    }, {
      class: 'divider',
    }, {
      text: 'More...',
      children: [{
        text: 'Delete',
        href: '#'
      }, {
        text: 'Download...',
        href: '#',
        children: [{
          text: 'Save as PDF',
          href: '#'
        }, {
          text: 'Save as PNG',
          href: '#'
        }]
      }]
    }]
  });
```
To add a context menu to one of your elements, e.g. elements within lists, simply add the `data-context-menu` attribute, having either a defined menu type or the reference to your rendered HTML list as a value.
```html
  <!-- This li uses the JSON from the config for "listitem" and renders it as the context menu -->
  <li data-context-menu="listitem">
    First item here
  </li>
  <!-- This li uses the JSON from the config for "listitem" and renders it as the context menu -->
  <li data-context-menu="#menu">
    Second item here
  </li>
```

## Accessibility
This plugin is partly accessible. To allow keyboard users to open the context menus, simply add the following buttons into your trigger elements. Elements having the `data-context-menu-trigger` attribute will trigger the context menu of their parent element when clicked.
```html
  <li data-context-menu="#menu">
    Second item here <button data-context-menu-trigger class="button tiny show-on-focus pull-right">Open menu</button>
  </li>
```
## Touch support
This plugin is also optimized for mobile and touch devices. You can toggle the context menu with a long-touch event, which duration can be adjusted in the plugin's options.

## Demo
Test the Context Menu on your own at the demo page!

http://Owlbertz.github.io/ContextMenu/

## Acknowledgments
As this project is a plugin for Foundation by ZURB, a big thanks for their stunning framework.

## License
Context Menu is available under the [MIT License](http://opensource.org/licenses/MIT).
{'fraction_non_alphanumeric': 0.11365736462761042, 'fraction_numerical': 0.00036961744594344855, 'mean_word_length': 2.9619326500732064, 'pattern_counts': {'":': 0, '<': 29, '<?xml version=': 0, '>': 29, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 2, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1232027', 'n_tokens_mistral': 1511, 'n_tokens_neox': 1461, 'n_words': 641}