Add support for display name, initial value and url parameters

README.md

@@ -67,4 +67,13 @@ To set custom highlight colors, change the Sass variables `$color-highlight-cust
 *  `signInPrompt` (*string*) - Show sign in prompts    
     - `'none'` - Never show (default)
     - `'guests'` - Show if signed in as guest
-    - `'all'` - Always show
+    - `'all'` - Always show
+*  `displayName` (*string*) - Display name of user, useful when using guest accounts
+*  `composerIntialValue` (*string*) - Initial value of the composer for prepoulating a sample message
+*  `signInPrompt` (*string*) - Show sign in prompts    
+    - `'none'` - Never show (default)
+    - `'guests'` - Show if signed in as guest
+    - `'all'` - Always show
+*  `urlParameters` (*boolean*) - Allow adding to config with url prameters (`#displayName=Something`)    
+    - `'true'` (default)
+    - `'false'`

app.js

@@ -6,6 +6,33 @@ import ThemeContext from './components/theme-context.jsx';
 require('./styles/main.scss');
 
 ReactDOM.render(
-    <Client {...config} />,
+    <Client {...{...config, ...getConfigFromURL()}} />,
     document.getElementById('root')
-);
+);
+
+function getConfigFromURL() {
+    if (!config.urlParameters) return {};
+
+    const hash = window.location.hash.substr(1);
+    const params = hash.split('&').reduce((acc, param) => {
+        const [key, value] = param.split('=');
+        acc[key] = parseValue(value);
+        console.log(value)
+        return acc;
+    }, {});
+
+    console.log(params)
+
+    return params;
+}
+
+function parseValue(value) {
+    if (value === 'true') {
+        return true;
+    } else if (value === 'false') {
+        return false;
+    } else if (Number.isFinite(value)) {
+        return Number(value);
+    }
+    return decodeURI(value);
+}

components/client.jsx

@@ -40,7 +40,9 @@ export default class Client extends Component{
         roomsList: PropTypes.bool, // Enable roomsList? Overrides readOnly
         msgComposer: PropTypes.bool, // Enable msgComposer? Overrides readOnly
         whitelist: PropTypes.array, // Whitelisted origins - ignore to allow all
-        signInPrompt: PropTypes.string // Show signInPrompt for - none, guests, all
+        signInPrompt: PropTypes.string, // Show signInPrompt for - none, guests, all
+        displayName: PropTypes.string, // Display name for user (used for guests)
+        composerIntialValue: PropTypes.string // Initial value of composer
     };
 
     constructor(props) {
@@ -119,6 +121,7 @@ export default class Client extends Component{
                     userId: userId
                 });
                 this.client.setGuest(true);
+                if (this.props.displayName) this.client.setDisplayName(this.props.displayName);
                 if (props.readOnly) {
                     this.client.peekInRoom(this.props.roomId, {syncRoom: true}).then(() => {
                         this.init();
@@ -537,7 +540,7 @@ export default class Client extends Component{
                     </div>}       
 
                     <div className={`client-body bg-primary-${this.state.theme}`}>
-                        {this.state.roomsList && (<RoomsList list={this.client.getRooms()} 
+                        {this.state.roomsList > 1 && (<RoomsList list={this.client.getRooms()} 
                             currentRoomId={currentRoomId}
                             onClick={this.onSelectRoom} />)}
                         <TimelinePanel homeserver={homeserver} room={this.state.room} 
@@ -550,6 +553,7 @@ export default class Client extends Component{
                                     replyTo={this.replyTo} /> : 
                                 <></>}
                             {this.state.msgComposer ? <MessageComposer client={this.client} 
+                                intialValue={this.props.composerIntialValue}
                                 roomId={currentRoomId} mxEvent={this.state.reply} 
                                 unsetReply={this.replyTo} ref={this.msgComposer}
                                 openContinueModal={this.state.readOnly && this.continueModal.current ? 

components/message-composer.jsx

@@ -19,13 +19,14 @@ export default class MessageComposer extends PureComponent {
         client: PropTypes.object.isRequired, // Client object
         mxEvent: PropTypes.object, // Event to reply to
         unsetReply: PropTypes.func.isRequired, // Callback to unset reply
-        openContinueModal: PropTypes.func // Callback to open continue dialog box
+        openContinueModal: PropTypes.func, // Callback to open continue dialog box
+        intialValue: PropTypes.string // Initial value of composer
     };
 
     constructor(props) {
         super(props);
         this.state = {
-            value: '',
+            value: props.intialValue || '',
             busy: false
         };