GithubHelp home page GithubHelp logo

rxui-confirmationexample's Introduction

Do not use this as an example of how to do a proper RxUI app! This is a quick and dirty hack to give an example of how I've had my ViewModels collect feedback before continuing some process.

Description

Lets the user delete a file, but first prompts the user to enter the file's full name, just to make sure they are serious. The confirmation box is dynamic and appears under the file listing, but this is an implementation detail. The fairly ugly layout was created with speed in mind, nothing more. It could have easily been a pop-up modal dialog, or it could have appeared within the file list itself (all fancy-like as a part of the file item in the listview).

I only implemented the ConfirmEventView as a separate IViewFor<> for ease of use in this example. In a real application, ConfirmEventViewModel<string> would likely be reused in several places, meaning the design would require using view contracts, or just doing the layout in-line and keeping the Visibility Collapsed when necessary.

Highlights:

  • The views are very simple. Controls bind to Reactive properties, or to ReactiveCommands.
  • The logic to delete a file is self-contained within a single lambda within the ViewModel constructor.

Lowlights:

  • The ConfirmEventViewModel<T> type is ... kind of ugly. It's still pretty app-specific, even with that lovely generic there.
  • Dealing with the Typo, try again scenario is klunky.

Usage:

  1. select the fake file you want to "delete"
  2. click on the delete button
  3. enter the file name by hand to confirm, then click on "do it"
  4. you can back out by clicking on any other filename, or the "nope" button
  5. if you have a typo, it'll tell you and let you try again

rxui-confirmationexample's People

Contributors

kentcb avatar moswald avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.