//@TODO: Customize advice based on OS var HelpPage = React.createClass({ getInitialState: function() { return { versionInfo: null, }; }, componentWillMount: function() { lbry.getVersionInfo((info) => { this.setState({ versionInfo: info, }); }); }, componentDidMount: function() { document.title = "Help"; }, render: function() { var ver = this.state.versionInfo; if (ver) { if (ver.os_system == 'Darwin') { var osName = (parseInt(ver.os_release.match(/^\d+/)) < 16 ? 'Mac OS X' : 'Mac OS'); var platform = osName + ' ' + ver.os_release; var newVerLink = 'https://lbry.io/get/lbry.dmg'; } else if (ver.os_system == 'Linux') { var platform = 'Linux (' + ver.platform + ')'; var newVerLink = 'https://lbry.io/get/lbry.deb'; } else { var platform = 'Windows (' + ver.platform + ')'; var newVerLink = 'https://lbry.io/get/lbry.msi'; } } return ( <main className="page"> <section className="card"> <h3>Read the FAQ</h3> <p>Our FAQ answers many common questions.</p> <p><Link href="https://lbry.io/faq" label="Read the FAQ" icon="icon-question" button="alt"/></p> </section> <section className="card"> <h3>Get Live Help</h3> <p> Live help is available most hours in the <strong>#help</strong> channel of our Slack chat room. </p> <p> <Link button="alt" label="Join Our Slack" icon="icon-slack" href="https://slack.lbry.io" /> </p> </section> <section className="card"> <h3>Report a Bug</h3> <p>Did you find something wrong?</p> <p><Link href="/?report" label="Submit a Bug Report" icon="icon-bug" button="alt" /></p> <div className="meta">Thanks! LBRY is made by it's users.</div> </section> {!ver ? null : <section className="card"> <h3>About</h3> {ver.lbrynet_update_available || ver.lbryum_update_available ? <p>A newer version of LBRY is available. <Link href={newVerLink} label={"Download LBRY " + ver.remote_lbrynet + " now!"} /></p> : <p>Your copy of LBRY is up to date.</p> } <table className="table-standard"> <tbody> <tr> <th>lbrynet (data)</th> <td>{ver.lbrynet_version}</td> </tr> <tr> <th>lbryum (wallet)</th> <td>{ver.lbryum_version}</td> </tr> <tr> <th>Platform</th> <td>{platform}</td> </tr> </tbody> </table> </section> } </main> ); } });