Giter Site home page Giter Site logo

Comments (10)

ah7255703 avatar ah7255703 commented on May 26, 2024

can you show me the piece of code that initializes the Copilot ?
in the meanwhile

  • try this (don't use window.onload)
$(document).ready(()=>{
// put the initialization function here
  initAiCoPilot({
    apiUrl: "https://yourdomain.com/api" // your base url where your are hosting OpenCopilot at (the API), usually it's http://localhost:5000/api
    initialMessages: ["How are the things"], // optional: you can pass an array of messages that will be sent to the copilot when it's initialized
    token: "your_copilot_token_goes_here", // you can get your token from the dashboard
    triggerSelector: "#triggerSelector", // the selector of the element that will trigger the copilot when clicked
    headers: {
      // optional: you can pass your authentication tokens to the copilot or any other header you want to send with every request
      Authorization: "Bearer your_auth_token_goes_here",
      AnyKey: "AnyValue"
    },
  }); 
})
  • make sure that you loaded the jquery first.

from opencopilot.

rohit22799 avatar rohit22799 commented on May 26, 2024

Yes Sure Here Is Code

`
$(document).ready(function() {

var loadCoPilot = async () => {
    initAiCoPilot({
        initialMessage: "Hello, how I can help you?", // Initial message.
        token: "token", // Your copilot token (automatically filled here).
        triggerSelector: "#triggerSelector", // The selector of the element that will trigger the widget on click.
        apiUrl: "http://localhost:8888/backend/api", // The url of the copilot backend API.
        headers: {
          // Headers that you want to send with every message request to your backend.
          Authorization: "auth",
        },
    });
}

loadCoPilot();

});
`

i have also tried doing this before pilot.js loads jquery works fine but after loading jquery doesn't work

`$(document).ready(function() {

var loadCoPilot = async () => {
    await $.ajax({
        url: 'http://localhost:8888/backend/pilot.js',
        dataType: 'script',
        cache: true,
    });
    initAiCoPilot({
        initialMessage: "Hello, how I can help you?", // Initial message.
        token: "token", // Your copilot token (automatically filled here).
        triggerSelector: "#triggerSelector", // The selector of the element that will trigger the widget on click.
        apiUrl: "http://localhost:8888/backend/api", // The url of the copilot backend API.
        headers: {
          // Headers that you want to send with every message request to your backend.
          Authorization: "auth",
        },
    });
}

setTimeout(() => {
    loadCoPilot();
}, 5000);

});`

from opencopilot.

ah7255703 avatar ah7255703 commented on May 26, 2024

weird!!, I will try replicate it , Have you get any error console logs ?

from opencopilot.

rohit22799 avatar rohit22799 commented on May 26, 2024

Yes i get error on keydown event. in event i'm using $.ui.keyCode.ESCAPE, so after loading pilot.js when i press key i get this following error
Screenshot from 2023-09-28 18-45-09

from opencopilot.

ah7255703 avatar ah7255703 commented on May 26, 2024

@rohit22799 Bro this error is not related to the pilot script, the error is referring to something else, and JQuery works fine here.
I've tested both the JQuery and pilot script and both worked just fine

from opencopilot.

rohit22799 avatar rohit22799 commented on May 26, 2024

Then why $.ui becomes undefined after loading pilot.js?
$.ui returns perfectly before loading pilot.js

you can see in video what is happening
https://www.loom.com/share/8dce83cc91354975a9d62434e1deeaaf?sid=33c3a1fe-59c1-4cb1-870a-e6b08279f762

from opencopilot.

rohit22799 avatar rohit22799 commented on May 26, 2024

Can you try with loading jquery-ui?

from opencopilot.

rohit22799 avatar rohit22799 commented on May 26, 2024

here is html code to reproduce the issue

<html>
    <title>Test</title>
    <body>
        <div>
            <button id="triggerSelector">
                Init
            </button>
        </div>
    </body>
    <script src="https://code.jquery.com/jquery-3.7.1.min.js" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.13.2/jquery-ui.min.js" integrity="sha512-57oZ/vW8ANMjR/KQ6Be9v/+/h6bq9/l3f0Oc7vn6qMqyhvPd1cvKBRWWpzu0QoneImqr2SkmO4MSqU+RpHom3Q==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<!--    <script src="http://localhost:8888/backend/pilot.js"></script>-->
    <script>
        var loadCoPilot = async () => {
            if($('#triggerSelector').length){
                console.log($.ui,'<----- Return $.ui Before Loading Pilot.js');
                await $.ajax({
                     url: '/openeducat_opencopilot/static/src/js/pilot_lib.js',
                     dataType: 'script',
                     cache: false,
                });
                console.log($.ui,'<----- Return undefined After Loading Pilot.js');
                initAiCoPilot({
                    initialMessage: "Hello, how I can help you?", // Initial message.
                    token: "token", // Your copilot token (automatically filled here).
                    triggerSelector: "#triggerSelector", // The selector of the element that will trigger the widget on click.
                    apiUrl: "http://localhost:8888/backend/api", // The url of the copilot backend API.
                    headers: {
                    // Headers that you want to send with every message request to your backend.
                    Authorization: "auth",
                    },
                });
            }
        }

        loadCoPilot();
    </script>
</html>

from opencopilot.

rohit22799 avatar rohit22799 commented on May 26, 2024

any update on this?

from opencopilot.

rohit22799 avatar rohit22799 commented on May 26, 2024

i think this is solved i will close the issue

from opencopilot.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.