Skip to content

Commit

Permalink
Merge pull request #293 from harena-lab/development
Browse files Browse the repository at this point in the history
refactor (comments/generator): dynamic comments and new generator infra
  • Loading branch information
santanche authored Oct 28, 2021
2 parents 0534314 + d3aeea1 commit ee92ad3
Show file tree
Hide file tree
Showing 71 changed files with 9,051 additions and 7,854 deletions.
18 changes: 13 additions & 5 deletions src/adonisjs/public/author/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -110,10 +110,14 @@
<script src="/author/js/panels.js"></script>
<script src="/author/js/navigator.js"></script>
<script src="/author/js/comments.js"></script>
<script src="/author/js/artifacts.js"></script>
<script src="/author/js/generator/artifact-knot.js"></script>
<script src="/author/js/modifier.js"></script>

<script src="/author/js/author.js"></script>
</head>

<body onload="AuthorManager.author.start()">
<body onload="AuthorManager.i.start()">
<!-- message div -->
<div id="message-space" class="sty-message-space vh-100 vw-100 text-center invisible" style="overflow:hidden; !important">
<span style="top: 50%;position: absolute;"
Expand Down Expand Up @@ -399,7 +403,8 @@ <h6 style="color:#808080;">Created by {{author_grade}}: {{username}} ({{institut
<div id="properties-expansion" class="sty-navigation-expansion">
<div id="properties-set" class="sty-navigation-set">
<dcc-button id="button-expand-prop" topic="control/properties/expand" label="Expand" image="/author/icons/icon-properties.svg"></dcc-button>
<dcc-button id="button-retract-right" topic="control/properties/retract" label="Retract" image="/author/icons/icon-expansion-right.svg" style="display:none"></dcc-button>
<dcc-button id="button-retract-right" topic="control/elements/retract" label="Retract" image="/author/icons/icon-expansion-right.svg" style="display:none"></dcc-button>
<dcc-button id="button-expand-left" topic="control/elements/wide" label="Expand" image="/author/icons/icon-expansion-left.svg" style="display:none"></dcc-button>
<dcc-button id="button-expand-com" topic="control/comments/expand" label="Comment" image="/author/icons/icon-comment.svg"></dcc-button>
<dcc-button id="button-expand-art" topic="control/artifacts/expand" label="Artifacts" image="/author/icons/icon-media.svg"></dcc-button>
</div>
Expand Down Expand Up @@ -427,11 +432,14 @@ <h6 style="color:#808080;">Created by {{author_grade}}: {{username}} ({{institut
<div id="comments-block" class="sty-properties-block std-border" style="display:none">
<div id="comments-display" class="d-flex flex-column sty-knot-panel p-1" style="overflow-y:auto !important; overflow-x:hidden !important;"></div>
</div>
<div id="artifacts-block" class="sty-properties-block std-border" style="display:none">
<div id="artifacts-block" class="sty-properties-block" style="display:none">
<div id="case-artifacts"></div>
<div id="progress-artifacts"></div>
<input type="file" id="artifacts-select" name="artifacts-select" multiple="multiple"
accept="image/png, image/jpeg, image/svg, audio/mpeg, video/mp4, video/webm">
<div id="artifact-controls">
<input type="file" id="artifacts-select" name="artifacts-select" multiple="multiple"
accept="image/png, image/jpeg, image/svg, audio/mpeg, video/mp4, video/webm">
<dcc-button xstyle="in" topic="generator/activate/artifact-knot" label="PLACE IN KNOTS"></dcc-button>
</div>
</div>
</div>
</div>
Expand Down
113 changes: 113 additions & 0 deletions src/adonisjs/public/author/js/artifacts.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,113 @@
/**
* Artifacts Manager
*
* Manages the artifacts.
*/

class Artifacts {
static start (author) {
Artifacts.i = new Artifacts(author)
}

constructor (author) {
this._author = author
this._uploadArtifacts = this._uploadArtifacts.bind(this)
document.querySelector("#artifacts-select").onchange = this._uploadArtifacts
this.activateGenerator = this.activateGenerator.bind(this)
MessageBus.i.subscribe('generator/activate/artifact-knot', this.activateGenerator)
this.deactivateGenerator = this.deactivateGenerator.bind(this)
MessageBus.i.subscribe('generator/finished/artifact-knot', this.deactivateGenerator)
}

async _uploadArtifacts () {
let files = document.querySelector('#artifacts-select').files
let progSpace = document.querySelector('#progress-artifacts')
let a = 0
for (let f of files) {
let art = document.createElement('div')
progSpace.appendChild(art)
a++
let prMsg = "action/upload/artifact/" + a
art.innerHTML =
'<dcc-progress index><subscribe-dcc topic="' + prMsg + '" map="update">' +
'</subscribe-dcc></dcc-progress>'
let ref = document.createElement('div')
progSpace.appendChild(ref)
ref.innerHTML = f.name
const artifact = await
MessageBus.i.request('data/asset//new',
{
file: f,
caseid: Basic.service.currentCaseId,
progress: prMsg
}, null, true)
ref.innerHTML = '<a href="' + artifact.message.url + '" target="_blank">' +
f.name + '</a>'
this._insertArtifactReference(artifact.message.filename, f.name)
}
progSpace.innerHTML = ''
this.showArtifacts()
}

_insertArtifactReference (artifactId, artifactName) {
let compiledCase = this._author.compiledCase

if (!compiledCase.layers.Data) {
compiledCase.layers.Data = {
_source: '',
content: []
}
}

const content = compiledCase.layers.Data.content
let artifacts = null
for (let c of content)
if (c.type == 'field' && c.field == 'artifacts')
artifacts = c

if (artifacts == null) {
artifacts = {
_source: '',
type: 'field',
field: 'artifacts',
value: {}
}
artifacts.seq = (content.length == 0) ? 1 : content[content.length - 1].seq + 1
content.push(artifacts)
compiledCase.artifacts = artifacts.value
Properties.s.artifacts = compiledCase.artifacts
}

artifacts.value[artifactId] = artifactName
Translator.instance.updateElementMarkdown(artifacts)
compiledCase.layers.Data._source =
'\n' + Translator.instance.contentToMarkdown(content)
}

showArtifacts () {
if (this._author.compiledCase.artifacts) {
const artifacts = this._author.compiledCase.artifacts
let artHTML = ''
for (let a in artifacts)
artHTML += '<div><a href="' + Basic.service.imageResolver(a) +
'" target="_blank">' +
artifacts[a] + '</a></div>'
document.querySelector('#case-artifacts').innerHTML = artHTML
}
}

activateGenerator () {
const compiled = this._author.compiledCase
if (compiled.generators && compiled.generators['artifact-knot'] != null &&
compiled.artifacts) {
document.querySelector('#artifact-controls').style.display = 'none'
ArtifactKnotGenerator.activate(
compiled.artifacts, compiled.generators['artifact-knot'],
document.querySelector('#case-artifacts'))
}
}

deactivateGenerator () {
document.querySelector('#artifact-controls').style.display = 'initial'
}
}
71 changes: 57 additions & 14 deletions src/adonisjs/public/author/js/author.js
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@ class AuthorManager {

this.updateSourceField = this.updateSourceField.bind(this)

this._uploadArtifacts = this._uploadArtifacts.bind(this)
// this._uploadArtifacts = this._uploadArtifacts.bind(this)

this._caseModified = false

Expand Down Expand Up @@ -80,6 +80,16 @@ class AuthorManager {
? this._compiledCase.templates.categories : null
}

// <TODO> probably provisory - used by Artifacts
get compiledCase () {
return this._compiledCase
}

set compiledCase (compiled) {
this._compiledCase = compiled
this._knots = compiled.knots
}

/*
*
*/
Expand Down Expand Up @@ -112,7 +122,8 @@ class AuthorManager {
this._messageSpace = document.querySelector('#message-space')
this.authorizeCommentSection()

document.querySelector("#artifacts-select").onchange = this._uploadArtifacts
// document.querySelector("#artifacts-select").onchange = this._uploadArtifacts
Artifacts.start(this)

if (caseid != null) { this._caseLoad(caseid) }

Expand Down Expand Up @@ -161,6 +172,8 @@ class AuthorManager {
break
case 'control/case/markdown': this.caseMarkdown()
break
case 'control/case/refresh': this.showCase()
break
case 'control/case/play': this.casePlay()
break
case 'control/case/settings': await this.caseRename()
Expand Down Expand Up @@ -280,25 +293,29 @@ class AuthorManager {

this._currentCaseTitle = caseObj.message.title
await this._compile(caseObj.message.source)
await this._showCase()
await this.showCase()
}

async _compile (caseSource) {
this._compiledCase =
await Translator.instance.compileMarkdown(Basic.service.currentCaseId,
caseSource)
Basic.service.composedThemeFamily(this._compiledCase.theme)
this._updateCompiled()
}

_updateCompiled () {
this._knots = this._compiledCase.knots

Basic.service.composedThemeFamily(this._compiledCase.theme)
if (this._compiledCase.title) { this._currentCaseTitle = this._compiledCase.title }

console.log('***** COMPILED CASE *****')
console.log(this._compiledCase)
}

async _showCase (selectKnot) {
this._showArtifacts()
async showCase (selectKnot) {
// this._showArtifacts()
Artifacts.i.showArtifacts()
Properties.s.artifacts = this._compiledCase.artifacts

await this._navigator.mountTreeCase(this, this._compiledCase.knots)
Expand All @@ -314,6 +331,7 @@ class AuthorManager {
MessageBus.i.publish('control/knot/selected', sk, true)
}

/*
_showArtifacts () {
if (this._compiledCase.artifacts) {
let artHTML = ''
Expand All @@ -324,6 +342,7 @@ class AuthorManager {
document.querySelector('#case-artifacts').innerHTML = artHTML
}
}
*/

/*
* ACTION: control-save
Expand All @@ -338,8 +357,8 @@ class AuthorManager {

})
.then(function (rej) {
AuthorManager.author._messageSpace.firstElementChild.innerHTML = 'Error ocurred. Trying again...'
setTimeout(() => {AuthorManager.author.caseSave()}, 3000)
AuthorManager.i._messageSpace.firstElementChild.innerHTML = 'Error ocurred. Trying again...'
setTimeout(() => {AuthorManager.i.caseSave()}, 3000)
})
await Properties.s.closePreviousProperties()
await this._updateActiveComments()
Expand Down Expand Up @@ -470,7 +489,7 @@ class AuthorManager {
if (nextState != 3) { delete this._originalMd }
await this._compile(editorText)
if (nextState == 3) { this._renderState = 1 }
this._showCase()
this.showCase()
}
}
}
Expand Down Expand Up @@ -520,19 +539,23 @@ class AuthorManager {
this._renderKnot()
delete this._elementSelected
await this._updateActiveComments()
this._comments = new Comments(this._compiledCase, knotid)
Comments.prepare(this._compiledCase, knotid)
if (Panels.s.commentsVisible)
this._comments.activateComments()
MessageBus.i.publish('control/comments/editor')
MessageBus.i.publish('control/case/ready', null, true)
}
}

async _updateActiveComments() {
if (Comments.i && Comments.i.activated)
await MessageBus.i.request('control/comments/submit', null, null, true)
/*
if (this._comments != null) {
if (this._comments.activated)
await MessageBus.i.request('control/comments/submit', null, null, true)
this._comments.close()
}
*/
}

/*
Expand All @@ -555,6 +578,7 @@ class AuthorManager {
if (template == null)
template = await this._templateSelect('knot', this._templateNewKnot)

/*
if (template != null) {
let knotTarget =
(message != null && message.knotid != null)
Expand Down Expand Up @@ -611,12 +635,29 @@ class AuthorManager {
this._compiledCase, true)
await this._compile(md)
*/

let knotTarget =
(message != null && message.knotid != null)
? message.knotid : this._knotSelected

let status = await MessageBus.i.request('modify/knot/create',
{target: knotTarget,
before: false,
template: template})

console.log('=== status knot create')
console.log(status)

if (status.message) {
this._knots = this._compiledCase.knots

let newSelected = null
const kl = Object.keys(this._knots)
const ki = kl.indexOf(knotTarget)
if (ki > -1 && ki + 1 < kl.length) { newSelected = kl[ki + 1] }

await this._showCase(newSelected)
await this.showCase(newSelected)
}
}

Expand Down Expand Up @@ -853,7 +894,7 @@ class AuthorManager {

const md = Translator.instance.assembleMarkdown(this._compiledCase, true)
this._compile(md)
this._showCase()
this.showCase()

this._knotSelected = newIndex
}
Expand Down Expand Up @@ -954,6 +995,7 @@ class AuthorManager {
this._themeSVG = themeObj.svg
}

/*
async _uploadArtifacts () {
let files = document.querySelector('#artifacts-select').files
let progSpace = document.querySelector('#progress-artifacts')
Expand Down Expand Up @@ -1022,11 +1064,12 @@ class AuthorManager {
console.log('=== updated artifact')
console.log(artifacts)
}
*/
}

(function () {
AuthorManager.jsonKnot = '(function() { PlayerManager.player.presentKnot(`{knot}`) })();'
AuthorManager.jsonNote = '(function() { PlayerManager.player.presentNote(`{knot}`) })();'

AuthorManager.author = new AuthorManager()
AuthorManager.i = new AuthorManager()
})()
Loading

0 comments on commit ee92ad3

Please sign in to comment.