@hatiolab/things-scene 8.0.0-alpha.0 → 8.0.0-alpha.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/db.sqlite +0 -0
- package/monitor-extension/background.js +21 -0
- package/monitor-extension/content.js +65 -0
- package/monitor-extension/devtools.html +38 -0
- package/monitor-extension/devtools.js +155 -0
- package/monitor-extension/icons/icon128.png +0 -0
- package/monitor-extension/icons/icon16.png +0 -0
- package/monitor-extension/icons/icon48.png +0 -0
- package/monitor-extension/injected.js +28 -0
- package/monitor-extension/libs/Chart.min.js +7 -0
- package/monitor-extension/libs/apexchart.min.js +24151 -0
- package/monitor-extension/manifest.json +34 -0
- package/monitor-extension/popup.html +37 -0
- package/monitor-extension/popup.js +99 -0
- package/package.json +7 -1
- package/schema.graphql +548 -59
- package/things-scene-ie.js +1 -1
- package/things-scene-min.js +1 -1
- package/things-scene.mjs +1 -1
package/db.sqlite
CHANGED
|
Binary file
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
|
|
2
|
+
if (message.type === 'GET_TAB_INFO') {
|
|
3
|
+
chrome.tabs.query({ active: true, currentWindow: true }, tabs => {
|
|
4
|
+
if (chrome.runtime.lastError) {
|
|
5
|
+
console.error('Error querying tabs:', chrome.runtime.lastError)
|
|
6
|
+
sendResponse({ tabId: null })
|
|
7
|
+
return
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
if (tabs.length > 0) {
|
|
11
|
+
sendResponse({ tabId: tabs[0].id })
|
|
12
|
+
} else {
|
|
13
|
+
console.log('No active tab found.')
|
|
14
|
+
sendResponse({ tabId: null })
|
|
15
|
+
}
|
|
16
|
+
})
|
|
17
|
+
|
|
18
|
+
// 비동기 응답을 위해 true 반환
|
|
19
|
+
return true
|
|
20
|
+
}
|
|
21
|
+
})
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
// content.js
|
|
2
|
+
|
|
3
|
+
// 백그라운드 스크립트에 탭 정보를 요청
|
|
4
|
+
chrome.runtime.sendMessage({ type: 'GET_TAB_INFO' }, response => {
|
|
5
|
+
if (response && response.tabId) {
|
|
6
|
+
const tabId = response.tabId
|
|
7
|
+
|
|
8
|
+
function updateChart(data) {
|
|
9
|
+
chrome.runtime.sendMessage({ type: 'UPDATE_CHART', tabId, data })
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
window.addEventListener('message', function (event) {
|
|
13
|
+
if (event.source !== window || !event.data.type) return
|
|
14
|
+
|
|
15
|
+
if (event.data.type === 'RESIDENT_COUNT') {
|
|
16
|
+
const { timestamp, componentResidentsCount, sceneResidentsCount, referenceMapResidentsCount } = event.data
|
|
17
|
+
|
|
18
|
+
try {
|
|
19
|
+
chrome.storage.local.get({ residentData: {} }, result => {
|
|
20
|
+
const residentData = result.residentData || {}
|
|
21
|
+
residentData[tabId] = residentData[tabId] || []
|
|
22
|
+
|
|
23
|
+
residentData[tabId].push({
|
|
24
|
+
timestamp,
|
|
25
|
+
componentResidentsCount,
|
|
26
|
+
sceneResidentsCount,
|
|
27
|
+
referenceMapResidentsCount
|
|
28
|
+
})
|
|
29
|
+
|
|
30
|
+
// 데이터가 100개 이상일 경우 오래된 데이터 삭제
|
|
31
|
+
if (residentData[tabId].length > 100) {
|
|
32
|
+
residentData[tabId].shift()
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
chrome.storage.local.set({ residentData }, () => {
|
|
36
|
+
try {
|
|
37
|
+
updateChart(residentData[tabId])
|
|
38
|
+
} catch (e) {
|
|
39
|
+
console.error('Error updating chart:', e)
|
|
40
|
+
}
|
|
41
|
+
})
|
|
42
|
+
})
|
|
43
|
+
} catch (e) {
|
|
44
|
+
console.error('Error accessing storage:', e)
|
|
45
|
+
}
|
|
46
|
+
}
|
|
47
|
+
})
|
|
48
|
+
|
|
49
|
+
// 스크립트를 인젝션하는 함수
|
|
50
|
+
function injectScript(file) {
|
|
51
|
+
if (!document.getElementById(file)) {
|
|
52
|
+
const th = document.head
|
|
53
|
+
const s = document.createElement('script')
|
|
54
|
+
s.setAttribute('type', 'text/javascript')
|
|
55
|
+
s.setAttribute('src', chrome.runtime.getURL(file))
|
|
56
|
+
s.setAttribute('id', file) // 중복 인젝션 방지
|
|
57
|
+
th.appendChild(s)
|
|
58
|
+
}
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
injectScript('injected.js')
|
|
62
|
+
} else {
|
|
63
|
+
console.error('No active tab found.')
|
|
64
|
+
}
|
|
65
|
+
})
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8" />
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
6
|
+
<title>Component Residents Monitor</title>
|
|
7
|
+
<script src="libs/Chart.min.js"></script>
|
|
8
|
+
<script src="devtools.js"></script>
|
|
9
|
+
<style>
|
|
10
|
+
body {
|
|
11
|
+
display: flex;
|
|
12
|
+
flex-direction: column;
|
|
13
|
+
gap: 10px;
|
|
14
|
+
align-items: center;
|
|
15
|
+
justify-content: center;
|
|
16
|
+
min-width: 400px;
|
|
17
|
+
min-height: 800px;
|
|
18
|
+
box-sizing: border-box;
|
|
19
|
+
}
|
|
20
|
+
canvas {
|
|
21
|
+
flex: 1;
|
|
22
|
+
border: 1px solid #000;
|
|
23
|
+
border-radius: 4px;
|
|
24
|
+
width: 100%;
|
|
25
|
+
box-sizing: border-box;
|
|
26
|
+
}
|
|
27
|
+
</style>
|
|
28
|
+
</head>
|
|
29
|
+
<body>
|
|
30
|
+
<h1>Component Residents Monitor</h1>
|
|
31
|
+
<div id="resident-components"></div>
|
|
32
|
+
<div id="resident-scenes"></div>
|
|
33
|
+
<div id="resident-reference-maps"></div>
|
|
34
|
+
<canvas id="residentChart1"></canvas>
|
|
35
|
+
<canvas id="residentChart2"></canvas>
|
|
36
|
+
<canvas id="residentChart3"></canvas>
|
|
37
|
+
</body>
|
|
38
|
+
</html>
|
|
@@ -0,0 +1,155 @@
|
|
|
1
|
+
let panelCreated = false
|
|
2
|
+
|
|
3
|
+
chrome.devtools.panels.create('Board Monitor', 'icons/icon48.png', 'devtools.html', function (panel) {
|
|
4
|
+
if (panelCreated) {
|
|
5
|
+
console.log('Panel already created, skipping creation.')
|
|
6
|
+
return
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
var residentChart1, residentChart2, residentChart3
|
|
10
|
+
var listenerRegistered = false
|
|
11
|
+
|
|
12
|
+
// 차트 업데이트 함수
|
|
13
|
+
const updateCharts = data => {
|
|
14
|
+
console.log('Updating charts:', residentChart1, residentChart2, residentChart3)
|
|
15
|
+
if (residentChart1 && residentChart2 && residentChart3) {
|
|
16
|
+
residentChart1.data.labels = data.map(entry => entry.timestamp)
|
|
17
|
+
residentChart1.data.datasets[0].data = data.map(entry => entry.componentResidentsCount)
|
|
18
|
+
residentChart1.update()
|
|
19
|
+
|
|
20
|
+
residentChart2.data.labels = data.map(entry => entry.timestamp)
|
|
21
|
+
residentChart2.data.datasets[0].data = data.map(entry => entry.sceneResidentsCount)
|
|
22
|
+
residentChart2.update()
|
|
23
|
+
|
|
24
|
+
residentChart3.data.labels = data.map(entry => entry.timestamp)
|
|
25
|
+
residentChart3.data.datasets[0].data = data.map(entry => entry.referenceMapResidentsCount)
|
|
26
|
+
residentChart3.update()
|
|
27
|
+
} else {
|
|
28
|
+
const text1 = window.document.getElementById('resident-components')
|
|
29
|
+
const text2 = window.document.getElementById('resident-scenes')
|
|
30
|
+
const text3 = window.document.getElementById('resident-reference-maps')
|
|
31
|
+
|
|
32
|
+
text1.textContent = data.map(entry => entry.componentResidentsCount)
|
|
33
|
+
text2.textContent = data.map(entry => entry.sceneResidentsCount)
|
|
34
|
+
text3.textContent = data.map(entry => entry.referenceMapResidentsCount)
|
|
35
|
+
|
|
36
|
+
console.error('Charts are not initialized yet.')
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
// 차트 초기화 함수
|
|
41
|
+
const resetCharts = window => {
|
|
42
|
+
if (residentChart1 || residentChart2 || residentChart3) {
|
|
43
|
+
console.log('Charts already initialized, skipping reset.')
|
|
44
|
+
return // 이미 초기화된 경우 차트를 다시 초기화하지 않음
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
const ctx1 = window.document.getElementById('residentChart1').getContext('2d')
|
|
48
|
+
const ctx2 = window.document.getElementById('residentChart2').getContext('2d')
|
|
49
|
+
const ctx3 = window.document.getElementById('residentChart3').getContext('2d')
|
|
50
|
+
console.log('Initializing charts:', ctx1, ctx2, ctx3)
|
|
51
|
+
|
|
52
|
+
residentChart1 = new Chart(ctx1, {
|
|
53
|
+
type: 'line',
|
|
54
|
+
data: {
|
|
55
|
+
labels: [],
|
|
56
|
+
datasets: [
|
|
57
|
+
{
|
|
58
|
+
label: 'Component Residents Count',
|
|
59
|
+
data: [],
|
|
60
|
+
borderColor: 'rgba(75, 192, 192, 1)',
|
|
61
|
+
borderWidth: 1,
|
|
62
|
+
fill: false
|
|
63
|
+
}
|
|
64
|
+
]
|
|
65
|
+
},
|
|
66
|
+
options: {
|
|
67
|
+
scales: {
|
|
68
|
+
x: { display: false, ticks: { display: false } },
|
|
69
|
+
y: { title: { display: true, text: 'Component Residents Count' } }
|
|
70
|
+
}
|
|
71
|
+
}
|
|
72
|
+
})
|
|
73
|
+
|
|
74
|
+
residentChart2 = new Chart(ctx2, {
|
|
75
|
+
type: 'line',
|
|
76
|
+
data: {
|
|
77
|
+
labels: [],
|
|
78
|
+
datasets: [
|
|
79
|
+
{
|
|
80
|
+
label: 'Scene Residents Count',
|
|
81
|
+
data: [],
|
|
82
|
+
borderColor: 'rgba(75, 192, 192, 1)',
|
|
83
|
+
borderWidth: 1,
|
|
84
|
+
fill: false
|
|
85
|
+
}
|
|
86
|
+
]
|
|
87
|
+
},
|
|
88
|
+
options: {
|
|
89
|
+
scales: {
|
|
90
|
+
x: { display: false, ticks: { display: false } },
|
|
91
|
+
y: { title: { display: true, text: 'Scene Residents Count' } }
|
|
92
|
+
}
|
|
93
|
+
}
|
|
94
|
+
})
|
|
95
|
+
|
|
96
|
+
residentChart3 = new Chart(ctx3, {
|
|
97
|
+
type: 'line',
|
|
98
|
+
data: {
|
|
99
|
+
labels: [],
|
|
100
|
+
datasets: [
|
|
101
|
+
{
|
|
102
|
+
label: 'ReferenceMap Residents Count',
|
|
103
|
+
data: [],
|
|
104
|
+
borderColor: 'rgba(75, 192, 192, 1)',
|
|
105
|
+
borderWidth: 1,
|
|
106
|
+
fill: false
|
|
107
|
+
}
|
|
108
|
+
]
|
|
109
|
+
},
|
|
110
|
+
options: {
|
|
111
|
+
scales: {
|
|
112
|
+
x: { display: false, ticks: { display: false } },
|
|
113
|
+
y: { title: { display: true, text: 'ReferenceMap Residents Count' } }
|
|
114
|
+
}
|
|
115
|
+
}
|
|
116
|
+
})
|
|
117
|
+
|
|
118
|
+
console.log('Charts initialized:', residentChart1, residentChart2, residentChart3)
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
// 패널이 처음 열리거나 다시 열릴 때마다 호출
|
|
122
|
+
panel.onShown.addListener(function (window) {
|
|
123
|
+
console.log('DevTools panel shown')
|
|
124
|
+
resetCharts(window) // 패널이 열릴 때 차트를 초기화
|
|
125
|
+
|
|
126
|
+
// 초기 로딩 시 저장된 데이터를 가져옴
|
|
127
|
+
chrome.storage.local.get({ residentData: {} }, result => {
|
|
128
|
+
const tabId = chrome.devtools.inspectedWindow.tabId
|
|
129
|
+
if (tabId && result.residentData[tabId] && result.residentData[tabId].length > 0) {
|
|
130
|
+
updateCharts(result.residentData[tabId])
|
|
131
|
+
} else {
|
|
132
|
+
console.log('No resident data found.')
|
|
133
|
+
}
|
|
134
|
+
})
|
|
135
|
+
})
|
|
136
|
+
|
|
137
|
+
// 메시지 리스너는 한 번만 등록 (중복 방지)
|
|
138
|
+
if (!listenerRegistered) {
|
|
139
|
+
chrome.runtime.onMessage.addListener(message => {
|
|
140
|
+
const tabId = chrome.devtools.inspectedWindow.tabId
|
|
141
|
+
|
|
142
|
+
if (tabId && message.type === 'UPDATE_CHART' && message.tabId === tabId) {
|
|
143
|
+
console.log('Received UPDATE_CHART message:', tabId, message)
|
|
144
|
+
chrome.storage.local.get({ residentData: {} }, result => {
|
|
145
|
+
if (result.residentData[tabId]) {
|
|
146
|
+
updateCharts(result.residentData[tabId])
|
|
147
|
+
}
|
|
148
|
+
})
|
|
149
|
+
}
|
|
150
|
+
})
|
|
151
|
+
listenerRegistered = true // 리스너가 중복 등록되지 않도록 설정
|
|
152
|
+
}
|
|
153
|
+
|
|
154
|
+
panelCreated = true // 패널이 생성되었음을 표시
|
|
155
|
+
})
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
function logComponentResidents() {
|
|
2
|
+
const componentResidentsCount = window.scene.Component?.residentsCount || 0;
|
|
3
|
+
const sceneResidentsCount = window.scene.Scene?.residentsCount || 0;
|
|
4
|
+
const referenceMapResidentsCount =
|
|
5
|
+
window.scene.ReferenceMap?.residentsCount || 0;
|
|
6
|
+
const timestamp = new Date().toISOString();
|
|
7
|
+
|
|
8
|
+
console.log(
|
|
9
|
+
`Component Residents Count: ${componentResidentsCount}, Scene Residents Count: ${sceneResidentsCount}, ReferenceMap Residents Count: ${referenceMapResidentsCount} at ${timestamp}`
|
|
10
|
+
);
|
|
11
|
+
|
|
12
|
+
window.postMessage(
|
|
13
|
+
{
|
|
14
|
+
type: "RESIDENT_COUNT",
|
|
15
|
+
timestamp,
|
|
16
|
+
componentResidentsCount,
|
|
17
|
+
sceneResidentsCount,
|
|
18
|
+
referenceMapResidentsCount,
|
|
19
|
+
},
|
|
20
|
+
"*"
|
|
21
|
+
);
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
setTimeout(() => {
|
|
25
|
+
if (window.scene) {
|
|
26
|
+
setInterval(logComponentResidents, 5000);
|
|
27
|
+
}
|
|
28
|
+
}, 5000);
|