Add real time updating new
This commit is contained in:
Dana Woodman
parent
432653cdb4
commit
58523736e5
|
|
@ -0,0 +1,13 @@
|
|||
{
|
||||
"presets": [
|
||||
"react",
|
||||
[
|
||||
"env",
|
||||
{
|
||||
"targets": {
|
||||
"browsers": ["> 5%"]
|
||||
}
|
||||
}
|
||||
]
|
||||
]
|
||||
}
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
{
|
||||
"semi": false,
|
||||
"singleQuote": true,
|
||||
"trailingComma": "es5"
|
||||
}
|
||||
|
|
@ -0,0 +1,64 @@
|
|||
require('whatwg-fetch')
|
||||
|
||||
const React = require('react')
|
||||
const ReactDOM = require('react-dom')
|
||||
|
||||
class ResourceList extends React.Component {
|
||||
constructor(props) {
|
||||
super(props)
|
||||
this.state = {
|
||||
loading: false,
|
||||
items: [],
|
||||
}
|
||||
}
|
||||
|
||||
componentWillMount() {
|
||||
this.setState(Object.assign({}, this.state, { loading: true }))
|
||||
|
||||
fetch('http://app.tubbsfireinfo.com/recent_news.json')
|
||||
.then(response => {
|
||||
return response.json()
|
||||
})
|
||||
.then(json => {
|
||||
console.log('parsed json', json)
|
||||
this.setState(
|
||||
Object.assign({}, this.state, { items: json, loading: false })
|
||||
)
|
||||
})
|
||||
.catch(ex => {
|
||||
console.log('parsing failed', ex)
|
||||
this.setState(Object.assign({}, this.state, { loading: false }))
|
||||
})
|
||||
}
|
||||
|
||||
render() {
|
||||
return <List items={this.state.items} loading={this.state.loading} />
|
||||
}
|
||||
}
|
||||
|
||||
function List({ loading, items }) {
|
||||
if (loading) {
|
||||
return (
|
||||
<p className="lead text-center">
|
||||
<i className="fa fa-spinner fa-spin mr-3" /> Loading news...
|
||||
</p>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<ul className="list-group">
|
||||
{items.map((item, key) => <Item item={item} key={key} />)}
|
||||
</ul>
|
||||
)
|
||||
}
|
||||
|
||||
function Item({ item }) {
|
||||
return (
|
||||
<li className="list-group-item">
|
||||
<i className="fa fa-warning mr-3" />
|
||||
{item.fields.Description}
|
||||
</li>
|
||||
)
|
||||
}
|
||||
|
||||
ReactDOM.render(<ResourceList />, document.getElementById('resource-list'))
|
||||
56
index.html
56
index.html
|
|
@ -13,6 +13,13 @@
|
|||
|
||||
<body>
|
||||
|
||||
<div class="section bg-danger text-center text-white">
|
||||
<h3 class="">
|
||||
Signup for live alerts by texting your ZIP code to
|
||||
<a href="tel:888777" class="text-warning">888-777</a>
|
||||
</h3>
|
||||
</div>
|
||||
|
||||
<div class="section bg-light text-center">
|
||||
<div class="container">
|
||||
<h1 class="display-2">Tubb's Fire Info</h1>
|
||||
|
|
@ -49,57 +56,12 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="section bg-danger text-center text-white">
|
||||
<h3 class="">
|
||||
Signup for live alerts by texting your ZIP code to
|
||||
<a href="tel:888777" class="text-warning">888-777</a>
|
||||
</h3>
|
||||
</div>
|
||||
|
||||
<div id="news" class="section">
|
||||
<div class="container">
|
||||
<h2 class="text-center mb-3">Updates</h2>
|
||||
<p class="text-center mb-5">
|
||||
<small class="text-muted">Last updated of 10/9 8pm</small>
|
||||
</p>
|
||||
<div class="row">
|
||||
<div class="col-sm-10 mx-auto">
|
||||
<ul class="list-group">
|
||||
<li class="list-group-item">
|
||||
<i class="fa fa-warning mr-3"></i>
|
||||
Mandatory curfew in effect 6:45pm to 7:15am in mandatory evacuation areas. Violators
|
||||
subject to arrest
|
||||
</li>
|
||||
<li class="list-group-item">
|
||||
<i class="fa fa-warning mr-3"></i>
|
||||
Sonoma County Sheriff asks residents who are not evacuating to stay off the roads
|
||||
</li>
|
||||
<li class="list-group-item">
|
||||
<i class="fa fa-warning mr-3"></i>
|
||||
Residents of the Larkfield area (north of Santa Rosa) are being advised not to drink
|
||||
their tap water
|
||||
</li>
|
||||
<li class="list-group-item">
|
||||
<i class="fa fa-warning mr-3"></i>
|
||||
PG&E has cut natural gas service in Kenwood, Santa Rosa, and other areas affected
|
||||
by fires
|
||||
</li>
|
||||
<li class="list-group-item">
|
||||
<i class="fa fa-warning mr-3"></i>
|
||||
|
||||
The Sebastopol Community Center evacuation site is merging with Analy High School
|
||||
evacuation site. The Sebastopol Community Center is closed. Please
|
||||
bring all donations to Analy High School (7:30pm)
|
||||
</li>
|
||||
<li class="list-group-item">
|
||||
<i class="fa fa-warning mr-3"></i>
|
||||
SSU, JC and most other schools have cancelled class for today
|
||||
</li>
|
||||
<li class="list-group-item">
|
||||
<i class="fa fa-warning mr-3"></i>
|
||||
Oliver’s in Rohnert Park is currently open and offering free coffee and tea.
|
||||
</li>
|
||||
</ul>
|
||||
<div id="resource-list"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -222,6 +184,8 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<script async src="/build.js"></script>
|
||||
|
||||
<!-- Global Site Tag (gtag.js) - Google Analytics -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-599674-49"></script>
|
||||
<script>
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
23
package.json
23
package.json
|
|
@ -4,8 +4,8 @@
|
|||
"description": "",
|
||||
"main": "webpack.config.js",
|
||||
"scripts": {
|
||||
"build": "node-sass styles.scss output.css",
|
||||
"dev": "npm run build -- -w"
|
||||
"build": "webpack",
|
||||
"dev": "webpack --watch"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
|
|
@ -18,9 +18,24 @@
|
|||
},
|
||||
"homepage": "https://github.com/chimera/tubbsfireinfo.com#readme",
|
||||
"dependencies": {
|
||||
"bootstrap": "4.0.0-beta"
|
||||
"babel-preset-react": "6.24.1",
|
||||
"bootstrap": "4.0.0-beta",
|
||||
"react": "16.0.0",
|
||||
"react-dom": "16.0.0",
|
||||
"whatwg-fetch": "2.0.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
"node-sass": "4.5.3"
|
||||
"babel-core": "6.26.0",
|
||||
"babel-loader": "7.1.2",
|
||||
"babel-polyfill": "6.26.0",
|
||||
"babel-preset-env": "1.6.0",
|
||||
"css-loader": "0.28.7",
|
||||
"extract-text-webpack-plugin": "3.0.1",
|
||||
"node-sass": "4.5.3",
|
||||
"react-loader": "2.4.2",
|
||||
"sass-loader": "6.0.6",
|
||||
"style-loader": "0.19.0",
|
||||
"webpack": "3.6.0",
|
||||
"webpack-dev-server": "2.9.1"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,30 @@
|
|||
const webpack = require('webpack')
|
||||
const ExtractTextPlugin = require('extract-text-webpack-plugin')
|
||||
|
||||
const config = {
|
||||
entry: ['./app.js'],
|
||||
output: {
|
||||
path: __dirname,
|
||||
filename: 'build.js',
|
||||
},
|
||||
module: {
|
||||
loaders: [
|
||||
{
|
||||
test: /\.js$/,
|
||||
exclude: /(node_modules)/,
|
||||
loader: 'babel-loader',
|
||||
},
|
||||
{
|
||||
test: /\.scss$/,
|
||||
use: ExtractTextPlugin.extract({
|
||||
fallback: 'style-loader',
|
||||
use: ['css-loader', 'sass-loader'],
|
||||
}),
|
||||
},
|
||||
],
|
||||
},
|
||||
plugins: [new ExtractTextPlugin('output.css')],
|
||||
devtool: 'eval',
|
||||
}
|
||||
|
||||
module.exports = config
|
||||
Loading…
Reference in New Issue