mirror of
https://github.com/flutter/flutter
synced 2024-10-13 11:42:54 +00:00
09538aed91
Previously, the two versions of this sample app had separate copies of the stock data. This CL moves the common data to the common data directory so that they can share. Also, I've switched the data files to be |dart| files rather than |sky| files to make them easier to use from fn examples. R=eseidel@chromium.org Review URL: https://codereview.chromium.org/980953002
113 lines
3 KiB
Plaintext
113 lines
3 KiB
Plaintext
<!--
|
|
// Copyright 2015 The Chromium Authors. All rights reserved.
|
|
// Use of this source code is governed by a BSD-style license that can be
|
|
// found in the LICENSE file.
|
|
-->
|
|
<import src="/sky/framework/sky-drawer-header.sky" />
|
|
<import src="/sky/framework/sky-drawer.sky" />
|
|
<import src="/sky/framework/sky-element.sky" />
|
|
<import src="/sky/framework/sky-icon.sky" />
|
|
<import src="/sky/framework/sky-menu-divider.sky" />
|
|
<import src="/sky/framework/sky-menu-item.sky" />
|
|
<import src="/sky/framework/sky-scrollable.sky" />
|
|
<import src="/sky/framework/sky-toolbar.sky" />
|
|
<import src="stock.sky" as='view'/>
|
|
|
|
<sky-element>
|
|
<template>
|
|
<style>
|
|
:host {
|
|
display: flex;
|
|
flex-direction: column;
|
|
height: -webkit-fill-available;
|
|
font-family: 'Roboto Regular', 'Helvetica';
|
|
font-size: 16px;
|
|
}
|
|
sky-drawer {
|
|
position: absolute;
|
|
z-index: 2;
|
|
top: 0;
|
|
left: 0;
|
|
bottom: 0;
|
|
right: 0;
|
|
}
|
|
sky-toolbar {
|
|
z-index: 1;
|
|
background-color: #3F51B5;
|
|
color: white;
|
|
}
|
|
sky-icon {
|
|
padding: 8px;
|
|
margin: 0 4px;
|
|
}
|
|
#title {
|
|
flex: 1;
|
|
margin: 0 4px;
|
|
}
|
|
sky-scrollable {
|
|
flex: 1;
|
|
}
|
|
</style>
|
|
<sky-drawer id="drawer" level="3">
|
|
<sky-drawer-header>
|
|
Stocks
|
|
</sky-drawer-header>
|
|
<sky-menu-item icon="content/inbox">Inbox</sky-menu-item>
|
|
<sky-menu-item icon="content/drafts">Drafts</sky-menu-item>
|
|
<sky-menu-divider />
|
|
<sky-menu-item icon="action/settings">Settings</sky-menu-item>
|
|
<sky-menu-item icon="action/help">Help & feedback</sky-menu-item>
|
|
</sky-drawer>
|
|
<sky-toolbar level="2">
|
|
<sky-icon id="menu" type="navigation/menu_white" size="24" />
|
|
<div id="title">I am a stocks app</div>
|
|
<sky-icon type="action/search_white" size="24" />
|
|
<sky-icon type="navigation/more_vert_white" size="24" />
|
|
</sky-toolbar>
|
|
<sky-scrollable id='stock_list'>
|
|
</sky-scrollable>
|
|
</template>
|
|
<script>
|
|
import "dart:sky";
|
|
import "dart:math";
|
|
import "../data/stocks.dart" as model;
|
|
|
|
List pick(List list, int count) {
|
|
var rng = new Random();
|
|
List picked = new List();
|
|
for (int i = 0; i < count; i++) {
|
|
picked.add(list[rng.nextInt(list.length)]);
|
|
}
|
|
return picked;
|
|
}
|
|
|
|
@Tagname('stocks')
|
|
class Stocks extends SkyElement {
|
|
Element _drawer;
|
|
|
|
void shadowRootReady() {
|
|
_drawer = shadowRoot.getElementById('drawer');
|
|
Element menu = shadowRoot.getElementById('menu');
|
|
menu.addEventListener('click', _handleMenuClick);
|
|
populateStockList();
|
|
}
|
|
|
|
void populateStockList() {
|
|
Element stockList = shadowRoot.getElementById('stock_list');
|
|
// Limit to 100 to avoid taking seconds to load.
|
|
List<model.Stock> picked = pick(model.oracle.stocks, 100);
|
|
picked.sort((a, b) => a.symbol.compareTo(b.symbol));
|
|
for (model.Stock stock in picked) {
|
|
stockList.appendChild(new view.Stock()..model = stock);
|
|
}
|
|
}
|
|
|
|
void _handleMenuClick(_) {
|
|
_drawer.toggle();
|
|
}
|
|
}
|
|
|
|
_init(script) => register(script, Stocks);
|
|
</script>
|
|
</sky-element>
|