UI Schema

Utilities

Toggle CSS Classes

Click to toggle
<input class="ui-box-small" placeholder="Toggle on focus" data-schema-toggle="#target" data-schema-trigger='focus blur'>
<a class="ui-text-button ui-offset-small" data-schema-toggle="#target" data-schema-toggler="ui-button-success">Click to toggle</a>
<button id="target" class="ui-button-success ui-offset-small" data-schema-toggler="ui-button-success ui-zoom-small">Target button</button>

Extract Data

We have created an organization https://github.com/arxitics on GitHub. :smile:

<div data-schema-extract="url,emoji" data-schema-emoji="http://oss.arxitics.com/images/emoji/">
  <p>We have created an organization https://github.com/arxitics on GitHub. :smile:</p>
</div>

Format Strings

template = 'https://www.reddit.com/submit?url=${url}&title=${title}';
data = {
  url: 'http://arxitics.com',
  title: 'arXiv Analytics'
};
schema.format(template, data) => 'https://www.reddit.com/submit?url=http://arxitics.com&title=arXiv Analytics'

Parse URLs

url = 'https://www.reddit.com/submit?url=http://arxitics.com&title=arXiv+Analytics';
schema.parseURL(url) => {
  href: 'https://www.reddit.com/submit?url=http://arxitics.com&title=arXiv%20Analytics',
  origin: 'https://www.reddit.com',
  protocol: 'https:',
  username: '',
  password: '',
  host: 'www.reddit.com',
  hostname: 'www.reddit.com',
  port: '',
  path: '/submit?url=http://arxitics.com&title=arXiv%20Analytics',
  pathname: '/submit',
  segments: [
    'submit'
  ],
  search: '?url=http://arxitics.com&title=arXiv%20Analytics',
  query: {
    url: 'http://arxitics.com',
    title: 'arXiv Analytics'
  },
  hash: '',
  fragment: ''
}