revelry_core 0.1.12.6 → 0.1.13.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 647c171e5d873a83fedaa6a9645c69145f1993a4
-  data.tar.gz: 3e4e6cfa7e469f9cb50fc8c38934a41db4d0764d
+  metadata.gz: fc9e64fe85e9f0caad64a44a7d800db0b49f76f6
+  data.tar.gz: 5e5f8ff764368c4595e096c5ea5fdcb65364c7e9
 SHA512:
-  metadata.gz: 6c854184f105850c1d8e28c5e23372437ebb2db0eb9cb0236b5ca36374e7079eed4dda613662185074efc2d53c73ce4947f3b64e9da834ceda56e6cd064aa80b
-  data.tar.gz: 3971a24708631c8970c4626bb1f2b8c2e0ae3220138a540742debed5ea10c7e835fb85768ad0ec8803e352d0784d8cee15c88a77d9109e193fbc41bf269c0672
+  metadata.gz: ac9e58583910182a6e482bc123a432fa45a0e7b4c7b8f9ee6fbda2b485e5e85f12c03a29af634e691c8907802c0b75e3bff700e55182e8f52b2b379e588b6109
+  data.tar.gz: a3fb3d518121629bbceaf7e1e68266df6b52d024c3f870f33d9815299d288b6eb1fe05846941b9ee7579e0fee71ab484aac18bd0a19ab1441f0d1c3911422a2c

data/app/assets/javascripts/revelry/Main.es6

@@ -0,0 +1,88 @@
+Rev.registerComponent('Main', class Main extends React.Component {
+
+  /* CLASS METHODS */
+
+  static pathToComponentClassName(path) {
+    return path.split('/').map(_.str.classify).join('.')
+  }
+
+  static pathToComponentClass(path) {
+    const parts = Main.pathToComponentClassName(path).split('.')
+
+    let klass = Rev.App.Components
+
+    for(let i = 0; i < parts.length; i++) {
+      const key = parts[i]
+
+      klass = klass[key]
+      if(klass === null || typeof klass === 'undefined') {
+        break
+      }
+    }
+
+    return klass
+  }
+
+  static hasView(path) {
+    const klass = Main.pathToComponentClass(path)
+    const found = klass !== null && typeof klass !== 'undefined'
+
+    return found
+  }
+
+  static createElement(klass, props, children) {
+    if(React.createElement !== null && typeof React.createElement !== 'undefined') {
+      return React.createElement(klass, props, children)
+    }
+    return (
+      <klass {...props}>
+        {children}
+      </klass>
+    )
+  }
+
+  static get propTypes() {
+    return {
+      path: React.PropTypes.string.isRequired,
+      options: React.PropTypes.object,
+    }
+  }
+
+  /* INSTANCE METHODS */
+
+  getChildComponentClassName() {
+    return this.constructor.pathToComponentClassName(this.props.path)
+  }
+
+  getChildComponentClass() {
+    return this.constructor.pathToComponentClass(this.props.path)
+  }
+
+  // Some things are just easier when semi-global.
+  // (Think CSRF token.)
+  componentWillMount() {
+    App.props = this.props.options
+  }
+
+  componentWillUpdate(nextProps, nextState) {
+    App.props = this.nextProps.options
+  }
+
+  render() {
+    const klass = this.getChildComponentClass()
+
+    if(klass === null || typeof klass === 'undefined') {
+      return <div>{`Couldn't locate component \`${this.getChildComponentClassName()}\``}</div>
+    }
+    return this.constructor.createElement(klass, this.props.options)
+  }
+})
+
+
+// Application code can overwrite this to do whatever extra stuff you want.
+Rev.appComponent('Main', class Main extends React.Component {
+  render() {
+    console.warn('Revelry application does not define a `Main` component. Falling back to default implementation.')
+    return <Rev.Components.Main {...this.props} />
+  }
+})

data/app/assets/javascripts/revelry/core.es6

@@ -0,0 +1,184 @@
+//= require es6shim
+//= require react
+//= require underscore
+//= require underscore.string
+
+const ESCAPE_LOOKUP = {
+  '&': '&',
+  '>': '>',
+  '<': '&lt;',
+  '"': '&quot;',
+  '\'': '&#x27;',
+}
+const ESCAPE_REGEX = /[&><'']/g
+
+global.Rev = class Revelry {
+
+  static appObject(name, object) {
+    return Revelry.registerObject(`App.${name}`, object)
+  }
+
+  static registerObject(name, object) {
+    const parts = name.split('.')
+    let container = Revelry
+
+    _(parts).each((part, i) => {
+
+      if(i === parts.length - 1) {
+        if(container[part] !== null && typeof container[part] !== 'undefined' && name !== 'App.Components.Main') {
+          console.warn(`Object previously defined: ${name}`)
+        }
+        container[part] = object
+      } else {
+        container[part] = container[part] || {}
+        container = container[part]
+      }
+    })
+
+    return object
+  }
+
+  static appComponent(name, object) {
+    name = `App.Components.${name}`
+    return Revelry.registerObject(name, Revelry.createReactClass(name, object))
+  }
+
+  static registerComponent(name, object) {
+    name = `Components.${name}`
+    return Revelry.registerObject(name, Revelry.createReactClass(`Rev.${name}`, object))
+  }
+
+  static createReactClass(displayName, object) {
+    object.displayName = displayName
+
+    // Initialize mixins to an empty array if it doesn't exist yet
+    if(!object.mixins) {
+      object.mixins = []
+    } else if(!(object.mixins instanceof Array)) {
+      throw new Error(`${displayName}'s mixins property must be an array.`)
+    }
+
+    // Check for inclusion of missing mixins
+    object.mixins.forEach((mixin, index) => {
+      if(mixin === null || typeof mixin === 'undefined') {
+        console.warn(`${displayName} attempted to include a missing mixin at index ${index}.`)
+      }
+    })
+
+    // Add Revelry Core mixin
+    object.mixins.unshift(Revelry.Mixins.Core)
+
+    if(typeof object === 'function') { // ES6 or Coffeescript class, OK as-is
+      return object
+    }
+    // Old style react class - pass to createClass
+    return React.createClass(object)
+  }
+
+  static appMixin(name, object) {
+    if(object === null || typeof object === 'undefined') {
+      throw new Error(`Missing mixin \`${name}\``)
+    }
+    return Revelry.registerObject(`App.Mixins.${name}`, object)
+  }
+
+  static registerMixin(name, object) {
+    if(object === null || typeof object === 'undefined') {
+      throw new Error(`Missing mixin \`${name}\``)
+    }
+    return Revelry.registerObject(`Mixins.${name}`, object)
+  }
+
+  static registerExample(name, object) {
+    name = `Examples.${name}`
+    return Revelry.registerObject(name, Revelry.createReactClass(`Rev.${name}`, object))
+  }
+
+  static appExample(name, object) {
+    name = `App.Examples.${name}`
+    return Revelry.registerObject(name, Revelry.createReactClass(name, object))
+  }
+
+  static registerModel(name, object) {
+    return Revelry.registerObject(`Models.${name}`, object)
+  }
+
+  static appModel(name, object) {
+    return Revelry.registerObject(`App.Models.${name}`, object)
+  }
+
+  static pullInto(context) {
+    console.warn('`Rev.pullInto` is deprecated.')
+    return (...names) => {
+      names.forEach((name) => context[name] = Rev.Components[name])
+    }
+  }
+
+  static _escaper(match) {
+    return ESCAPE_LOOKUP[match]
+  }
+
+  static escapeTextForBrowser(text) {
+    return (`${text}`).replace(ESCAPE_REGEX, Revelry._escaper)
+  }
+
+  static _resetUniqueId() {
+    let idCounter = 0
+
+    _.uniqueId = function(prefix) {
+      const id = `${++idCounter}`
+
+      return prefix ? prefix + id : id
+    }
+  }
+
+  static hasView(path) {
+    return Revelry.Components.Main.hasView(path)
+  }
+
+  static viewToString(path, options) {
+    Revelry._resetUniqueId()
+
+    const {Main} = Revelry.App.Components
+
+    const props = {
+      path,
+      options: JSON.parse(options),
+    }
+
+    const json = Revelry.escapeTextForBrowser(JSON.stringify(props))
+
+    const tag = (inner) => `<div data-react-class='App.Components.Main' data-react-props='${json}'>${inner}</div>`
+
+    const component = React.createElement(Main, props)
+
+    // 2 checks: One is for standard Rails apps and one for jsonapi-resources.
+    if(props.options.disable_prerender || (props.options.meta && props.options.meta['disable-prerender'])) {
+      return tag
+    }
+
+    try {
+      if(React.renderComponentToString !== null && typeof React.renderComponentToString !== 'undefined') { // < 0.13
+        return tag(React.renderComponentToString(component))
+      } else { // >= 0.13
+        return tag(React.renderToString(component))
+      }
+    } catch(e) {
+      return `<pre><code>${path}</code></pre>` +
+             `<pre><code>${Revelry.escapeTextForBrowser(e.stack)}</code></pre>` +
+             tag('') +
+             `<pre><code>${json}</code></pre>`
+    }
+  }
+
+  static initExecjsRails() {
+    global.execjs_rails_has_view = Revelry.hasView.bind(Revelry)
+    global.execjs_rails_handler = Revelry.viewToString.bind(Revelry)
+  }
+}
+
+global.App = Rev.App = {
+  Mixins: {},
+  Components: {},
+  Examples: {},
+}

data/app/assets/javascripts/revelry/data/Collection.es6

@@ -0,0 +1,3 @@
+//= require backbone
+
+Rev.registerObject('Collection', class RevCollection extends Backbone.Collection {})

data/app/assets/javascripts/revelry/data/Model.es6

@@ -0,0 +1,3 @@
+//= require backbone
+
+Rev.registerObject('Model', class RevModel extends Backbone.Model {})

data/app/assets/javascripts/revelry/examples/Buttons.es6

@@ -0,0 +1,63 @@
+Rev.registerExample('Buttons', class ButtonsExample extends React.Component {
+  render() {
+    const {Row, Col, Button, ButtonGroup, ButtonBar} = Rev.Components
+
+    return (
+      <div>
+        <h3>{"<Button>"}</h3>
+        <Button tiny>tiny</Button>
+        <Button small>small</Button>
+        <Button medium>medium</Button>
+        <Button large>large</Button>
+        <Button alert>alert</Button>
+        <Button disabled>disabled</Button>
+        <Button secondary>secondary</Button>
+        <Button success>success</Button>
+        <h3>{"<ButtonBar> and <ButtonGroup>"}</h3>
+        <Row>
+          <Col>
+            <ButtonBar>
+              <ButtonGroup>
+                <Button>Click me!</Button>
+              </ButtonGroup>
+              <ButtonGroup round>
+                <Button>One</Button>
+                <Button>Two</Button>
+              </ButtonGroup>
+              <ButtonGroup radius>
+                <Button>1</Button>
+                <Button>2</Button>
+                <Button>3</Button>
+              </ButtonGroup>
+            </ButtonBar>
+          </Col>
+        </Row>
+        <Row>
+          <Col>
+            <ButtonGroup even={2}>
+              <Button>Even = 2</Button>
+              <Button>X</Button>
+              <Button>Y</Button>
+              <Button>Z</Button>
+            </ButtonGroup>
+          </Col>
+        </Row>
+        <Row>
+          <Col>
+            <ButtonBar>
+              <ButtonGroup stack>
+                <Button>One</Button>
+                <Button>Two</Button>
+              </ButtonGroup>
+              <ButtonGroup stackForSmall>
+                <Button>stack</Button>
+                <Button>for</Button>
+                <Button>small</Button>
+              </ButtonGroup>
+            </ButtonBar>
+          </Col>
+        </Row>
+      </div>
+    )
+  }
+})

data/app/assets/javascripts/revelry/examples/Charts.es6

@@ -0,0 +1,36 @@
+Rev.registerExample('Charts', class ChartsExample extends React.Component {
+
+  get data() {
+    return {
+      labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
+      datasets: [
+        {
+          label: 'My First dataset',
+          fillColor: 'rgba(220,220,220,0.5)',
+          strokeColor: 'rgba(220,220,220,0.8)',
+          highlightFill: 'rgba(220,220,220,0.75)',
+          highlightStroke: 'rgba(220,220,220,1)',
+          data: [65, 59, 80, 81, 56, 55, 40],
+        },
+        {
+          label: 'My Second dataset',
+          fillColor: 'rgba(151,187,205,0.5)',
+          strokeColor: 'rgba(151,187,205,0.8)',
+          highlightFill: 'rgba(151,187,205,0.75)',
+          highlightStroke: 'rgba(151,187,205,1)',
+          data: [28, 48, 40, 19, 86, 27, 90],
+        },
+      ],
+    }
+  }
+
+  render() {
+    const {ChartBuilder} = Rev.Components
+
+    return (
+      <div>
+        <ChartBuilder type="Line" data={this.data} height={300} width={300} />
+      </div>
+    )
+  }
+})

data/app/assets/javascripts/revelry/examples/Forms.es6

@@ -0,0 +1,53 @@
+Rev.registerExample('<Form> with <Input>, <Textarea>', class FormsExample extends React.Component {
+  render() {
+    const {Row, Col, Form, Input, Textarea, Checkbox, Radio, Select, Option, Switch} = Rev.Components
+
+    return (
+      <div>
+        <Form>
+          <Row>
+            <Col><Input type="text" placeholder="Has a placeholder but no label" /></Col>
+            <Col><Input type="text" label="This one has a label" /></Col>
+            <Col large={6}>
+              <Input type="text" label="Another Error" error="Invalid entry" />
+            </Col>
+            <Col large={6}>
+              <Input type="text" label="Yet Another Error" error="Invalid entry" />
+            </Col>
+            <Col>
+              <Input
+                dom="textarea"
+                label="You can override the inner DOM tag"
+                placeholder="<Input dom={React.DOM.textarea}>"
+              />
+              <Textarea
+                label="This one has an error"
+                placeholder="Or you can just use a <Textarea /> component"
+                error="Invalid entry"
+              />
+            </Col>
+            <Col>
+              <Input type="checkbox" label="One" />
+              <Checkbox label="Two" />
+            </Col>
+            <Col>
+              <Input type="radio" name="myRadio" label="This" />
+              <Radio name="myRadio" label="That" />
+            </Col>
+            <Col>
+              <Input dom="select" label="Pick something">
+                <option value="one">one</option>
+                <option value="two">two</option>
+              </Input>
+              <Select label="Pick another thing" error="Oh no a thing is wrong!" defaultValue="two">
+                <Option value="one">1</Option>
+                <Option value="two">2</Option>
+              </Select>
+            </Col>
+            <Col><Switch />{"This is a <Switch>"}</Col>
+          </Row>
+        </Form>
+      </div>
+    )
+  }
+})