Skip to content

Commit

Permalink
Sync cb-tb api
Browse files Browse the repository at this point in the history
  • Loading branch information
@cb-github-robot
cb-github-robot authored Aug 14, 2024
2 parents b4182fc + 9616abc commit 6e54e9a
Show file tree
Hide file tree
Showing 3 changed files with 263 additions and 263 deletions.
18 changes: 9 additions & 9 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -76,25 +76,25 @@ Check CB-Tumblebug project. (https://github.com/cloud-barista/cb-tumblebug)
- TB Username, Password: CB-Tumblebug REST API (BasicAuth) 호출에 필요한 Username 및 Password (ex: `default`, `default`)
- NS ID: cb-mapui에 표시할 namespace를 지정
- Display interval: 기본값은 10 (단위: 초)며, 정상적인 양의 정수를 입력했을 때에만 유효
- MCIS 생성
- MCIS Provisioning에서 MCIS 구성을 위한 상세 정보를 설정. Location-based 를 지정한 경우 Map에 클릭하면, 추천 VM이 지정됨.
- 추천 VM들로 구성한 MCIS 요구사항이 마련되면, `Create MCIS` 버튼을 클릭하여 구성 정보 확인 후 MCIS 생성 요청.
- MCI 생성
- MCI Provisioning에서 MCI 구성을 위한 상세 정보를 설정. Location-based 를 지정한 경우 Map에 클릭하면, 추천 VM이 지정됨.
- 추천 VM들로 구성한 MCI 요구사항이 마련되면, `Create MCI` 버튼을 클릭하여 구성 정보 확인 후 MCI 생성 요청.
- 생성 결과는 알림창 및 Text areabox에 표시됨.
## cb-mapui 동작 방식
index.js 에 포함된 로직이 수행되며, 이는 index.html 를 통해서 웹에 출력됨.
아래 과정을 주기적으로 반복함.
1. CB-Tumblebug을 통해 MCIS VM 조회
1. CB-Tumblebug을 통해 MCI VM 조회
1. 각VM의 기하학적 위치(longitude, latitude)를 획득
1. Convex Hull을 통해 VM들을 폴리곤 형태로 구성 (MCIS 형태 표현)
1. Map에 해당 MCIS 폴리곤들을 출력 (VM 라이프사이클 정보 아이콘 출력 포함)
1. Convex Hull을 통해 VM들을 폴리곤 형태로 구성 (MCI 형태 표현)
1. Map에 해당 MCI 폴리곤들을 출력 (VM 라이프사이클 정보 아이콘 출력 포함)
### index.js 처리 로직 상세
index.js 는 Openlayers를 기반으로,
- CB-Tumblebug API를 콜하여 MCIS 및 VM 정보를 조회(function getMcis())하고,
- MCIS를 생성 및 제어할 수 있는 기능을 버튼으로 제공함.
- tileLayer.on('postrender', function (event) Openlayers에서 반복적으로 그래픽 출력을 수행하는 펑션이며, MCIS Polygon 객체들을 도형으로 출력. 이때 MCIS의 상태도 갱신하여, 정보를 함께 출력.
- CB-Tumblebug API를 콜하여 MCI 및 VM 정보를 조회(function getMci())하고,
- MCI를 생성 및 제어할 수 있는 기능을 버튼으로 제공함.
- tileLayer.on('postrender', function (event) Openlayers에서 반복적으로 그래픽 출력을 수행하는 펑션이며, MCI Polygon 객체들을 도형으로 출력. 이때 MCI의 상태도 갱신하여, 정보를 함께 출력.
50 changes: 25 additions & 25 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -225,7 +225,7 @@
</button>
<div class="dropdown-menu" aria-labelledby="mapControlDropdown">
<a class="dropdown-item" href="javascript:void(0)" onclick="getConnection();">Show all Clouds</a>
<a class="dropdown-item" href="javascript:void(0)" onclick="hideMCIS();">Hide/Show MCIS</a>
<a class="dropdown-item" href="javascript:void(0)" onclick="hideMCI();">Hide/Show MCI</a>
<a class="dropdown-item" href="javascript:void(0)" onclick="clearMap();">Clear Map</a>
<a class="dropdown-item" href="javascript:void(0)" onclick="toggleView();">Toggle Map/API</a>
</div>
Expand All @@ -241,11 +241,11 @@
</div>


<!-- MCIS Provisioning Card -->
<!-- MCI Provisioning Card -->
<div class="card mb-2">
<div class="card-header">MC-Infra Provisioning</div>
<div class="card-body d-flex flex-column">
<form id="mcis-configuration-form" class="form-row">
<form id="mci-configuration-form" class="form-row">
<!-- Recommendation Policy Field -->
<div class="form-group col">
<div class="input-group">
Expand Down Expand Up @@ -343,7 +343,7 @@
<button class="btn btn-info w-100" type="button" data-toggle="collapse" data-target="#collapseAccelerator" aria-expanded="false" aria-controls="collapseAccelerator">
Accelerator Config
</div>
<div id="collapseAccelerator" class="collapse" aria-labelledby="headingAccelerator" data-parent="#mcis-configuration-form">
<div id="collapseAccelerator" class="collapse" aria-labelledby="headingAccelerator" data-parent="#mci-configuration-form">
<div class="px-0 py-0">

<!-- Accelerator Type Field -->
Expand Down Expand Up @@ -405,10 +405,10 @@
Configuration</button>
</div>

<!-- Create MCIS Field -->
<!-- Create MCI Field -->
<div class="form-group col">
<button type="button" id="createMcisButton" onClick="createMcis();" class="btn btn-primary w-100">Create
MCIS</button>
<button type="button" id="createMciButton" onClick="createMci();" class="btn btn-primary w-100">Create
MCI</button>
</div>


Expand All @@ -417,11 +417,11 @@
</div>
</div>

<!-- MCIS Control Card -->
<!-- MCI Control Card -->
<div class="card mb-2">
<div class="card-header">MC-Infra Control</div>
<div class="card-body d-flex flex-column">
<form id="mcis-control-form" class="form-row">
<form id="mci-control-form" class="form-row">

<!-- Namespace ID Field -->
<div class="form-group col">
Expand All @@ -437,14 +437,14 @@
</div>


<!-- MCIS ID Field -->
<!-- MCI ID Field -->
<div class="form-group col">
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text" id="mcisidLabel">MCIS ID</span>
<span class="input-group-text" id="mciidLabel">MCI ID</span>
</div>
<select id="mcisid" name="mcisid" class="form-control" aria-label="MCIS ID"
aria-describedby="mcisidLabel">
<select id="mciid" name="mciid" class="form-control" aria-label="MCI ID"
aria-describedby="mciidLabel">
<!-- Options will be filled dynamically -->
</select>
</div>
Expand Down Expand Up @@ -509,13 +509,13 @@
Actions
</button>
<div class="dropdown-menu" aria-labelledby="controlActionsDropdown">
<a class="dropdown-item" href="javascript:void(0)" onClick="controlMCIS('suspend');">Suspend</a>
<a class="dropdown-item" href="javascript:void(0)" onClick="controlMCIS('resume');">Resume</a>
<a class="dropdown-item" href="javascript:void(0)" onClick="controlMCIS('reboot');">Reboot</a>
<a class="dropdown-item" href="javascript:void(0)" onClick="controlMCIS('refine');">Refine</a>
<a class="dropdown-item" href="javascript:void(0)" onClick="controlMCIS('continue');">Continue</a>
<a class="dropdown-item" href="javascript:void(0)" onClick="controlMCIS('withdraw');">Withdraw</a>
<a class="dropdown-item" href="javascript:void(0)" onClick="controlMCIS('terminate');">Terminate</a>
<a class="dropdown-item" href="javascript:void(0)" onClick="controlMCI('suspend');">Suspend</a>
<a class="dropdown-item" href="javascript:void(0)" onClick="controlMCI('resume');">Resume</a>
<a class="dropdown-item" href="javascript:void(0)" onClick="controlMCI('reboot');">Reboot</a>
<a class="dropdown-item" href="javascript:void(0)" onClick="controlMCI('refine');">Refine</a>
<a class="dropdown-item" href="javascript:void(0)" onClick="controlMCI('continue');">Continue</a>
<a class="dropdown-item" href="javascript:void(0)" onClick="controlMCI('withdraw');">Withdraw</a>
<a class="dropdown-item" href="javascript:void(0)" onClick="controlMCI('terminate');">Terminate</a>
</div>
</div>

Expand All @@ -534,12 +534,12 @@

<!-- Status Field -->
<div class="form-group col">
<input type="button" value="Status" onClick="statusMCIS();" class="btn btn-info w-100">
<input type="button" value="Status" onClick="statusMCI();" class="btn btn-info w-100">
</div>

<!-- Delete Field -->
<div class="form-group col">
<input type="button" value="Delete" onClick="deleteMCIS();" class="btn btn-secondary w-100">
<input type="button" value="Delete" onClick="deleteMCI();" class="btn btn-secondary w-100">
</div>


Expand Down Expand Up @@ -655,11 +655,11 @@



<!-- MCIS Application Card -->
<!-- MCI Application Card -->
<div class="card mb-2">
<div class="card-header">MC-Infra Application</div>
<div class="card-body d-flex flex-column">
<form id="mcis-application-form" class="form-row">
<form id="mci-application-form" class="form-row">

<!-- Select Application Field -->
<div class="form-group col">
Expand Down Expand Up @@ -700,7 +700,7 @@
</div>


<!-- MCIS Access Field -->
<!-- MCI Access Field -->
<div class="form-group col dropdown">
<button class="btn btn-info dropdown-toggle w-100" type="button" id="accessDropdown"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Expand Down
Loading

0 comments on commit 6e54e9a

Please sign in to comment.