Technische Dokumentation der Open Datacheck Deep Search

{
    "channelid" : [2,1],
    "externalsearch" : false,
    "usebaudocs" : false,
    "removeroundbracketsinsuppliername" : true,
    "removesquarebracketsinsuppliername" : true,
    "style":{
        "primarycolor": "#616161",
        "secondarycolor": "#D3D3D3"
    },
    "pdfviewer":{
             "position":{
                   "top": "150px",
                   "right": "20px",
                   "bottom": "50px",
                   "left": "20px"
             }
    }
}

<!-- Widget -->
<xs-loader 
    accesstoken="[acccesstoken]" 
    refreshtoken="[refreshtoken]" 
    targeturl="https://2.0.open-datacheck.de" 
    widget="xs-deepsearch" 
    widgetmode="true" 
    language="de" 
    parameter="eyJjaGFubmVsaWQiOjIsImV4dGVybmFsc2VhcmNoIjpmYWxzZSwidXNlYmF1ZG9jcyI6ZmFsc2V9">
</xs-loader>

<!-- Widget Resourcen -->
<script src="https://widget.itek.de/xs-loader/1.0.1/runtime.js" defer></script>
<script src="https://widget.itek.de/xs-loader/1.0.1/polyfills.js" defer></script>
<script src="https://widget.itek.de/xs-loader/1.0.1/main.js" defer></script>

<!-- Widget -->
<xs-loader 
    accesstoken="[acccesstoken]" 
    refreshtoken="[refreshtoken]" 
    targeturl="https://2.0.open-datacheck.de" 
    widget="xs-deepsearch" 
    widgetmode="true" 
    language="de" 
    parameter="eyJjaGFubmVsaWQiOjIsImV4dGVybmFsc2VhcmNoIjpmYWxzZSwidXNlYmF1ZG9jcyI6ZmFsc2V9">
</xs-loader>

<!-- Widget Resourcen -->
<link rel="stylesheet" href="https://widget.itek.de/xs-loader/2.0.0/styles.css">
<noscript><link rel="stylesheet" href="https://widget.itek.de/xs-loader/2.0.0/styles.css"></noscript>
<script src="https://widget.itek.de/xs-loader/2.0.0/xs-loader.js" defer></script>

<script defer>
      // Auf ein Event vom Widget "xs-loader" warten. 
      //Wenn das Event "true" ist, kann ein Eventlistener für die DeepSearch registriert werden
      const loader_element = document.querySelector('xs-loader');
      loader_element.addEventListener('loadfinished', (loadEvent) => {
        console.log("Load finished: " +  loadEvent.detail);
        
        // Auf ein Event vom Widget warten.
        const widget_status = document.querySelector('xs-deepsearch');
        widget_status.addEventListener('shopsearch', (statusEvent) => {
          console.log('"shopsearch" emitted: ' + statusEvent.detail)
        });
      });
</script>

<script defer>
      // Auf ein Event vom Widget "xs-loader" warten. 
      //Wenn das Event "true" ist, kann ein Eventlistener für die DeepSearch registriert werden
      const loader_element = document.querySelector('xs-loader');
      loader_element.addEventListener('loadfinished', (loadEvent) => {
        console.log("Load finished: " +  loadEvent.detail);
        
        // Auf ein Event vom Widget warten.
        const widget_status = document.querySelector('xs-deepsearch');
        widget_status.addEventListener('shopcart', (statusEvent) => {
          console.log('"shopcart" emitted: ' + statusEvent.detail)
        });
      });
</script>

<script defer>
      // Auf ein Event vom Widget "xs-loader" warten. 
      //Wenn das Event "true" ist, kann ein Eventlistener für die DeepSearch registriert werden
      const loader_element = document.querySelector('xs-loader');
      loader_element.addEventListener('loadfinished', (loadEvent) => {
        console.log("Load finished: " +  loadEvent.detail);
        
        // Auf ein Event vom Widget warten.
        const widget_status = document.querySelector('xs-deepsearch');
        widget_status.addEventListener('status', (statusEvent) => {
          console.log('"status" emitted: ' + statusEvent.detail)
        });
      });
</script>

<?php
    $systemURL = "https://2.0.open-datacheck.de"; // URL der Anlage, von der das Widget eingebunden werden soll
    $systemUsername  = ""; // Benutzer auf der Anlage
    $systemPassword = ""; // Passwort des Anlagen-Benutzeres
    $xsloaderVersion = "1.0.1"; // Version des XS-Loader Widgets

    $params = array(
        'grant_type' => 'password',
        'client_id' => 'article_search_client',
        'username'=> $systemUsername,                
        'password' => $systemPassword,
        'scope' => 'customer_portal_view_article_data_30',
    );

    $ch = curl_init();
    curl_setopt($ch, CURLOPT_URL, $systemURL . "/oauth2/token");
    curl_setopt($ch, CURLOPT_POST, TRUE);
    curl_setopt($ch, CURLOPT_POSTFIELDS, $params);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);

    $result = curl_exec($ch);
    $json_deepsearch = json_decode($result, true);
    curl_close($ch);
?>

<html>
    <head> 
        <title>Widget Integration Test</title>
    </head>

    <body>
        <noscript>
            DeepSearch funktioniert nur mit aktiviertem Javascript.
        </noscript>

            <!-- vor das widget--> 
            <link rel="stylesheet" href="https://widget.itek.de/xs-loader/<?php echo $xsloaderVersion ?>/styles.css">
            <noscript><link rel="stylesheet" href="https://widget.itek.de/xs-loader/<?php echo $xsloaderVersion ?>/styles.css"></noscript>
            <script src="https://widget.itek.de/xs-loader/<?php echo $xsloaderVersion ?>/runtime.js" defer></script>
            <script src="https://widget.itek.de/xs-loader/<?php echo $xsloaderVersion ?>/polyfills.js" defer></script>
            <script src="https://widget.itek.de/xs-loader/<?php echo $xsloaderVersion ?>/main.js" defer></script>

            <!-- Widget -->
            <xs-loader widget="xs-deepsearch" accesstoken="<?php echo $json_deepsearch['access_token'];?>" refreshtoken="<?php echo $json_deepsearch['refresh_token'];?>" targeturl="<?php echo $systemURL ?>" language="de" widgetmode=true ></xs-loader>
    </body> 
</html>

<?php
    $systemURL = "https://2.0.open-datacheck.de"; // URL der Anlage, von der das Widget eingebunden werden soll
    $systemUsername  = ""; // Benutzer auf der Anlage
    $systemPassword = ""; // Passwort des Anlagen-Benutzeres
    $xsloaderVersion = "2.0.0"; // Version des XS-Loader Widgets

    $params = array(
        'grant_type' => 'password',
        'client_id' => 'article_search_client',
        'username'=> $systemUsername,                
        'password' => $systemPassword,
        'scope' => 'customer_portal_view_article_data_30',
    );

    $ch = curl_init();
    curl_setopt($ch, CURLOPT_URL, $systemURL . "/oauth2/token");
    curl_setopt($ch, CURLOPT_POST, TRUE);
    curl_setopt($ch, CURLOPT_POSTFIELDS, $params);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);

    $result = curl_exec($ch);
    $json_deepsearch = json_decode($result, true);
    curl_close($ch);
?>

<html>
    <head> 
        <title>Widget Integration Test</title>
    </head>

    <body>
        <noscript>
            DeepSearch funktioniert nur mit aktiviertem Javascript.
        </noscript>

            <!-- vor das widget--> 
            <link rel="stylesheet" href="https://widget.itek.de/xs-loader/<?php echo $xsloaderVersion;?>/styles.css">
            <script src="https://widget.itek.de/xs-loader/<?php echo $xsloaderVersion ?>/xs-loader.js" defer></script>

            <!-- Widget -->
            <xs-loader widget="xs-deepsearch" accesstoken="<?php echo $json_deepsearch['access_token'];?>" refreshtoken="<?php echo $json_deepsearch['refresh_token'];?>" targeturl="<?php echo $systemURL ?>" language="de" widgetmode=true ></xs-loader>
    </body> 
</html>

<?php
    $systemURL = "https://2.0.open-datacheck.de"; // URL der Anlage, von der das Widget eingebunden werden soll
    $systemUsername  = ""; // Benutzer auf der Anlage
    $systemPassword = ""; // Passwort des Anlagen-Benutzeres
    $xsloaderVersion = "1.0.1"; // Version des XS-Loader Widgets
    $phpDebug = true; // Debugmode für den PHP Teil
    $phpDisableSSLVerify = true;

    //BauDocs Parameter
    $systemManufacturerIdType = "TODO"; // ID-Typ der Anlage im ID-Hub
    $baudocsClientId = 'TODO'; // Client-Id auf dem Baudocs-System
    $baudocsClientSecret = "TODO"; // Secret des Clients
    $baudocsUsername = "TODO"; // Benutzer auf dem Baudocs-System
    $baudocsPassword = "TODO"; // Passwort des Baudocs-Benutzers

    $params = array(
        'grant_type' => 'password',
        'client_id' => 'article_search_client',
        'username'=> $systemUsername,                
        'password' => $systemPassword,
        'scope' => 'customer_portal_view_article_data_30',
    );
    
    try{
        $ch = curl_init();
        curl_setopt($ch, CURLOPT_URL, $systemURL . "/oauth2/token");
        curl_setopt($ch, CURLOPT_POST, TRUE);
        curl_setopt($ch, CURLOPT_POSTFIELDS, $params);
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
        
        if( $phpDisableSSLVerify) {
            //Disable CURLOPT_SSL_VERIFYHOST and CURLOPT_SSL_VERIFYPEER by
            curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, false);
            curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
        }
       
        $result = curl_exec($ch);
        if(curl_exec($ch) === false && $phpDebug) 
        {
            echo 'Curl-Fehler: ' . curl_error($ch);
        }
        $json_deepsearch = json_decode($result, true);
    }catch (Exception $e) {
        if( $phpDebug)
        {
            echo 'Exception abgefangen: ',  $e->getMessage(), "\n";
        }
    }
    
    curl_close($ch);

    $params = array(
        'grant_type' => 'password',
        'client_id' => $baudocsClientId,
        'client_secret' => $baudocsClientSecret,
        'username'=> $baudocsUsername,
        'password' => $baudocsPassword,
        'scope' => 'consumer',
    );

    $ch = curl_init();
    curl_setopt($ch, CURLOPT_URL, "https://plattform.baudocs.de/backend/oauth/token");
    curl_setopt($ch, CURLOPT_POST, TRUE);
    curl_setopt($ch, CURLOPT_POSTFIELDS, $params);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
    
    $result = curl_exec($ch);
    $json_baudocs = json_decode($result, true);


    $parameters = new stdClass();
    $parameters->usebaudocs = true;
    $parameters->baudocsaccesstoken = $json_baudocs['access_token'];
    $parameters->baudocsrefreshtoken = $json_baudocs['refresh_token'];
    $parameters->manufactureridtype = $systemManufacturerIdType;
?>

<html>
    <head>
        <title>Widget Integration Test</title>
    </head>

    <body>
        <noscript>
            DeepSearch funktioniert nur mit aktiviertem Javascript.
        </noscript>

        <!-- Widgetcontainer an die Stelle kopieren, wo das Widget angezeugt werden soll --> 
        <div id="widget-container" class="widget-container" >
            <!-- vor das widget-->
            <noscript>Deepsearch funktioniert nur mit aktiviertem Javascript.</noscript>
            <link rel="stylesheet" href="https://widget.itek.de/xs-loader/<?php echo $xsloaderVersion ?>/styles.css">
            <noscript><link rel="stylesheet" href="https://widget.itek.de/xs-loader/<?php echo $xsloaderVersion ?>/styles.css"></noscript>
            <script src="https://widget.itek.de/xs-loader/<?php echo $xsloaderVersion ?>/runtime.js" defer></script>
            <script src="https://widget.itek.de/xs-loader/<?php echo $xsloaderVersion ?>/polyfills.js" defer></script>
            <script src="https://widget.itek.de/xs-loader/<?php echo $xsloaderVersion ?>/main.js" defer></script>

            <!-- Widget -->
            <xs-loader widget="xs-deepsearch" accesstoken="<?php echo $json_deepsearch['access_token'];?>" refreshtoken="<?php echo $json_deepsearch['refresh_token'];?>" targeturl="<?php echo $systemURL ?>" language="de" widgetmode=true parameter="<?php base64_encode(json_encode((array)$parameters)) ?>"></xs-loader>
        </div>
    </body> 
</html>

<?php
    $systemURL = "https://2.0.open-datacheck.de"; // URL der Anlage, von der das Widget eingebunden werden soll
    $systemUsername  = ""; // Benutzer auf der Anlage
    $systemPassword = ""; // Passwort des Anlagen-Benutzeres
    $xsloaderVersion = "2.0.1"; // Version des XS-Loader Widgets
    $phpDebug = true; // Debugmode für den PHP Teil
    $phpDisableSSLVerify = true;

    //BauDocs Parameter
    $systemManufacturerIdType = "TODO"; // ID-Typ der Anlage im ID-Hub
    $baudocsClientId = 'TODO'; // Client-Id auf dem Baudocs-System
    $baudocsClientSecret = "TODO"; // Secret des Clients
    $baudocsUsername = "TODO"; // Benutzer auf dem Baudocs-System
    $baudocsPassword = "TODO"; // Passwort des Baudocs-Benutzers

    $params = array(
        'grant_type' => 'password',
        'client_id' => 'article_search_client',
        'username'=> $systemUsername,                
        'password' => $systemPassword,
        'scope' => 'customer_portal_view_article_data_30',
    );
    
    try{
        $ch = curl_init();
        curl_setopt($ch, CURLOPT_URL, $systemURL . "/oauth2/token");
        curl_setopt($ch, CURLOPT_POST, TRUE);
        curl_setopt($ch, CURLOPT_POSTFIELDS, $params);
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
        
        if( $phpDisableSSLVerify) {
            //Disable CURLOPT_SSL_VERIFYHOST and CURLOPT_SSL_VERIFYPEER by
            curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, false);
            curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
        }
       
        $result = curl_exec($ch);
        if(curl_exec($ch) === false && $phpDebug) 
        {
            echo 'Curl-Fehler: ' . curl_error($ch);
        }
        $json_deepsearch = json_decode($result, true);
    }catch (Exception $e) {
        if( $phpDebug)
        {
            echo 'Exception abgefangen: ',  $e->getMessage(), "\n";
        }
    }
    
    curl_close($ch);

    $params = array(
        'grant_type' => 'password',
        'client_id' => $baudocsClientId,
        'client_secret' => $baudocsClientSecret,
        'username'=> $baudocsUsername,
        'password' => $baudocsPassword,
        'scope' => 'consumer',
    );

    $ch = curl_init();
    curl_setopt($ch, CURLOPT_URL, "https://plattform.baudocs.de/backend/oauth/token");
    curl_setopt($ch, CURLOPT_POST, TRUE);
    curl_setopt($ch, CURLOPT_POSTFIELDS, $params);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
    
    $result = curl_exec($ch);
    $json_baudocs = json_decode($result, true);


    $parameters = new stdClass();
    $parameters->usebaudocs = true;
    $parameters->baudocsaccesstoken = $json_baudocs['access_token'];
    $parameters->baudocsrefreshtoken = $json_baudocs['refresh_token'];
    $parameters->manufactureridtype = $systemManufacturerIdType;
?>

<html>
    <head>
        <title>Widget Integration Test</title>
    </head>

    <body>
        <noscript>
            DeepSearch funktioniert nur mit aktiviertem Javascript.
        </noscript>

        <!-- Widgetcontainer an die Stelle kopieren, wo das Widget angezeugt werden soll --> 
        <div id="widget-container" class="widget-container" >
            <!-- vor das widget-->
            <noscript>Deepsearch funktioniert nur mit aktiviertem Javascript.</noscript>
            <link rel="stylesheet" href="https://widget.itek.de/xs-loader/<?php echo $xsloaderVersion;?>/styles.css">
            <script src="https://widget.itek.de/xs-loader/<?php echo $xsloaderVersion ?>/xs-loader.js" defer></script>
            
            <!-- Widget -->
            <xs-loader widget="xs-deepsearch" accesstoken="<?php echo $json_deepsearch['access_token'];?>" refreshtoken="<?php echo $json_deepsearch['refresh_token'];?>" targeturl="<?php echo $systemURL ?>" language="de" widgetmode=true parameter="<?php base64_encode(json_encode((array)$parameters)) ?>"></xs-loader>
        </div>
    </body> 
</html>