Add real time updating new
This commit is contained in:
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>
|
<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="section bg-light text-center">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<h1 class="display-2">Tubb's Fire Info</h1>
|
<h1 class="display-2">Tubb's Fire Info</h1>
|
||||||
|
@ -49,57 +56,12 @@
|
||||||
</div>
|
</div>
|
||||||
</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 id="news" class="section">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<h2 class="text-center mb-3">Updates</h2>
|
<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="row">
|
||||||
<div class="col-sm-10 mx-auto">
|
<div class="col-sm-10 mx-auto">
|
||||||
<ul class="list-group">
|
<div id="resource-list"></div>
|
||||||
<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>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -222,6 +184,8 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<script async src="/build.js"></script>
|
||||||
|
|
||||||
<!-- Global Site Tag (gtag.js) - Google Analytics -->
|
<!-- Global Site Tag (gtag.js) - Google Analytics -->
|
||||||
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-599674-49"></script>
|
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-599674-49"></script>
|
||||||
<script>
|
<script>
|
||||||
|
|
File diff suppressed because it is too large
Load Diff
23
package.json
23
package.json
|
@ -4,8 +4,8 @@
|
||||||
"description": "",
|
"description": "",
|
||||||
"main": "webpack.config.js",
|
"main": "webpack.config.js",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"build": "node-sass styles.scss output.css",
|
"build": "webpack",
|
||||||
"dev": "npm run build -- -w"
|
"dev": "webpack --watch"
|
||||||
},
|
},
|
||||||
"repository": {
|
"repository": {
|
||||||
"type": "git",
|
"type": "git",
|
||||||
|
@ -18,9 +18,24 @@
|
||||||
},
|
},
|
||||||
"homepage": "https://github.com/chimera/tubbsfireinfo.com#readme",
|
"homepage": "https://github.com/chimera/tubbsfireinfo.com#readme",
|
||||||
"dependencies": {
|
"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": {
|
"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