svg-layout-designer-react/test-server/node-http.js

import http from 'http';
const host = 'localhost';
const port = 5000;

const requestListener = async(request, response) => {
  response.setHeader('Access-Control-Allow-Origin', '*');
  response.setHeader('Access-Control-Allow-Headers', '*');
  response.setHeader('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, PATCH, OPTIONS');
  if (request.method === 'POST') {
    response.setHeader('Content-Type', 'application/json');
    const url = request.url;
    let json;
    if (url === '/ApplicationState') {
      const buffers = [];
      for await (const chunk of request) {
        buffers.push(chunk);
      }
      const data = Buffer.concat(buffers).toString();
      const bodyParsed = JSON.parse(data);
      console.log(bodyParsed);
      switch (bodyParsed.Action) {
        case 'FillHoleWithChassis':
          json = FillHoleWithChassis(bodyParsed);
          break;
        case 'SplitRemplissage':
          json = SplitRemplissage(bodyParsed);
          break;
        default:
          break;
      }
    } else {
      // TODO: Return 404 rather than this
      json = GetSVGLayoutConfiguration();
    }
    response.writeHead(200);
    return response.end(JSON.stringify(json));
  } else if (request.method === 'OPTIONS') {
    response.writeHead(200);
    return response.end();
  }

  response.setHeader('Content-Type', 'text/plain');
  response.writeHead(200);
  return response.end('Hello world');
};

const server = http.createServer(requestListener);
server.listen(port, host, () => {
  console.log(`Server is running on http://${host}:${port}`);
});

const GetSVGLayoutConfiguration = () => {
  return {
    AvailableContainers: [
      {
        BodyColor: null,
        BorderColor: '#ff0000',
        BorderWidth: 48,
        ContainerActions: null,
        ContainerDimensionning: null,
        DefaultChildrenContainers: null,
        Height: 0,
        IsPositionFixed: false,
        IsWidthFixed: false,
        MaxHeight: 0,
        MaxWidth: 3000,
        MinHeight: 0,
        MinWidth: 500,
        Type: 'Chassis',
        TypeChildContainerDefault: 'Trou',
        Width: 500,
        XPositionReference: 0,
        Style: {
          fillOpacity: 0,
          borderWidth: 2,
          stroke: 'red'
        }
      },
      {
        BodyColor: null,
        BorderColor: '#FFFFFF',
        BorderWidth: 0,
        ContainerActions: null,
        ContainerDimensionning: null,
        DefaultChildrenContainers: null,
        Height: 0,
        IsPositionFixed: false,
        IsWidthFixed: false,
        MaxHeight: 0,
        MaxWidth: 0,
        MinHeight: 0,
        MinWidth: 0,
        Type: 'Trou',
        TypeChildContainerDefault: 'Remplissage',
        Width: 0,
        XPositionReference: 0
      },
      {
        BodyColor: '#99C8FF',
        BorderColor: '#00FF00',
        BorderWidth: 0,
        ContainerActions: [
          {
            Action: 'SplitRemplissage',
            AddingBehavior: 0,
            CustomLogo: {
              Base64Image: null,
              Name: null,
              Svg: null,
              Url: ''
            },
            Description: 'Diviser le remplissage en insérant un montant',
            Id: null,
            Label: 'Diviser le remplissage'
          }
        ],
        ContainerDimensionning: {
          DimensionningStyle: 1,
          ShowDimensionning: false,
          ShowLabel: false
        },
        DefaultChildrenContainers: null,
        Height: 0,
        IsPositionFixed: false,
        IsWidthFixed: false,
        MaxHeight: 0,
        MaxWidth: 0,
        MinHeight: 0,
        MinWidth: 0,
        Type: 'Remplissage',
        TypeChildContainerDefault: null,
        Width: 0,
        XPositionReference: 0
      },
      {
        BodyColor: '#FFA947',
        BorderColor: '#FFA947',
        BorderWidth: 0,
        ContainerActions: null,
        ContainerDimensionning: null,
        DefaultChildrenContainers: null,
        Height: 0,
        IsPositionFixed: false,
        IsWidthFixed: false,
        MaxHeight: 0,
        MaxWidth: 0,
        MinHeight: 0,
        MinWidth: 0,
        Type: 'Montant',
        TypeChildContainerDefault: null,
        Width: 50,
        XPositionReference: 1
      },
      {
        BodyColor: '#FFA3D1',
        BorderColor: '#FF6DE6',
        BorderWidth: 0,
        ContainerActions: null,
        ContainerDimensionning: {
          DimensionningStyle: 0,
          ShowDimensionning: false,
          ShowLabel: false
        },
        DefaultChildrenContainers: null,
        Height: 0,
        IsPositionFixed: false,
        IsWidthFixed: false,
        MaxHeight: 0,
        MaxWidth: 0,
        MinHeight: 0,
        MinWidth: 0,
        Type: 'Ouverture',
        TypeChildContainerDefault: null,
        Width: 0,
        XPositionReference: 0
      },
      {
        BodyColor: '#000000',
        BorderColor: null,
        BorderWidth: 0,
        ContainerActions: null,
        ContainerDimensionning: {
          DimensionningStyle: 0,
          ShowDimensionning: false,
          ShowLabel: false
        },
        DefaultChildrenContainers: null,
        Height: 0,
        IsPositionFixed: false,
        IsWidthFixed: false,
        MaxHeight: 0,
        MaxWidth: 0,
        MinHeight: 0,
        MinWidth: 0,
        Type: 'Dilatation',
        TypeChildContainerDefault: null,
        Width: 8,
        XPositionReference: 0
      },
      {
        BodyColor: '#dee2e4',
        BorderColor: '#54616c',
        BorderWidth: 0,
        ContainerActions: [
          {
            Action: 'FillHoleWithChassis',
            AddingBehavior: 1,
            CustomLogo: {
              Base64Image: null,
              Name: null,
              Svg: null,
              Url: ''
            },
            Description: 'Remplir le trou avec des châssis',
            Id: null,
            Label: 'Calepiner'
          }
        ],
        ContainerDimensionning: null,
        DefaultChildrenContainers: null,
        Height: 0,
        IsPositionFixed: false,
        IsWidthFixed: false,
        MaxHeight: 0,
        MaxWidth: 0,
        MinHeight: 0,
        MinWidth: 0,
        Type: '',
        TypeChildContainerDefault: null,
        Width: 0,
        XPositionReference: 0
      }
    ],
    AvailableSymbols: [
      {
        Height: 0,
        Image: {
          Base64Image: null,
          Name: null,
          Svg: null,
          Url: 'https://www.manutan.fr/img/S/GRP/ST/AIG3930272.jpg'
        },
        Name: 'Poteau structure',
        Width: 0,
        XPositionReference: 1
      },
      {
        Height: 0,
        Image: {
          Base64Image: null,
          Name: null,
          Svg: null,
          Url: 'https://e7.pngegg.com/pngimages/647/127/png-clipart-svg-working-group-information-world-wide-web-internet-structure.png'
        },
        Name: 'Joint de structure',
        Width: 0,
        XPositionReference: 0
      }
    ],
    MainContainer: {
      BodyColor: null,
      BorderColor: '#FFFFFF',
      BorderWidth: 0,
      ContainerActions: null,
      ContainerDimensionning: null,
      DefaultChildrenContainers: null,
      Height: 200,
      IsPositionFixed: false,
      IsWidthFixed: false,
      MaxHeight: 0,
      MaxWidth: 0,
      MinHeight: 0,
      MinWidth: 0,
      Type: 'Trou',
      TypeChildContainerDefault: null,
      Width: 1000,
      XPositionReference: 0
    }
  };
};

const FillHoleWithChassis = (request) => {
  const maxWidthChassis = 3000;
  const nbChassis = Math.ceil(request.ContainerAction.Width / maxWidthChassis);
  const lstModels = [];
  for (let i = 0; i <= nbChassis; i++) {
    if (i === 1 && request.ContainerAction.ExistOnBefore) {
      lstModels.push({ Type: 'Dilatation' });
    }
    lstModels.push({ Type: 'Chassis' });
    if (i < nbChassis) {
      lstModels.push({ Type: 'Dilatation' });
    }
    if (i === nbChassis && request.ContainerAction.ExistOnAfter) {
      lstModels.push({ Type: 'Dilatation' });
    }
  }
  return {
    ApplicationState: {
      Containers: lstModels
    }
  };
};

const SplitRemplissage = (request) => {
  const lstModels = [
    { Type: 'Remplissage' },
    { Type: 'Montant' },
    { Type: 'Remplissage' }
  ];

  return {
    ApplicationState: { Containers: lstModels }
  };
};