Skip to content

Commit 13bddd8

Browse files
KaviBharathi-SF5060KaviBharathi-SF5060
committed
979098: removed the settimeout and streaming response
1 parent c4c51df commit 13bddd8

File tree

4 files changed

+203
-85
lines changed

4 files changed

+203
-85
lines changed

‎ej2-asp-core-mvc/code-snippet/ai-assistview/ai-integrations/gemini-ai/razor‎

Lines changed: 50 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
{
1111
Items = ViewBag.Items,
1212
ItemClicked = "toolbarItemClicked"
13-
}).Render()
13+
}).StopRespondingClick("stopRespondingClick").Render()
1414
</div>
1515

1616
<script id="bannerContent" type="text/x-jsrender">
@@ -27,7 +27,7 @@
2727

2828
var assistObj = null;
2929
var suggestions = @Html.Raw(Json.Serialize(ViewBag.PromptSuggestionData));
30-
30+
var stopStreaming = false;
3131
function onCreated() {
3232
assistObj = this;
3333
}
@@ -39,29 +39,59 @@
3939
}
4040
}
4141

42-
function onPromptRequest(args) {
43-
setTimeout(async () => {
44-
let responseText = '';
45-
try {
46-
const response = await fetch('/Home/GetAIResponse', {
47-
method: 'POST',
48-
headers: {
49-
'Content-Type': 'application/json'
50-
},
51-
body: JSON.stringify({ prompt: args.prompt })
52-
});
42+
async function streamResponse(response) {
43+
let lastResponse = '';
44+
const responseUpdateRate = 10;
45+
let i = 0;
46+
const responseLength = response.length;
47+
while (i < responseLength && !stopStreaming) {
48+
lastResponse += response[i];
49+
i++;
50+
if (i % responseUpdateRate === 0 || i === responseLength) {
51+
const htmlResponse = marked.parse(lastResponse);
52+
assistObj.addPromptResponse(htmlResponse, i === responseLength);
53+
assistObj.scrollToBottom();
54+
}
55+
await new Promise(resolve => setTimeout(resolve, 15)); // Delay for streaming effect
56+
}
57+
assistObj.promptSuggestions = suggestions;
58+
}
5359

60+
function onPromptRequest(args) {
61+
if (!token) {
62+
assistObj.addPromptResponse('⚠️ Antiforgery token not found.');
63+
return;
64+
}
65+
66+
fetch('/?handler=GetAIResponse', {
67+
method: 'POST',
68+
headers: {
69+
'Content-Type': 'application/json',
70+
'RequestVerificationToken': token
71+
},
72+
body: JSON.stringify({ prompt: args.prompt || 'Hi' })
73+
})
74+
.then(response => {
5475
if (!response.ok) {
5576
throw new Error(`HTTP ${response.status}: ${response.statusText}`);
5677
}
57-
58-
responseText = await response.json();
59-
assistObj.addPromptResponse(marked.parse(responseText));
60-
} catch (error) {
78+
return response.json();
79+
})
80+
.then(responseText => {
81+
const text = responseText.trim() || 'No response received.';
82+
stopStreaming = false;
83+
streamResponse(text);
84+
})
85+
.catch(error => {
86+
console.error('Error fetching AI response:', error);
6187
assistObj.addPromptResponse('⚠️ Something went wrong while connecting to the AI service. Please try again later.');
62-
}
63-
}, 2000); // Match the 2000ms delay from the reference sample
64-
}
88+
stopStreaming = true;
89+
});
90+
}
91+
92+
function stopRespondingClick() {
93+
stopStreaming = true;
94+
}
6595
</script>
6696

6797
<style>

‎ej2-asp-core-mvc/code-snippet/ai-assistview/ai-integrations/gemini-ai/tagHelper‎

Lines changed: 51 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@
77
<ejs-aiassistview id="aiAssistView" bannerTemplate="#bannerContent"
88
promptSuggestions="@Model.ViewModel.PromptSuggestionData"
99
promptRequest="onPromptRequest"
10+
stopRespondingClick="stopRespondingClick"
1011
created="onCreated">
1112
<e-aiassistview-toolbarsettings items="@Model.ViewModel.Items" itemClicked="toolbarItemClicked"></e-aiassistview-toolbarsettings>
1213
</ejs-aiassistview>
@@ -23,7 +24,7 @@
2324
<script>
2425
var assistObj = null;
2526
var suggestions = @Html.Raw(Json.Serialize(Model.ViewModel.PromptSuggestionData));
26-
27+
var stopStreaming = false;
2728
function onCreated() {
2829
assistObj = this;
2930
}
@@ -33,30 +34,59 @@
3334
this.prompts = [];
3435
this.promptSuggestions = suggestions;
3536
}
36-
}
37+
}
3738

38-
function onPromptRequest(args) {
39-
setTimeout(async () => {
40-
let responseText = '';
41-
try {
42-
const response = await fetch('/?handler=GetAIResponse', {
43-
method: 'POST',
44-
headers: {
45-
'Content-Type': 'application/json'
46-
},
47-
body: JSON.stringify({ prompt: args.prompt })
48-
});
39+
async function streamResponse(response) {
40+
let lastResponse = '';
41+
const responseUpdateRate = 10;
42+
let i = 0;
43+
const responseLength = response.length;
44+
while (i < responseLength && !stopStreaming) {
45+
lastResponse += response[i];
46+
i++;
47+
if (i % responseUpdateRate === 0 || i === responseLength) {
48+
const htmlResponse = marked.parse(lastResponse);
49+
assistObj.addPromptResponse(htmlResponse, i === responseLength);
50+
assistObj.scrollToBottom();
51+
}
52+
await new Promise(resolve => setTimeout(resolve, 15)); // Delay for streaming effect
53+
}
54+
assistObj.promptSuggestions = suggestions;
55+
}
4956

50-
if (!response.ok) {
51-
throw new Error(`HTTP ${response.status}: ${response.statusText}`);
52-
}
57+
function onPromptRequest(args) {
58+
if (!token) {
59+
assistObj.addPromptResponse('⚠️ Antiforgery token not found.');
60+
return;
61+
}
5362

54-
responseText = await response.json();
55-
assistObj.addPromptResponse(marked.parse(responseText));
56-
} catch (error) {
57-
assistObj.addPromptResponse('⚠️ Something went wrong while connecting to the AI service. Please try again later.');
63+
fetch('/?handler=GetAIResponse', {
64+
method: 'POST',
65+
headers: {
66+
'Content-Type': 'application/json'
67+
},
68+
body: JSON.stringify({ prompt: args.prompt || 'Hi' })
69+
})
70+
.then(response => {
71+
if (!response.ok) {
72+
throw new Error(`HTTP ${response.status}: ${response.statusText}`);
5873
}
59-
}, 2000); // Match the 2000ms delay from the reference sample
74+
return response.json();
75+
})
76+
.then(responseText => {
77+
const text = responseText.trim() || 'No response received.';
78+
stopStreaming = false;
79+
streamResponse(text);
80+
})
81+
.catch(error => {
82+
console.error('Error fetching AI response:', error);
83+
assistObj.addPromptResponse('⚠️ Something went wrong while connecting to the AI service. Please try again later.');
84+
stopStreaming = true;
85+
});
86+
}
87+
88+
function stopRespondingClick() {
89+
stopStreaming = true;
6090
}
6191
</script>
6292

‎ej2-asp-core-mvc/code-snippet/ai-assistview/ai-integrations/open-ai/razor‎

Lines changed: 50 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
{
1010
Items = ViewBag.Items,
1111
ItemClicked = "toolbarItemClicked"
12-
}).Render()
12+
}).StopRespondingClick("stopRespondingClick").Render()
1313
</div>
1414

1515
<script id="bannerContent" type="text/x-jsrender">
@@ -20,13 +20,10 @@
2020
</div>
2121
</script>
2222

23-
<!-- Add antiforgery token for POST requests -->
24-
@Html.AntiForgeryToken()
25-
2623
<script>
2724
var assistObj = null;
2825
var suggestions = @Html.Raw(Json.Serialize(ViewBag.PromptSuggestionData));
29-
26+
var stopStreaming = false;
3027
function onCreated() {
3128
assistObj = this;
3229
}
@@ -38,29 +35,59 @@
3835
}
3936
}
4037

41-
function onPromptRequest(args) {
42-
setTimeout(async () => {
43-
let responseText = '';
44-
try {
45-
const response = await fetch('/Home/GetAIResponse', {
46-
method: 'POST',
47-
headers: {
48-
'Content-Type': 'application/json'
49-
},
50-
body: JSON.stringify({ prompt: args.prompt })
51-
});
38+
async function streamResponse(response) {
39+
let lastResponse = '';
40+
const responseUpdateRate = 10;
41+
let i = 0;
42+
const responseLength = response.length;
43+
while (i < responseLength && !stopStreaming) {
44+
lastResponse += response[i];
45+
i++;
46+
if (i % responseUpdateRate === 0 || i === responseLength) {
47+
const htmlResponse = marked.parse(lastResponse);
48+
assistObj.addPromptResponse(htmlResponse, i === responseLength);
49+
assistObj.scrollToBottom();
50+
}
51+
await new Promise(resolve => setTimeout(resolve, 15)); // Delay for streaming effect
52+
}
53+
assistObj.promptSuggestions = suggestions;
54+
}
55+
56+
function onPromptRequest(args) {
57+
if (!token) {
58+
assistObj.addPromptResponse('⚠️ Antiforgery token not found.');
59+
return;
60+
}
5261

62+
fetch('/?handler=GetAIResponse', {
63+
method: 'POST',
64+
headers: {
65+
'Content-Type': 'application/json',
66+
'RequestVerificationToken': token
67+
},
68+
body: JSON.stringify({ prompt: args.prompt || 'Hi' })
69+
})
70+
.then(response => {
5371
if (!response.ok) {
5472
throw new Error(`HTTP ${response.status}: ${response.statusText}`);
5573
}
56-
57-
responseText = await response.json();
58-
assistObj.addPromptResponse(marked.parse(responseText));
59-
} catch (error) {
74+
return response.json();
75+
})
76+
.then(responseText => {
77+
const text = responseText.trim() || 'No response received.';
78+
stopStreaming = false;
79+
streamResponse(text);
80+
})
81+
.catch(error => {
82+
console.error('Error fetching AI response:', error);
6083
assistObj.addPromptResponse('⚠️ Something went wrong while connecting to the AI service. Please try again later.');
61-
}
62-
}, 2000); // Match the 2000ms delay from the reference sample
63-
}
84+
stopStreaming = true;
85+
});
86+
}
87+
88+
function stopRespondingClick() {
89+
stopStreaming = true;
90+
}
6491
</script>
6592

6693
<style>

‎ej2-asp-core-mvc/code-snippet/ai-assistview/ai-integrations/open-ai/tagHelper‎

Lines changed: 52 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@
88
<ejs-aiassistview id="aiAssistView" bannerTemplate="#bannerContent"
99
promptSuggestions="@Model.ViewModel.PromptSuggestionData"
1010
promptRequest="onPromptRequest"
11+
stopRespondingClick="stopRespondingClick"
1112
created="onCreated">
1213
<e-aiassistview-toolbarsettings items="@Model.ViewModel.Items" itemClicked="toolbarItemClicked"></e-aiassistview-toolbarsettings>
1314
</ejs-aiassistview>
@@ -24,7 +25,7 @@
2425
<script>
2526
var assistObj = null;
2627
var suggestions = @Html.Raw(Json.Serialize(Model.ViewModel.PromptSuggestionData));
27-
28+
var stopStreaming = false;
2829
function onCreated() {
2930
assistObj = this;
3031
}
@@ -36,30 +37,60 @@
3637
}
3738
}
3839

39-
function onPromptRequest(args) {
40-
setTimeout(async () => {
41-
let responseText = '';
42-
try {
43-
const response = await fetch('/?handler=GetAIResponse', {
44-
method: 'POST',
45-
headers: {
46-
'Content-Type': 'application/json'
47-
},
48-
body: JSON.stringify({ prompt: args.prompt })
49-
});
40+
async function streamResponse(response) {
41+
let lastResponse = '';
42+
const responseUpdateRate = 10;
43+
let i = 0;
44+
const responseLength = response.length;
45+
while (i < responseLength && !stopStreaming) {
46+
lastResponse += response[i];
47+
i++;
48+
if (i % responseUpdateRate === 0 || i === responseLength) {
49+
const htmlResponse = marked.parse(lastResponse);
50+
assistObj.addPromptResponse(htmlResponse, i === responseLength);
51+
assistObj.scrollToBottom();
52+
}
53+
await new Promise(resolve => setTimeout(resolve, 15)); // Delay for streaming effect
54+
}
55+
assistObj.promptSuggestions = suggestions;
56+
}
5057

51-
if (!response.ok) {
52-
throw new Error(`HTTP ${response.status}: ${response.statusText}`);
53-
}
58+
function onPromptRequest(args) {
59+
if (!token) {
60+
assistObj.addPromptResponse('⚠️ Antiforgery token not found.');
61+
return;
62+
}
5463

55-
responseText = await response.json();
56-
assistObj.addPromptResponse(marked.parse(responseText));
57-
} catch (error) {
58-
assistObj.addPromptResponse('⚠️ Something went wrong while connecting to the AI service. Please try again later.');
64+
fetch('/?handler=GetAIResponse', {
65+
method: 'POST',
66+
headers: {
67+
'Content-Type': 'application/json',
68+
'RequestVerificationToken': token
69+
},
70+
body: JSON.stringify({ prompt: args.prompt || 'Hi' })
71+
})
72+
.then(response => {
73+
if (!response.ok) {
74+
throw new Error(`HTTP ${response.status}: ${response.statusText}`);
5975
}
60-
}, 2000); // Match the 2000ms delay from the reference sample
76+
return response.json();
77+
})
78+
.then(responseText => {
79+
const text = responseText.trim() || 'No response received.';
80+
stopStreaming = false;
81+
streamResponse(text);
82+
})
83+
.catch(error => {
84+
console.error('Error fetching AI response:', error);
85+
assistObj.addPromptResponse('⚠️ Something went wrong while connecting to the AI service. Please try again later.');
86+
stopStreaming = true;
87+
});
88+
}
89+
90+
function stopRespondingClick() {
91+
stopStreaming = true;
6192
}
62-
</script>
93+
</script>
6394

6495
<style>
6596
.aiassist-container .e-view-container {

0 commit comments

Comments
 (0)