Add option to show/hide NSFW content

js/lbry.js

@@ -5,7 +5,9 @@ var lbry = {
   colors: {
     primary: '#155B4A'
   },
-  defaultClientSettings: {}
+  defaultClientSettings: {
+    showNsfw: false,
+  }
 };
 
 lbry.jsonrpc_call = function (connectionString, method, params, callback, errorCallback, connectFailedCallback) {

js/page/discover.js

@@ -34,9 +34,10 @@ var SearchNoResults = React.createClass({
 
 var SearchResults = React.createClass({
   render: function() {
+    var showNsfw = lbry.getClientSetting('showNsfw');
     var rows = [];
     this.props.results.forEach(function(result) {
-      if (!result.value.nsfw) {
+      if (showNsfw || !result.value.nsfw) {
         rows.push(
           <SearchResultRow key={result.name} name={result.name} title={result.value.title} imgUrl={result.value.thumbnail}
                            description={result.value.description} cost={result.cost} />
@@ -157,10 +158,10 @@ var FeaturedContentItem = React.createClass({
       return null;
     }
 
-    //@TODO: Make this check the "show NSFW" setting once it's implemented
+    var blur = !lbry.getClientSetting('showNsfw') && this.state.metadata.nsfw;
 
     return (<div style={featuredContentItemContainerStyle} onMouseEnter={this.handleMouseOver} onMouseLeave={this.handleMouseOut}>
-      <div className={this.state.metadata.nsfw ? 'blur' : ''}>
+      <div className={blur ? 'blur' : ''}>
         <SearchResultRow name={this.props.name} title={this.state.title} imgUrl={this.state.metadata.thumbnail}
                    description={this.state.metadata.description} cost={this.state.amount}
                    available={this.state.available} />

js/page/settings.js

@@ -14,6 +14,7 @@ var settingsRadioOptionStyles = {
 };
 
 var SettingsPage = React.createClass({
+  _initClientSettings: null,
   onRunOnStartChange: function (event) {
     lbry.setDaemonSetting('run_on_startup', event.target.checked);
   },
@@ -52,6 +53,7 @@ var SettingsPage = React.createClass({
   },
   componentDidMount: function() {
     document.title = "Settings";
+    this._initClientSettings = lbry.getClientSettings();
   },
   componentWillMount: function() {
     lbry.getDaemonSettings(function(settings) {
@@ -62,6 +64,9 @@ var SettingsPage = React.createClass({
       });
     }.bind(this));
   },
+  onShowNsfwChange: function(event) {
+    lbry.setClientSetting('showNsfw', event.target.checked);
+  },
   render: function() {
     if (!this.state.initDaemonSettings) {
       return null;
@@ -103,6 +108,12 @@ var SettingsPage = React.createClass({
             </label>
           </div>
         </section>
+        <section className="card">
+          <h3>Content</h3>
+          <label style={settingsCheckBoxOptionStyles}>
+            <input type="checkbox" onChange={this.onShowNsfwChange} defaultChecked={this._initClientSettings.showNsfw} /> Include Not Safe For Work content in search results and Commmunity Content
+          </label>
+        </section>
         <section className="card">
           <h3>Share Diagnostic Data</h3>
           <label style={settingsCheckBoxOptionStyles}>