Merge pull request #253 from harena-lab/development

Text editor big refactor

src/adonisjs/public/dccs/components/cell/dcc-cell-ruler.js

@@ -15,6 +15,7 @@ class DCCCellRuler extends DCCBase {
   }
 
   connectedCallback () {
+    super.connectedCallback()
     MessageBus.page.publish('dcc/tool-cell/register', this)
   }
 

src/adonisjs/public/dccs/components/cell/dcc-cell.js

@@ -9,6 +9,8 @@ class DCCCell extends DCCBase {
   }
 
   connectedCallback () {
+    super.connectedCallback()
+
     // Fetch all the children that are not defined yet
     const undefinedProps = this.querySelectorAll(':not(:defined)')
 

src/adonisjs/public/dccs/components/cell/dcc-space-cellular.js

@@ -19,6 +19,8 @@ class DCCSpaceCellular extends DCCBase {
   }
 
   connectedCallback () {
+    super.connectedCallback()
+
     this._stateStr = this.innerHTML.trim()
 
     this._stateTypes = []

src/adonisjs/public/dccs/components/data/dcc-model.js

@@ -0,0 +1,30 @@
+/**
+ * Embeds a data model
+ */
+
+class DCCModel extends DCCBase {
+  connectedCallback () {
+    super.connectedCallback()
+
+    this.requestSchema = this.requestSchema.bind(this)
+    MessageBus.int.subscribe('data/schema/' + this.id, this.requestSchema)
+
+    console.log('=== model schema')
+    console.log(this.schema)
+  }
+
+  /* Properties
+     **********/
+
+  get schema () {
+    return (this._content != null) ? this._content.schema : null;
+  }
+
+  requestSchema (topic, message) {
+    MessageBus.int.publish(MessageBus.buildResponseTopic(topic, message), this.schema)
+  }
+}
+
+(function () {
+  DCC.component('dcc-model', DCCModel)
+})()

src/adonisjs/public/dccs/components/data/dcc-rest.js

@@ -0,0 +1,100 @@
+/**
+ * Embeds a data model
+ */
+
+class DCCRest extends DCCBase {
+  constructor () {
+    super()
+  }
+
+  async connectedCallback () {
+    super.connectedCallback()
+
+    // this.presentReport = this.presentReport.bind(this)
+
+    /*
+    const schema = await this.request('data/schema')
+
+    console.log('=== schema')
+    console.log(schema)
+    */
+  }
+
+  async connect (id, topic) {
+    super.connect(id, topic)
+    const schema = await this.request('data/schema')
+  }
+
+  async restRequest(method, parameters) {
+    console.log('=== rest request')
+    console.log(method)
+    console.log(parameters)
+    if (this._content != null && this._content.paths != null) {
+      const paths = Object.keys(this._content.paths)
+      if (paths.length > 0) {
+        let url = paths[0]
+        for (let p in parameters)
+          url = url.replace('{' + p + '}', parameters[p])
+        const request = {
+          method: method.toUpperCase(),
+          url: url,
+          crossDomain: true,
+          headers: {
+            'Access-Control-Allow-Origin': '*'
+          }
+        }
+        console.log("=== request header")
+        console.log(request)
+        axios(request)
+          .then(function (response) {
+            console.log('=== REST response')
+            console.log(response)
+            // MessageBus.ext.publish(MessageBus.buildResponseTopic(topic, message),
+            //   response.data.source)
+          })
+          .catch(function (error) {
+            console.log('=== REST error')
+            console.log(error)
+          })
+        /*
+        const header = {
+          async: true,
+          crossDomain: true,
+          method: method.toUpperCase(),
+          headers: {
+            'Access-Control-Allow-Origin': '*',
+            'Content-Type': 'application/json'
+          }
+        }
+        const response = await fetch(url, header)
+        const jsonResponse = await response.json()
+        */
+      }
+    }
+  }
+
+  async notify (topic, message) {
+    console.log('=== notify')
+    console.log(topic)
+    console.log(message.role)
+    if (message.role) {
+      switch (message.role.toLowerCase()) {
+        case 'get':
+          if (topic.startsWith('var/')) {
+            let parameters = {}
+            parameters[MessageBus.extractLevel(topic, 2)] =
+              ((message.body)
+                ? ((message.body.value) ? message.body.value : message)
+                : ((message.value) ? message.value : message))
+            this.restRequest('get', parameters)
+          }
+          break
+      }
+    }
+  }
+
+}
+
+(function () {
+  DCC.component('dcc-rest', DCCRest)
+})()

src/adonisjs/public/dccs/components/data/dcc-submit.js

@@ -0,0 +1,47 @@
+/**
+ * Embeds a data model
+ */
+
+class DCCSubmit extends DCCButton {
+  connectedCallback () {
+    super.connectedCallback()
+  }
+
+  async connect (id, topic) {
+    super.connect(id, topic)
+    const result = await this.request('data/schema')
+    if (result != null && result[id] != null)
+      this._schema = result[id]
+    console.log('=== requested schema')
+    console.log(this._schema)
+  }
+
+  _computeTrigger () {
+    if (this._active) {
+      const message = { sourceType: this.nodeName.toLowerCase() }
+      if (this.hasAttribute('label') || this.hasAttribute('topic')) {
+        const topic = (this.hasAttribute('topic'))
+          ? this.topic : 'button/' + this.label + '/submit'
+        if (this.hasAttribute('message')) { message.value = this.message }
+        if (this._schema != null) {
+          const schema = Object.keys(this._schema)
+          console.log('=== form schema')
+          console.log(schema)
+          for (let s of schema) {
+            let field = document.querySelector('#' + s)
+            if (field != null)
+              message[s] = field.value
+          }
+        }
+        console.log('=== form')
+        console.log(topic)
+        console.log(message)
+        MessageBus.ext.publish(topic, message)
+      }
+    }
+  }
+}
+
+(function () {
+  DCC.component('dcc-submit', DCCSubmit)
+})()

src/adonisjs/public/dccs/components/dcc-aggregator.js

@@ -10,6 +10,8 @@ class DCCAggregator extends DCCBase {
   }
 
   connectedCallback () {
+    super.connectedCallback()
+
     if (!this.hasAttribute('publish')) { this.publish = 'dcc/aggregate/post' }
     if (this.hasAttribute('quantity')) {
       if (typeof this.quantity === 'number') { this._quantity = this.quantity } else { this._quantity = parseInt(this.quantity) }

src/adonisjs/public/dccs/components/dcc-base.js

@@ -8,8 +8,13 @@ class DCCBase extends HTMLElement {
     this.edit = this.edit.bind(this)
   }
 
+  connectedCallback () {
+    if (this.hasAttribute('bind'))
+      this._content = DCC.retrieve(this.bind.toLowerCase(), this.nodeName.toLowerCase())
+  }
+
   static get observedAttributes () {
-    return ['id', 'role', 'author']
+    return ['id', 'role', 'author', 'bind']
   }
 
   static get replicatedAttributes () {
@@ -41,6 +46,34 @@ class DCCBase extends HTMLElement {
     if (isAuthor) { this.setAttribute('author', '') } else { this.removeAttribute('author') }
   }
 
+  // binds this DCC to a content component
+  get bind () {
+    return this.getAttribute('bind')
+  }
+
+  set bind (newValue) {
+    this.setAttribute('bind', newValue)
+  }
+
+  // connects this DCC to another
+  connect (id, topic) {
+    if (id != null && topic != null) {
+      if (this._connections == null) this._connections = {}
+      if (this._connections[topic] == null) this._connections[topic] = []
+      this._connections[topic].push(id)
+    }
+  }
+
+  async request (topic) {
+    let response = {}
+    if (this._connections != null && this._connections[topic] != null)
+      for (let c of this._connections[topic]) {
+        const result = await MessageBus.int.request(topic + '/' + c)
+        response[c] = (result != null) ? result.message : null
+      }
+    return response
+  }
+
   edit () {
     /* nothing */
   }

src/adonisjs/public/dccs/components/dcc-compute.js

@@ -6,6 +6,8 @@ class DCCCompute extends DCCBase {
   }
 
   async connectedCallback () {
+    super.connectedCallback()
+
     if (this.hasAttribute('instruction')) {
       if (this.instruction == 'case=0') { MessageBus.ext.publish('case/completed', '') } else {
         const trans = /(\w+)?[ \t]*([+\-*/=])[ \t]*(\d+(?:\.\d+)?)/im

src/adonisjs/public/dccs/components/dcc-image-marker.js

@@ -13,6 +13,8 @@ class DCCImageMarker extends DCCVisual {
   }
 
   async connectedCallback () {
+    super.connectedCallback()
+
     const coordsArr = this.coords.split(',')
     this._coords = {
       x: parseInt(coordsArr[0]),

src/adonisjs/public/dccs/components/dcc-lively-dialog.js

@@ -18,6 +18,8 @@ class DCCLivelyTalk extends DCCVisual {
   }
 
   connectedCallback () {
+    super.connectedCallback()
+
     this._prefixSpeech = (this.speech) ? this.speech : ''
 
     this.addEventListener('schedule-animation', this._scheduleAnimation)

src/adonisjs/public/dccs/components/dcc-markdown.js

@@ -3,6 +3,7 @@
 class DCCMarkdown extends DCCVisual {
   connectedCallback () {
     this._content = this.innerHTML
+    console.log('dcc markdown: ' + this._content)
     this.innerHTML = "<div id='presentation-dcc'>" + this._content + '</div>'
     this._presentation = this.querySelector('#presentation-dcc')
     this._presentationIsReady()

src/adonisjs/public/dccs/components/dcc-rss.js

@@ -11,6 +11,8 @@ class DCCRSS extends DCCBase {
   }
 
   connectedCallback () {
+    super.connectedCallback()
+
     if (!this.hasAttribute('publish')) { this.publish = 'dcc/rss/post' }
     if (!this.hasAttribute('interval')) { this.interval = 1000 }
   }

src/adonisjs/public/dccs/components/dcc-styler.js

@@ -12,6 +12,8 @@ class DCCStyler extends DCCBase {
   }
 
   connectedCallback () {
+    super.connectedCallback()
+
     if (this.hasAttribute('targeted')) {
       this._targeted = this.targeted.split(';')
       for (const t in this._targeted) { this._targeted[t] = this._targeted[t].trim() }
@@ -107,4 +109,4 @@ class DCCStyler extends DCCBase {
 (function () {
   DCCStyler.editableCode = false
   customElements.define('dcc-styler', DCCStyler)
-})()
+})()

src/adonisjs/public/dccs/components/dcc-timer.js

@@ -11,6 +11,8 @@ class DCCTimer extends DCCBase {
   }
 
   connectedCallback () {
+    super.connectedCallback()
+
     if (!this.hasAttribute('cycles')) { this.cycles = 10 }
     if (!this.hasAttribute('interval')) { this.interval = 100 }
     if (!this.hasAttribute('publish')) { this.publish = 'dcc/timer/cycle' }

src/adonisjs/public/dccs/components/dcc-visual.js

@@ -29,6 +29,7 @@ class DCCVisual extends DCCBase {
    */
 
   connectedCallback () {
+    super.connectedCallback()
     this.checkActivateAuthor()
   }
 

src/adonisjs/public/dccs/connect-dcc.js

@@ -0,0 +1,49 @@
+/* DCC Connector
+  **************/
+
+class ConnectDCC extends HTMLElement {
+  connectedCallback () {
+    if (this.hasAttribute('to') && this.hasAttribute('topic')) {
+      this._fromObj = (this.hasAttribute('from'))
+        ? document.querySelector('#' + this.from) : this.parentNode
+      console.log("=== to connect")
+      console.log(this._fromObj)
+      this._fromObj.connect(this.to, this.topic)
+    }
+  }
+
+  /* Properties
+      **********/
+
+  static get observedAttributes () {
+    return ['from', 'to', 'topic']
+  }
+
+  get from () {
+    return this.getAttribute('from')
+  }
+
+  set from (newValue) {
+    this.setAttribute('from', newValue)
+  }
+
+  get to () {
+    return this.getAttribute('to')
+  }
+
+  set to (newValue) {
+    this.setAttribute('to', newValue)
+  }
+
+  get topic () {
+    return this.getAttribute('topic')
+  }
+
+  set topic (newValue) {
+    this.setAttribute('topic', newValue)
+  }
+}
+
+(function () {
+  customElements.define('connect-dcc', ConnectDCC)
+})()