// ==UserScript==
// @name JRPredecision Label
// @namespace http://baidu.com/
// @version 0.5.10
// @description Decision label. Try to take over the world!
// @author You
// @match http://ov.baidu-int.com/*
// @match http://yf.baidu-int.com/*
// @icon https://www.google.com/s2/favicons?sz=64&domain=baidu-int.com
// @require https://code.jquery.com/jquery-3.6.0.min.js
// @require https://update.greasyfork.org/scripts/491896/1355860/Copy%20Text%20and%20HTML%20to%20Clipboard.js
// @license MIT
// @grant none
// ==/UserScript==
(function () {
"use strict";
let label_list = [];
let cur_label = {};
let ads_id = -1;
let start_pre_seq = -1;
let end_pre_seq = -1;
let cur_pre_seq = -1;
let cur_obs_id = -1;
let is_label_panel_show = false;
let old_info;
var initialMouseX, initialMouseY, initialElementX, initialElementY;
function set_cur_info() {
var _ads_id = parseInt(
$("section").children("p").children("span")[1].textContent
);
var _cur_pre_seq = parseInt(
$(".seq-wrap>div>p:nth-child(4)").text().replace("PreSeq:", "")
);
// var _cur_obs_id = parseInt($(".viz-detail-text")[9].textContent.replace("id: ", "").trim());
var _cur_obs_id = null;
$(".viz-detail-text").each(function () {
var textContent = $(this).text();
if (textContent.startsWith('id')) {
_cur_obs_id = parseInt(textContent.replace("id: ", "").trim());
console.log("抓取障碍物id", _cur_obs_id);
}
});
if (window.location.host == "yf.baidu-int.com") {
_ads_id = getUrlParam("ads_id");
if (_ads_id != null) {
_ads_id = parseInt(_ads_id);
} else {
_ads_id = -1;
}
$(".dashboard_value").each(function (index) {
if (this.textContent.startsWith('PLA')) {
_cur_pre_seq = parseInt(this.textContent.split("\n")[1].replace("PRE:", "").trim());
console.log("当前预测帧", _cur_pre_seq);
}
});
}
if (_cur_pre_seq == null) {
console.log("抓取帧号失败", _cur_obs_id);
return;
}
if (_cur_obs_id == null) {
console.log("抓取障碍物id失败", _cur_obs_id);
return;
}
ads_id = isNaN(_ads_id) ? ads_id : _ads_id;
cur_pre_seq = isNaN(_cur_pre_seq) ? cur_pre_seq : _cur_pre_seq;
cur_obs_id = isNaN(_cur_obs_id) ? cur_obs_id : _cur_obs_id;
$("#ads_id").text(ads_id);
$("#seq_num").text(cur_pre_seq);
$("#obs_id").text(cur_obs_id);
cur_label.ads_id = ads_id;
console.log(ads_id);
console.log(cur_pre_seq);
console.log(cur_obs_id);
}
function getUrlParam(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
var value = window.location.search.substr(1).match(reg);
if (value != null) return unescape(value[2]);
return null;
}
function copy2clipboard(str) {
var $temp = $("<textarea>");
$("body").append($temp);
$temp.val(str).select();
document.execCommand('copy', false, null);
$temp.remove();
console.log(str);
//alert("复制成功");
showToast('复制成功', 'success');
}
function setStartSeq() {
set_cur_info();
cur_label.start_seq = cur_pre_seq;
console.log("set start seq", cur_label.start_seq);
}
function setEndSeq() {
set_cur_info();
cur_label.end_seq = cur_pre_seq;
console.log("set end seq", cur_label.end_seq);
}
//<textarea id="decision_label_show_list" placeholder="" rows="6" style="width:100%;background-color: #292f42;padding: 10px;max-width: 100%;max-height: 100%;line-height: 1.5;border-radius: 5px;border: 1px solid #ccc;"></textarea>
function showLabelList() {
$("#decision_label_show_list").empty();
for (let i = 0; i < label_list.length; i++) {
var label = label_list[i];
var str =
label.ads_id +
"\t" +
label.obs_id +
"\t" +
label.start_seq +
"\t" +
label.end_seq +
"\t" +
label.dec_label;
var text_ele = $("<textarea>", {
id: `label${i}`,
text: str,
placeholder: "",
rows: "1",
style:
"width:80%;background-color: #008844;margin-left: 5px;margin-right:5px;margin-top: 5px;",
});
$(`label${i}`).on("input", function () {
this.styel.height = "auto";
this.style.height = this.scrollHeight + "px";
});
var button_ele = $("<button>", {
text: "删除",
style:
"background-color: #008844;margin-left: 10px;margin-right:5px;margin-top: 5px;",
});
button_ele.click(function () {
if (i >= 0 && i < label_list.length) {
label_list.splice(i, 1);
console.log("删除" + toString(i));
showLabelList();
}
});
var div = $("<div>", {
style: "display: flex;",
});
// div.append(text_ele);
div.append(text_ele).append(button_ele);
$("#decision_label_show_list").append(div);
console.log("add show string", str);
}
}
function copyLabels() {
var res = '';
for (let i = 0; i < label_list.length; i++) {
var label = label_list[i];
var str =
label.ads_id +
"\t" +
label.obs_id +
"\t" +
label.start_seq +
"\t" +
label.end_seq +
"\t" +
label.dec_label;
res = str + '\n' + res;
}
copy2clipboard(res);
}
function clearLabels() {
$("#decision_label_show_list").empty();
label_list = [];
}
function checkOverlaps(labels, cur_label) {
for (let i = 0; i < labels.length; i++) {
var label = labels[i];
if (cur_label.obs_id != label.obs_id) {
continue;
}
// 检查重叠：如果一个区间的开始在另一个区间的开始和结束之间，或者反之亦然
if (
(cur_label.start_seq < label.end_seq &&
cur_label.end_seq > label.start_seq) ||
(label.start_seq < cur_label.end_seq &&
label.end_seq > cur_label.start_seq)
) {
if (cur_label.label != label.dec_label) {
console.log(`障碍物${cur_label.obs_id}与第${i}个标签冲突`);
alert(`障碍物${cur_label.obs_id}与第${i}个标签冲突`);
return true;
} else {
console.log(`障碍物${label.obs_id}区间重复标注`);
console.warn();
`障碍物${label.obs_id}区间重复标注`;
return false;
}
}
}
return false; // 没有重叠
}
function onLabel(dec_label) {
$("#label_btn_" + dec_label.toString()).click(function () {
// 添加类以实现按钮变亮效果
$("#label_btn_" + dec_label.toString()).addClass("clicked");
// 在 300 毫秒后移除类以恢复按钮原始状态
setTimeout(function () {
$("#label_btn_" + dec_label.toString()).removeClass("clicked");
}, 300);
});
if (
isNaN(ads_id) ||
isNaN(cur_obs_id) ||
isNaN(cur_label.start_seq) ||
isNaN(cur_label.end_seq) ||
isNaN(dec_label)
) {
return;
}
if (ads_id <= 0 && getUrlParam("ads_id") != null) {
alert("ads id 不合法:" + ads_id.toString());
return;
}
if (cur_obs_id <= 0) {
alert("obs id 不合法:" + cur_obs_id.toString());
return;
}
if (dec_label < 0) {
alert("label 不合法" + dec_label.toString());
return;
}
cur_label.ads_id = ads_id;
cur_label.obs_id = cur_obs_id;
cur_label.dec_label = dec_label;
console.log("add decision label to list", cur_label);
if (checkOverlaps(label_list, cur_label)) {
return;
}
label_list.push(cur_label);
showLabelList();
cur_label = {};
}
function showDecisionLabelPanel() {
$("#decision_label_panel").css(
"z-index",
-1 * $("#decision_label_panel").css("z-index")
);
console.log(
"move decision label panel to z index ",
$("#decision_label_panel").css("z-index")
);
}
// Your code here...
var label_tab = `
<button type="button" onclick="showDecisionLabelPanel()" class="ant-btn ant-btn-default ant-btn-sm" style="margin-right: 10px;">
<div class="ant-space ant-space-horizontal ant-space-align-center" style="gap: 8px;">
<div class="ant-space-item">
决策标注
</div>
</div>
</button>
`;
var label_panel_html = `
<div class="container-fluid" id="decision_label_panel"
style="position: absolute; top: 55%; right: 20px;width: 500px;height:30%;background-color: #292f42;z-index: -9999;">
<div class="col-md-2 column" style="float: center;">
</div>
<div class="row clearfix">
<div class="col-md-2 column" style="float: center;">
<div class="row clearfix">
<label>
ads_id:
</label>
<label id='ads_id'>
-1
</label>
<label>
obs_id:
</label>
<label id='obs_id'>
-1
</label>
<label>
seq_num:
</label>
<label id='seq_num'>
-1
</label>
</div>
</div>
<div class="col-md-2 column">
<div class="row clearfix" style="float: center;">
<button style="width:45%;margin-left: 3%;background-color: red;transition: background-color 0.3s ease;"
onclick="setStartSeq()">
seq_start
</button>
<button style="width:45%;margin-left: 2%;background-color: green;" onclick="setEndSeq()">
seq_end
</button>
</div>
<br>
<div class="btn-group" style="margin-left: 2%">
<button style="background-color: #FFBBFF;margin-left: 5px;margin-top: 5px;" id="label_btn_0"
type="button" value="0" onclick="onLabel(0)">
Ignore(0)
</button>
<button style="background-color: #00DDDD;margin-left: 5px;margin-top: 5px;" id="label_btn_1"
type="button" value="1" onclick="onLabel(1)">
Follow(1)
</button>
<button style="background-color: #8C0044;margin-left: 5px;margin-top: 5px;" id="label_btn_2"
type="button" value="2" onclick="onLabel(2)">
Yield(2)
</button>
<button style="background-color: #886600;margin-left: 5px;margin-top: 5px;" id="label_btn_3"
type="button" value="3" onclick="onLabel(3)">
Overtake(3)
</button>
<button style="background-color: #008844;margin-left: 5px;margin-top: 5px;" id="label_btn_4"
type="button" value="4" onclick="onLabel(4)">
NudgeYield(4)
</button>
<button style="background-color: #008888;margin-left: 5px;margin-top: 5px;" id="label_btn_5"
type="button" value="5" onclick="onLabel(5)">
NudgeOvetake(5)
</button>
<button style="background-color: #0000CD;margin-left: 5px;margin-top: 5px;" id="label_btn_6"
type="button" value="6" onclick="onLabel(6)">
NudgeIgnore(6)
</button>
<button style="background-color: #BDB76B;margin-left: 5px;margin-top: 5px;" id="label_btn_7"
type="button" value="7" onclick="onLabel(7)">
Caution(7)
</button>
</div>
<br>
<div>
<div id="decision_label_show_list" style="width:100%">
</div>
</div>
<br>
<div class="row clearfix" style="float: center;">
<button id="copy_to_clipboard_btn" style="width:45%;margin-left: 3%;background-color: blue;transition: background-color 0.3s ease;"
onclick="copyLabels()">
复制
</button>
<button style="width:45%;margin-left: 2%;background-color: red;" onclick="clearLabels()">
清除
</button>
</div>
<br>
</div>
</div>
</div>
</div>
`;
// 插入 Toast 容器和样式
function injectToast() {
// 如果 Toast 容器已经存在，则不重复插入
if (document.getElementById('toastContainer')) return;
// 插入 Toast 容器
const toastContainer = document.createElement('div');
toastContainer.id = 'toastContainer';
document.body.appendChild(toastContainer);
// 插入 Toast 样式
const style = document.createElement('style');
style.textContent = `
/* Toast container */
#toastContainer {
position: fixed;
bottom: 20px;
right: 20px;
z-index: 9999;
}
/* Individual toast style */
.toast {
display: flex;
align-items: center;
background-color: #333;
color: #fff;
padding: 10px 20px;
margin-bottom: 10px;
border-radius: 5px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
opacity: 0;
transform: translateY(20px);
transition: opacity 0.3s ease, transform 0.3s ease;
}
/* Toast visible class */
.toast.show {
opacity: 1;
transform: translateY(0);
}
/* Close button */
.toast .close-btn {
margin-left: auto;
background: none;
border: none;
color: #fff;
font-size: 16px;
cursor: pointer;
}
.toast.success {
background-color: #4caf50;
}
.toast.error {
background-color: #f44336;
}
.toast.info {
background-color: #2196f3;
}
.toast.warning {
background-color: #ff9800;
}
`;
document.head.appendChild(style);
}
// 显示 Toast 消息
function showToast(message, type = 'info') {
const toastContainer = document.getElementById('toastContainer');
// 创建 Toast 元素
const toast = document.createElement('div');
toast.className = `toast show ${type}`;
toast.innerHTML = `
<span>${message}</span>
<button class="close-btn">×</button>
`;
// 关闭按钮事件
toast.querySelector('.close-btn').addEventListener('click', () => {
closeToast(toast);
});
// 添加到容器中
toastContainer.appendChild(toast);
// 自动移除
setTimeout(() => {
closeToast(toast);
}, 3000);
}
// 关闭 Toast
function closeToast(toast) {
toast.classList.remove('show');
setTimeout(() => toast.remove(), 300); // 等待动画完成后移除
}
function clearLabel() {
return;
$("#decision_label_show_list").val("");
label_list = [];
}
function onMouseMove(event) {
// 计算鼠标偏移量
var offsetX = event.clientX - initialMouseX;
var offsetY = event.clientY - initialMouseY;
// 将偏移量应用于元素的位置
$("#decision_label_panel").css({
left: initialElementX + offsetX + "px",
top: initialElementY + offsetY + "px",
});
}
// 鼠标释放事件处理程序
function onMouseUp() {
// 移除事件监听器
$(document).off("mousemove", onMouseMove);
$(document).off("mouseup", onMouseUp);
}
window.onMouseMove = onMouseMove;
window.onMouseUp = onMouseUp;
window.set_cur_info = set_cur_info;
window.showDecisionLabelPanel = showDecisionLabelPanel;
window.setStartSeq = setStartSeq;
window.setEndSeq = setEndSeq;
window.onLabel = onLabel;
window.clearLabel = clearLabel;
window.showLabelList = showLabelList;
window.copyLabels = copyLabels;
window.clearLabels = clearLabels;
setTimeout(function () {
console.log("3s time out");
// 初始化 Toast 容器
injectToast();
$(".if-header-operations").prepend(label_tab);
$(".ov-header-operations").prepend(label_tab);
$("body").append(label_panel_html);
$("#decision_label_panel").mousedown(function (event) {
var elementTop = $("#decision_label_panel").offset().top;
var mouseY = event.clientY;
console.log("elementTop", elementTop, "mouseY", mouseY);
if (mouseY > elementTop + 10) {
return; // 如果不在顶部，则忽略拖动
}
// 记录鼠标位置和元素初始位置
initialMouseX = event.clientX;
initialMouseY = event.clientY;
initialElementX = $("#decision_label_panel").offset().left;
initialElementY = $("#decision_label_panel").offset().top;
console.log("initialMouseX", initialMouseX);
// 添加事件监听器
$(document).mousemove(onMouseMove);
$(document).mouseup(onMouseUp);
});
}, 3000); // 等待3秒
})();
