Implement radio boxes ( vector-im/vector-web#731 ) for history visibility. Hook up remaining bits.

src/components/structures/RoomView.js

@@ -1222,15 +1222,15 @@ module.exports = React.createClass({
         this.refs.room_settings.setTopic(this.refs.header.getTopic());
         
         this.refs.room_settings.save().then((results) => {
-            console.log("Settings saved.");
             var fails = results.filter(function(result) { return result.state !== "fulfilled" });
+            console.log("Settings saved with %s errors", fails.length);
             if (fails.length) {
                 fails.forEach(function(result) {
                     console.error(result.reason);
                 });
                 var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
                 Modal.createDialog(ErrorDialog, {
-                    title: "Failed to set state",
+                    title: "Failed to save settings",
                     description: fails.map(function(result) { return result.reason }).join("\n"),
                 });
                 // still editing room settings

src/components/views/rooms/RoomSettings.js

@@ -102,12 +102,31 @@ module.exports = React.createClass({
             promises.push(MatrixClientPeg.get().setRoomTopic(roomId, this.state.topic));
         }
 
-        // TODO:
+        if (this.state.history_visibility !== originalState.history_visibility) {
-        // this.state.join_rule
+            promises.push(MatrixClientPeg.get().sendStateEvent(
-        // this.state.history_visibility
+                roomId, "m.room.history_visibility",
-        // this.state.guest_access
+                { history_visibility: this.state.history_visibility },
+                ""
+            ));
+        }
+
+        if (this.state.join_rule !== originalState.join_rule) {
+            promises.push(MatrixClientPeg.get().sendStateEvent(
+                roomId, "m.room.join_rules",
+                { join_rule: this.state.join_rule },
+                ""
+            ));
+        }
+
+        if (this.state.guest_access !== originalState.guest_access) {
+            promises.push(MatrixClientPeg.get().sendStateEvent(
+                roomId, "m.room.guest_access",
+                { guest_access: this.state.guest_access },
+                ""
+            ));
+        }
+
 
-        // setRoomMutePushRule
         if (this.state.areNotifsMuted !== originalState.areNotifsMuted) {
             promises.push(MatrixClientPeg.get().setRoomMutePushRule(
                 "global", roomId, this.state.areNotifsMuted
@@ -144,6 +163,7 @@ module.exports = React.createClass({
                 }
             });
         }
+        console.log("Performing %s operations", promises.length);
 
         // color scheme
         promises.push(this.saveColor());
@@ -204,6 +224,12 @@ module.exports = React.createClass({
         }
         return event.getContent()[keyName] || defaultValue;
     },
+
+    _onHistoryRadioToggle: function(ev) {
+        this.setState({
+            history_visibility: ev.target.value
+        });
+    },
     
     _onToggle: function(keyName, checkedValue, uncheckedValue, ev) {
         console.log("Checkbox toggle: %s %s", keyName, ev.target.checked);
@@ -386,6 +412,10 @@ module.exports = React.createClass({
                 }
             </div>
 
+        // If there is no history_visibility, it is assumed to be 'shared'.
+        // http://matrix.org/docs/spec/r0.0.0/client_server.html#id31
+        var historyVisibility = this.state.history_visibility || "shared";
+
         // FIXME: disable guests_read if the user hasn't turned on shared history
         return (
             <div className="mx_RoomSettings">
@@ -402,20 +432,38 @@ module.exports = React.createClass({
                             defaultChecked={this.state.join_rule !== "public"}/>
                         Make this room private
                     </label>
-                    <label>
-                        <input type="checkbox" ref="share_history"
-                            defaultChecked={this.state.history_visibility === "shared" || this.state.history_visibility === "world_readable"}/>
-                        Share message history with new participants
-                    </label>
                     <label>
                         <input type="checkbox" onChange={this._onToggle.bind(this, "guest_access", "can_join", "forbidden")}
                             defaultChecked={this.state.guest_access === "can_join"}/>
                         Let guests join this room
                     </label>
-                    <label>
+                    <div className="mx_RoomSettings_settings">
-                        <input type="checkbox" ref="guests_read" defaultChecked={this.state.history_visibility === "world_readable"}/>
+                        <h3>Who can read history?</h3>
-                        Let users read message history without joining
+                        <label htmlFor="hvis_wr">
-                    </label>
+                            <input type="radio" id="hvis_wr" name="historyVis" value="world_readable"
+                                    defaultChecked={historyVisibility === "world_readable"}
+                                    onChange={this._onHistoryRadioToggle} />
+                            Anyone
+                        </label>
+                        <label htmlFor="hvis_sh">
+                            <input type="radio" id="hvis_sh" name="historyVis" value="shared"
+                                    defaultChecked={historyVisibility === "shared"}
+                                    onChange={this._onHistoryRadioToggle} />
+                            Members only (since the room began)
+                        </label>
+                        <label htmlFor="hvis_inv">
+                            <input type="radio" id="hvis_inv" name="historyVis" value="invited"
+                                    defaultChecked={historyVisibility === "invited"}
+                                    onChange={this._onHistoryRadioToggle} />
+                            Members only (since they were invited)
+                        </label>
+                        <label htmlFor="hvis_joi">
+                            <input type="radio" id="hvis_joi" name="historyVis" value="joined"
+                                    defaultChecked={historyVisibility === "joined"}
+                                    onChange={this._onHistoryRadioToggle} />
+                            Members only (since they joined)
+                        </label>
+                    </div>
                     <label className="mx_RoomSettings_encrypt">
                         <input type="checkbox" />
                         Encrypt room