bsodfather/crank
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ui: remove html step counter translations

Browse Source
This commit is contained in:
a.tolmachev
2026-05-02 13:33:24 +00:00
parent 3a4dddd071
commit c54d234daa
11 changed files with 30 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/ui/html/wizard/step1.html
+1 -1
View File
@@ -3,7 +3,7 @@
<div class="step-panel-header">
<div class="step-panel-eyebrow">
<div class="step-panel-eyebrow-line"></div>
<span data-i18n-html="wizard.step_of">Step 1 of 5</span>
<span data-step-counter>Step 1 of 5</span>
</div>
<h1 class="step-panel-title" data-i18n="wizard.step1.title">Choose a protocol</h1>
<p class="step-panel-subtitle" data-i18n="wizard.step1.subtitle">Select the transport protocol your upstream service uses. This determines how Crank will communicate with your API and which configuration options are available in subsequent steps.</p>
apps/ui/html/wizard/step2.html
+1 -1
View File
@@ -3,7 +3,7 @@
<div class="step-panel-header">
<div class="step-panel-eyebrow">
<div class="step-panel-eyebrow-line"></div>
<span data-i18n-html="wizard.step_of">Step 2 of 5</span>
<span data-step-counter>Step 2 of 5</span>
</div>
<h1 class="step-panel-title" data-i18n="wizard.step2.title">Select upstream &amp; endpoint</h1>
<p class="step-panel-subtitle" data-i18n="wizard.step2.subtitle">Choose an existing upstream — a shared host with its auth config — or register a new one. Then define the specific endpoint path this operation will call.</p>
apps/ui/html/wizard/step3-graphql.html
+1 -1
View File
@@ -2,7 +2,7 @@
<div class="step-panel-header">
<div class="step-panel-eyebrow">
<div class="step-panel-eyebrow-line"></div>
<span data-i18n-html="wizard.step_of">Step 3 of 5</span>
<span data-step-counter>Step 3 of 5</span>
</div>
<h1 class="step-panel-title" data-i18n="wizard.step3.graphql.title">GraphQL operation</h1>
<p class="step-panel-subtitle" data-i18n="wizard.step3.graphql.subtitle">Define the GraphQL operation this tool will execute. All requests are sent as HTTP POST to the endpoint configured in the previous step. Variables are populated from MCP tool arguments at runtime.</p>
apps/ui/html/wizard/step3-grpc.html
+1 -1
View File
@@ -2,7 +2,7 @@
<div class="step-panel-header">
<div class="step-panel-eyebrow">
<div class="step-panel-eyebrow-line"></div>
<span data-i18n-html="wizard.step_of">Step 3 of 5</span>
<span data-step-counter>Step 3 of 5</span>
</div>
<h1 class="step-panel-title" data-i18n="wizard.step3.grpc.title">RPC method</h1>
<p class="step-panel-subtitle" data-i18n="wizard.step3.grpc.subtitle">Choose how to describe the gRPC service contract. Upload a .proto file, discover methods from a live server via reflection, or enter the route manually. Only unary RPCs are supported.</p>
apps/ui/html/wizard/step3-rest.html
+1 -1
View File
@@ -3,7 +3,7 @@
<div class="step-panel-header">
<div class="step-panel-eyebrow">
<div class="step-panel-eyebrow-line"></div>
<span data-i18n-html="wizard.step_of">Step 3 of 5</span>
<span data-step-counter>Step 3 of 5</span>
</div>
<h1 class="step-panel-title" data-i18n="wizard.step3.rest.title">HTTP method &amp; format</h1>
<p class="step-panel-subtitle" data-i18n="wizard.step3.rest.subtitle">Choose the HTTP verb this operation sends and configure content negotiation headers. Crank will serialize MCP tool arguments into the appropriate request body format.</p>
apps/ui/html/wizard/step3-soap.html
+1 -1
View File
@@ -2,7 +2,7 @@
<div class="step-panel-header">
<div class="step-panel-eyebrow">
<div class="step-panel-eyebrow-line"></div>
<span data-i18n-html="wizard.step_of">Step 3 of 5</span>
<span data-step-counter>Step 3 of 5</span>
</div>
<h1 class="step-panel-title" data-i18n="wizard.step3.soap.title">WSDL and SOAP binding</h1>
<p class="step-panel-subtitle" data-i18n="wizard.step3.soap.subtitle">Upload the WSDL/XSD bundle, inspect services and choose the exact service, port and operation that Crank should expose as an MCP tool.</p>
apps/ui/html/wizard/step3-websocket.html
+1 -1
View File
@@ -2,7 +2,7 @@
<div class="step-panel-header">
<div class="step-panel-eyebrow">
<div class="step-panel-eyebrow-line"></div>
<span data-i18n-html="wizard.step_of">Step 3 of 5</span>
<span data-step-counter>Step 3 of 5</span>
</div>
<h1 class="step-panel-title" data-i18n="wizard.step3.websocket.title">WebSocket subscription</h1>
<p class="step-panel-subtitle" data-i18n="wizard.step3.websocket.subtitle">Define the subscription handshake, the message templates and the connection tuning that Crank should use before collecting bounded WebSocket events.</p>
apps/ui/html/wizard/step4.html
+1 -1
View File
@@ -2,7 +2,7 @@
<div class="step-panel-header">
<div class="step-panel-eyebrow">
<div class="step-panel-eyebrow-line"></div>
<span data-i18n-html="wizard.step_of">Step 4 of 5</span>
<span data-step-counter>Step 4 of 5</span>
</div>
<h1 class="step-panel-title" data-i18n="wizard.step4.title">Tool config</h1>
<p class="step-panel-subtitle" data-i18n="wizard.step4.subtitle">Name your tool, write the LLM-facing description, and define the input/output schemas. The description is the primary signal the model uses when deciding whether to call this tool.</p>
apps/ui/html/wizard/step5.html
+1 -1
View File
@@ -2,7 +2,7 @@
<div class="step-panel-header">
<div class="step-panel-eyebrow">
<div class="step-panel-eyebrow-line"></div>
<span data-i18n-html="wizard.step_of">Step 5 of 5</span>
<span data-step-counter>Step 5 of 5</span>
</div>
<h1 class="step-panel-title" data-i18n="wizard.step5.title">Mapping and execution</h1>
<p class="step-panel-subtitle" data-i18n="wizard.step5.subtitle">Define how MCP tool arguments map to upstream request fields, and how the upstream response maps back to MCP output. Then set execution parameters — auth is configured per-upstream in step 2.</p>
apps/ui/js/i18n.js
-3
View File
@@ -2362,9 +2362,6 @@ function applyLang() {
document.querySelectorAll('[data-i18n]').forEach(function(el) {
el.textContent = t(el.getAttribute('data-i18n'));
});
document.querySelectorAll('[data-i18n-html]').forEach(function(el) {
el.innerHTML = t(el.getAttribute('data-i18n-html'));
});
// placeholder
document.querySelectorAll('[data-i18n-ph]').forEach(function(el) {
el.placeholder = t(el.getAttribute('data-i18n-ph'));
apps/ui/js/wizard-shell.js
+21 -2
View File
@@ -50,6 +50,19 @@
);
}
function renderStepCounter(counter, step, total) {
if (!counter) return;
var language = localStorage.getItem('crank_lang') || 'en';
var parts = language === 'ru'
? { prefix: 'Шаг ', suffix: ' из ' + total }
: { prefix: 'Step ', suffix: ' of ' + total };
var strong = document.createElement('strong');
counter.textContent = parts.prefix;
strong.textContent = String(step);
counter.appendChild(strong);
counter.appendChild(document.createTextNode(parts.suffix));
}
function loadStep(step, callback) {
var panelId = step === 3 ? step3PanelId() : 'step-panel-' + step;
if (document.getElementById(panelId)) {
@@ -114,8 +127,8 @@
var percentNode = document.querySelector('.progress-pct');
if (percentNode) percentNode.textContent = percent + '%';
var counter = document.querySelector('[data-step-counter]');
if (counter) counter.innerHTML = tfKey('wizard.step_of', { step: step, total: TOTAL_STEPS });
var counter = pane ? pane.querySelector('[data-step-counter]') : null;
renderStepCounter(counter, step, TOTAL_STEPS);
var backButton = document.querySelector('.btn-back');
if (backButton) {
@@ -153,6 +166,12 @@
}, Promise.resolve());
}
window.addEventListener('crank:langchange', function() {
if (window.currentStep) {
doGoToStep(window.currentStep);
}
});
function bindProtocolCards() {
document.querySelectorAll('.protocol-card').forEach(function(card) {
card.addEventListener('click', function() {