ulist: Implement deletion of items from the list

4 files changed, 65 insertions, 12 deletions

diff --git a/Makefile b/Makefile
index 18e25f47..d203df92 100644
--- a/Makefile
+++ b/Makefile
@@ -120,8 +120,9 @@ static/f/vndb.min.js: static/f/vndb.js
 JS_FILES=\
 	elm/polyfills.js \
 	elm/pagevars.js \
-	elm/UList/ManageLabels.js \
 	elm/UList/LabelEdit.js \
+	elm/UList/ManageLabels.js \
+	elm/UList/Opt.js \
 	elm/UList/VoteEdit.js \
 	elm/Lib/Ffi.js \
 	elm/elm-init.js \
diff --git a/elm/UList/Opt.elm b/elm/UList/Opt.elm
index 22350b7c..edbdf187 100644
--- a/elm/UList/Opt.elm
+++ b/elm/UList/Opt.elm
@@ -1,4 +1,4 @@
-module UList.Opt exposing (main)
+port module UList.Opt exposing (main)
 
 import Html exposing (..)
 import Html.Attributes exposing (..)
@@ -12,7 +12,7 @@ import Lib.Api as Api
 import Gen.Types as T
 import Gen.Api as GApi
 import Gen.UListVNOpt as GVO
-
+import Gen.UListDel as GDE
 
 main : Program GVO.Send Model Msg
 main = Browser.element
@@ -22,27 +22,34 @@ main = Browser.element
   , update = update
   }
 
+port ulistVNDeleted : Bool -> Cmd msg
+
 type alias Model =
-  { state  : Api.State
-  , flags  : GVO.Send
-  , del    : Bool
+  { flags    : GVO.Send
+  , del      : Bool
+  , delState : Api.State
   }
 
 init : GVO.Send -> Model
 init f =
-  { state  = Api.Normal
-  , flags  = f
-  , del    = False
+  { flags    = f
+  , del      = False
+  , delState = Api.Normal
   }
 
 type Msg
   = Del Bool
+  | Delete
+  | Deleted GApi.Response
 
 
 update : Msg -> Model -> (Model, Cmd Msg)
 update msg model =
   case msg of
     Del b -> ({ model | del = b }, Cmd.none)
+    Delete -> ({ model | delState = Api.Loading }, Api.post "/u/ulist/del.json" (GDE.encode { uid = model.flags.uid, vid = model.flags.vid }) Deleted)
+    Deleted GApi.Success -> (model, ulistVNDeleted True)
+    Deleted e -> ({ model | delState = Api.Error e }, Cmd.none)
 
 
 view : Model -> Html Msg
@@ -53,7 +60,7 @@ view model =
         [ td [ colspan 5 ]
           [ textarea ([ placeholder "Notes", rows 2, cols 100 ] ++ GVO.valNotes) [ text model.flags.notes ]
           , div [ ]
-            [ div [ class "spinner" ] []
+            [ div [ class "spinner invisible" ] []
             , br_ 2
             , a [ href "#", onClickD (Del True) ] [ text "Remove VN" ]
             ]
@@ -76,4 +83,16 @@ view model =
       , td [ class "tco5" ] [ a [ href ("/r"++String.fromInt r.id), title r.original ] [ text r.title ] ]
       ]
 
-  in table [] <| (if model.flags.own then opt else []) ++ List.indexedMap rel model.flags.rels
+    confirm =
+      div []
+      [ text "Are you sure you want to remove this visual novel from your list? "
+      , a [ onClickD Delete ] [ text "Yes" ]
+      , text " | "
+      , a [ onClickD (Del False) ] [ text "Cancel" ]
+      ]
+
+  in case (model.del, model.delState) of
+      (False, _) -> table [] <| (if model.flags.own then opt else []) ++ List.indexedMap rel model.flags.rels
+      (_, Api.Normal)  -> confirm
+      (_, Api.Loading) -> div [ class "spinner" ] []
+      (_, Api.Error e) -> b [ class "standout" ] [ text <| "Error removing item: " ++ Api.showResponse e ]
diff --git a/elm/UList/Opt.js b/elm/UList/Opt.js
new file mode 100644
index 00000000..6a4f126f
--- /dev/null
+++ b/elm/UList/Opt.js
@@ -0,0 +1,16 @@
+var init = Elm.UList.Opt.init;
+Elm.UList.Opt.init = function(opt) {
+    // TODO: This module is more often than not hidden from the page, lazily loading it could improve page load time.
+    var app = init(opt);
+
+    app.ports.ulistVNDeleted.subscribe(function(b) {
+        var e = document.getElementById('ulist_tr_'+opt.flags.vid);
+        e.parentNode.removeChild(e.nextElementSibling);
+        e.parentNode.removeChild(e);
+
+        // Have to restripe after deletion :(
+        var rows = document.querySelectorAll('.ulist > table > tbody > tr');
+        for(var i=0; i<rows.length; i++)
+            rows[i].classList.toggle('odd', Math.floor(i/2) % 2 == 0);
+    });
+};
diff --git a/lib/VNWeb/User/Lists.pm b/lib/VNWeb/User/Lists.pm
index 0aa10630..fb09a8e4 100644
--- a/lib/VNWeb/User/Lists.pm
+++ b/lib/VNWeb/User/Lists.pm
@@ -74,6 +74,15 @@ elm_form 'UListVNOpt', undef, $VNOPT;
 
 
 
+my $VNDEL = form_compile any => {
+    uid => { id => 1 },
+    vid => { id => 1 },
+};
+
+elm_form 'UListDel', undef, $VNDEL;
+
+
+
 # TODO: Filters to find unlabeled VNs or VNs with/without notes?
 sub filters_ {
     my($own, $labels) = @_;
@@ -126,7 +135,7 @@ sub filters_ {
 
 sub vn_ {
     my($uid, $own, $n, $v, $labels) = @_;
-    tr_ mkclass(odd => $n % 2 == 0), sub {
+    tr_ mkclass(odd => $n % 2 == 0), id => "ulist_tr_$v->{id}", sub {
         my %labels = map +($_,1), $v->{labels}->@*;
 
         td_ class => 'tc1', sub {
@@ -382,4 +391,12 @@ json_api qr{/u/ulist/setdate.json}, $VNDATE, sub {
     elm_Success
 };
 
+
+json_api qr{/u/ulist/del.json}, $VNDEL, sub {
+    my($data) = @_;
+    return elm_Unauth if !auth || auth->uid != $data->{uid};
+    tuwf->dbExeci('DELETE FROM ulist_vns WHERE uid =', \$data->{uid}, 'AND vid =', \$data->{vid});
+    elm_Success
+};
+
 1;