Created
February 26, 2015 08:50
-
-
Save danschultz/596d02d6f330e4ab7393 to your computer and use it in GitHub Desktop.
Frappe registration form
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import 'dart:async'; | |
import 'dart:html'; | |
import 'dart:math'; | |
import 'package:frappe/frappe.dart'; | |
InputElement usernameInput = querySelector("#username"); | |
Element usernameAvailable = querySelector("#usernameAvailable"); | |
InputElement fullnameInput = querySelector("#fullname"); | |
ButtonElement registerButton = querySelector("#register"); | |
Element result = querySelector("#result"); | |
void main() { | |
var username = new Property<String>.fromStreamWithInitialValue(usernameInput.value, usernameInput.onInput.map(inputValue)); | |
var fullname = new Property<String>.fromStreamWithInitialValue(fullnameInput.value, fullnameInput.onInput.map(inputValue)); | |
var isUsernameValid = username.map((value) => value.isNotEmpty); | |
var isFullnameValid = fullname.map((value) => value.isNotEmpty); | |
var isUsernameAvailable = username | |
.changes | |
.flatMapLatest((value) => new Stream.fromFuture(fetchIsUsernameAvailable(value))); | |
var isValid = isUsernameValid | |
.combine(isFullnameValid, (a, b) => a && b) | |
.combine(isUsernameAvailable, (a, b) => a && b) | |
.asPropertyWithInitialValue(false); | |
var onSubmit = new EventStream(usernameInput.onKeyUp.where(isEnterKey)) | |
.merge(fullnameInput.onKeyUp.where(isEnterKey)) | |
.merge(registerButton.onClick) | |
.when(isValid); | |
var onRequestRegistration = username | |
.combine(fullname, (username, fullname) => register(username, fullname)) | |
.sampleOn(onSubmit); | |
username.changes.forEach((_) => usernameAvailable.text = ""); | |
isUsernameAvailable | |
.distinct() | |
.doAction((value) => print("Username available? $value")) | |
.where((value) => !value) | |
.forEach((value) => usernameAvailable.text = "Sorry, username is taken"); | |
isValid | |
.distinct() | |
.doAction((value) => print("Form valid? $value")) | |
.forEach((value) => registerButton.disabled = !value); | |
onRequestRegistration | |
.doAction((_) => print("Registering ...")) | |
.asyncMap((request) => request) | |
.doAction((_) => print("Registered!")) | |
.forEach((_) => result.text = "Thanks, you're registered!"); | |
} | |
Future<bool> fetchIsUsernameAvailable(String username) { | |
return new Future.delayed(randomDelay(), () => username.length % 2 == 0); | |
} | |
Future<bool> register(String username, String fullname) { | |
return new Future.delayed(randomDelay() * 4, () => true); | |
} | |
Duration randomDelay() => new Duration(milliseconds: new Random().nextInt(500) + 500); | |
String inputValue(Event event) => event.target.value; | |
bool isEnterKey(KeyboardEvent event) => event.keyCode == 13; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment