mannuelf/index.html

## readme.md

      
    Raw
  

              readme.md
            
          
    dom-select-streams

Created with <3 with dartpad.dev.

  
## index.html
<!DOCTYPE html>

<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>dom-select-streams</title>
    <link rel="stylesheet" href="styles.css">
    <script type="application/dart" src="main.dart"></script>
  </head>

  <body>
    <h1>Guess the word</h1>
<input id="guesses"/>
<button id="myButton">Click me</button>

  </body>
</html>

## main.dart
import 'dart:html';

void main() {
  final button = querySelector('button') as ButtonElement;
  final input = querySelector('input') as InputElement;

  button.onClick
    .take(4)
    .where((event) => input.value == 'magic')
    .listen(
      (event) => print('you got it!'),
      onDone: () => print('Noope, bad guesses.')
    );
}

## styles.css
body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: absolute;
  width: 100%;
  height: 100%;
}

h1 {
  color: white;
  font-family: Arial, Helvetica, sans-serif;
}
	<!DOCTYPE html>

	<html>
	<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>dom-select-streams</title>
	<link rel="stylesheet" href="styles.css">
	<script type="application/dart" src="main.dart"></script>
	</head>

	<body>
	<h1>Guess the word</h1>
	<input id="guesses"/>
	<button id="myButton">Click me</button>

	</body>
	</html>
	import 'dart:html';

	void main() {
	final button = querySelector('button') as ButtonElement;
	final input = querySelector('input') as InputElement;

	button.onClick
	.take(4)
	.where((event) => input.value == 'magic')
	.listen(
	(event) => print('you got it!'),
	onDone: () => print('Noope, bad guesses.')
	);
	}
	body {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	position: absolute;
	width: 100%;
	height: 100%;
	}

	h1 {
	color: white;
	font-family: Arial, Helvetica, sans-serif;
	}