dslak
/
coze_demo
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

add multiple selection

develop
Carmine De Rosa 7 years ago
parent
db42c28255
commit
f79fb485c6
20 changed files with 438 additions and 75 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. BIN
      TMP/g46375.png
  2. 81
      compatibility.php
  3. 161
      css/styles.css
  4. 12
      header.php
  5. BIN
      images/phone.png
  6. 0
      index.php
  7. 2
      js/compatibility.js
  8. 22
      js/modules.js
  9. 28
      js/plans.js
  10. 8
      modules.php
  11. 56
      plans.php
  12. 2
      scripts/plans.php
  13. BIN
      scss/.sass-cache/132087705a52dd1d0e0e4a761ce2b1b521d0d802/forms.scssc
  14. BIN
      scss/.sass-cache/132087705a52dd1d0e0e4a761ce2b1b521d0d802/global.scssc
  15. BIN
      scss/.sass-cache/132087705a52dd1d0e0e4a761ce2b1b521d0d802/variables.scssc
  16. 6
      scss/forms.scss
  17. 5
      scss/global.scss
  18. 125
      scss/sections/plans.scss
  19. 5
      scss/variables.scss
  20. BIN
      sounds/message.wav

BIN
TMP/g46375.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 25 KiB

81
compatibility.php
View File

@ -1,53 +1,52 @@
<div class="compatibility pattern">
<div class="row">
<div class="col-12">
<p class="font-14 font-bold text-upper text-red p-5">Analisi compatibilità del modulo</p>
</div>
<div class="row">
<div class="col-12">
<p class="font-14 font-bold text-upper text-red p-5">Analisi compatibilità del modulo</p>
</div>
<div class="row content">
<div class="col-4 user-sheet">
<div class="avatar"><img src="<?= $BASE_PATH;?>/images/avatar/luca.png"></div>
<div class="name">Luca</div>
<div class="rule">Stagista</div>
<p class="sheet-title">Modulo differenze culturali</p>
<div class="sheet-container">
<p class="font-10 text-upper pt-3 pb-2">Compatibilità knowledge</p>
<div class="value"><div class="percent" data-percent="60"></div></div>
<p class="font-10 text-upper pt-3 pb-2">Prestazioni storiche sul corso</p>
<div class="value"><div class="percent" data-percent="40"></div></div>
<p class="font-10 text-upper pt-3 pb-2">Carico didattico sostenibile</p>
<div class="value"><div class="percent" data-percent="70"></div></div>
</div>
</div>
<div class="col-4 user-sheet">
<div class="avatar"><img src="<?= $BASE_PATH;?>/images/avatar/sara.png"></div>
<div class="name">Sara</div>
<div class="rule">Venditore</div>
<p class="sheet-title">Modulo differenze culturali</p>
<div class="sheet-container">
<p class="font-10 text-upper pt-3 pb-2">Compatibilità knowledge</p>
<div class="value"><div class="percent" data-percent="40"></div></div>
<p class="font-10 text-upper pt-3 pb-2">Prestazioni storiche sul corso</p>
<div class="value"><div class="percent" data-percent="90"></div></div>
<p class="font-10 text-upper pt-3 pb-2">Carico didattico sostenibile</p>
<div class="value"><div class="percent" data-percent="30"></div></div>
</div>
</div>
<div class="row content">
<div class="col-4 user-sheet">
<div class="avatar"><img src="<?= $BASE_URL;?>/images/avatar/luca.png"></div>
<div class="name">Luca</div>
<div class="rule">Stagista</div>
<p class="sheet-title">Modulo differenze culturali</p>
<div class="sheet-container">
<p class="font-10 text-upper pt-3 pb-2">Compatibilità knowledge</p>
<div class="value"><div class="percent" data-percent="60"></div></div>
<p class="font-10 text-upper pt-3 pb-2">Prestazioni storiche sul corso</p>
<div class="value"><div class="percent" data-percent="40"></div></div>
<p class="font-10 text-upper pt-3 pb-2">Carico didattico sostenibile</p>
<div class="value"><div class="percent" data-percent="70"></div></div>
</div>
</div>
<div class="row p-5">
<div class="col-12 px-2">
<button class="button big confirm">Avvia personalizzazione e attiva corso</button>
<button class="button big discard">Annulla</button>
<div class="col-4 user-sheet">
<div class="avatar"><img src="<?= $BASE_URL;?>/images/avatar/sara.png"></div>
<div class="name">Sarah</div>
<div class="rule">Venditore</div>
<p class="sheet-title">Modulo differenze culturali</p>
<div class="sheet-container">
<p class="font-10 text-upper pt-3 pb-2">Compatibilità knowledge</p>
<div class="value"><div class="percent" data-percent="40"></div></div>
<p class="font-10 text-upper pt-3 pb-2">Prestazioni storiche sul corso</p>
<div class="value"><div class="percent" data-percent="90"></div></div>
<p class="font-10 text-upper pt-3 pb-2">Carico didattico sostenibile</p>
<div class="value"><div class="percent" data-percent="30"></div></div>
</div>
</div>
</div>
<div class="row p-5">
<div class="col-12 px-2">
<button class="button big confirm">Avvia personalizzazione e attiva corso</button>
<button class="button big discard">Annulla</button>
</div>
</div>
</div>

161
css/styles.css
View File

@ -14536,12 +14536,7 @@ a:hover {
transform: translate(-50%, -50%);
}
/* line 66, global.scss */
.bg-alpha {
background: rgba(255, 255, 255, 0.5);
}
/* line 70, global.scss */
/* line 65, global.scss */
.pattern {
background: white;
background-image: url(../images/pattern.jpg);
@ -14549,24 +14544,24 @@ a:hover {
background-position: center bottom;
}
/* line 77, global.scss */
/* line 72, global.scss */
.radius {
border-radius: 3px;
}
/* line 81, global.scss */
/* line 76, global.scss */
.radius-bottom {
border-radius: 0 0 3px 3px;
}
/* line 86, global.scss */
/* line 81, global.scss */
#MainContent {
top: 50px;
z-index: 0;
overflow: hidden;
}
/* line 92, global.scss */
/* line 87, global.scss */
#map {
width: 100%;
border-radius: 3px;
@ -14574,7 +14569,7 @@ a:hover {
padding: 10px;
}
/* line 102, global.scss */
/* line 97, global.scss */
#dropLoading {
display: none;
position: fixed;
@ -14585,7 +14580,7 @@ a:hover {
background: rgba(0, 0, 0, 0.8);
overflow: hidden;
}
/* line 111, global.scss */
/* line 106, global.scss */
#dropLoading #animation_container {
position: absolute;
height: 300px;
@ -14594,7 +14589,7 @@ a:hover {
left: 50%;
transform: translate(-50%, -50%);
}
/* line 120, global.scss */
/* line 115, global.scss */
#dropLoading #countdown {
position: fixed;
height: 30px;
@ -14675,6 +14670,16 @@ button.discard,
.button.discard {
background: black;
}
/* line 48, forms.scss */
input[type=button].dotted,
input[type=submit].dotted,
button.dotted,
.button.dotted {
background: white;
color: #2f2f2f;
border: 2px dotted #2f2f2f;
border-radius: 6px;
}
/* line 2, header.scss */
header {
@ -15020,3 +15025,133 @@ header .container .row .menu ul li.active a:hover, header .container .row .menu
height: 25px;
background: #bf0f3d;
}
/* line 3, sections/plans.scss */
.plans {
width: 100%;
}
/* line 6, sections/plans.scss */
.plans .phone {
position: relative;
height: 570px;
width: 245px;
background-image: url(../images/phone.png);
background-position: center bottom;
background-repeat: no-repeat;
background-size: 245px 500px;
}
/* line 15, sections/plans.scss */
.plans .phone .name {
position: absolute;
left: 60px;
top: 5px;
font-size: 0.75rem;
font-weight: 700;
}
/* line 22, sections/plans.scss */
.plans .phone .rule {
position: absolute;
left: 60px;
top: 25px;
font-size: 0.625rem;
}
/* line 28, sections/plans.scss */
.plans .phone .avatar {
position: absolute;
left: 0;
top: 0;
height: 50px;
width: 50px;
}
/* line 34, sections/plans.scss */
.plans .phone .avatar img {
height: 50px;
width: 50px;
}
/* line 40, sections/plans.scss */
.plans .phone .content {
position: absolute;
top: 145px;
left: 12px;
height: 371px;
width: 222px;
}
/* line 47, sections/plans.scss */
.plans .phone .content .cloud {
display: none;
position: relative;
width: 80%;
font-size: 0.75rem;
font-weight: 500;
padding: 10px;
margin: 10px 0;
border-radius: 8px;
}
/* line 57, sections/plans.scss */
.plans .phone .content .cloud.left {
left: 15px;
background: #f6e7ea;
border: 1px solid #c8bcbe;
}
/* line 61, sections/plans.scss */
.plans .phone .content .cloud.left:before {
content: '';
border: solid 11px transparent;
border-right-color: #c8bcbe;
position: absolute;
left: 0;
top: 50%;
transform: translate(-100%, -50%);
}
/* line 70, sections/plans.scss */
.plans .phone .content .cloud.left:after {
content: '';
border: solid 10px transparent;
border-right-color: #f6e7ea;
position: absolute;
left: 0;
top: 50%;
transform: translate(-100%, -50%);
}
/* line 81, sections/plans.scss */
.plans .phone .content .cloud.right {
left: calc(20% - 13px);
background: #d4eeed;
border: 1px solid #b0c8c6;
}
/* line 85, sections/plans.scss */
.plans .phone .content .cloud.right:before {
content: '';
border: solid 11px transparent;
border-left-color: #b0c8c6;
position: absolute;
right: 0;
top: 50%;
transform: translate(100%, -50%);
}
/* line 94, sections/plans.scss */
.plans .phone .content .cloud.right:after {
content: '';
border: solid 10px transparent;
border-left-color: #d4eeed;
position: absolute;
right: 0;
top: 50%;
transform: translate(100%, -50%);
}
/* line 105, sections/plans.scss */
.plans .phone .content .cloud.empty {
width: 100%;
text-align: center;
padding: 0;
}
/* line 114, sections/plans.scss */
.plans .phone .input {
position: absolute;
top: 516px;
left: 12px;
height: 42px;
width: 222px;
border-radius: 0 0 26px 26px;
overflow: hidden;
}

12
header.php
View File

@ -3,14 +3,14 @@
<div class="container">
<div class="row">
<div class="col-2"><img class="logo middle" src="<?= $BASE_PATH;?>/images/logo.png"></div>
<div class="col-2"><img class="logo middle" src="<?= $BASE_URL;?>/images/logo.png"></div>
<div class="col-10 menu">
<ul class="middle">
<li class="<?php if($getQ[0]=="menu"){echo "active";}?>"><a href="/menu">Menu</a></li>
<li class="<?php if($getQ[0]=="results"){echo "active";}?>"><a href="/results">Risultati</a></li>
<li class="<?php if($getQ[0]=="plans"){echo "active";}?>"><a href="/plans">Piani attivi</a></li>
<li class="<?php if($getQ[0]=="report"){echo "active";}?>"><a href="/report">Report</a></li>
<li class="<?php if($getQ[0]=="modules" || $getQ[0]=="compatibility"){echo "active";}?>"><a href="/modules">Moduli disponibili</a></li>
<li class="<?php if($getQ[0]=="menu"){echo "active";}?>"><a href="<?= $BASE_URL;?>/menu">Menu</a></li>
<li class="<?php if($getQ[0]=="results"){echo "active";}?>"><a href="<?= $BASE_URL;?>/results">Risultati</a></li>
<li class="<?php if($getQ[0]=="plans"){echo "active";}?>"><a href="<?= $BASE_URL;?>/plans">Piani attivi</a></li>
<li class="<?php if($getQ[0]=="report"){echo "active";}?>"><a href="<?= $BASE_URL;?>/report">Report</a></li>
<li class="<?php if($getQ[0]=="modules" || $getQ[0]=="compatibility"){echo "active";}?>"><a href="<?= $BASE_URL;?>/modules">Moduli disponibili</a></li>
<li><a href="#"><i class="fa fa-search"></i></a></li>
<li><a href="#"><i class="fa fa-bell"></i></a></li>
<li><a href="#"><i class="fa fa-user"></i></a></li>

BIN
images/phone.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 25 KiB

0
index.php
View File

2
js/compatibility.js
View File

@ -22,7 +22,7 @@ $(document).ready(()=>{
loading.fadeIn()
setTimeout(()=>{
loading.fadeOut(()=>{
window.location='/plans'
window.location='plans'
})
},7000)

22
js/modules.js
View File

@ -13,7 +13,7 @@ function drop(ev) {
ev.preventDefault();
const target = $(ev.currentTarget).find('.modules-container')
const target = $(ev.currentTarget)
const overlay = $('#dropConfirm')
const loading = $('#dropLoading')
const discard = overlay.find('.discard')
@ -40,9 +40,15 @@ function drop(ev) {
setTimeout(()=>{
const module = $('#'+data)
loading.fadeOut()
target.append('<div class="div-drag">'+module.text()+'</div>')
},7000)
if(target.find('.modules-container').length){
target.find('.modules-container').append('<div class="div-drag">'+module.text()+'</div>')
}else{
$('.modules-container').append('<div class="div-drag">'+module.text()+'</div>')
}
},700)
once = false
}
@ -58,4 +64,14 @@ function dragLeave(ev) {
$(document).ready(()=>{
$(document).keypress((event)=> {
if(event.which == 32){
window.location = 'compatibility'
}
})
})

28
js/plans.js
View File

@ -1 +1,29 @@
$(document).ready(()=>{
const plans = $('.plans')
const clouds = plans.find('.cloud')
const delay = 1000
let timer = 0
setTimeout(()=>{
clouds.each((index,elem)=>{
const el = $(elem)
timer = index*delay
if(el.hasClass('empty')){
timer -= delay
}
setTimeout(()=>{
if(!el.hasClass('empty')){
$('#notify1')[0].play()
}
el.fadeIn(500)
},timer)
})
},delay)
})

8
modules.php
View File

@ -72,7 +72,7 @@
<div class="row my-2">
<div class="col-3 p-0 mx-auto">
<div class="dropdown drop-action active">
<div class="dropdown drop-action active droppable" ondrop="drop(event)" ondragover="allowDrop(event)">
<div class="label"><i class="fa fa-flag"></i> Duomo</div>
<div class="data"><i class="fa fa-user"></i> 2</div>
</div>
@ -110,7 +110,7 @@
<i class="fa fa-user"></i>
<div class="name">Luca</div>
<div class="rule">Stagista</div>
<div class="avatar"><img src="<?= $BASE_PATH;?>/images/avatar/luca.png"></div>
<div class="avatar"><img src="<?= $BASE_URL;?>/images/avatar/luca.png"></div>
<p class="modules-title">Azioni in corso</p>
<div class="modules-container"></div>
@ -122,9 +122,9 @@
<div class="col-6 p-2 mx-auto">
<div class="user-sheet drop-action droppable" ondrop="drop(event)" ondragover="allowDrop(event)">
<i class="fa fa-user"></i>
<div class="name">Sara</div>
<div class="name">Sarah</div>
<div class="rule">Venditore</div>
<div class="avatar"><img src="<?= $BASE_PATH;?>/images/avatar/sara.png"></div>
<div class="avatar"><img src="<?= $BASE_URL;?>/images/avatar/sara.png"></div>
<p class="modules-title">Azioni in corso</p>
<div class="modules-container"></div>

56
plans.php
View File

@ -1 +1,55 @@
<div class="plans pattern">
<div class="row">
<div class="col-12">
<p class="font-14 font-bold text-upper text-red p-5">Monitoring dispositivi</p>
</div>
</div>
<div class="row mb-5">
<div class="col-8 mx-auto">
<div class="row">
<div class="col-6">
<div class="phone mx-auto" id="usr_luca">
<div class="avatar"><img src="<?= $BASE_URL;?>/images/avatar/luca.png"></div>
<div class="name">Luca</div>
<div class="rule">Stagista</div>
<div class="content">
<div class="cloud left">
Ciao Luca!<br>
Il modulo "differenze culturali" è disponibile.
</div>
<div class="cloud empty">
<button class="button dotted">Ok</button>
</div>
</div>
<div class="input"></div>
</div>
</div>
<div class="col-6">
<div class="phone mx-auto" id="usr_sara">
<div class="avatar"><img src="<?= $BASE_URL;?>/images/avatar/sara.png"></div>
<div class="name">Sarah</div>
<div class="rule">Venditore</div>
<div class="content">
<div class="cloud left">
Ciao Sara!<br>
Il modulo "differenze culturali" è disponibile.
</div>
<div class="cloud empty">
<button class="button dotted">Ok</button>
</div>
</div>
<div class="input"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<audio id="notify1">
<source src="<?= $BASE_URL;?>/sounds/message.wav" type="audio/wav">
</audio>

2
scripts/plans.php
View File

@ -0,0 +1,2 @@
<script type="text/javascript" src="<?php echo $BASE_URL;?>/js/plans.js"></script>

BIN
scss/.sass-cache/132087705a52dd1d0e0e4a761ce2b1b521d0d802/forms.scssc
View File

Binary file not shown.

BIN
scss/.sass-cache/132087705a52dd1d0e0e4a761ce2b1b521d0d802/global.scssc
View File

Binary file not shown.

BIN
scss/.sass-cache/132087705a52dd1d0e0e4a761ce2b1b521d0d802/variables.scssc
View File

Binary file not shown.

6
scss/forms.scss
View File

@ -44,6 +44,12 @@ button,
}
&.discard{
background: black;
}
&.dotted{
background: white;
color: $dark-grey;
border: 2px dotted $dark-grey;
border-radius: 6px;
}
}

5
scss/global.scss
View File

@ -62,11 +62,6 @@ a{
}
.bg-alpha{
background: rgba(255,255,255,0.5);
}
.pattern{
background: white;
background-image: url(../images/pattern.jpg);

125
scss/sections/plans.scss
View File

@ -1 +1,124 @@
.plans{
width: 100%;
.phone{
position: relative;
height: 570px;
width: 245px;
background-image: url(../images/phone.png);
background-position: center bottom;
background-repeat: no-repeat;
background-size: 245px 500px;
.name{
position: absolute;
left: 60px;
top: 5px;
font-size: $font-12;
font-weight: 700;
}
.rule{
position: absolute;
left: 60px;
top: 25px;
font-size: $font-10;
}
.avatar{
position: absolute;
left: 0;
top: 0;
height: 50px;
width: 50px;
img{
height: 50px;
width: 50px;
}
}
.content{
position: absolute;
top: 145px;
left: 12px;
height: 371px;
width: 222px;
.cloud{
display: none;
position: relative;
width: 80%;
font-size: $font-12;
font-weight: 500;
padding: 10px;
margin: 10px 0;
border-radius: 8px;
&.left{
left: 15px;
background: $pink;
border: 1px solid $dark-pink;
&:before{
content: '';
border: solid 11px transparent;
border-right-color: $dark-pink;
position: absolute;
left: 0;
top: 50%;
transform: translate(-100%, -50%);
}
&:after{
content: '';
border: solid 10px transparent;
border-right-color: $pink;
position: absolute;
left: 0;
top: 50%;
transform: translate(-100%, -50%);
}
}
&.right{
left: calc(20% - 13px);
background: $azure;
border: 1px solid $dark-azure;
&:before{
content: '';
border: solid 11px transparent;
border-left-color: $dark-azure;
position: absolute;
right: 0;
top: 50%;
transform: translate(100%, -50%);
}
&:after{
content: '';
border: solid 10px transparent;
border-left-color: $azure;
position: absolute;
right: 0;
top: 50%;
transform: translate(100%, -50%);
}
}
&.empty{
width: 100%;
text-align: center;
padding: 0;
}
}
}
.input{
position: absolute;
top: 516px;
left: 12px;
height: 42px;
width: 222px;
border-radius: 0 0 26px 26px;
overflow: hidden;
}
}
}

5
scss/variables.scss
View File

@ -55,3 +55,8 @@ $red: #bf0f3d;
$grey: #ccc;
$light-grey: #f2f2f2;
$dark-grey: #2f2f2f;
$pink: #f6e7ea;
$dark-pink: #c8bcbe;
$azure: #d4eeed;
$dark-azure: #b0c8c6;

BIN
sounds/message.wav
View File

Binary file not shown.
Write Preview
Loading…
Cancel
Save