Browse Source

Rename file name

pull/10/head
Hironsan 6 years ago
parent
commit
e4c60e39b4
2 changed files with 86 additions and 287 deletions
  1. 191
      doccano/app/server/static/annotation.1.js
  2. 182
      doccano/app/server/static/annotation.js

191
doccano/app/server/static/annotation.1.js

@ -1,191 +0,0 @@
import Vue from 'vue';
Vue.use(require('vue-shortkey'));
axios.defaults.xsrfCookieName = 'csrftoken';
axios.defaults.xsrfHeaderName = 'X-CSRFToken';
var base_url = window.location.href.split('/').slice(3, 5).join('/');
function swap(values) {
var ret = {};
for (var item of values) {
ret[item['text']] = item['id'];
}
return ret;
};
var vm = new Vue({
el: '#mail-app',
delimiters: ['[[', ']]'],
data: {
cur: 0,
items: [{
"id": null,
"labels": [],
"text": ''
}],
labels: [],
guideline: 'Here is the Annotation Guideline Text',
total: 0,
remaining: 0,
searchQuery: '',
hasNext: false,
hasPrevious: false,
nextPageNum: 1,
prevPageNum: 1,
page: 1,
message_body: '',
},
methods: {
addLabel: function (label) {
for (var i = 0; i < this.items[this.cur]['labels'].length; i++) {
var item = this.items[this.cur]['labels'][i];
if (label == item.text) {
this.deleteLabel(i);
return;
}
}
var label = {
'text': label,
'prob': null
};
this.items[this.cur]['labels'].push(label);
var label2id = swap(this.labels);
var data = {
'id': this.items[this.cur]['id'],
'label_id': label2id[label['text']]
};
axios.post('/' + base_url + '/apis/data', data)
.then(function (response) {
console.log('post data');
})
.catch(function (error) {
console.log('ERROR!! happend by Backend.')
});
this.updateProgress();
},
deleteLabel: function (index) {
var label2id = swap(this.labels);
var label = this.items[this.cur]['labels'][index];
var payload = {
'id': this.items[this.cur]['id'],
'label_id': label2id[label['text']]
};
axios.delete('/' + base_url + '/apis/data', {
data: payload
})
.then(function (response) {
console.log('delete data');
})
.catch(function (error) {
console.log('ERROR!! happend by Backend.')
});
this.items[this.cur]['labels'].splice(index, 1)
this.updateProgress();
},
nextPage: function () {
this.cur += 1;
if (this.cur == this.items.length) {
if (this.hasNext) {
this.page = this.nextPageNum;
this.submit();
this.cur = 0;
} else {
this.cur = this.items.length - 1;
}
}
this.showMessage(this.cur);
},
prevPage: function () {
this.cur -= 1;
if (this.cur == -1) {
if (this.hasPrevious) {
this.page = this.prevPageNum;
this.submit();
this.cur = this.items.length - 1;
} else {
this.cur = 0;
}
}
this.showMessage(this.cur);
},
activeLearn: function () {
alert('Active Learning!');
},
submit: function () {
console.log('submit' + this.searchQuery);
var self = this;
axios.get('/' + base_url + '/apis/search?keyword=' + this.searchQuery + '&page=' + this.page)
.then(function (response) {
console.log('search response');
console.log(response.data);
self.items = response.data['data'];
self.hasNext = response.data['has_next']
self.nextPageNum = response.data['next_page_number']
self.hasPrevious = response.data['has_previous']
self.prevPageNum = response.data['previous_page_number']
//self.searchQuery = '';
})
.catch(function (error) {
console.log('ERROR!! happend by Backend.')
});
},
showMessage: function (index) {
this.cur = index;
//$('#message-pane').removeClass('is-hidden');
$('.card').removeClass('active');
$('#msg-card-' + index).addClass('active');
var text = this.items[index].text;
this.message_body = text;
},
updateProgress: function() {
var self = this;
axios.get('/' + base_url + '/apis/progress')
.then(function (response) {
self.total = response.data['total'];
self.remaining = response.data['remaining'];
})
.catch(function (error) {
console.log('ERROR!! happend by Backend.')
});
}
},
created: function () {
var self = this;
axios.get('/' + base_url + '/apis/labels')
.then(function (response) {
self.labels = response.data['labels'];
})
.catch(function (error) {
console.log('ERROR!! happend by Backend.')
});
this.updateProgress();
this.submit();
},
computed: {
done: function () {
return this.total - this.remaining
},
achievement: function () {
if (this.total == 0) {
return 0;
} else {
return (this.total - this.remaining) / this.total * 100
}
},
progressColor: function () {
if (this.achievement < 30) {
return 'is-danger'
} else if (this.achievement < 70) {
return 'is-warning'
} else {
return 'is-primary'
}
}
}
});

182
doccano/app/server/static/annotation.js

@ -1,3 +1,6 @@
import Vue from 'vue';
Vue.use(require('vue-shortkey'));
axios.defaults.xsrfCookieName = 'csrftoken'; axios.defaults.xsrfCookieName = 'csrftoken';
axios.defaults.xsrfHeaderName = 'X-CSRFToken'; axios.defaults.xsrfHeaderName = 'X-CSRFToken';
var base_url = window.location.href.split('/').slice(3, 5).join('/'); var base_url = window.location.href.split('/').slice(3, 5).join('/');
@ -11,78 +14,8 @@ function swap(values) {
return ret; return ret;
}; };
Vue.component('tabs', {
template: `
<div>
<div class="tabs is-boxed is-right" style="margin-bottom:0;">
<ul>
<li v-for="tab in tabs" :class="{ 'is-active': tab.isActive }">
<a :href="tab.href" @click="selectTab(tab)">{{ tab.name }}</a>
</li>
</ul>
</div>
<div class="tabs-details">
<slot></slot>
</div>
</div>
`,
data() {
return {
tabs: []
};
},
created() {
this.tabs = this.$children;
},
methods: {
selectTab(selectedTab) {
this.tabs.forEach(tab => {
tab.isActive = (tab.name == selectedTab.name);
});
}
}
});
Vue.component('tab', {
template: `
<div v-show="isActive"><slot></slot></div>
`,
props: {
name: {
required: true
},
selected: {
default: false
},
},
data() {
return {
isActive: false
}
},
computed: {
href() {
return '#' + this.name.toLowerCase().replace(/ /g, '-')
}
},
mounted() {
this.isActive = this.selected
}
});
var vm = new Vue({ var vm = new Vue({
el: '#root',
el: '#mail-app',
delimiters: ['[[', ']]'], delimiters: ['[[', ']]'],
data: { data: {
cur: 0, cur: 0,
@ -96,11 +29,24 @@ var vm = new Vue({
total: 0, total: 0,
remaining: 0, remaining: 0,
searchQuery: '', searchQuery: '',
history: []
hasNext: false,
hasPrevious: false,
nextPageNum: 1,
prevPageNum: 1,
page: 1,
message_body: '',
}, },
methods: { methods: {
addLabel: function (label) { addLabel: function (label) {
for (var i = 0; i < this.items[this.cur]['labels'].length; i++) {
var item = this.items[this.cur]['labels'][i];
if (label == item.text) {
this.deleteLabel(i);
return;
}
}
var label = { var label = {
'text': label, 'text': label,
'prob': null 'prob': null
@ -120,6 +66,7 @@ var vm = new Vue({
.catch(function (error) { .catch(function (error) {
console.log('ERROR!! happend by Backend.') console.log('ERROR!! happend by Backend.')
}); });
this.updateProgress();
}, },
deleteLabel: function (index) { deleteLabel: function (index) {
var label2id = swap(this.labels); var label2id = swap(this.labels);
@ -139,14 +86,33 @@ var vm = new Vue({
console.log('ERROR!! happend by Backend.') console.log('ERROR!! happend by Backend.')
}); });
this.items[this.cur]['labels'].splice(index, 1) this.items[this.cur]['labels'].splice(index, 1)
this.updateProgress();
}, },
nextPage: function () { nextPage: function () {
this.cur = Math.min(this.cur + 1, this.items.length - 1);
this.remaining -= 1;
this.cur += 1;
if (this.cur == this.items.length) {
if (this.hasNext) {
this.page = this.nextPageNum;
this.submit();
this.cur = 0;
} else {
this.cur = this.items.length - 1;
}
}
this.showMessage(this.cur);
}, },
prevPage: function () { prevPage: function () {
this.cur = Math.max(this.cur - 1, 0);
this.remaining += 1;
this.cur -= 1;
if (this.cur == -1) {
if (this.hasPrevious) {
this.page = this.prevPageNum;
this.submit();
this.cur = this.items.length - 1;
} else {
this.cur = 0;
}
}
this.showMessage(this.cur);
}, },
activeLearn: function () { activeLearn: function () {
alert('Active Learning!'); alert('Active Learning!');
@ -154,29 +120,32 @@ var vm = new Vue({
submit: function () { submit: function () {
console.log('submit' + this.searchQuery); console.log('submit' + this.searchQuery);
var self = this; var self = this;
axios.get('/' + base_url + '/apis/search?keyword=' + this.searchQuery)
axios.get('/' + base_url + '/apis/search?keyword=' + this.searchQuery + '&page=' + this.page)
.then(function (response) { .then(function (response) {
console.log('search response'); console.log('search response');
self.history = response.data['data'];
console.log(response.data);
self.items = response.data['data'];
self.hasNext = response.data['has_next']
self.nextPageNum = response.data['next_page_number']
self.hasPrevious = response.data['has_previous']
self.prevPageNum = response.data['previous_page_number']
//self.searchQuery = '';
}) })
.catch(function (error) { .catch(function (error) {
console.log('ERROR!! happend by Backend.') console.log('ERROR!! happend by Backend.')
}); });
}
},
created: function () {
var self = this;
axios.get('/' + base_url + '/apis/labels')
.then(function (response) {
self.labels = response.data['labels'];
//self.total = response.data['total'];
//self.remaining = response.data['remaining'];
})
.catch(function (error) {
console.log('ERROR!! happend by Backend.')
});
axios.get('/' + base_url + '/apis/progress')
},
showMessage: function (index) {
this.cur = index;
//$('#message-pane').removeClass('is-hidden');
$('.card').removeClass('active');
$('#msg-card-' + index).addClass('active');
var text = this.items[index].text;
this.message_body = text;
},
updateProgress: function() {
var self = this;
axios.get('/' + base_url + '/apis/progress')
.then(function (response) { .then(function (response) {
self.total = response.data['total']; self.total = response.data['total'];
self.remaining = response.data['remaining']; self.remaining = response.data['remaining'];
@ -184,18 +153,39 @@ var vm = new Vue({
.catch(function (error) { .catch(function (error) {
console.log('ERROR!! happend by Backend.') console.log('ERROR!! happend by Backend.')
}); });
axios.get('/' + base_url + '/apis/data')
}
},
created: function () {
var self = this;
axios.get('/' + base_url + '/apis/labels')
.then(function (response) { .then(function (response) {
self.items = response.data['data'];
self.labels = response.data['labels'];
}) })
.catch(function (error) { .catch(function (error) {
console.log('ERROR!! happend by Backend.') console.log('ERROR!! happend by Backend.')
}); });
this.updateProgress();
this.submit();
}, },
computed: { computed: {
done: function () { done: function () {
return this.total - this.remaining return this.total - this.remaining
},
achievement: function () {
if (this.total == 0) {
return 0;
} else {
return (this.total - this.remaining) / this.total * 100
}
},
progressColor: function () {
if (this.achievement < 30) {
return 'is-danger'
} else if (this.achievement < 70) {
return 'is-warning'
} else {
return 'is-primary'
}
} }
} }
}); });
Loading…
Cancel
Save