window.h5PanelSdk;

// webpack.config.js
module.exports = {
  externals: {
    'qcloud-iotexplorer-h5-panel-sdk': 'h5PanelSdk',
  },
};

console.log(sdk.deviceId);

const action = 'AppGetDeviceStatuses'; // Action name for requesting application side API
const params = { // Parameters for requesting application side API
  DeviceIds: [sdk.deviceId]
};
sdk.requestTokenApi(action, params).then(data = >  {
  // Request successful
  console.log(data);
}).catch(err = >  {
  //Request failed
  console.error(err);
});


// Attribute data of the device to be controlled
const deviceData = {
  light_switch: 0
};

// Control the current device of the H5 panel
sdk.controlDeviceData(deviceData).then(data = >  {
  // Request successful
  console.log(data);
}).catch(err = >  {
  //Request failed
  console.error(err);
});

// Control the specified device
const deviceId = 'The ID of the device to control';
sdk.controlDeviceData(deviceData, deviceId).then(data = >  {
  // Request successful
  console.log(data);
}).catch(err = >  {
  //Request failed
  console.error(err);
});


// Perform firmware upgrade on the current device
sdk.goFirmwareUpgradePage();

// Perform firmware upgrade on the specified device
sdk.goFirmwareUpgradePage({
  deviceId: 'The ID of the device to perform firmware upgrade'
});


// Listen for device-reported data push
sdk.on('wsReport', ({ deviceId, deviceData }) = >  {
  console.log('websocket device report', deviceId, deviceData);
});

// Listen for device online status change push
sdk.on('wsStatusChange', ({ deviceId, deviceStatus }) = >  {
  console.log('websocket device status change', deviceId, deviceStatus);
});

// Listen for device control push
sdk.on('wsControl', ({ deviceId, deviceData }) = >  {
  console.log('websocket device control', deviceId, deviceData);
});


sdk.goDeviceDetailPage();

sdk.showDeviceDetail({
  labelWidth: 120, // Label width of device detail
  margin-top: 8, // Padding-top of device detail
  shareParams: { // Parameters for custom share when sharing devices
    a: 'a',
    b: 'b',
  },
  extendItems: [
    {
      labelIcon: 'https://main.qcloudimg.com/raw/be1d876d55ec2479d384e17c94****e69.svg',
      label: 'custom menu'
      content: 'Custom menu content (optional)'
      onClick: () => console.log('Click custom menu')
    },
  ],
  extendButtons: [
    {
      text: 'Custom button'
      type: 'warning',
      onClick: () => console.log('click Custom button')
    },
    {
      text: 'Custom button 2'
      type: 'primary',
      onClick: () => console.log('click Custom button 2')
    },
    {
      text: 'Get custom share parameters'
      onClick: async () = >  {
        const shareParams = await sdk.getShareParams();
        console.log('Custom share parameters: ', shareParams);
      }
    },
    {
      text: 'Hide device detail',
      type: '',
      onClick: () = >  sdk.hideDeviceDetail(),
    },
  ],
});

// Listen for the H5 page to move to the foreground
sdk.on('pageShow', () = >  {
  console.log('on pageShow');
});

// Listen for the H5 page to switch to the background
sdk.on('pageHide', () = >  {
  console.log('on pageHide');
});

// Listen for the mini program to move to the foreground
sdk.on('appShow', () = >  {
  console.log('on appShow');
});

// Listen for the mini program to switch to the background
sdk.on('appHide', () = >  {
  console.log('on appHide');
});

// When the H5 page switches to the foreground, refresh the device name of the page title
sdk.on('pageShow', async () = >  {
  const deviceInfo = await sdk.getDeviceInfo();

  // Device display name
  const deviceDisplayName = deviceInfo.AliasName || sdk.productInfo.Name;
  // Update page title
  window.document.title = deviceDisplayName;
});