diff --git a/app/server/static/bundle/seq2seq.js b/app/server/static/bundle/seq2seq.js index 624f6ef7..a871bb71 100644 --- a/app/server/static/bundle/seq2seq.js +++ b/app/server/static/bundle/seq2seq.js @@ -185,7 +185,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _htt /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vue */ \"./node_modules/vue/dist/vue.esm.js\");\n/* harmony import */ var _mixin_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./mixin.js */ \"./static/js/mixin.js\");\n/* harmony import */ var _http_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./http.js */ \"./static/js/http.js\");\n\nvue__WEBPACK_IMPORTED_MODULE_0__[\"default\"].use(__webpack_require__(/*! vue-shortkey */ \"./node_modules/vue-shortkey/dist/index.js\"));\n\n\n\nvar vm = new vue__WEBPACK_IMPORTED_MODULE_0__[\"default\"]({\n el: '#mail-app',\n delimiters: ['[[', ']]'],\n mixins: [_mixin_js__WEBPACK_IMPORTED_MODULE_1__[\"default\"]],\n\n methods: {\n addLabel: async function (label_id) {\n var payload = {\n 'label_id': label_id\n };\n\n var doc_id = this.items[this.cur].id;\n await _http_js__WEBPACK_IMPORTED_MODULE_2__[\"default\"].post(`docs/${doc_id}/annotations/`, payload).then(response => {\n this.items[this.cur]['labels'].push(response.data);\n });\n this.updateProgress();\n }\n },\n created: function () {\n this.updateProgress();\n this.submit();\n }\n});\n\n//# sourceURL=webpack:///./static/js/seq2seq.js?"); +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vue */ \"./node_modules/vue/dist/vue.esm.js\");\n/* harmony import */ var _mixin_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./mixin.js */ \"./static/js/mixin.js\");\n/* harmony import */ var _http_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./http.js */ \"./static/js/http.js\");\n\nvue__WEBPACK_IMPORTED_MODULE_0__[\"default\"].use(__webpack_require__(/*! vue-shortkey */ \"./node_modules/vue-shortkey/dist/index.js\"));\n\n\n\n// localStorage persistence\nvar STORAGE_KEY = 'todos-vuejs-2.0'\nvar todoStorage = {\n fetch: function () {\n var todos = JSON.parse(localStorage.getItem(STORAGE_KEY) || '[]')\n todos.forEach(function (todo, index) {\n todo.id = index\n })\n todoStorage.uid = todos.length\n return todos\n },\n save: function (todos) {\n localStorage.setItem(STORAGE_KEY, JSON.stringify(todos))\n }\n}\n\nvar vm = new vue__WEBPACK_IMPORTED_MODULE_0__[\"default\"]({\n el: '#mail-app',\n delimiters: ['[[', ']]'],\n data: {\n todos: todoStorage.fetch(),\n newTodo: '',\n editedTodo: null\n },\n mixins: [_mixin_js__WEBPACK_IMPORTED_MODULE_1__[\"default\"]],\n directives: {\n 'todo-focus': function (el, binding) {\n if (binding.value) {\n el.focus()\n }\n }\n },\n methods: {\n addLabel: async function (label_id) {\n var payload = {\n 'label_id': label_id\n };\n\n var doc_id = this.items[this.cur].id;\n await _http_js__WEBPACK_IMPORTED_MODULE_2__[\"default\"].post(`docs/${doc_id}/annotations/`, payload).then(response => {\n this.items[this.cur]['labels'].push(response.data);\n });\n this.updateProgress();\n },\n addTodo: function () {\n var value = this.newTodo && this.newTodo.trim()\n if (!value) {\n return\n }\n this.todos.push({\n id: todoStorage.uid++,\n title: value,\n })\n this.newTodo = ''\n },\n\n removeTodo: function (todo) {\n this.todos.splice(this.todos.indexOf(todo), 1)\n },\n\n editTodo: function (todo) {\n this.beforeEditCache = todo.title\n this.editedTodo = todo\n },\n\n doneEdit: function (todo) {\n if (!this.editedTodo) {\n return\n }\n this.editedTodo = null\n todo.title = todo.title.trim()\n if (!todo.title) {\n this.removeTodo(todo)\n }\n },\n\n cancelEdit: function (todo) {\n this.editedTodo = null\n todo.title = this.beforeEditCache\n }\n },\n created: function () {\n this.updateProgress();\n this.submit();\n },\n watch: {\n todos: {\n handler: function (todos) {\n todoStorage.save(todos)\n },\n deep: true\n }\n }\n});\n\n//# sourceURL=webpack:///./static/js/seq2seq.js?"); /***/ }) diff --git a/app/server/static/css/annotation.css b/app/server/static/css/annotation.css index c3e34bf4..034ae18b 100644 --- a/app/server/static/css/annotation.css +++ b/app/server/static/css/annotation.css @@ -142,4 +142,123 @@ body { height: 1.5em; padding-left: .5em; padding-right: .5em; -} \ No newline at end of file +} + + +:focus { + outline: 0; +} + +.hidden { + display: none; +} + +.todoapp { + background: #fff; + margin: 30px 0 0 0; + position: relative; + box-shadow: 0 2px 3px rgba(10,10,10,.1), 0 0 0 1px rgba(10,10,10,.1) +} + +.todoapp input::-webkit-input-placeholder { + font-style: italic; + font-weight: 300; + color: #e6e6e6; +} + +.todoapp input::-moz-placeholder { + font-style: italic; + font-weight: 300; + color: #e6e6e6; +} + +.todoapp input::input-placeholder { + font-style: italic; + font-weight: 300; + color: #e6e6e6; +} + +.new-todo, +.edit { + position: relative; + margin: 0; + width: 100%; + font-size: 16pt; + font-family: inherit; + font-weight: inherit; + line-height: 1.4em; + border: 0; + color: inherit; + padding: 6px; + border: 1px solid #999; + box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2); + box-sizing: border-box; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.new-todo { + padding: 1.5rem; + border: none; + background: rgba(0, 0, 0, 0.003); + box-shadow: inset 0 -2px 1px rgba(0,0,0,0.03); +} + +.todo-list { + margin: 0; + padding: 0; + list-style: none; +} + +.todo-list li { + position: relative; + font-size: 16pt; + border-bottom: 1px solid #ededed; +} + +.todo-list li:last-child { + border-bottom: none; +} + +.todo-list li.editing { + border-bottom: none; + padding: 0; +} + +.todo-list li.editing .edit { + display: block; + padding: 12px 16px; +} + +.todo-list li.editing .view { + display: none; +} + +.todo-list li label { + word-break: break-all; + padding: 1.5rem 60px 1.5rem 1.5rem; + display: block; + line-height: 1.2; + transition: color 0.4s; +} + +.todo-list li .destroy { + display: none; + position: absolute; + top: 0; + right: 10px; + bottom: 0; + margin: auto 0; +} + +.todo-list li:hover .destroy { + display: block; +} + +.todo-list li .edit { + display: none; +} + +.todo-list li.editing:last-child { + margin-bottom: -1px; +} diff --git a/app/server/static/css/forum.css b/app/server/static/css/forum.css index 61457934..8edd6039 100644 --- a/app/server/static/css/forum.css +++ b/app/server/static/css/forum.css @@ -96,7 +96,7 @@ p { box-shadow: rgba(0, 0, 0, .1) 0 1px 0; border-radius: 4px; display: inline-block; - //margin: 10px; + /*margin: 10px;*/ position: relative; transition: all .2s ease-in-out; } diff --git a/app/server/static/js/seq2seq.js b/app/server/static/js/seq2seq.js index c7050021..18eebb50 100644 --- a/app/server/static/js/seq2seq.js +++ b/app/server/static/js/seq2seq.js @@ -3,11 +3,38 @@ Vue.use(require('vue-shortkey')); import annotationMixin from './mixin.js'; import HTTP from './http.js'; +// localStorage persistence +var STORAGE_KEY = 'todos-vuejs-2.0' +var todoStorage = { + fetch: function () { + var todos = JSON.parse(localStorage.getItem(STORAGE_KEY) || '[]') + todos.forEach(function (todo, index) { + todo.id = index + }) + todoStorage.uid = todos.length + return todos + }, + save: function (todos) { + localStorage.setItem(STORAGE_KEY, JSON.stringify(todos)) + } +} + var vm = new Vue({ el: '#mail-app', delimiters: ['[[', ']]'], + data: { + todos: todoStorage.fetch(), + newTodo: '', + editedTodo: null + }, mixins: [annotationMixin], - + directives: { + 'todo-focus': function (el, binding) { + if (binding.value) { + el.focus() + } + } + }, methods: { addLabel: async function (label_id) { var payload = { @@ -19,10 +46,54 @@ var vm = new Vue({ this.items[this.cur]['labels'].push(response.data); }); this.updateProgress(); + }, + addTodo: function () { + var value = this.newTodo && this.newTodo.trim() + if (!value) { + return + } + this.todos.push({ + id: todoStorage.uid++, + title: value, + }) + this.newTodo = '' + }, + + removeTodo: function (todo) { + this.todos.splice(this.todos.indexOf(todo), 1) + }, + + editTodo: function (todo) { + this.beforeEditCache = todo.title + this.editedTodo = todo + }, + + doneEdit: function (todo) { + if (!this.editedTodo) { + return + } + this.editedTodo = null + todo.title = todo.title.trim() + if (!todo.title) { + this.removeTodo(todo) + } + }, + + cancelEdit: function (todo) { + this.editedTodo = null + todo.title = this.beforeEditCache } }, created: function () { this.updateProgress(); this.submit(); + }, + watch: { + todos: { + handler: function (todos) { + todoStorage.save(todos) + }, + deep: true + } } }); \ No newline at end of file diff --git a/app/server/templates/annotation/seq2seq.html b/app/server/templates/annotation/seq2seq.html index 795af4a3..63d33a18 100644 --- a/app/server/templates/annotation/seq2seq.html +++ b/app/server/templates/annotation/seq2seq.html @@ -1,6 +1,4 @@ -{% extends "annotation/annotation_base.html" %} -{% load static %} -{% block annotation-area %} +{% extends "annotation/annotation_base.html" %} {% load static %} {% block annotation-area %}
@@ -9,6 +7,7 @@
+ -{% block footer %} +
+
+ +
+
+
    +
  • +
    + + +
    + +
    • +
+
+
+{% endblock %} {% block footer %} {% endblock %} \ No newline at end of file