Skip to content

Commit

Permalink
Chronos: update js, css and md files to add filter function in tutori…
Browse files Browse the repository at this point in the history 
…al page. (#5506)
  • Loading branch information
@AndyLuo1029
AndyLuo1029 authored Aug 23, 2022
1 parent c94e934 commit 584ee60
Show file tree
Hide file tree
Showing 3 changed files with 464 additions and 136 deletions.
51 changes: 51 additions & 0 deletions docs/readthedocs/source/_static/css/chronos_tutorial.css
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,51 @@
#tutorial img{
margin: 10px 5px 10px 15px;
}

.choiceline{
display: flex;
justify-content: space-around;
margin: 0px 5px 10px 5px;
}

.choicebox{
width: 200px;
height: 20px;
}

summary p{
margin: 10px 0 0 0;
font-weight: bold;
}

details p{
padding: 5px 15px;
color: #404040;
}

.border{
background-color: #f3f6f6;
border: 1px solid rgba(0,0,0,.1);
color: #404040;
box-shadow: inset 0 1px 2px -1px hsl(0deg 0% 100% / 50%), inset 0 -2px 0 0 rgb(0 0 0 / 10%);
margin-bottom: 10px;
padding-top: 10px;
padding-left: 5px;
padding-right: 5px;
margin-top: -10px;
border-radius: 5px;
font-weight: bold;
}

details p span{
font-style: italic;
font-weight: bold;
}

summary p button{
border-radius: 2px;
border: 1px solid rgba(0,0,0,.1);
box-shadow: inset 0 1px 2px -1px hsl(0deg 0% 100% / 90%);
color: #404040;
font-family:Lato,proxima-nova,Helvetica Neue,Arial,sans-serif;
}
175 changes: 175 additions & 0 deletions docs/readthedocs/source/_static/js/chronos_tutorial.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,175 @@
$(document).ready(function(){
$("#tutorial details").attr("open",true);
});

//func to show a tutorial
function showTutorials(ids){
ids.forEach(id => {
$("#"+id).css("display","block");
$("#"+id).attr("open","true");
$("#"+id).next().css("display","block");
});
}

//func to disable checkbox and button
function disCheck(ids){
ids.forEach(id => {
$("#"+id).prop("disabled", true);
$("#"+id).parent().css("color","#c5c5c5");
$("button[value='"+id+"']").prop("disabled",true);
$("button[value='"+id+"']").css("color","#c5c5c5");
});
}

//event when click the checkboxes
$(".checkboxes").click(function(){
//get all checked values
var vals = [];
$('input:checkbox:checked').each(function (index, item) {
vals.push($(this).val());
});

//reset display
$("#tutorial details").css("display","none");
$("#tutorial hr").css("display","none");
//reset checkbox and button
$("#tutorial button").prop("disabled",false);
$("#tutorial input[type='checkbox']").prop("disabled",false);
$("#tutorial input[type='checkbox']").parent().css("color","#404040");
$("#tutorial button").css("color","#404040");

//show tutorial according to checked values
if(vals.length==0){
//choose noting, show all tutorials
$("#tutorial details").css("display","block");
$("#tutorial details").attr("open",true);
$("#tutorial hr").css("display","block");
}
//chose something, disable invalid checkboxes and buttons accordingly.
else if(vals.length==1){
if(vals.includes("forecast")){
var ids = ["ChronosForecaster","TuneaForecasting","AutoTSEstimator","AutoWIDE",
"MultvarWIDE","MultstepWIDE","LSTMForecaster","AutoProphet","AnomalyDetection",
"DeepARmodel","TFTmodel","hyperparameter","taxiDataset","distributedFashion",
"ONNX","Quantize","TCMFForecaster"];
showTutorials(ids);
var disIds = ["simulation"];
disCheck(disIds);
}
else if(vals.includes("anomaly_detection")){
var ids = ["DetectAnomaly","Unsupervised","AnomalyDetection"];
showTutorials(ids);
var disIds = ["simulation","hyperparameter_tuning","onnxruntime","quantization","distributed","customized_model"];
disCheck(disIds);
}
else if(vals.includes("simulation")){
var ids = ["SimualateTimeSeriesData"];
showTutorials(ids);
var disIds = ["forecast","anomaly_detection","hyperparameter_tuning","onnxruntime","quantization","distributed","customized_model"];
disCheck(disIds);
}
else if(vals.includes("hyperparameter_tuning")){
var ids = ["TuneaForecasting","AutoTSEstimator","AutoWIDE","AutoProphet",
"hyperparameter","taxiDataset","ONNX"];
showTutorials(ids);
var disIds = ["anomaly_detection","simulation","quantization","distributed"];
disCheck(disIds);
}
else if(vals.includes("onnxruntime")){
var ids = ["ONNX"];
showTutorials(ids);
var disIds = ["anomaly_detection","simulation","quantization","distributed","customized_model"];
disCheck(disIds);
}
else if(vals.includes("quantization")){
var ids = ["Quantize"];
showTutorials(ids);
var disIds = ["anomaly_detection","simulation","hyperparameter_tuning","onnxruntime","distributed","customized_model"];
disCheck(disIds);
}
else if(vals.includes("distributed")){
var ids = ["distributedFashion","TCMFForecaster"];
showTutorials(ids);
var disIds = ["anomaly_detection","simulation","hyperparameter_tuning","onnxruntime","quantization","customized_model"];
disCheck(disIds);
}
else if(vals.includes("customized_model")){
var ids = ["AutoTSEstimator","DeepARmodel","TFTmodel"];
showTutorials(ids);
var disIds = ["anomaly_detection","simulation","onnxruntime","quantization","distributed"];
disCheck(disIds);
}
}
else if(vals.length==2){
if(vals.includes("forecast") && vals.includes("hyperparameter_tuning")){
var ids = ["TuneaForecasting","AutoTSEstimator","AutoWIDE","AutoProphet","hyperparameter","taxiDataset","ONNX","AutoTSEstimator"];
showTutorials(ids);
var disIds = ["anomaly_detection","simulation","quantization","distributed"];
disCheck(disIds);
}
else if(vals.includes("forecast") && vals.includes("anomaly_detection")){
var ids = ["AnomalyDetection"];
showTutorials(ids);
var disIds = ["simulation","hyperparameter_tuning","onnxruntime","quantization","distributed","customized_model"];
disCheck(disIds);
}
else if(vals.includes("forecast") && vals.includes("customized_model")){
var ids = ["DeepARmodel","TFTmodel","AutoTSEstimator"];
showTutorials(ids);
var disIds = ["anomaly_detection","simulation","onnxruntime","quantization","distributed"];
disCheck(disIds);
}
else if(vals.includes("forecast") && vals.includes("distributed")){
var ids = ["distributedFashion","TCMFForecaster"];
showTutorials(ids);
var disIds = ["anomaly_detection","simulation","hyperparameter_tuning","onnxruntime","quantization","customized_model"];
disCheck(disIds);
}
else if(vals.includes("forecast") && vals.includes("quantization")){
var ids = ["Quantize"];
showTutorials(ids);
var disIds = ["anomaly_detection","simulation","hyperparameter_tuning","onnxruntime","distributed","customized_model"];
disCheck(disIds);
}
else if(vals.includes("hyperparameter_tuning") && vals.includes("customized_model")){
var ids = ["AutoTSEstimator"];
showTutorials(ids);
var disIds = ["anomaly_detection","simulation","onnxruntime","quantization","distributed"];
disCheck(disIds);
}
else if(vals.includes("forecast") && vals.includes("onnxruntime")){
var ids = ["ONNX"];
showTutorials(ids);
var disIds = ["anomaly_detection","simulation","quantization","distributed","customized_model"];
disCheck(disIds);
}
else if(vals.includes("hyperparameter_tuning") && vals.includes("onnxruntime")){
var ids = ["ONNX"];
showTutorials(ids);
var disIds = ["anomaly_detection","simulation","quantization","distributed","customized_model"];
disCheck(disIds);
}
}
else if(vals.length==3){
if(vals.includes("forecast") && vals.includes("hyperparameter_tuning") && vals.includes("customized_model")){
var ids = ["AutoTSEstimator"];
showTutorials(ids);
var disIds = ["anomaly_detection","simulation","onnxruntime","quantization","distributed"];
disCheck(disIds);
}
else if(vals.includes("forecast") && vals.includes("hyperparameter_tuning") && vals.includes("onnxruntime")){
var ids = ["ONNX"];
showTutorials(ids);
var disIds = ["anomaly_detection","simulation","quantization","distributed","customized_model"];
disCheck(disIds);
}
}
});

//event when click the tags' buttons
$("details p button").click(function(){
var id = $(this).val();
$("#"+id).trigger("click");
});

// var allIds = ["forecast","anomaly_detection","simulation","hyperparameter_tuning","onnxruntime","quantization","distributed","customized_model"];
Loading

0 comments on commit 584ee60

Please sign in to comment.