fix wallpaper defaults

src/lib/utils.js

@@ -254,3 +254,23 @@ export function defaultWallpaper() {
   const wp = wallpaperIndex[WALLPAPER_DEFAULTS.type][WALLPAPER_DEFAULTS.index];
   return {name: `../${WALLPAPER_DEFAULTS.path}${wp.name}`, size: wp.size};
 }
+
+export function wallpaperNameFromUrl(wallpaperUrl) {
+  // Get filename from URL.
+  const parts = wallpaperUrl.split('/');
+  return parts[parts.length - 1];
+}
+
+export function wallpaperTypeFromUrl(wallpaperUrl) {
+  // Get filename from URL.
+  const fname = wallpaperNameFromUrl(wallpaperUrl);
+  const wallpaperIndex = require('../../img/bkg/index.json');
+  for (const type in wallpaperIndex) {
+    for (let i = 0; i < wallpaperIndex[type].length; i++) {
+      if (wallpaperIndex[type][i].name == fname) {
+        return type;
+      }
+    }
+  }
+  return null;
+}

src/views/sidepanel-view.jsx

@@ -254,6 +254,9 @@ class SidepanelView extends React.PureComponent {
           <Suspense fallback={<div className="panel-form-row"><FormattedMessage id="loading_note"
             defaultMessage="Loading..." description="Message shown when component is loading"/></div>}>
             <WallpapersView
+              wallpaper={this.props.wallpaper}
+              wallpaperSize={this.props.wallpaperSize}
+              wallpaperBlur={this.props.wallpaperBlur}
               colorSchema={this.props.colorSchema !== 'auto' ? this.props.colorSchema : this.props.systemColorSchema}
               onWallpaperSelected={this.props.onWallpaperSelected}
             />

src/views/tinode-web.jsx

@@ -2179,6 +2179,9 @@ class TinodeWeb extends React.Component {
             reqCredMethod={this.state.reqCredMethod}
             textSize={this.state.textSize}
             colorSchema={this.state.colorSchema}
+            wallpaper={this.state.wallpaper}
+            wallpaperSize={this.state.wallpaperSize}
+            wallpaperBlur={this.state.wallpaperBlur}
             systemColorSchema={this.state.systemColorSchema}
             sendOnEnter={this.state.sendOnEnter}
 

src/views/wallpapers.jsx

@@ -3,17 +3,20 @@ import React from 'react';
 import { FormattedMessage } from 'react-intl';
 import HashNavigation from '../lib/navigation.js';
 import { WALLPAPER_DEFAULTS } from '../config.js';
+import { wallpaperNameFromUrl, wallpaperTypeFromUrl } from '../lib/utils.js';
 import imageIndex from '../../img/bkg/index.json';
 
 export default class WallpapersView extends React.PureComponent {
   constructor(props) {
     super(props);
 
+    const type = wallpaperTypeFromUrl(this.props.wallpaper);
+    const name = wallpaperNameFromUrl(this.props.wallpaper);
     this.state = {
-      tab: WALLPAPER_DEFAULTS.type, // currently selected tab: 'patt' | 'img'
-      selectedType: WALLPAPER_DEFAULTS.type, // type of the selected wallpaper.
-      wallpaper: imageIndex[WALLPAPER_DEFAULTS.type][WALLPAPER_DEFAULTS.index].name,
-      blur: 0,
+      tab: type || WALLPAPER_DEFAULTS.type, // currently selected tab: 'patt' | 'img'
+      selectedType: type || WALLPAPER_DEFAULTS.type, // type of the selected wallpaper.
+      wallpaper: name || imageIndex[WALLPAPER_DEFAULTS.type][WALLPAPER_DEFAULTS.index].name,
+      blur: this.props.wallpaperBlur | 0,
     };
 
     this.blurValues = [0, 1, 2, 4, 8, 16];
@@ -21,6 +24,7 @@ export default class WallpapersView extends React.PureComponent {
     this.handleTabClick = this.handleTabClick.bind(this);
     this.handleWallpaperSelected = this.handleWallpaperSelected.bind(this);
     this.handleBlurChanged = this.handleBlurChanged.bind(this);
+    this.hasChanged = this.hasChanged.bind(this);
   }
 
   handleTabClick(e) {
@@ -32,6 +36,10 @@ export default class WallpapersView extends React.PureComponent {
   handleWallpaperSelected(e) {
     let index, type, blur
     if (!e) {
+      if (!this.hasChanged()) {
+        return;
+      }
+
       // Restore default.
       type = WALLPAPER_DEFAULTS.type;
       index = WALLPAPER_DEFAULTS.index;
@@ -58,11 +66,18 @@ export default class WallpapersView extends React.PureComponent {
     }
   }
 
+  hasChanged() {
+    return this.state.selectedType != WALLPAPER_DEFAULTS.type ||
+      this.state.wallpaper != imageIndex[WALLPAPER_DEFAULTS.type][WALLPAPER_DEFAULTS.index].name ||
+      this.state.blur != 0;
+  }
+
   render() {
     return (
       <div className="flex-column">
-        <div className="panel-form-row clean-clickable">
-          <a className="flat-button" onClick={() => this.handleWallpaperSelected(null)}>
+        <div className={`panel-form-row${this.hasChanged() ? ' clean-clickable' : ''}`}>
+          <a className={`flat-button${this.hasChanged() ? '' : ' disabled'}`}
+            onClick={() => this.handleWallpaperSelected(null)}>
             <i className="material-icons">undo</i>&nbsp;
             <FormattedMessage id="button_restore" defaultMessage="Restore default" description="Reset setting to default"/>
           </a>