Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@the-grid/caliper

Package Overview
Dependencies
Maintainers
18
Versions
84
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@the-grid/caliper

Measurement library

  • 0.6.1
  • Source
  • npm
  • Socket score

Version published
Maintainers
18
Created
Source

Caliper Build Status

Measurement library for Poly, handling different media types.

Local testing

First make sure you have all dependencies installed:

npm install

Use the following command to run tests locally:

grunt

Specifications

Caliper deals with the following blocks:

Headline

headline:
  id: 'one'
  type: 'headline'
  html: '<h1>This is a headline</h1>'
  text: 'This is a headline'
  length: 18
}

Paragraph

paragraph:
  id: 'two'
  type: 'text'
  html: '<p>Hello world, <b>this</b> is some text</p>'
  text: 'Hello world, this is some text'
  length: 30

CTA

cta:
  id: '1234cta'
  type: 'cta'
  uuid: '71bfc2e0-4a96-11e4-916c-0800200c9a66'
  verb: 'purchase'
  price: '96'
  html: '<button data-uuid=71bfc2e0-4a96-11e4-916c-0800200c9a66 data-role="cta" data-verb="purchase" data-price="96">Buy now</button>'
  text: 'Buy now'
  length: 7

List

list:
  id: 'ordered'
  type: 'list'
  html: '<ul><li>Foo</li><li>Bar</li></ul>'
  items: 2

Image

image:
  id: 'foo'
  type: 'article'
  src: 'http://foo/fullscale.png'
  cover:
    orientation: 'landscape'
    src: 'http://foo/fullscale.png'
    altsrc: 'http://foo/original.png'
    ratio: '1004:777'
    width: 2008
    height: 1554
    faces: [
      { x: 608.1907291149191
        y: 189.99097584365575
        width: 229.20877742760769
        height: 229.20877742760769
        neighbors: 2
        confidence: -1.7360807700000014 }
    ]
    colors: [[197, 135, 87], ...]
    saliency:
      polygon: [[2006, 1552], ...]
      center: [1258, 1233]
      radius: 836.904
      bounding_rect: [[483, 817], [2007, 1553]]
    negative_space:
      rectangles: [
        { x: 0
          y: 0
          width: 1943
          height: 780
          text:
            large: 1184
            medium: 3947
            small: 6647 }
      ]
      colors: [
        [[24,15,8],
         [43,34,27],
         [94,10,30],
         [139,25,48],
         [89,67,53],
         [151,90,68],
         [187,128,98],
         [220,165,145],
         [146,124,92],
         [216,202,196]]
      ]
   scene:
     bbox:
       x: number
       y: number
       width: number
       height: number
  • altsrc is optional and should be the original src when available
  • src should be the fullscale src when available
  • we should extract measurements from the fullscale src (for now, we should extract from the scaled down src in the near future)
  • faces length can be equal to zero
  • 'saliency' equals to null in noflo-browser

Video

video:
  id: 'youtube'
  type: 'video'
  html: '<iframe src="//www.youtube.com/embed/P5cdlLTqb24?list=UUnPE7t9tqwcsO0LLyw5zuPQ"></iframe>'
  video:
    src: '//www.youtube.com/embed/P5cdlLTqb24?list=UUnPE7t9tqwcsO0LLyw5zuPQ'
  src: 'http://img.youtube.com/vi/P5cdlLTqb24/hqdefault.jpg'
  cover:
    ... the same of image type ...

FAQs

Package last updated on 08 Jul 2016

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc