From 678f511619708ba893cb2414eead90cdae685708 Mon Sep 17 00:00:00 2001 From: Yorhel Date: Wed, 16 Oct 2019 10:31:24 +0200 Subject: v2rw: Convert staff adding/editing form This is the first major editing form to be converted, so I'm expecting a little breakage. A good chunk of this code has been copied from v3. In terms of the UI there has been a small change: aliases that are still referenced do not have the 'remove' link and instead have a flag that shows that they are still referenced. This ought to be a bit friendlier than throwing an error message after the user has submitted the form. Some other things I'd like to improve in this form: - BBCode preview - Pasting in external links and letting the form figure out the Pixiv ID, etc. - Or perhaps even: Integrate AniDB/Wikidata search/autocompletion. --- data/js/main.js | 3 -- data/js/staffalias.js | 80 --------------------------------------------------- data/style.css | 24 ++++++++-------- 3 files changed, 12 insertions(+), 95 deletions(-) delete mode 100644 data/js/staffalias.js (limited to 'data') diff --git a/data/js/main.js b/data/js/main.js index 09d62d12..3d4248b9 100644 --- a/data/js/main.js +++ b/data/js/main.js @@ -48,6 +48,3 @@ VARS = /*VARS*/; // Character editing (/c+/edit) //include chartraits.js //include charvns.js - -// Staff editing (/s+/edit) -//include staffalias.js diff --git a/data/js/staffalias.js b/data/js/staffalias.js deleted file mode 100644 index 7e6abe0c..00000000 --- a/data/js/staffalias.js +++ /dev/null @@ -1,80 +0,0 @@ -function salLoad () { - byId('alias_tbl').appendChild(tag('tr', {id:'alias_new'}, - tag('td', null), - tag('td', {colspan:3}, tag('a', {href:'#', onclick:salFormAdd}, 'Add alias')))); - - salAdd(byId('primary').value||0, byId('name').value, byId('original').value); - var aliases = jsonParse(byId('aliases').value) || []; - for(var i = 0; i < aliases.length; i++) { - salAdd(aliases[i].aid, aliases[i].name, aliases[i].orig); - } - - byName(byId('maincontent'), 'form')[0].onsubmit = salSerialize; -} - -function salAdd(aid, name, original) { - var tbl = byId('alias_tbl'); - var first = tbl.rows.length <= 1; - tbl.insertBefore(tag('tr', first ? {id:'primary_name'} : null, - tag('td', {'class':'tc_id' }, - tag('input', {type:'radio', name:'primary_id', value:aid, checked:first, onchange:salPrimary})), - tag('td', {'class':'tc_name' }, tag('input', {type:'text', 'class':'text', value:name})), - tag('td', {'class':'tc_original' }, tag('input', {type:'text', 'class':'text', value:original})), - tag('td', {'class':'tc_add' }, !first ? - tag('a', {href:'#', onclick:salDel}, 'remove') : null) - ), byId('alias_new')); -} - -function salPrimary() { - var prev = byId('primary_name') - prev.removeAttribute('id'); - byClass(prev, 'td', 'tc_add')[0].appendChild(tag('a', {href:'#', onclick:salDel}, 'remove')); - var tr = this; - while (tr && tr.nodeName.toLowerCase() != 'tr') - tr = tr.parentNode; - tr.setAttribute('id', 'primary_name'); - var td = byClass(tr, 'td', 'tc_add')[0]; - while (td.firstChild) - td.removeChild(td.firstChild); - - return salSerialize(); -} - -function salSerialize() { - var tbl = byName(byId('alias_tbl'), 'tr'); - var a = []; - for (var i = 0; i < tbl.length; ++i) { - if(tbl[i].id == 'alias_new') - continue; - var id = byName(byClass(tbl[i], 'td', 'tc_id')[0], 'input')[0].value; - var name = byName(byClass(tbl[i], 'td', 'tc_name')[0], 'input')[0].value; - var orig = byName(byClass(tbl[i], 'td', 'tc_original')[0], 'input')[0].value; - if(tbl[i].id == 'primary_name') { - byId('name').value = name; - byId('original').value = orig; - byId('primary').value = id; - } else - a.push({ aid:Number(id), name:name, orig:orig }); - } - byId('aliases').value = JSON.stringify(a); - return true; -} - -function salDel() { - var tr = this; - while (tr && tr.nodeName.toLowerCase() != 'tr') - tr = tr.parentNode; - var tbl = byId('alias_tbl'); - tbl.removeChild(tr); - salSerialize(); - return false; -} - -function salFormAdd() { - salAdd(0, '', ''); - byName(byClass(byId('alias_new').previousSibling, 'td', 'tc_name')[0], 'input')[0].focus(); - return false; -} - -if(byId('jt_box_staffe_geninfo')) - salLoad(); diff --git a/data/style.css b/data/style.css index 9ad103a4..2655c85b 100644 --- a/data/style.css +++ b/data/style.css @@ -145,7 +145,7 @@ fieldset.submit input[type=submit] { width: 150px; } fieldset.submit input[type=checkbox] { margin: 0 5px 0 15px; } fieldset.submit h2 { font-size: 13px!important; } fieldset.submit textarea { margin: 0 20px 5px 20px; } -td.label, td.label label { width: 110px; } +td.label, td.label label { width: 130px; } td.label label { display: block; } td.field label { margin: 0 5px 0 5px; } table.formtable { margin: 0 20px 20px 20px; } @@ -711,27 +711,27 @@ div.charsum_list .charsum_bubble { #jt_box_vn_staff h2 { margin: 0 0 3px 0px; } #jt_box_vn_cast td, #jt_box_vn_staff td, -#jt_box_staffe_geninfo table#names td { padding: 1px 2px; vertical-align: middle; } -#jt_box_staffe_geninfo table#names tr#alias_new td { padding-top: 8px } #jt_box_vn_cast td.tc_role, #jt_box_vn_cast td.tc_role select, #jt_box_vn_staff td.tc_role, #jt_box_vn_staff td.tc_role select { width: 120px } -#jt_box_vn_cast td.tc_staff, -#jt_box_vn_staff td.tc_staff, -#jt_box_staffe_geninfo td.tc_name, -#jt_box_staffe_geninfo td.tc_original { width: 200px } -#jt_box_vn_cast td.tc_staff input, -#jt_box_vn_staff td.tc_staff input, -#jt_box_staffe_geninfo td.tc_name input, -#jt_box_staffe_geninfo td.tc_original input { width: 200px } +#jt_box_vn_cast td.tc_staff, +#jt_box_vn_staff td.tc_staff, +.staffedit td.tc_name, +.staffedit td.tc_original { width: 200px } +#jt_box_vn_cast td.tc_staff input, +#jt_box_vn_staff td.tc_staff input, +.staffedit td.tc_name input, +.staffedit td.tc_original input { width: 200px } #jt_box_vn_cast td.tc_note, #jt_box_vn_cast td.tc_note input, #jt_box_vn_staff td.tc_note, #jt_box_vn_staff td.tc_note input { width: 250px } #jt_box_vn_cast td.tc_add, #jt_box_vn_staff td.tc_add, -#jt_box_staffe_geninfo td.tc_add { width: 40px; text-align: left } +.staffedit td.tc_add { width: 40px; text-align: left } +.staffedit table.names td { padding: 1px 2px; vertical-align: middle; } +.staffedit table.names tr.alias_new td { padding-top: 8px } /***** Documentation pages *****/ -- cgit v1.2.3