Skip to content

Commit

Permalink
change tokens replace feature
Browse files Browse the repository at this point in the history
  • Loading branch information
khansadaoudi committed Oct 2, 2024
1 parent 30b2b3b commit 1e56662
Show file tree
Hide file tree
Showing 5 changed files with 202 additions and 195 deletions.
112 changes: 62 additions & 50 deletions src/components/sentence/ConlluDialog.vue
Original file line number Diff line number Diff line change
Expand Up @@ -35,13 +35,14 @@
</q-td>
<q-td key="LEMMA" :props="props">
{{ props.row.LEMMA }}
<q-popup-edit v-model="props.row.LEMMA" auto-save v-slot="scope" >
<q-popup-edit v-if="!props.row.ID.includes('-')" v-model="props.row.LEMMA" auto-save v-slot="scope" >
<q-input v-model="scope.value" dense autofocus />
</q-popup-edit>
</q-td>
<q-td key="UPOS" :props="props">
{{ props.row.UPOS }}
<q-popup-edit
v-if="!props.row.ID.includes('-')"
v-model="props.row.UPOS"
buttons
label-set="Save"
Expand All @@ -61,13 +62,14 @@
</q-td>
<q-td key="XPOS">
{{ props.row.XPOS }}
<q-popup-edit v-model="props.row.XPOS" auto-save v-slot="scope" >
<q-popup-edit v-if="!props.row.ID.includes('-')" v-model="props.row.XPOS" auto-save v-slot="scope" >
<q-input v-model="scope.value" dense autofocus />
</q-popup-edit>
</q-td>
<q-td key="FEATS" :props="props">
{{ props.row.FEATS }}
<q-popup-edit
v-if="!props.row.ID.includes('-')"
v-model="props.row.FEATS"
buttons
label-set="Save"
Expand All @@ -88,6 +90,7 @@
<q-td key="HEAD" :props="props">
{{ props.row.HEAD }}
<q-popup-edit
v-if="!props.row.ID.includes('-')"
v-model.number="props.row.HEAD"
buttons
label-set="Save"
Expand All @@ -109,6 +112,7 @@
<q-td key="DEPREL" :props="props">
{{ props.row.DEPREL }}
<q-popup-edit
v-if="!props.row.ID.includes('-')"
v-model="props.row.DEPREL"
buttons
label-set="Save"
Expand All @@ -128,7 +132,7 @@
</q-td>
<q-td key="DEPS">
{{ props.row.DEPS }}
<q-popup-edit v-model="props.row.DEPS" auto-save v-slot="scope" >
<q-popup-edit v-if="!props.row.ID.includes('-')" v-model="props.row.DEPS" auto-save v-slot="scope" >
<q-input v-model="scope.value" dense autofocus />
</q-popup-edit>
</q-td>
Expand All @@ -138,6 +142,18 @@
<q-input v-model="scope.value" dense autofocus />
</q-popup-edit>
</q-td>
<q-menu
touch-position
context-menu
>
<TokensReplaceDialog
:sentence-bus="sentenceBus"
:reactive-sentences-obj="reactiveSentencesObj"
:user-id="userId"
:token="props.row"
@reload="getConllTable()"
/>
</q-menu>
</q-tr>
</template>
</q-table>
Expand All @@ -157,71 +173,42 @@
</template>

<script lang="ts">
import CodeMirror2 from 'codemirror';
import Codemirror from 'codemirror-editor-vue3';
import TokensReplaceDialog from './TokensReplaceDialog.vue';
import { copyToClipboard } from 'quasar';
import { tokenJson_T, _featuresConllToJson, _depsConllToJson, nodesJson_T } from 'conllup/lib/conll';
import { tokenJson_T, _featuresConllToJson, _depsConllToJson, nodesJson_T, groupsJson_T } from 'conllup/lib/conll';
import { mapState } from 'pinia';
import { useProjectStore } from 'src/pinia/modules/project';
import { useUserStore } from 'src/pinia/modules/user';
import { sentence_bus_t, table_t } from 'src/types/main_types';
import { sentence_bus_t, table_t, reactive_sentences_obj_t } from 'src/types/main_types';
import { notifyMessage } from 'src/utils/notify';
import { PropType, defineComponent } from 'vue';
CodeMirror2.defineMode('tsv', () => {
function tokenBase(stream: any) {
if (stream.string.match(/^#.+/)) {
stream.skipToEnd();
return 'comment';
}
const ch = stream.next();
if (/\d/.test(ch)) {
stream.eatWhile(/[\d]/);
if (stream.eat('.')) {
stream.eatWhile(/[\d]/);
}
return 'number';
}
if (/[+\-*&%=<>!?|:]/.test(ch)) {
return 'operator';
}
stream.eatWhile(/\w/);
return 'variable';
}
return {
startState() {
return { tokenize: tokenBase, commentLevel: 0 };
},
token(stream: any, state: any) {
if (stream.eatSpace()) return null;
return state.tokenize(stream, state);
},
lineComment: '#',
};
});
interface formatError_t {
[key: string]: {
error: boolean,
message: string
}
}
export default defineComponent({
components: { Codemirror },
components: { Codemirror, TokensReplaceDialog },
props: {
sentenceBus: {
type: Object as PropType<sentence_bus_t>,
required: true,
},
reactiveSentencesObj: {
type: Object as PropType<reactive_sentences_obj_t>,
required: true,
},
},
data() {
const conllTable: any[] = [];
const conllColumns = ['ID', 'FORM', 'LEMMA', 'UPOS', 'XPOS', 'FEATS', 'HEAD', 'DEPREL', 'DEPS', 'MISC'];
const conllColumnsToCheck = ['UPOS', 'FEATS', 'HEAD', 'DEPREL'];
const nodesJson: nodesJson_T = {};
const groupsJson: groupsJson_T = {};
const table: table_t<tokenJson_T> = {
fields: [],
visibleColumns: [],
Expand Down Expand Up @@ -259,6 +246,7 @@ export default defineComponent({
readOnly: true,
},
formatErrorTable,
groupsJson,
};
},
computed: {
Expand All @@ -279,8 +267,6 @@ export default defineComponent({
this.userId = userId;
this.conlluDialogOpened = true;
this.currentConllContent = this.sentenceBus.sentenceSVGs[this.userId].exportConll();
this.conllContent = this.sentenceBus.sentenceSVGs[this.userId].exportConll();
this.nodesJson = this.sentenceBus.sentenceSVGs[this.userId].treeJson.nodesJson;
this.getConllTable();
});
this.createTableFields();
Expand All @@ -290,8 +276,21 @@ export default defineComponent({
},
methods: {
getConllTable() {
this.conllTable = [];
this.conllContent = this.sentenceBus.sentenceSVGs[this.userId].exportConll();
this.nodesJson = this.sentenceBus.sentenceSVGs[this.userId].treeJson.nodesJson;
this.groupsJson = this.sentenceBus.sentenceSVGs[this.userId].treeJson.groupsJson;
for (const node of Object.values(this.nodesJson)) {
const multiWordId = `${node.ID}-${parseInt(node.ID) +1}`;
const multiWordNode = this.groupsJson[multiWordId]
if (multiWordNode) {
this.conllTable.push({
...multiWordNode,
HEAD: multiWordNode.HEAD === -1 ? '_' : multiWordNode.HEAD,
FEATS: this.formatTableEntry(multiWordNode.FEATS, '='),
DEPS: this.formatTableEntry(multiWordNode.DEPS, ':'),
MISC: this.formatTableEntry(multiWordNode.MISC, '='),
});
}
this.conllTable.push({
...node,
HEAD: node.HEAD === -1 ? '_' : node.HEAD,
Expand All @@ -300,6 +299,9 @@ export default defineComponent({
MISC: this.formatTableEntry(node.MISC, '='),
});
}
this.conllColumnsToCheck.forEach((column) => {
this.formatErrorTable[column] = { error: false, message: '' };
});
},
formatTableEntry(entry: any, linkOperator: string ) {
return Object.entries(entry)
Expand Down Expand Up @@ -335,14 +337,24 @@ export default defineComponent({
},
generateConllFromTable() {
this.conllTable.forEach((row, index) => {
this.nodesJson[`${index + 1}`] = {
...row,
FEATS: row.FEATS ? _featuresConllToJson(row.FEATS) : {},
MISC: row.MISC ? _featuresConllToJson(row.MISC) : {},
DEPS: row.DEPS ? _depsConllToJson(row.DEPS) : {},
};
if (!row.ID.includes('-')) {
this.nodesJson[`${index + 1}`] = {
...row,
FEATS: row.FEATS ? _featuresConllToJson(row.FEATS) : {},
MISC: row.MISC ? _featuresConllToJson(row.MISC) : {},
DEPS: row.DEPS ? _depsConllToJson(row.DEPS) : {},
};
}
else {
this.groupsJson[row.ID] = {
...row,
FEATS: row.FEATS ? _featuresConllToJson(row.FEATS) : {},
MISC: row.MISC ? _featuresConllToJson(row.MISC) : {},
}
}
});
this.sentenceBus.sentenceSVGs[this.userId].treeJson.nodesJson = { ...this.nodesJson };
this.sentenceBus.sentenceSVGs[this.userId].treeJson.groupsJson = { ...this.groupsJson };
},
copyConll() {
copyToClipboard(this.currentConllContent).then(() => {
Expand Down
25 changes: 24 additions & 1 deletion src/components/sentence/FeaturesDialog.vue
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,23 @@
:isModifiable="true"
title="Miscellaneous Features"
></AttributeTable>
<q-separator />
</q-card-section>

<q-card-section>
<q-expansion-item
expand-separator
label="Edit tokens"
>
<TokensReplaceDialog
:sentence-bus="sentenceBus"
:reactive-sentences-obj="reactiveSentencesObj"
:token="token"
:user-id="userId"
@reload="featuresDialogOpened = false"
>
</TokensReplaceDialog>
</q-expansion-item>
</q-card-section>

<q-card-actions class="sticky-card-actions" align="around">
Expand All @@ -44,22 +61,28 @@
import conllup from 'conllup';
import { mapState } from 'pinia';
import { useProjectStore } from 'src/pinia/modules/project';
import { sentence_bus_t } from 'src/types/main_types';
import { sentence_bus_t, reactive_sentences_obj_t } from 'src/types/main_types';
import { PropType, defineComponent } from 'vue';
import AttributeTable from './AttributeTable.vue';
import TokensReplaceDialog from './TokensReplaceDialog.vue';
const emptyTokenJson = conllup.emptyTokenJson;
export default defineComponent({
components: {
AttributeTable,
TokensReplaceDialog,
},
props: {
sentenceBus: {
type: Object as PropType<sentence_bus_t>,
required: true,
},
reactiveSentencesObj: {
type: Object as PropType<reactive_sentences_obj_t>,
required: true,
},
},
data() {
const feat: { a: string; v: string }[] = [];
Expand Down
12 changes: 6 additions & 6 deletions src/components/sentence/SentenceCard.vue
Original file line number Diff line number Diff line change
Expand Up @@ -114,18 +114,18 @@
<RelationDialog :sentence-bus="sentenceBus" />
<UposDialog :sentence-bus="sentenceBus" />
<XposDialog :sentence-bus="sentenceBus" />
<FeaturesDialog :sentence-bus="sentenceBus" @changed:meta-text="changeText()" />
<MetaDialog :sentence-bus="sentenceBus" />
<ConlluDialog :sentence-bus="sentenceBus" />
<ExportSVG
<FeaturesDialog
:sentence-bus="sentenceBus"
:reactive-sentences-obj="(reactiveSentencesObj as reactive_sentences_obj_t)"
@changed:meta-text="changeText()"
/>
<TokensReplaceDialog
<MetaDialog :sentence-bus="sentenceBus" />
<ConlluDialog :sentence-bus="sentenceBus" :reactive-sentences-obj="(reactiveSentencesObj as reactive_sentences_obj_t)" />
<ExportSVG
:sentence-bus="sentenceBus"
:reactive-sentences-obj="(reactiveSentencesObj as reactive_sentences_obj_t)"
@changed:meta-text="changeText()"
/>

<MultiEditDialog
:sentence-bus="sentenceBus"
:reactive-sentences-obj="(reactiveSentencesObj as reactive_sentences_obj_t)"
Expand Down
18 changes: 10 additions & 8 deletions src/components/sentence/SentenceToolBar.vue
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
v-bind="$attrs"
readonly
borderless
@select="editTokens"
@select="notifyNewFeature"
>
<q-tooltip v-if="openTabUser !== ''" anchor="bottom middle" self="center middle" :offset="[10, 10]">
{{ $t('sentenceCard.selectTooltip') }}
Expand Down Expand Up @@ -197,6 +197,7 @@ import { defineComponent, PropType } from 'vue';
import TagsMenu from './TagsMenu.vue';
import SentenceSegmentation from './SentenceSegmentation.vue';
import { notifyMessage } from 'src/utils/notify';
export default defineComponent({
name: 'sentenceToolBar',
Expand Down Expand Up @@ -276,13 +277,14 @@ export default defineComponent({
}
},
methods: {
editTokens(event: Event) {
if (this.openTabUser !== '' && this.isAdmin) {
this.sentenceBus.emit('open:tokensReplaceDialog', {
userId: this.openTabUser,
event,
});
}
notifyNewFeature(event: Event) {
const docLink = "Doc link".link('https://arborator.github.io/arborator-documentation/#/annotation?id=tokens-editing-options')
notifyMessage({
message: `This feature has been changed if you want to change tokens segmentation check this link ${docLink}`,
position: 'top',
timeout: 3000,
});
event.stopPropagation();
},
openStatisticsDialog() {
this.sentenceBus.emit('open:statisticsDialog', {
Expand Down
Loading

0 comments on commit 1e56662

Please sign in to comment.