diff options
author | Yorhel <git@yorhel.nl> | 2019-11-03 18:11:40 +0100 |
---|---|---|
committer | Yorhel <git@yorhel.nl> | 2019-11-10 12:44:55 +0100 |
commit | 6821b9ab3f3b24e4d635a0763122d0ed2b1c0b72 (patch) | |
tree | bfc36ca1fc878aaddc2ad0d7bd0327408eed105c | |
parent | cc4607635279792b59953bba2e3cb4a3928e76df (diff) |
ulist: Add comment and "this item is public" icons
Dynamically updating the visibility state of the "this item is public"
icon kind of sucks. But meh, you really want that state to update
correctly.
-rw-r--r-- | Makefile | 1 | ||||
-rw-r--r-- | data/style.css | 2 | ||||
-rw-r--r-- | elm/ULists/LabelEdit.elm | 9 | ||||
-rw-r--r-- | elm/ULists/LabelEdit.js | 7 | ||||
-rw-r--r-- | elm/ULists/VoteEdit.elm | 6 | ||||
-rw-r--r-- | elm/ULists/VoteEdit.js | 9 | ||||
-rw-r--r-- | lib/VNWeb/User/Lists.pm | 25 |
7 files changed, 46 insertions, 13 deletions
@@ -122,6 +122,7 @@ JS_FILES=\ elm/pagevars.js \ elm/ULists/ManageLabels.js \ elm/ULists/LabelEdit.js \ + elm/ULists/VoteEdit.js \ elm/Lib/Ffi.js \ elm/elm-init.js \ elm/checkall.js \ diff --git a/data/style.css b/data/style.css index 40b57259..092f853b 100644 --- a/data/style.css +++ b/data/style.css @@ -790,11 +790,11 @@ div.votelist td.tc2 { width: 50px; text-align: right; padding-right: 10px } .managelabels select { width: 100% } .managelabels tfoot div { float: right; text-align: right } +.ulist .tc1 { white-space: nowrap; width: 70px } .ulist .tc1 label { cursor: pointer } .ulist .tc1 input { display: none } .ulist .tc1 label:before { content: '▸ ' } .ulist .tc1 input:checked + label:before { content: '▾ ' } -.ulist .tc1 { white-space: nowrap; width: 60px } .ulist .tc2 b { margin-left: 10px } .ulist .tc4 { white-space: nowrap; width: 60px; text-align: right; padding-right: 10px } .ulist .tc4 input { width: 55px; text-align: right } diff --git a/elm/ULists/LabelEdit.elm b/elm/ULists/LabelEdit.elm index e138b01a..b6a03de2 100644 --- a/elm/ULists/LabelEdit.elm +++ b/elm/ULists/LabelEdit.elm @@ -1,4 +1,4 @@ -module ULists.LabelEdit exposing (main) +port module ULists.LabelEdit exposing (main) import Html exposing (..) import Html.Attributes exposing (..) @@ -24,6 +24,8 @@ main = Browser.element , update = update } +port ulistsLabelChanged : Bool -> Cmd msg + type alias Model = { uid : Int , vid : Int @@ -74,7 +76,10 @@ update msg model = , Api.post "/u/ulist/setlabel.json" (GLE.encode { uid = model.uid, vid = model.vid, label = l, applied = b }) (Saved l b) ) - Saved l b (GApi.Success) -> ({ model | sel = if b then Set.insert l model.sel else Set.remove l model.sel, state = Dict.remove l model.state }, Cmd.none) + Saved l b (GApi.Success) -> + let nmodel = { model | sel = if b then Set.insert l model.sel else Set.remove l model.sel, state = Dict.remove l model.state } + public = List.any (\lb -> lb.id /= 7 && not lb.private && Set.member lb.id nmodel.sel) nmodel.labels + in (nmodel, ulistsLabelChanged public) Saved l b e -> ({ model | state = Dict.insert l (Api.Error e) model.state }, Cmd.none) diff --git a/elm/ULists/LabelEdit.js b/elm/ULists/LabelEdit.js index c40aa615..f1c0c278 100644 --- a/elm/ULists/LabelEdit.js +++ b/elm/ULists/LabelEdit.js @@ -2,5 +2,10 @@ var init = Elm.ULists.LabelEdit.init; Elm.ULists.LabelEdit.init = function(opt) { opt.flags.uid = pageVars.uid; opt.flags.labels = pageVars.labels; - init(opt); + var app = init(opt); + app.ports.ulistsLabelChanged.subscribe(function(pub) { + var l = document.getElementById('ulist_public_'+opt.flags.vid); + l.setAttribute('data-publabel', pub?1:''); + l.classList.toggle('invisible', !((l.getAttribute('data-voted') && !pageVars.voteprivate) || l.getAttribute('data-publabel'))) + }); }; diff --git a/elm/ULists/VoteEdit.elm b/elm/ULists/VoteEdit.elm index c8681d1a..60814e5d 100644 --- a/elm/ULists/VoteEdit.elm +++ b/elm/ULists/VoteEdit.elm @@ -1,4 +1,4 @@ -module ULists.VoteEdit exposing (main) +port module ULists.VoteEdit exposing (main) import Html exposing (..) import Html.Attributes exposing (..) @@ -21,6 +21,8 @@ main = Browser.element , update = update } +port ulistsVoteChanged : Bool -> Cmd msg + type alias Model = { state : Api.State , flags : GVE.Send @@ -64,7 +66,7 @@ update msg model = Saved GApi.Success -> let flags = model.flags nflags = { flags | vote = Just model.text } - in ({ model | flags = nflags, state = Api.Normal }, Cmd.none) + in ({ model | flags = nflags, state = Api.Normal }, ulistsVoteChanged (model.text /= "" && model.text /= "-")) Saved e -> ({ model | state = Api.Error e }, Cmd.none) diff --git a/elm/ULists/VoteEdit.js b/elm/ULists/VoteEdit.js new file mode 100644 index 00000000..4a3e304c --- /dev/null +++ b/elm/ULists/VoteEdit.js @@ -0,0 +1,9 @@ +var init = Elm.ULists.VoteEdit.init; +Elm.ULists.VoteEdit.init = function(opt) { + var app = init(opt); + app.ports.ulistsVoteChanged.subscribe(function(voted) { + var l = document.getElementById('ulist_public_'+opt.flags.vid); + l.setAttribute('data-voted', voted?1:''); + l.classList.toggle('invisible', !((l.getAttribute('data-voted') && !pageVars.voteprivate) || l.getAttribute('data-publabel'))) + }); +}; diff --git a/lib/VNWeb/User/Lists.pm b/lib/VNWeb/User/Lists.pm index 2558963b..e745db71 100644 --- a/lib/VNWeb/User/Lists.pm +++ b/lib/VNWeb/User/Lists.pm @@ -31,7 +31,7 @@ my $VNLABELS = { vid => { id => 1 }, label => { _when => 'in', id => 1 }, applied => { _when => 'in', anybool => 1 }, - labels => { _when => 'out', aoh => { id => { int => 1 }, label => {} } }, + labels => { _when => 'out', aoh => { id => { int => 1 }, label => {}, private => { anybool => 1 } } }, selected => { _when => 'out', type => 'array', values => { id => 1 } }, }; @@ -104,7 +104,8 @@ sub filters_ { sub vn_ { my($uid, $own, $n, $v, $labels) = @_; tr_ mkclass(odd => $n % 2 == 0), sub { - # TODO: Public/private indicator + my %labels = map +($_,1), $v->{labels}->@*; + td_ class => 'tc1', sub { input_ type => 'checkbox', class => 'checkhidden', name => 'collapse_vid', id => 'collapse_vid'.$v->{id}, value => 'collapsed_vid'.$v->{id}; label_ for => 'collapse_vid'.$v->{id}, sub { @@ -114,6 +115,16 @@ sub vn_ { if($total && $obtained == $total) { b_ class => 'done', $txt } elsif($obtained < $total) { b_ class => 'todo', $txt } else { txt_ $txt } + span_ $v->{notes} ? () : (style => 'opacity: 0.5'), ' 💬'; + if($own) { + my $public = List::Util::any { $labels{$_->{id}} && !$_->{private} } @$labels; + my $publicLabel = List::Util::any { $_->{id} != 7 && $labels{$_->{id}} && !$_->{private} } @$labels; + span_ mkclass(invisible => !$public), + id => 'ulist_public_'.$v->{id}, + 'data-publabel' => !!$publicLabel, + 'data-voted' => !!$labels{7}, + title => 'This item is public', ' 👁'; + } }; }; td_ class => 'tc2', sub { @@ -121,8 +132,7 @@ sub vn_ { b_ class => 'grayedout', $v->{notes} if $v->{notes}; }; td_ class => 'tc3', sub { - my %l = map +($_,1), $v->{labels}->@*; - my @l = grep $l{$_->{id}} && $_->{id} != 7, @$labels; + my @l = grep $labels{$_->{id}} && $_->{id} != 7, @$labels; my $txt = @l ? join ', ', map $_->{label}, @l : '-'; if($own) { elm_ 'ULists.LabelEdit' => $VNLABELS_OUT, { vid => $v->{id}, selected => [ grep $_ != 7, $v->{labels}->@* ] }, $txt; @@ -194,7 +204,7 @@ sub listing_ { my sub url { '?'.query_encode %$opt, @_ } - # TODO: In-line editable labels, start/end dates, notes, remove-from-list + # TODO: In-line editable notes, remove-from-list # TODO: Releases # TODO: Thumbnail view paginate_ \&url, $opt->{p}, [ $count, 50 ], 't'; @@ -238,8 +248,9 @@ TUWF::get qr{/$RE{uid}/ulist}, sub { my $title = $own ? 'My list' : user_displayname($u)."'s list"; framework_ title => $title, type => 'u', dbobj => $u, tab => 'list', $own ? ( pagevars => { - uid => $u->{id}*1, - labels => $LABELS->analyze->{keys}{labels}->coerce_for_json($labels), + uid => $u->{id}*1, + labels => $LABELS->analyze->{keys}{labels}->coerce_for_json($labels), + voteprivate => (map \($_->{private}?1:0), grep $_->{id} == 7, @$labels), } ) : (), sub { my $opt; |