diff --git a/capsule-prototype/create.zip b/capsule-prototype/create.zip index f135089df67215934ef7b883218c37a4b7999b11..40b7e727a0ccf08db83eb7b5c69648df3018fc90 100644 Binary files a/capsule-prototype/create.zip and b/capsule-prototype/create.zip differ diff --git a/capsule-prototype/css/flatten_timeline.css b/capsule-prototype/css/flatten_timeline.css new file mode 100644 index 0000000000000000000000000000000000000000..b92769b3d1a05f30111b1e048fcd336354a53669 --- /dev/null +++ b/capsule-prototype/css/flatten_timeline.css @@ -0,0 +1,349 @@ + +#flattentimeline { + flex: 1 0 0; + color: white; + overflow-x: hidden; + overflow-y: auto; + min-width: 150px; +} + +#flattentimeline.drag { + /*background: rgba(2,212,255,.5);*/ + box-shadow: 0 0 20px 20px rgba(63,223,255,.45) inset; +} + +.flattentimeline_item.draggable { + background: rgba(63,223,255,.25); +} + +#flattentimeline_highlight { + margin-bottom: 0px; +} + + +#flattentimeline_main_title { + font-weight: 200; + /*height: 40px;*/ + line-height: 20px; + padding: 10px 0; + text-align: center; + /*background: #2C3032;*/ + /*background: #2C3033;*/ + /*background: #57A5AF;*/ + background: #EC8960; + /*background-image: -webkit-linear-gradient(left, #EC8960 0%, #57A5AF 100%);*/ + /*background-image: -webkit-linear-gradient(left, #94CA6F 0%, #B495CC 100%);*/ + text-transform: uppercase; + color: rgba(255,255,255,1); + font-size: 18px; + border-bottom: 2px solid #1B1D1E; +} + +#flattentimeline_settings { + font-weight: 200; + height: 240px; + line-height: 40px; + text-align: center; + background: #26292B; + text-transform: uppercase; + color: #FFF; + font-size: 18px; + margin-top: 4px; + display: none; +} + +#flattentimeline_items { + width: 100%; + height: 100%; + overflow: hidden; + overflow-y: auto; + background-color: rgba(255,255,255,.05); +} + +.flattentimeline_item { + position: relative; + height: 40px; + color: white; + margin: 0px 0px; + cursor: pointer; + width: 100%; + display: none; + /*border-radius: 2px;*/ +} + + +.flattentimeline_highlightitem { + position: relative; + /*height: 150px;*/ + height: auto; + color: white; + margin: 3px 0px 0px 0px; + cursor: pointer; + /*background: rgba(255,255,255,.15); */ + width: 100%; + text-align: center; + padding: 2px 0 3px 0; + border-radius: 1px; + + background-position: center center; + background-repeat: no-repeat; + -webkit-background-size:cover; + -moz-background-size: cover; + -o-background-size: cover; + background-size: cover; + + /*display:block;*/ +} + + +.flattentimeline_item:hover, .flattentimeline_highlightitem:hover { + background-color: rgba(255,255,255,.15); + opacity: 1; +} + +.flattentimeline_opacifiant, .flattentimeline_bar { + top: 0px; + left: 0px; + width: 100%; + height: 100%; + position: absolute; + background-position: center center; + background-repeat: no-repeat; + -webkit-background-size:cover; + -moz-background-size: cover; + -o-background-size: cover; + background-size: cover; + text-align: left; + overflow: hidden; + + /*border-radius: 3px; + /*mix-blend-mode: overlay;*/ +} + +.flattentimeline_title, .flattentimeline_subtitle, .flattentimeline_counter { + top: 0px; + left: 0px; + /*position: absolute; */ + background-position: center center; + background-repeat: no-repeat; + text-align: left; + overflow: hidden; + line-height: 20px; +} + + +.flattentimeline_item .flattentimeline_image { + height: 30px; + width: 30px; + margin: 4px 7px 4px 0px; + border-radius: 1px; + background-color: rgba(255,255,255,.25); + float: left; + background-position: center center; + background-repeat: no-repeat; + -webkit-background-size:cover; + -moz-background-size: cover; + -o-background-size: cover; + background-size: cover; +} + + +.flattentimeline_highlightitem .flattentimeline_image { + height: 100%; + width: 100%; + margin: 0; + border-radius: 1px; + position: absolute; + background-position: center center; + background-repeat: no-repeat; + -webkit-background-size:cover; + -moz-background-size: cover; + -o-background-size: cover; + background-size: cover; + background-blend-mode: normal; + opacity: .5; +} + +/*.flattentimeline_highlightitem .flattentimeline_image { +width: 170px; +height: 60px; +margin: 15px 15px 5px 15px; +border-radius: 2px; +background-color: #fff; +display: inline-block; +float: left; +background-position: center center; +} */ + +/*.flattentimeline_color { +top: 0px; +height: 100%; +}*/ +.flattentimeline_opacifiant, .flattentimeline_bar { + background-color: rgba(0, 0, 0, 0.75); + height: 3px; + top: 37px; + + /* box-shadow: 0px 0px 1px 1px rgba(20,46,51,.25); + /* mix-blend-mode: luminosity; */ + + /* mix-blend-mode: multiply; + /* height: 40px; + top: 0px; + opacity: .25; */ +} + +.flattentimeline_highlightitem .flattentimeline_bar, .flattentimeline_highlightitem .flattentimeline_opacifiant { + top: auto; + display: block; +} + +.flattentimeline_title { + font-weight: 400; + font-size: 10px; + line-height: 39px; + /* color: rgba(255,255,255,.5); */ + + /*width: 55%; */ + /*max-width: 132px;*/ + text-overflow: ellipsis; + white-space: nowrap; + /*overflow: hidden;*/ + + /*color: #0C2D33; */ + /*mix-blend-mode: screen; */ +} + +.flattentimeline_highlightitem .flattentimeline_title { + line-height: 1.2em; + width: 170px; + font-size: 12px; + text-transform: uppercase; + padding: 20px 0 20px 0; + color: #FFF;/*rgba(255,255,255,1);*/ + font-weight: 600; +} + +.flattentimeline_highlightitem .flattentimeline_description { + font-weight: 400; + font-size: 11px; + line-height: 1.4em; + color: rgba(255,255,255,.9); + margin: -15px 15px 20px 15px; + + width: 170px; + text-align: left; + + display: inline-block; +} + +.flattentimeline_highlightitem .flattentimeline_typeTxt, .flattentimeline_highlightitem .flattentimeline_author { + font-weight: 400; + font-size: 9px; + line-height: 1.2em; + margin: -13px 15px 20px 15px; + + width: 170px; + text-align: left; + color: rgba(255,255,255,.75); + + display: inline-block; + font-style: italic; + /*text-transform: uppercase; */ +} + +.flattentimeline_highlightitem .flattentimeline_author { + font-style: normal; +} + +.flattentimeline_subtitle { + font-family: "OpenSans"; + font-weight: 200; + top: 25px; + font-size: 10px; + left: 40px; + line-height: 20px; + height: 20px; + display: none; +} +/*.flattentimeline_type { +top: 14px; +left: 6px; +width: 26px; +height: 26px; +background-position: center center; +background-repeat: no-repeat; +opacity: .5; +}*/ +/*.flattentimeline_type { +width:10px; height:10px; +border-radius:10px; +float:right; +margin:20px 15px 20px 0; +}*/ +.flattentimeline_type { + width: 20px; + height: 20px; + /*border-radius: 20px; */ + float: right; + background-position: center center; + background-repeat: no-repeat; + margin: 9px 5px; + opacity: 0.75; + display: none; +} + +.flattentimeline_highlightitem .flattentimeline_type { + width: 40px; + height: 40px; + position: absolute; + border-radius: 30px; + background-color: rgba(0,0,0,.5); + margin: 25px 0 0 80px; +} + +.flattentimeline_color { + width: 6px; + height: 6px; + border-radius: 10px; + float: right; + margin: 22px 5px; +} + +.flattentimeline_counter { + font-weight: 600; + top: 5px; + left: 5px; + width: 40px; + height: 40px; + line-height: 38px; + border-radius: 2px; + + background-color: #000; + + font-size: 18px; + text-align: center; + display: none; +} + +.flattentimeline_bar { + /*width: 0%;*/ + background-color: #26292B; /*#2DCAE1;*/ + opacity: 1; +} + +.docLive, .docTocome, .docFaraway { + display: block; +} + +.docLive { + opacity: 1; +} + +.docTocome, .docFaraway { + opacity: 0.1; +} + +.docFaraway { + opacity: 0.1; +} diff --git a/capsule-prototype/css/left_menu.css b/capsule-prototype/css/left_menu.css new file mode 100644 index 0000000000000000000000000000000000000000..41803b28561ef85f54d8081bb4ed1cb88c101cd4 --- /dev/null +++ b/capsule-prototype/css/left_menu.css @@ -0,0 +1,83 @@ + +#left_menu, #left_menu.div { + width: 80px; + justify-content: space-between; + background: var(--rk-light-blue); + padding-top: 10px; + padding-bottom: 10px; +} + + +.left_menu_item { + color: rgba(255,255,255,.5); + cursor: pointer; + display: flex; + flex-direction: column; + align-items: center; + text-align: center; + /* + font-size: 10px; + width: 70px; + margin: 0 5px; + height: 60px; + border-radius: 2px; + padding: 5px 0; + text-align: center; + display: inline-block; + */ +} + +.left_menu_item:hover { background: rgba(0,0,0,.1); } + +.left_menu_item.selected { background: rgba(0,0,0,.15); } + +.left_menu_item:first-child { margin-bottom: 10px; } + +.left_menu_item_icn { width:40px; height:40px; } + +#left_menu_item_icn_presets { background:url("images/icn-menu-presets.png"); } + +#left_menu_item_icn_horizontal { background:url("images/icn-menu-horizontal.png"); } + +#left_menu_item_icn_vertical { background:url("images/icn-menu-vertical.png"); } + +#left_menu_item_icn_groups { background:url("images/icn-menu-groups.png"); } + +#left_menu_item_icn_colors { background:url("images/icn-menu-colors.png"); } + +#left_menu_item_icn_filter { background:url("images/icn-menu-filter.png"); } + +#left_menu_item_icn_highlight { background:url("images/icn-menu-highlight.png"); } + +#left_menu_item_icn_search { background:url("images/icn-menu-search.png"); } + +#left_menu_item_icn_keywords { background:url("images/icn-menu-keywords.png"); } + +#left_menu_item_icn_mosaic { background:url("images/icn-menu-mosaic.png"); } + +#left_menu_item_icn_preview { background:url("images/icn-menu-preview.png"); } + +#left_menu_item_icn_settings { background:url("images/icn-menu-settings.png"); } + +#left_menu_item_icn_addfile { background:url("images/icn-menu-addfile.png"); } + +#left_menu_item_icn_addnote { background:url("images/icn-menu-addnote.png"); } + +#left_menu_item_icn_addlink { background:url("images/icn-menu-addlink.png"); } + +.left_menu_item_title { + height:20px; + line-height:20px; +} + +#left_menu .break { + width:40px; height:1px; + background:rgba(255,255,255,.2); + margin:5px 20px; +} + +#left_menu_item_btn_addfile { + background: red; + opacity: 0; + cursor: pointer !important; +} diff --git a/capsule-prototype/css/mosaic.css b/capsule-prototype/css/mosaic.css new file mode 100644 index 0000000000000000000000000000000000000000..8ad8ce8598febfd58a700e69b9d0e024ad9e78e5 --- /dev/null +++ b/capsule-prototype/css/mosaic.css @@ -0,0 +1,94 @@ + +:root { + --card-height: 150px; + --card-width: 150px; + + --filter-width: 80px; + --filter-height: 25px; + + --border-radius: 3px; + --base-spacing: 5px; + --little-spacing: 2px; + + --filter-bg-size: 30px; +} + +#mosaic_tab { + display: flex; + flex-direction: column; +} + +.mosaic_filter, .mosaic_category > div { + display: flex; + flex-direction: row; + flex: 1; + + flex-wrap: wrap; +} + +.mosaic_filter_item { + width: var(--filter-width); + height: var(--filter-height); + margin: var(--base-spacing); + padding: var(--base-spacing); + border-radius: var(--border-radius); + display: flex; + flex-direction: row; + justify-content: left; + padding-left: var(--filter-bg-size); + align-items: center; +} + +.mosaic_category { + padding: var(--base-spacing); + margin: var(--base-spacing); + border-radius: var(--border-radius); + display: flex; + flex-direction: column; +} + +.mosaic_item { + width: var(--card-width); + display: flex; + flex-direction: column; + align-items: center; + text-align: center; +} + +.mosaic_item span { + max-width: var(--card-width); + overflow: hidden; + text-overflow: ellipsis; + padding: var(--base-spacing); +} + +.mosaic_item img { + width: 80%; + height: auto; + max-height: var(--card-height); + padding: var(--base-spacing); +} + +.mosaic_filter_item:not(.mosaic_filter_item_all), .mosaic_category > h2 { + text-transform: uppercase; +} + +.mosaic_filter > div { + background-repeat: no-repeat; + background-position: left; + background-size: var(--filter-bg-size); +} + +.mosaic_filter > div.mosaic_filter_item_all { background-size: 20px; } + +.mosaic_filter_item:not(.mosaic_filter_disabled, .mosaic_filter_item_all) { + background-image: url('images/icn-menu-preview.png'); +} + +.mosaic_filter_disabled { + background-image: url('images/icn-menu-filter.png'); +} + +.mosaic_filter_item_all { + background-image: url('images/icn-reload.png'); +} diff --git a/capsule-prototype/css/old_flatten_timeline.css b/capsule-prototype/css/old_flatten_timeline.css new file mode 100644 index 0000000000000000000000000000000000000000..9d021add4923af01017fb2891f675e8435b7c1a0 --- /dev/null +++ b/capsule-prototype/css/old_flatten_timeline.css @@ -0,0 +1,350 @@ + +#flattentimeline { + flex: 1; + color: white; + overflow-x: hidden; + overflow-y: auto; +} + +#flattentimeline.drag { + /*background: rgba(2,212,255,.5);*/ + box-shadow: 0 0 20px 20px rgba(63,223,255,.45) inset; +} + +.flattentimeline_item.draggable { + background: rgba(63,223,255,.25); +} + +#flattentimeline_highlight { + margin-bottom: 0px; +} + + +#flattentimeline_main_title { + font-weight: 200; + /*height: 40px;*/ + line-height: 20px; + padding: 10px 0; + text-align: center; + /*background: #2C3032;*/ + /*background: #2C3033;*/ + /*background: #57A5AF;*/ + background: #EC8960; + /*background-image: -webkit-linear-gradient(left, #EC8960 0%, #57A5AF 100%);*/ + /*background-image: -webkit-linear-gradient(left, #94CA6F 0%, #B495CC 100%);*/ + text-transform: uppercase; + color: rgba(255,255,255,1); + font-size: 18px; + border-bottom: 2px solid #1B1D1E; +} + +#flattentimeline_settings { + font-weight: 200; + height: 240px; + line-height: 40px; + text-align: center; + background: #26292B; + text-transform: uppercase; + color: #FFF; + font-size: 18px; + margin-top: 4px; + display: none; +} + +#flattentimeline_items { + width: 100%; + height: 100%; + overflow: hidden; + overflow-y: auto; + background-color: rgba(255,255,255,.05); +} + +.flattentimeline_item { + position: relative; + height: 40px; + color: white; + margin: 0px 0px; + cursor: pointer; + width: 100%; + display: none; + /*border-radius: 2px;*/ +} + + +.flattentimeline_highlightitem { + position: relative; + /*height: 150px;*/ + height: auto; + color: white; + margin: 3px 0px 0px 0px; + cursor: pointer; + /*background: rgba(255,255,255,.15); */ + width: 100%; + text-align: center; + padding: 2px 0 3px 0; + border-radius: 1px; + + background-position: center center; + background-repeat: no-repeat; + -webkit-background-size:cover; + -moz-background-size: cover; + -o-background-size: cover; + background-size: cover; + + /*display:block;*/ +} + + +.flattentimeline_item:hover, .flattentimeline_highlightitem:hover { + background-color: rgba(255,255,255,.15); + opacity: 1; +} + +.flattentimeline_opacifiant, .flattentimeline_bar { + top: 0px; + left: 0px; + width: 100%; + height: 100%; + position: absolute; + background-position: center center; + background-repeat: no-repeat; + -webkit-background-size:cover; + -moz-background-size: cover; + -o-background-size: cover; + background-size: cover; + text-align: left; + overflow: hidden; + + /*border-radius: 3px; + /*mix-blend-mode: overlay;*/ +} + +.flattentimeline_title, .flattentimeline_subtitle, .flattentimeline_counter { + top: 0px; + left: 0px; + /*position: absolute; */ + background-position: center center; + background-repeat: no-repeat; + text-align: left; + overflow: hidden; + line-height: 20px; +} + + +.flattentimeline_item .flattentimeline_image { + height: 30px; + width: 30px; + margin: 4px 7px 4px 0px; + border-radius: 1px; + background-color: rgba(255,255,255,.25); + float: left; + background-position: center center; + background-repeat: no-repeat; + -webkit-background-size:cover; + -moz-background-size: cover; + -o-background-size: cover; + background-size: cover; +} + + +.flattentimeline_highlightitem .flattentimeline_image { + height: 100%; + width: 100%; + margin: 0; + border-radius: 1px; + position: absolute; + background-position: center center; + background-repeat: no-repeat; + -webkit-background-size:cover; + -moz-background-size: cover; + -o-background-size: cover; + background-size: cover; + background-blend-mode: normal; + opacity: .5; +} + +/*.flattentimeline_highlightitem .flattentimeline_image { +width: 170px; +height: 60px; +margin: 15px 15px 5px 15px; +border-radius: 2px; +background-color: #fff; +display: inline-block; +float: left; +background-position: center center; +} */ + +/*.flattentimeline_color { +top: 0px; +height: 100%; +}*/ +.flattentimeline_opacifiant, .flattentimeline_bar { + background-color: rgba(0, 0, 0, 0.75); + height: 3px; + top: 37px; + + /* box-shadow: 0px 0px 1px 1px rgba(20,46,51,.25); + /* mix-blend-mode: luminosity; */ + + /* mix-blend-mode: multiply; + /* height: 40px; + top: 0px; + opacity: .25; */ +} + +.flattentimeline_highlightitem .flattentimeline_bar, .flattentimeline_highlightitem .flattentimeline_opacifiant { + top: auto; + display: block; +} + +.flattentimeline_title { + font-weight: 400; + font-size: 10px; + line-height: 39px; + /* color: rgba(255,255,255,.5); */ + + /*width: 55%; */ + max-width: 132px; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + + display: inline-block; + /*color: #0C2D33; */ + /*mix-blend-mode: screen; */ +} + +.flattentimeline_highlightitem .flattentimeline_title { + line-height: 1.2em; + width: 170px; + font-size: 12px; + text-transform: uppercase; + padding: 20px 0 20px 0; + color: #FFF;/*rgba(255,255,255,1);*/ + font-weight: 600; +} + +.flattentimeline_highlightitem .flattentimeline_description { + font-weight: 400; + font-size: 11px; + line-height: 1.4em; + color: rgba(255,255,255,.9); + margin: -15px 15px 20px 15px; + + width: 170px; + text-align: left; + + display: inline-block; +} + +.flattentimeline_highlightitem .flattentimeline_typeTxt, .flattentimeline_highlightitem .flattentimeline_author { + font-weight: 400; + font-size: 9px; + line-height: 1.2em; + margin: -13px 15px 20px 15px; + + width: 170px; + text-align: left; + color: rgba(255,255,255,.75); + + display: flex; + font-style: italic; + /*text-transform: uppercase; */ +} + +.flattentimeline_highlightitem .flattentimeline_author { + font-style: normal; +} + +.flattentimeline_subtitle { + font-family: "OpenSans"; + font-weight: 200; + top: 25px; + font-size: 10px; + left: 40px; + line-height: 20px; + height: 20px; + display: none; +} +/*.flattentimeline_type { +top: 14px; +left: 6px; +width: 26px; +height: 26px; +background-position: center center; +background-repeat: no-repeat; +opacity: .5; +}*/ +/*.flattentimeline_type { +width:10px; height:10px; +border-radius:10px; +float:right; +margin:20px 15px 20px 0; +}*/ +.flattentimeline_type { + width: 20px; + height: 20px; + /*border-radius: 20px; */ + float: right; + background-position: center center; + background-repeat: no-repeat; + margin: 9px 5px; + opacity: 0.75; + display: none; +} + +.flattentimeline_highlightitem .flattentimeline_type { + width: 40px; + height: 40px; + position: absolute; + border-radius: 30px; + background-color: rgba(0,0,0,.5); + margin: 25px 0 0 80px; +} + +.flattentimeline_color { + width: 6px; + height: 6px; + border-radius: 10px; + float: right; + margin: 22px 5px; +} + +.flattentimeline_counter { + font-weight: 600; + top: 5px; + left: 5px; + width: 40px; + height: 40px; + line-height: 38px; + border-radius: 2px; + + background-color: #000; + + font-size: 18px; + text-align: center; + display: none; +} + +.flattentimeline_bar { + /*width: 0%;*/ + background-color: #26292B; /*#2DCAE1;*/ + opacity: 1; +} + +.docLive, .docTocome, .docFaraway { + display: flex; + flex: 0; +} + +.docLive { + opacity: 1; +} + +.docTocome, .docFaraway { + opacity: 0.1; +} + +.docFaraway { + opacity: 0.1; +} diff --git a/capsule-prototype/css/old_mosaic.css b/capsule-prototype/css/old_mosaic.css new file mode 100644 index 0000000000000000000000000000000000000000..5900022308f739c1c07792322b2e069ea9e9433f --- /dev/null +++ b/capsule-prototype/css/old_mosaic.css @@ -0,0 +1,82 @@ + +#mosaic_tab { + background: #243538; + overflow: scroll; + padding: 20px; + display: none; +} + +.mosaic_category { + padding: 1.0em 1vw; + margin: 2vh 0 1.5vh 0; + border-radius: 3px; + background: rgba(0,0,0,.15); +} + +.mosaic_category_grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(125px, 1fr)); + grid-auto-rows: 150px; +} + +.mosaic_filter { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(125px, 1fr)); +} + +.mosaic_filter_item { + padding: 1.0em 1vw; + margin: 2vh 0.5vw 1.5vh 0.5vw; + border-radius: 3px; + cursor:pointer; +} + +.mosaic_filter_disabled { + opacity: 0.5; +} + +.mosaic_filter_disabled>h2:after { + background-image: url('images/icn-menu-filter.png'); +} + +.mosaic_filter_item > h2, .mosaic_category h2 { + text-transform: capitalize; +} + +.mosaic_filter_item:not(.mosaic_filter_disabled) > h2:after{ + background-image: url('images/icn-menu-preview.png'); +} + +.mosaic_filter_item > h2:after{ + display:inline-block; + height:20px; + width:20px; + content: " "; + background-size: 20px 20px; + margin-left: 5px; + padding-top: 3px; + background-repeat: no-repeat; +} + +.mosaic_filter_item_all > h2:after { + background-image: url('images/icn-reload.png') !important; +} + +.mosaic_item img { + /* To correctly align image, regardless of content height: */ + vertical-align: top; + display: inline-block; + /* To horizontally center images and caption */ + text-align: center; + /* The width of the container also implies margin around the images. */ + width: 100px; + margin: 2vh 0 1.5vh 0; + cursor:pointer; +} + +.mosaic_item .caption { + /* + display:block; + */ +} + diff --git a/capsule-prototype/css/online-theme.css b/capsule-prototype/css/online-theme.css index a1eeef556ddc68d4e77e23994a463b9c5021fa02..2793e4ac11871ed2816a20ea8df5d48ecaa8e58d 100644 --- a/capsule-prototype/css/online-theme.css +++ b/capsule-prototype/css/online-theme.css @@ -1,1393 +1,223 @@ @import url("font/stylesheet.css"); +@import 'left_menu.css'; +@import 'popup.css'; +@import 'mosaic.css'; +@import 'flatten_timeline.css'; -html, body { - width: 100%; - height: 100%; - margin: 0px; - color: white; - font-family: 'OpenSans'; - font-weight: 400; - font-size: 12px; - /*background-color: white; - background-color: #061619; */ - background: #142E33; - -webkit-touch-callout: none; - -webkit-user-select: none; - -khtml-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; -} - -#popupSpace, #popupAlertSpace, #popupAddLinkSpace, #popupSettingsSpace, #popupMosaicSpace { - width: 100%; - height: 100%; - background: rgba(0,0,0,.25); - position: absolute; - z-index: 10000000; - text-align: center; - display: none; - top: 0px; -} -#popupAlertSpace { - z-index: 100000000; -} - -/*#popupSettings { - width: 40vw; - margin-top: 25vh; - padding: 5vh 0 6vh 0; - border-radius: 2px; - box-shadow: 0 5px 25px #000; - font-weight: 400; - font-size: 1vw; - display: inline-block; - text-align: center; - background: #243538; -} */ - -#popupSettings { - margin-top: 15vh; - border-radius: 2px; - box-shadow: 0 5px 25px #000; - font-weight: 400; - font-size: 1vw; - display: inline-block; - text-align: left; - background: #243538; -} - -#popupSettingsLeft { - width: 25vw; - min-height: 50vh; - padding: 6vh 3vw 6vh 3vw; - vertical-align: top; - background: rgba(0,0,0,.15); -} - -#popupSettingsRight { - width: 18vw; - min-height: 50vh; - padding: 6vh 0 6vh 0; - vertical-align: top; - text-align: center; - border-radius: 2px 0 0 2px; - - background: #559299; - background: -o-linear-gradient(left bottom, rgba(20,46,51,1) 0%, #559299 100%); - background: -moz-linear-gradient(left bottom, rgba(20,46,51,1) 0%, #559299 100%); - background: -webkit-linear-gradient(left bottom, rgba(20,46,51,1) 0%, #559299 100%); -} - -.popupSettingsBtn { - font-weight: 400; - color: rgba(255,255,255,.75); - font-size: 0.6em; - cursor: pointer; - text-transform: uppercase; - text-align: center; - display: inline-block; - bottom: 0; - margin: 1vh 0 1vh 0; - line-height: 1.2em; - padding: 1.2em 2.4em 1.2em 2.4em; - padding: 1.2em 0; - width: 9vw; - border-radius: 3px; - border: 1px solid rgba(255,255,255,.15); - -} -.popupSettingsBtn:hover { - background: rgba(255,255,255,.05);/*rgba(20,46,51,.75);/*rgba(20,46,51,.75); */ - color: #fff; -} - -.popupSettingsA { - font-weight: 400; - color: rgba(255,255,255,.5); - font-size: .8em; - cursor: pointer; - text-align: center; - display: inline-block; - text-decoration: underline; - bottom: 0; - margin: 1vh 0; - line-height: 1.2em; - padding: 1.2em 0; - width: 9vw; -} -.popupSettingsA:hover { - color: rgba(255,255,255,.75); -} - -.popupSettingsTxt { - font-weight: 200; - width: 25vw; - display: inline-block; - margin-bottom: 1vh; - font-size: .9em; - line-height: 1.2em; - color: rgba(255,255,255,.75); - padding: .5vh 0 .5vh 0; - cursor: pointer; -} -.popupSettingsLabel { - color: rgba(255,255,255,.25); - font-size: .9em; -} - -.popupSettingsInput { - width: 23vw; - display: inline-block; - margin-bottom: 1vh; - font-size: .9em; - line-height: 1.2em; - - font-weight: 200; - - background: rgba(0,0,0,.05); - box-shadow: 0 1px 3px rgba(0,0,0,.2) inset; - border: 0; - border-radius: 3px; - color: rgba(255,255,255,.85); - padding: .5vh .5vw; - display: none; -} - -#popupSettingsTitle { - text-transform: uppercase; - font-size: 1.2em; - padding: 0 0 1vh 0; -} -#popupSettingsTitleInput { - font-size: 1.2em; -} -#popupSettingsCredits, #popupSettingsCreationDate { -} - - - - - - - -#popupAlert { - width: 46vw; - background: #142E33;/*rgb(50,50,50); */ - /*margin: 20vh 0 0 0; */ - padding: 5vh 2vw; - border-radius: 3px; - box-shadow: 0 5px 25px #000; - font-weight: 400; - font-size: 1vw; - display: inline-block; - text-align: center; - color: rgba(255,255,255,.75); -} -#popupAlertMessage { - font-size: .9em; - font-weight: 200; -} - -#popupAlertInput, #popupAlertTextarea { - background: rgba(0,0,0,.05);/*gba(255,255,255,.15);*/ - box-shadow: 0 1px 3px rgba(0,0,0,.2) inset; - border: 0; - border-radius: 3px; - color: rgba(255,255,255,.85); - width: 30vw; - - display: inline-block; - - font-weight: 200; - font-size: 0.9em; - cursor: pointer; - padding-bottom: 0; - - line-height: 1.4em; - padding: 2vh 1vw; - - margin: 3vh 0 1.5vh 0; -} - - - -#popupAlertButtons, #popupAddLinkButtons { - width: 100%; - text-align: center; +:root { + --tab_selector_height: 30px; + --rk-light-blue: #559299; } -.popupAlertButton, .popupAddLinkButton, .popupSettingsButton { - width: 9vw; - - font-weight: 400; - /* color: rgba(255,255,255,.75); */ - font-size: 0.7em; - line-height: 1.2em; - - cursor: pointer; - text-transform: uppercase; - text-align: center; - display: inline-block; - /* border: 1px solid rgba(255,255,255,.15); */ - border-radius: 3px; - padding: 1.1em 0; - - color: rgba(255,255,255,.5); - background: rgba(255,255,255,.15); - box-shadow: 0 1px 3px rgba(0,0,0,.1); - - margin: 3vh 1vw 0vh 1vw !important; - font-family: 'OpenSans' !important; -} -.popupAlertButton:hover, .popupAddLinkButton:hover, .popupSettingsButton:hover { - background: rgba(255,255,255,.05); - color: #fff -} -#popupAlertButtonOk, #popupAlertButtonYesdelete, #popupAlertButtonCancel, #popupAlertButtonYesdeleteproject { - display: inline-block; -} - - -#popupAddLink { - - width: 40vw; - /*background: rgb(102,202,138); - /*background: rgb(100,100,100);*/ - margin-top: 25vh; - padding: 5vh 0 6vh 0; - /*left: 20%; - position: absolute; */ - border-radius: 2px; - /*border: 2px solid #333;*/ - box-shadow: 0 5px 25px #000; - font-weight: 400; - font-size: 1vw; - display: inline-block; - text-align: center; - background: #243538; - /*background-image: -webkit-linear-gradient(right bottom, rgb(20,46,51) 0%, #475457 150%); - /*box-shadow: 0px 0px 2px 3px rgba(255,255,255,.1) inset; */ - -} - -#popupAddLinkMessage, #popupMosaicMessage { - font-weight: 100; - color: rgba(255,255,255,.75); - text-align: center; - display: inline-block; - font-size: 1em; - width: 30vw; - margin: 0vh 0vw 2vh 0vw !important; -} - -#popupAddLinkInput { - background: rgba(0,0,0,.05);/*gba(255,255,255,.15);*/ - box-shadow: 0 1px 3px rgba(0,0,0,.2) inset; - border: 0; - border-radius: 3px; - color: rgba(255,255,255,.85); - width: 30vw; - display: inline-block; - - font-weight: 200; - font-size: 0.9em; - cursor: pointer; - padding-bottom: 0; - - line-height: 1.2em; - padding: 1.0em 1vw; - - margin: 2vh 0 1.5vh 0; -} +.flex-col, .flex-row, .flex-center, .flex { display: flex; } -#popupMosaic { - background: #243538; - box-shadow: 0 1px 3px rgba(0,0,0,.2) inset; - border: 0; - border-radius: 3px; - color: rgba(255,255,255,.85); - width: 70vw; - display: inline-block; - - font-weight: 200; - font-size: 0.9em; - padding-bottom: 0; - - line-height: 1.2em; - padding: 1.0em 1vw; - - margin: 2vh 0 1.5vh -10vw; - overflow: scroll; - height: 90vh; -} - -.mosaic_category { - padding: 1.0em 1vw; - margin: 2vh 0 1.5vh 0; - border-radius: 3px; - background: rgba(0,0,0,.15); -} +.flex-col { flex-direction: column; } +.flex-row { flex-direction: row; } +.flex-center { justify-content: center; align-items: center; } +.flex-space-around { justify-content: space-around; } +.flex { flex: 1; } -.mosaic_category_grid { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(125px, 1fr)); - grid-auto-rows: 150px; -} - -.mosaic_filter { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(125px, 1fr)); -} - -.mosaic_filter_item { - padding: 1.0em 1vw; - margin: 2vh 0.5vw 1.5vh 0.5vw; - border-radius: 3px; - cursor:pointer; -} -.mosaic_filter_disabled { - opacity: 0.5; -} -.mosaic_filter_disabled>h2:after { - background-image: url('images/icn-menu-filter.png'); -} -.mosaic_filter_item>h2, .mosaic_category h2 { - text-transform: capitalize; -} - -.mosaic_filter_item:not(.mosaic_filter_disabled)>h2:after{ - background-image: url('images/icn-menu-preview.png'); -} -.mosaic_filter_item>h2:after{ - display:inline-block; - height:20px; - width:20px; - content: " "; - background-size: 20px 20px; - margin-left: 5px; - padding-top: 3px; - background-repeat: no-repeat; -} -.mosaic_filter_item_all>h2:after { - background-image: url('images/icn-reload.png') !important; -} - -.mosaic_item img { - /* To correctly align image, regardless of content height: */ - vertical-align: top; - display: inline-block; - /* To horizontally center images and caption */ - text-align: center; - /* The width of the container also implies margin around the images. */ +html, body { + width: 100%; + height: 100%; + margin: 0px; + color: white; + font-family: 'OpenSans'; + font-weight: 400; + font-size: 12px; + /*background-color: white; + background-color: #061619; */ + background: #142E33; + -webkit-touch-callout: none; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} + +#tab_selector { + background-color: var(--rk-light-blue); +} + +#tab_selector_form { + height: var(--tab_selector_height); +} + +#tab_selector_form label { + padding: 5px; + cursor: pointer; width: 100px; - margin: 2vh 0 1.5vh 0; - cursor:pointer; -} -.mosaic_item .caption { - display:block; -} - - - -#popupEdit { - margin-top: 15vh; - border-radius: 2px; - box-shadow: 0 5px 25px #000; - font-weight: 400; - font-size: 1vw; - display: inline-block; - text-align: left; - background: #243538; -} - -#popupLeft { - width: 18vw; - min-height: 50vh; - padding: 5vh 0 3vh 0; - vertical-align: top; - text-align: center; - background: rgba(0,0,0,.15); - border-radius: 2px 0 0 2px; -} -#popupRight { - width: 25vw; - min-height: 50vh; - padding: 5vh 3vw 4vh 3vw; - vertical-align: top; - background: rgba(0,0,0,.15); -} - - - -#popupEdit tr, #popupEdit td { - background: rgba(0,0,0,.15); -} - -.popupLeftItem { - width: 100%; - text-align: center; - display: inline-block; -} -.popupLeftButton { - font-weight: 400; - color: rgba(0,0,0,.35); - background: rgba(255,255,255,.15); - box-shadow: 0 1px 3px rgba(0,0,0,.1); - border-radius: 3px; - font-size: 1.0em; - line-height: 2.0em; - padding: 0 4%; - cursor: pointer; - text-transform: uppercase; - display: inline-block; - margin-top: 1vh; -} -.popupLeftButton:hover { - background: rgba(255,255,255,.35); -} - - - - -#popupImgBox { - margin-bottom: 3vh; - cursor: pointer; - height: 100%; -} -#popupImg { - max-width: 15vw; - max-height: 15vw; - background: rgba(255,255,255,.1); - display: inline-block; - border-radius: 3px; - box-shadow: 0 1px 3px rgba(0,0,0,.35); -} - - -#closePopupEdit { - width: 40px; - height: 40px; - font-weight: 200; - color: rgba(255,255,255,.25); - font-size: 30px; - text-align: center; - line-height: 40px; - cursor: pointer; - border-radius: 3px; - position: fixed; - top: 15vh; - right: 25.5vw; - z-index: 110; -} - -#closePopupMosaic { - width: 40px; - height: 40px; - font-weight: 200; - color: rgba(255,255,255,.25); - font-size: 30px; - text-align: center; - line-height: 40px; - cursor: pointer; - border-radius: 3px; - position: fixed; - top: 2vh; - right: 34vw; - z-index: 110; -} -#closePopupEdit:hover, #closePopupMosaic:hover { - color: rgba(255,255,255,.75); -} - -.popupRightItem { - width: 25vw; - display: inline-block; - margin-bottom: 1vh; - font-size: 1.2em; - line-height: 1.2em; - color: rgba(255,255,255,.75); -} -.popupInput { - background: rgba(0,0,0,.25); - box-shadow: 0 1px 3px rgba(0,0,0,.5) inset; - border: 0; - border-radius: 3px; - color: rgba(255,255,255,.85); - width: 25vw; - padding: 0 2%; - display: inline-block; - display: none; -} -#popupType { - font-size: 0.8em; - font-weight: 400; - color: #FFF; - display: inline-block; - margin: 3vh 0 0 0; -} - - -#popupNom { - font-weight: 400; - font-size: 1.2em; - color: #FFF; - cursor: pointer; - padding: 0; - line-height: 1.2em; - text-transform: uppercase; - margin-bottom: 1.5vh; -} -#popupNomInput { - font-weight: 200; - font-size: 1.2em; - cursor: pointer; - padding-bottom: 0; - line-height: 1.6em; -} - - -#popupTC { - font-size: 1em; - line-height: 1.8em; - box-shadow: 0 1px 3px rgba(0,0,0,.15); - padding: 0; - border-radius: 2px; - cursor: pointer; - text-align: center; - margin-bottom: 3vh; - font-weight: 600; -} -#popupTCin { - float: left; - color: #142E33; - margin-left: 3%; -} -#popupTCout { - float: right; - color: #142E33; - margin-right: 3%; -} -#popupTC:hover { - /*background: rgba(255,255,255,.25);*/ - background: rgba(255,255,255,.1); -} -.popupTClabel { - width: 4vw; - padding-right: 0.5vw; - text-align: right; - display: inline-block; - font-size: 0.8em; - text-transform: uppercase; -} -#popupTCedit { - font-size: 1.0em; - line-height: 1.2em; - margin-bottom: 5%; - font-weight: 200; - /*background: rgba(0,0,0,.05); */ - /*background: rgba(255,255,255,.05); */ - background: none; - border: 1px solid #000; - padding: 1vh 0; - color: rgba(255,255,255,.5); - display: none; -} -.popupTCeditfield { - background: rgba(0,0,0,.25);/*gba(255,255,255,.15);*/ - box-shadow: 0 1px 3px rgba(0,0,0,.5) inset; - border: 0; - border-radius: 3px; - color: rgba(255,255,255,.85); - width: 1.5vw; - padding: 0 2%; - display: inline-block; - font-size: 1.0em; - line-height: 1.8em; - text-align: center; -} -.nowTCbtn { - text-decoration: underline; - padding: 0 1%; - display: inline-block; - color: rgba(255,255,255,.75); - cursor: pointer; - font-size: 0.8em; - font-weight: 500; -} -.TCvalidBtn { - padding: 0 1%; - margin: 0 1%; - float: right; - line-height: 1.8em; - color: rgba(255,255,255,.75); - cursor: pointer; -} - -#popupLegende { - cursor: pointer; - font-weight: 200; - line-height: 1.2em; - font-size: 0.9em; - padding: 0; - margin: 0 0 2vh 0; - /*font-style: italic; */ -} - -#popupLegendeInput { - font-weight: 200; - min-height: 10vh; - cursor: pointer; - padding: 2%; - margin-bottom: 3%; - font-size: 1.0em; - line-height: 1.2em; -} - - -#popupAuthorInput, #popupLinkInput { - font-weight: 200; - height: 1.2em; - cursor: pointer; - padding: 2%; - margin-bottom: 3%; - font-size: 1.0em; - line-height: 1.2em; + text-align: center; + font-weight: bold; + font-size: 15px; + text-transform: capitalize; } - - +#tab_selector_form input { display: none; } -#popupLink { - cursor: pointer; - font-weight: 200; - line-height: 1.2em; - font-size: 0.9em; - padding: 0; - margin: 0 0 2vh 0; - color: rgba(255,255,255,.5); -} -#popupLink a:hover { - color: #fff; - text-decoration: underline; +#tab_selector_form input:checked + label { + background-color: rgba(255, 255, 255, .25); } -#popupAuthor { - cursor: pointer; - font-weight: 200; - line-height: 1.2em; - font-size: 0.9em; - padding: 0; - margin: 0 0 3vh 0; +#tabs { + overflow: auto; } - -#popupSetHighlight { - font-weight: 400; - color: rgba(0,0,0,.75);/*#142E33;*/ - font-size: 0.75em; - cursor: pointer; - text-transform: uppercase; - text-align: center; - margin: -3vh 2vh 2vh 2vh; - line-height: 2.0em; - /*background: rgba(255,255,255,.1); - /*background: rgba(0,0,0,.1); */ - padding: .8em 1.8em .8em 1.8em; - border-radius: 2px 0 0 0; -} -#popupSetHighlight.selected { - /*color: rgba(255,255,255,.75); - background: rgba(0,0,0,.15); */ - /* background: rgba(255,255,255,.15); */ - color: #FFF; -} -#popupSetHighlight:hover { - /*background: rgba(0,0,0,.25); - color: #FFF; */ - /*background: rgba(255,255,255,.2); */ - color: rgba(255,255,255,.25); /*#142E33; */ -} -#popupSetHighlight.selected:hover { - /*color: rgba(255,255,255,.75); - background: rgba(0,0,0,.15); */ - /*background: rgba(255,255,255,.25); */ - color: rgba(255,255,255,.75); /*#FFF; */ -} - - -#popupEditSupprimer { - font-weight: 400; - color: rgba(255,255,255,.75);/*#142E33;/*#FFF;/*rgba(255,255,255,.5); */ - font-size: 0.6em; - cursor: pointer; - text-transform: uppercase; - text-align: center; - display: inline-block; - bottom: 0; - margin: 2vh 0 1vh 0; - line-height: 1.2em; - /*background: #142E33;/*rgba(20,46,51,.8);/*rgba(0,0,0,.2); */ - /*background-image: -webkit-linear-gradient(top, rgba(255,255,255,.25) 0%, rgba(255,255,255,.10) 100%); */ - padding: 1.2em 2.4em 1.2em 2.4em; - padding: 1.2em 0; - width: 9vw; - border-radius: 3px; - border: 1px solid rgba(255,255,255,.15); - /*border-bottom: 1px solid #142E33; */ -} -#popupEditSupprimer:hover { - background: rgba(255,255,255,.05);/*rgba(20,46,51,.75);/*rgba(20,46,51,.75); */ - color: #fff -} - - - - - -@media screen and (max-width: 1000px) { - #popupEdit { - margin-top: 5vh; - font-size: 2.4vw; - } - #popupLeft { - width: 30vw; - min-height: 60vh; - padding: 5vh 0 3vh 0; - } - #popupRight { - width: 56vw; - min-height: 60vh; - padding: 5vh 3vw 4vh 3vw; - } - #popupImg { - max-width: 25vw; - max-height: 25vw; - } - #closePopupEdit { - top: 5vh; - right: 4vw; - z-index: 110; - } - .popupRightItem { - width: 56vw; - margin-bottom: 2vh; - font-size: 1em; - line-height: 1.2em; - } +#container { + width: 100%; + height: 100%; + vertical-align: top; + overflow: hidden; + display: flex; + flex-direction: row; } - - .empty, .empty#popupAuthor, .empty#popupLink { - /*font-style: italic; */ - color: rgba(255,255,255,.25); - text-decoration: none !important; - display: none; + /*font-style: italic; */ + color: rgba(255,255,255,.25); + text-decoration: none !important; + display: none; } - - .separationHDark { - height: 1px; - /*background: rgba(0,0,0,.25); - /*background: rgba(255,255,255,.1); */ - border-bottom: 1px solid rgba(0,0,0,.1); - margin: 1vh 0 0vh 0; - width: 100%; - display: none; -} - - - - - - - -#container { - width: 100%; - height: 100%; - vertical-align: top; - overflow: hidden; -} - -#left_menu { - width: 80px; - height: 100vh; - background: #559299; - display: inline-block; -} -#left_menu_top { - height: 50vh; - vertical-align: top; - text-align: center; - /*background: rgba(0,0,0,.1); */ -} -#left_menu_bottom { - height: 50vh; - vertical-align: bottom; - text-align: center; - /*background: rgba(0,0,0,.05); */ -} - -.left_menu_item { - color: rgba(255,255,255,.5); - font-size: 10px; - width: 70px; - margin: 0 5px; - height: 60px; - border-radius: 2px; - padding: 5px 0; - text-align: center; - cursor: pointer; - display: inline-block; -} -.left_menu_item:hover { - background: rgba(0,0,0,.1); -} -.left_menu_item.selected { - background: rgba(0,0,0,.15); -} -.left_menu_item:first-child { - margin-top: 10px; -} -.left_menu_item:last-child { - margin-bottom: 10px; -} - -.left_menu_item_icn { - width:40px; height:40px; - margin:0px 15px; -} -#left_menu_item_icn_presets { background:url("images/icn-menu-presets.png"); } -#left_menu_item_icn_horizontal { background:url("images/icn-menu-horizontal.png"); } -#left_menu_item_icn_vertical { background:url("images/icn-menu-vertical.png"); } -#left_menu_item_icn_groups { background:url("images/icn-menu-groups.png"); } -#left_menu_item_icn_colors { background:url("images/icn-menu-colors.png"); } -#left_menu_item_icn_filter { background:url("images/icn-menu-filter.png"); } -#left_menu_item_icn_highlight { background:url("images/icn-menu-highlight.png"); } -#left_menu_item_icn_search { background:url("images/icn-menu-search.png"); } -#left_menu_item_icn_keywords { background:url("images/icn-menu-keywords.png"); } -#left_menu_item_icn_mosaic { background:url("images/icn-menu-mosaic.png"); } - -#left_menu_item_icn_preview { background:url("images/icn-menu-preview.png"); } -#left_menu_item_icn_settings { background:url("images/icn-menu-settings.png"); } -#left_menu_item_icn_addfile { background:url("images/icn-menu-addfile.png"); } -#left_menu_item_icn_addnote { background:url("images/icn-menu-addnote.png"); } -#left_menu_item_icn_addlink { background:url("images/icn-menu-addlink.png"); } - -.left_menu_item_title { - height:20px; - line-height:20px; -} - -#left_menu .break { - width:40px; height:1px; - background:rgba(255,255,255,.2); - margin:5px 20px; -} - -#left_menu_item_btn_addfile { - width: 70px; - height: 70px; - margin: -5px 0 0 0; - background: red; - opacity: 0; - position: absolute; - display: block; - cursor: pointer !important; + height: 1px; + /*background: rgba(0,0,0,.25); + /*background: rgba(255,255,255,.1); */ + border-bottom: 1px solid rgba(0,0,0,.1); + margin: 1vh 0 0vh 0; + width: 100%; + display: none; } - #video { - display: inline-block; - vertical-align: top; -} - -#flattentimeline { - width: 200px; - height: 100%; - /*background-color: #061619; - background-color: #FFF;*/ - display: inline-block; - vertical-align: top; - color: white; - overflow-x: hidden; - overflow-y: scroll; - /*background: red; - background: #092126; - background: #0F1C1E; */ -} -#flattentimeline.drag { - /*background: rgba(2,212,255,.5);*/ - box-shadow: 0 0 20px 20px rgba(63,223,255,.45) inset; -} -.flattentimeline_item.draggable { - background: rgba(63,223,255,.25); -} - -#flattentimeline_highlight { - margin-bottom: 0px; -} - - -#flattentimeline_main_title { - font-weight: 200; - /*height: 40px;*/ - line-height: 20px; - padding: 10px 0; - text-align: center; - /*background: #2C3032;*/ - /*background: #2C3033;*/ - /*background: #57A5AF;*/ - background: #EC8960; - /*background-image: -webkit-linear-gradient(left, #EC8960 0%, #57A5AF 100%);*/ - /*background-image: -webkit-linear-gradient(left, #94CA6F 0%, #B495CC 100%);*/ - text-transform: uppercase; - color: rgba(255,255,255,1); - font-size: 18px; - border-bottom: 2px solid #1B1D1E; -} -#flattentimeline_settings { - font-weight: 200; - height: 240px; - line-height: 40px; - text-align: center; - background: #26292B; - text-transform: uppercase; - color: #FFF; - font-size: 18px; - margin-top: 4px; - display: none; -} -#flattentimeline_items { - width: 100%; - height: 100%; - overflow: hidden; - overflow-y: auto; - background-color: rgba(255,255,255,.05); -} -.flattentimeline_item { - position: relative; - height: 40px; - color: white; - margin: 0px 0px; - cursor: pointer; - width: 100%; - display: none; - /*border-radius: 2px;*/ -} - - -.flattentimeline_highlightitem { - position: relative; - /*height: 150px;*/ - height: auto; - color: white; - margin: 3px 0px 0px 0px; - cursor: pointer; - /*background: rgba(255,255,255,.15); */ - width: 100%; - text-align: center; - padding: 2px 0 3px 0; - border-radius: 1px; - - background-position: center center; - background-repeat: no-repeat; - -webkit-background-size:cover; - -moz-background-size: cover; - -o-background-size: cover; - background-size: cover; - - /*display:block;*/ -} - - -.flattentimeline_item:hover, .flattentimeline_highlightitem:hover { - background-color: rgba(255,255,255,.15); - opacity: 1; -} - -.flattentimeline_opacifiant, .flattentimeline_bar { - top: 0px; - left: 0px; - width: 100%; - height: 100%; - position: absolute; - background-position: center center; - background-repeat: no-repeat; - -webkit-background-size:cover; - -moz-background-size: cover; - -o-background-size: cover; - background-size: cover; - text-align: left; - overflow: hidden; - - /*border-radius: 3px; - /*mix-blend-mode: overlay;*/ -} -.flattentimeline_title, .flattentimeline_subtitle, .flattentimeline_counter { - top: 0px; - left: 0px; - /*position: absolute; */ - background-position: center center; - background-repeat: no-repeat; - text-align: left; - overflow: hidden; - line-height: 20px; -} - - -.flattentimeline_item .flattentimeline_image { - height: 30px; - width: 30px; - margin: 4px 7px 4px 0px; - border-radius: 1px; - background-color: rgba(255,255,255,.25); - float: left; - background-position: center center; - background-repeat: no-repeat; - -webkit-background-size:cover; - -moz-background-size: cover; - -o-background-size: cover; - background-size: cover; -} - - -.flattentimeline_highlightitem .flattentimeline_image { - height: 100%; - width: 100%; - margin: 0; - border-radius: 1px; - position: absolute; - background-position: center center; - background-repeat: no-repeat; - -webkit-background-size:cover; - -moz-background-size: cover; - -o-background-size: cover; - background-size: cover; - background-blend-mode: normal; - opacity: .5; + width: 80vw; + height: 100%; } -/*.flattentimeline_highlightitem .flattentimeline_image { - width: 170px; - height: 60px; - margin: 15px 15px 5px 15px; - border-radius: 2px; - background-color: #fff; - display: inline-block; - float: left; - background-position: center center; -} */ - -/*.flattentimeline_color { - top: 0px; - height: 100%; -}*/ -.flattentimeline_opacifiant, .flattentimeline_bar { - background-color: rgba(0, 0, 0, 0.75); - height: 3px; - top: 37px; - - /* box-shadow: 0px 0px 1px 1px rgba(20,46,51,.25); -/* mix-blend-mode: luminosity; */ - - /* mix-blend-mode: multiply; - /* height: 40px; - top: 0px; - opacity: .25; */ -} -.flattentimeline_highlightitem .flattentimeline_bar, .flattentimeline_highlightitem .flattentimeline_opacifiant { - top: auto; - display: block; +.vjs-big-play-button { + border-radius: 100% !important; + border: none !important; + color: #fff !important; + background: rgba(0,0,0,.5) !important; + height: 50px !important; + width: 50px !important; + line-height: 50px !important; + margin-left: -25px !important; + margin-top: -25px !important; } -.flattentimeline_title { - font-weight: 400; - font-size: 10px; - line-height: 39px; - /* color: rgba(255,255,255,.5); */ - - /*width: 55%; */ - max-width: 132px; - text-overflow: ellipsis; - white-space: nowrap; - overflow: hidden; - - display: inline-block; - /*color: #0C2D33; */ - /*mix-blend-mode: screen; */ -} - -.flattentimeline_highlightitem .flattentimeline_title { - line-height: 1.2em; - width: 170px; - font-size: 12px; - text-transform: uppercase; - padding: 20px 0 20px 0; - color: #FFF;/*rgba(255,255,255,1);*/ - font-weight: 600; -} - -.flattentimeline_highlightitem .flattentimeline_description { - font-weight: 400; - font-size: 11px; - line-height: 1.4em; - color: rgba(255,255,255,.9); - margin: -15px 15px 20px 15px; - - width: 170px; - text-align: left; - - display: inline-block; -} - -.flattentimeline_highlightitem .flattentimeline_typeTxt, .flattentimeline_highlightitem .flattentimeline_author { - font-weight: 400; - font-size: 9px; - line-height: 1.2em; - margin: -13px 15px 20px 15px; - - width: 170px; - text-align: left; - color: rgba(255,255,255,.75); - - display: inline-block; - font-style: italic; - /*text-transform: uppercase; */ -} -.flattentimeline_highlightitem .flattentimeline_author { - font-style: normal; +.vjs-marker { + border: none !important; + border-radius: 0 !important; + width: 2px !important; + margin: 0 !important; } -.flattentimeline_subtitle { - font-family: "OpenSans"; - font-weight: 200; - top: 25px; - font-size: 10px; - left: 40px; - line-height: 20px; - height: 20px; - display: none; +.vjs-tip { + margin-bottom: 40px !important; + font-weight: 500 !important; } -/*.flattentimeline_type { - top: 14px; - left: 6px; - width: 26px; - height: 26px; - background-position: center center; - background-repeat: no-repeat; - opacity: .5; -}*/ -/*.flattentimeline_type { - width:10px; height:10px; - border-radius:10px; - float:right; - margin:20px 15px 20px 0; -}*/ -.flattentimeline_type { - width: 20px; - height: 20px; - /*border-radius: 20px; */ - float: right; - background-position: center center; - background-repeat: no-repeat; - margin: 9px 5px; - opacity: 0.75; - display: none; -} - -.flattentimeline_highlightitem .flattentimeline_type { - width: 40px; - height: 40px; - position: absolute; - border-radius: 30px; - background-color: rgba(0,0,0,.5); - margin: 25px 0 0 80px; -} -.flattentimeline_color { - width: 6px; - height: 6px; - border-radius: 10px; - float: right; - margin: 22px 5px; -} -.flattentimeline_counter { - font-weight: 600; - top: 5px; - left: 5px; - width: 40px; - height: 40px; - line-height: 38px; - border-radius: 2px; - - background-color: #000; - - font-size: 18px; - text-align: center; - display: none; -} -.flattentimeline_bar { - /*width: 0%;*/ - background-color: #26292B; /*#2DCAE1;*/ - opacity: 1; -} - -.docLive { - opacity: 1; - display: block; -} - -.docTocome { - opacity: 0.1; - display: block; -} - -.docFaraway { - opacity: 0.1; - display: block; -} - - - - - - -.vjs-big-play-button { - border-radius: 100% !important; - border: none !important; - color: #fff !important; - background: rgba(0,0,0,.5) !important; - height: 50px !important; - width: 50px !important; - line-height: 50px !important; - margin-left: -25px !important; - margin-top: -25px !important; -} - -.vjs-marker { - border: none !important; - border-radius: 0 !important; - width: 2px !important; - margin: 0 !important; -} -.vjs-tip { - margin-bottom: 40px !important; - font-weight: 500 !important; -} -.vjs-mouse-display { - /*z-index: 1 !important; */ +.vjs-mouse-display { + /*z-index: 1 !important; */ } .editmode { - display:none !important; + display:none !important; width:0 !important; -} +} @media screen and (min-width: 1001px) { - #watermark { - display: none; + #watermark { + display: none; } /*#projectInfoBtn { - position: absolute; - display: none; - }*/ + position: absolute; + display: none; + }*/ } @media screen and (max-width: 1000px) { - #watermark { - width: 40px; - height: 40px; - position: absolute; - z-index: 100000; - bottom: 50px; - left: 20px; - opacity: .5; + #watermark { + width: 40px; + height: 40px; + position: absolute; + z-index: 100000; + bottom: 50px; + left: 20px; + opacity: .5; } - #watermark:hover { - opacity: 1; + + #watermark:hover { + opacity: 1; } - + /*#projectInfoBtn { - width: 30px; - height: 30px; - background: #FFF; - position: absolute; - z-index: 100000; - top: 20px; - left: 20px; - opacity: .25; - border-radius: 200px; - font-family: serif; - font-style: italic; - font-weight: bold; - color: #000; - font-size: 24px; - text-align: center; - line-height: 30px; - cursor: pointer; - } - #projectInfoBtn:hover { - opacity: .5; + width: 30px; + height: 30px; + background: #FFF; + position: absolute; + z-index: 100000; + top: 20px; + left: 20px; + opacity: .25; + border-radius: 200px; + font-family: serif; + font-style: italic; + font-weight: bold; + color: #000; + font-size: 24px; + text-align: center; + line-height: 30px; + cursor: pointer; + } + #projectInfoBtn:hover { + opacity: .5; }*/ } #projectInfoBtn { - width: 30px; - height: 30px; - background: #FFF; - position: absolute; - z-index: 100000; - top: 20px; - left: 20px; - opacity: .25; - border-radius: 200px; - font-family: serif; - font-style: italic; - font-weight: bold; - color: #000; - font-size: 24px; - text-align: center; - line-height: 30px; - cursor: pointer; -} -#projectInfoBtn:hover { - opacity: .5; + width: 30px; + height: 30px; + background: #FFF; + position: absolute; + z-index: 100000; + top: 20px; + left: 20px; + opacity: .25; + border-radius: 200px; + font-family: serif; + font-style: italic; + font-weight: bold; + color: #000; + font-size: 24px; + text-align: center; + line-height: 30px; + cursor: pointer; } -#openFullScreen { - width: 30px; - height: 30px; - min-width: 25px; - min-height: 25px; - position: absolute; - z-index: 100000; - bottom: 40px; - right: 220px; - opacity: .5; - display: none; +#projectInfoBtn:hover { + opacity: .5; } -#openFullScreen:hover { - opacity: 1; -} - - -.displayMode { - /* display: none; */ +#openFullScreen { + width: 30px; + height: 30px; + min-width: 25px; + min-height: 25px; + position: absolute; + z-index: 100000; + bottom: 40px; + right: 220px; + opacity: .5; + display: none; } - - -.video-js:not(.resized) { - width: 100vw; - height: 100vh; +#openFullScreen:hover { + opacity: 1; } - - - - - +.displayMode { + /* display: none; */ +} diff --git a/capsule-prototype/css/popup.css b/capsule-prototype/css/popup.css new file mode 100644 index 0000000000000000000000000000000000000000..8dc528e120ffd1579efbee467872d398e362e2aa --- /dev/null +++ b/capsule-prototype/css/popup.css @@ -0,0 +1,714 @@ + + +#popupSpace, #popupAlertSpace, #popupAddLinkSpace, #popupSettingsSpace { + width: 100%; + height: 100%; + background: rgba(0,0,0,.25); + position: absolute; + z-index: 10000000; + text-align: center; + display: none; + top: 0px; +} + +#popupAlertSpace { + z-index: 100000000; +} + +/*#popupSettings { +width: 40vw; +margin-top: 25vh; +padding: 5vh 0 6vh 0; +border-radius: 2px; +box-shadow: 0 5px 25px #000; +font-weight: 400; +font-size: 1vw; +display: inline-block; +text-align: center; +background: #243538; +} */ + +#popupSettings { + margin-top: 15vh; + border-radius: 2px; + box-shadow: 0 5px 25px #000; + font-weight: 400; + font-size: 1vw; + display: inline-block; + text-align: left; + background: #243538; +} + +#popupSettingsLeft { + width: 25vw; + min-height: 50vh; + padding: 6vh 3vw 6vh 3vw; + vertical-align: top; + background: rgba(0,0,0,.15); +} + +#popupSettingsRight { + width: 18vw; + min-height: 50vh; + padding: 6vh 0 6vh 0; + vertical-align: top; + text-align: center; + border-radius: 2px 0 0 2px; + + background: var(--rk-light-blue); + background: -o-linear-gradient(left bottom, rgba(20,46,51,1) 0%, var(--rk-light-blue) 100%); + background: -moz-linear-gradient(left bottom, rgba(20,46,51,1) 0%, var(--rk-light-blue) 100%); + background: -webkit-linear-gradient(left bottom, rgba(20,46,51,1) 0%, var(--rk-light-blue) 100%); +} + +.popupSettingsBtn { + font-weight: 400; + color: rgba(255,255,255,.75); + font-size: 0.6em; + cursor: pointer; + text-transform: uppercase; + text-align: center; + display: inline-block; + bottom: 0; + margin: 1vh 0 1vh 0; + line-height: 1.2em; + padding: 1.2em 2.4em 1.2em 2.4em; + padding: 1.2em 0; + width: 9vw; + border-radius: 3px; + border: 1px solid rgba(255,255,255,.15); + +} + +.popupSettingsBtn:hover { + background: rgba(255,255,255,.05);/*rgba(20,46,51,.75);/*rgba(20,46,51,.75); */ + color: #fff; +} + +.popupSettingsA { + font-weight: 400; + color: rgba(255,255,255,.5); + font-size: .8em; + cursor: pointer; + text-align: center; + display: inline-block; + text-decoration: underline; + bottom: 0; + margin: 1vh 0; + line-height: 1.2em; + padding: 1.2em 0; + width: 9vw; +} + +.popupSettingsA:hover { + color: rgba(255,255,255,.75); +} + +.popupSettingsTxt { + font-weight: 200; + width: 25vw; + display: inline-block; + margin-bottom: 1vh; + font-size: .9em; + line-height: 1.2em; + color: rgba(255,255,255,.75); + padding: .5vh 0 .5vh 0; + cursor: pointer; +} + +.popupSettingsLabel { + color: rgba(255,255,255,.25); + font-size: .9em; +} + +.popupSettingsInput { + width: 23vw; + display: inline-block; + margin-bottom: 1vh; + font-size: .9em; + line-height: 1.2em; + + font-weight: 200; + + background: rgba(0,0,0,.05); + box-shadow: 0 1px 3px rgba(0,0,0,.2) inset; + border: 0; + border-radius: 3px; + color: rgba(255,255,255,.85); + padding: .5vh .5vw; + display: none; +} + +#popupSettingsTitle { + text-transform: uppercase; + font-size: 1.2em; + padding: 0 0 1vh 0; +} + +#popupSettingsTitleInput { + font-size: 1.2em; +} + +#popupSettingsCredits, #popupSettingsCreationDate { +} + +#popupAlert { + width: 46vw; + background: #142E33;/*rgb(50,50,50); */ + /*margin: 20vh 0 0 0; */ + padding: 5vh 2vw; + border-radius: 3px; + box-shadow: 0 5px 25px #000; + font-weight: 400; + font-size: 1vw; + display: inline-block; + text-align: center; + color: rgba(255,255,255,.75); +} + +#popupAlertMessage { + font-size: .9em; + font-weight: 200; +} + +#popupAlertInput, #popupAlertTextarea { + background: rgba(0,0,0,.05);/*gba(255,255,255,.15);*/ + box-shadow: 0 1px 3px rgba(0,0,0,.2) inset; + border: 0; + border-radius: 3px; + color: rgba(255,255,255,.85); + width: 30vw; + + display: inline-block; + + font-weight: 200; + font-size: 0.9em; + cursor: pointer; + padding-bottom: 0; + + line-height: 1.4em; + padding: 2vh 1vw; + + margin: 3vh 0 1.5vh 0; +} + +#popupAlertButtons, #popupAddLinkButtons { + width: 100%; + text-align: center; +} + +.popupAlertButton, .popupAddLinkButton, .popupSettingsButton { + width: 9vw; + + font-weight: 400; + /* color: rgba(255,255,255,.75); */ + font-size: 0.7em; + line-height: 1.2em; + + cursor: pointer; + text-transform: uppercase; + text-align: center; + display: inline-block; + /* border: 1px solid rgba(255,255,255,.15); */ + border-radius: 3px; + padding: 1.1em 0; + + color: rgba(255,255,255,.5); + background: rgba(255,255,255,.15); + box-shadow: 0 1px 3px rgba(0,0,0,.1); + + margin: 3vh 1vw 0vh 1vw !important; + font-family: 'OpenSans' !important; +} + +.popupAlertButton:hover, .popupAddLinkButton:hover, .popupSettingsButton:hover { + background: rgba(255,255,255,.05); + color: #fff +} + +#popupAlertButtonOk, #popupAlertButtonYesdelete, #popupAlertButtonCancel, #popupAlertButtonYesdeleteproject { + display: inline-block; +} + +#popupAddLink { + + width: 40vw; + /*background: rgb(102,202,138); + /*background: rgb(100,100,100);*/ + margin-top: 25vh; + padding: 5vh 0 6vh 0; + /*left: 20%; + position: absolute; */ +border-radius: 2px; +/*border: 2px solid #333;*/ +box-shadow: 0 5px 25px #000; +font-weight: 400; +font-size: 1vw; +display: inline-block; +text-align: center; +background: #243538; +/*background-image: -webkit-linear-gradient(right bottom, rgb(20,46,51) 0%, #475457 150%); +/*box-shadow: 0px 0px 2px 3px rgba(255,255,255,.1) inset; */ + +} + +#popupAddLinkMessage, #popupMosaicMessage { + font-weight: 100; + color: rgba(255,255,255,.75); + text-align: center; + display: inline-block; + font-size: 1em; + width: 30vw; + margin: 0vh 0vw 2vh 0vw !important; +} + +#popupAddLinkInput { + background: rgba(0,0,0,.05);/*gba(255,255,255,.15);*/ + box-shadow: 0 1px 3px rgba(0,0,0,.2) inset; + border: 0; + border-radius: 3px; + color: rgba(255,255,255,.85); + width: 30vw; + display: inline-block; + + font-weight: 200; + font-size: 0.9em; + cursor: pointer; + padding-bottom: 0; + + line-height: 1.2em; + padding: 1.0em 1vw; + + margin: 2vh 0 1.5vh 0; +} + + +#popupEdit { + margin-top: 15vh; + border-radius: 2px; + box-shadow: 0 5px 25px #000; + font-weight: 400; + font-size: 1vw; + display: inline-block; + text-align: left; + background: #243538; +} + +#popupLeft { + width: 18vw; + min-height: 50vh; + padding: 5vh 0 3vh 0; + vertical-align: top; + text-align: center; + background: rgba(0,0,0,.15); + border-radius: 2px 0 0 2px; +} + +#popupRight { + width: 25vw; + min-height: 50vh; + padding: 5vh 3vw 4vh 3vw; + vertical-align: top; + background: rgba(0,0,0,.15); +} + +#popupEdit tr, #popupEdit td { + background: rgba(0,0,0,.15); +} + +.popupLeftItem { + width: 100%; + text-align: center; + display: inline-block; +} + +.popupLeftButton { + font-weight: 400; + color: rgba(0,0,0,.35); + background: rgba(255,255,255,.15); + box-shadow: 0 1px 3px rgba(0,0,0,.1); + border-radius: 3px; + font-size: 1.0em; + line-height: 2.0em; + padding: 0 4%; + cursor: pointer; + text-transform: uppercase; + display: inline-block; + margin-top: 1vh; +} + +.popupLeftButton:hover { + background: rgba(255,255,255,.35); +} + +#popupImgBox { + margin-bottom: 3vh; + cursor: pointer; + height: 100%; +} + +#popupImg { + max-width: 15vw; + max-height: 15vw; + background: rgba(255,255,255,.1); + display: inline-block; + border-radius: 3px; + box-shadow: 0 1px 3px rgba(0,0,0,.35); +} + +#closePopupEdit { + width: 40px; + height: 40px; + font-weight: 200; + color: rgba(255,255,255,.25); + font-size: 30px; + text-align: center; + line-height: 40px; + cursor: pointer; + border-radius: 3px; + position: fixed; + top: 15vh; + right: 25.5vw; + z-index: 110; +} + +#closePopupMosaic { + width: 40px; + height: 40px; + font-weight: 200; + color: rgba(255,255,255,.25); + font-size: 30px; + text-align: center; + line-height: 40px; + cursor: pointer; + border-radius: 3px; + position: fixed; + top: 2vh; + right: 34vw; + z-index: 110; +} + +#closePopupEdit:hover, #closePopupMosaic:hover { + color: rgba(255,255,255,.75); +} + +.popupRightItem { + width: 25vw; + display: inline-block; + margin-bottom: 1vh; + font-size: 1.2em; + line-height: 1.2em; + color: rgba(255,255,255,.75); +} + +.popupInput { + background: rgba(0,0,0,.25); + box-shadow: 0 1px 3px rgba(0,0,0,.5) inset; + border: 0; + border-radius: 3px; + color: rgba(255,255,255,.85); + width: 25vw; + padding: 0 2%; + display: inline-block; + display: none; +} + +#popupType { + font-size: 0.8em; + font-weight: 400; + color: #FFF; + display: inline-block; + margin: 3vh 0 0 0; +} + +#popupNom { + font-weight: 400; + font-size: 1.2em; + color: #FFF; + cursor: pointer; + padding: 0; + line-height: 1.2em; + text-transform: uppercase; + margin-bottom: 1.5vh; +} + +#popupNomInput { + font-weight: 200; + font-size: 1.2em; + cursor: pointer; + padding-bottom: 0; + line-height: 1.6em; +} + +#popupTC { + font-size: 1em; + line-height: 1.8em; + box-shadow: 0 1px 3px rgba(0,0,0,.15); + padding: 0; + border-radius: 2px; + cursor: pointer; + text-align: center; + margin-bottom: 3vh; + font-weight: 600; +} + +#popupTCin { + float: left; + color: #142E33; + margin-left: 3%; +} + +#popupTCout { + float: right; + color: #142E33; + margin-right: 3%; +} + +#popupTC:hover { + /*background: rgba(255,255,255,.25);*/ + background: rgba(255,255,255,.1); +} + +.popupTClabel { + width: 4vw; + padding-right: 0.5vw; + text-align: right; + display: inline-block; + font-size: 0.8em; + text-transform: uppercase; +} + +#popupTCedit { + font-size: 1.0em; + line-height: 1.2em; + margin-bottom: 5%; + font-weight: 200; + /*background: rgba(0,0,0,.05); */ + /*background: rgba(255,255,255,.05); */ + background: none; + border: 1px solid #000; + padding: 1vh 0; + color: rgba(255,255,255,.5); + display: none; +} + +.popupTCeditfield { + background: rgba(0,0,0,.25);/*gba(255,255,255,.15);*/ + box-shadow: 0 1px 3px rgba(0,0,0,.5) inset; + border: 0; + border-radius: 3px; + color: rgba(255,255,255,.85); + width: 1.5vw; + padding: 0 2%; + display: inline-block; + font-size: 1.0em; + line-height: 1.8em; + text-align: center; +} + +.nowTCbtn { + text-decoration: underline; + padding: 0 1%; + display: inline-block; + color: rgba(255,255,255,.75); + cursor: pointer; + font-size: 0.8em; + font-weight: 500; +} + +.TCvalidBtn { + padding: 0 1%; + margin: 0 1%; + float: right; + line-height: 1.8em; + color: rgba(255,255,255,.75); + cursor: pointer; +} + +#popupLegende { + cursor: pointer; + font-weight: 200; + line-height: 1.2em; + font-size: 0.9em; + padding: 0; + margin: 0 0 2vh 0; + /*font-style: italic; */ +} + +#popupLegendeInput { + font-weight: 200; + min-height: 10vh; + cursor: pointer; + padding: 2%; + margin-bottom: 3%; + font-size: 1.0em; + line-height: 1.2em; +} + + +#popupAuthorInput, #popupLinkInput { + font-weight: 200; + height: 1.2em; + cursor: pointer; + padding: 2%; + margin-bottom: 3%; + font-size: 1.0em; + line-height: 1.2em; +} + + + + +#popupLink { + cursor: pointer; + font-weight: 200; + line-height: 1.2em; + font-size: 0.9em; + padding: 0; + margin: 0 0 2vh 0; + color: rgba(255,255,255,.5); +} + +#popupLink a:hover { + color: #fff; + text-decoration: underline; +} + +#popupAuthor { + cursor: pointer; + font-weight: 200; + line-height: 1.2em; + font-size: 0.9em; + padding: 0; + margin: 0 0 3vh 0; +} + + +#popupSetHighlight { + font-weight: 400; + color: rgba(0,0,0,.75);/*#142E33;*/ + font-size: 0.75em; + cursor: pointer; + text-transform: uppercase; + text-align: center; + margin: -3vh 2vh 2vh 2vh; + line-height: 2.0em; + /*background: rgba(255,255,255,.1); + /*background: rgba(0,0,0,.1); */ + padding: .8em 1.8em .8em 1.8em; + border-radius: 2px 0 0 0; +} + +#popupSetHighlight.selected { + /*color: rgba(255,255,255,.75); + background: rgba(0,0,0,.15); */ +/* background: rgba(255,255,255,.15); */ +color: #FFF; +} + +#popupSetHighlight:hover { + /*background: rgba(0,0,0,.25); + color: #FFF; */ +/*background: rgba(255,255,255,.2); */ +color: rgba(255,255,255,.25); /*#142E33; */ +} + +#popupSetHighlight.selected:hover { + /*color: rgba(255,255,255,.75); + background: rgba(0,0,0,.15); */ +/*background: rgba(255,255,255,.25); */ +color: rgba(255,255,255,.75); /*#FFF; */ +} + + +#popupEditSupprimer { + font-weight: 400; + color: rgba(255,255,255,.75);/*#142E33;/*#FFF;/*rgba(255,255,255,.5); */ + font-size: 0.6em; + cursor: pointer; + text-transform: uppercase; + text-align: center; + display: inline-block; + bottom: 0; + margin: 2vh 0 1vh 0; + line-height: 1.2em; + /*background: #142E33;/*rgba(20,46,51,.8);/*rgba(0,0,0,.2); */ + /*background-image: -webkit-linear-gradient(top, rgba(255,255,255,.25) 0%, rgba(255,255,255,.10) 100%); */ + padding: 1.2em 2.4em 1.2em 2.4em; + padding: 1.2em 0; + width: 9vw; + border-radius: 3px; + border: 1px solid rgba(255,255,255,.15); + /*border-bottom: 1px solid #142E33; */ +} + +#popupEditSupprimer:hover { + background: rgba(255,255,255,.05);/*rgba(20,46,51,.75);/*rgba(20,46,51,.75); */ + color: #fff +} + +@media screen and (max-width: 1000px) { + #popupEdit { + margin-top: 5vh; + font-size: 2.4vw; + } + #popupLeft { + width: 30vw; + min-height: 60vh; + padding: 5vh 0 3vh 0; + } + #popupRight { + width: 56vw; + min-height: 60vh; + padding: 5vh 3vw 4vh 3vw; + } + #popupImg { + max-width: 25vw; + max-height: 25vw; + } + #closePopupEdit { + top: 5vh; + right: 4vw; + z-index: 110; + } + .popupRightItem { + width: 56vw; + margin-bottom: 2vh; + font-size: 1em; + line-height: 1.2em; + } +} + + +@media screen and (max-width: 1000px) { + #popupEdit { + margin-top: 5vh; + font-size: 2.4vw; + } + #popupLeft { + width: 30vw; + min-height: 60vh; + padding: 5vh 0 3vh 0; + } + #popupRight { + width: 56vw; + min-height: 60vh; + padding: 5vh 3vw 4vh 3vw; + } + #popupImg { + max-width: 25vw; + max-height: 25vw; + } + #closePopupEdit { + top: 5vh; + right: 4vw; + z-index: 110; + } + .popupRightItem { + width: 56vw; + margin-bottom: 2vh; + font-size: 1em; + line-height: 1.2em; + } +} + diff --git a/capsule-prototype/index.html b/capsule-prototype/index.html index cf06a103a947121e72f8400440510a3fb8f6f9ba..acdd48571737bcbdc4247225a7af438bb9a73928 100644 --- a/capsule-prototype/index.html +++ b/capsule-prototype/index.html @@ -4,7 +4,7 @@ <meta http-equiv="Content-type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Language" content="fr"> <meta name="language" content="fr"> - <meta name="designer" content="buzzing light"> + <meta name="designer" content="buzzing light"> <meta name="copyright" content="buzzing light"> <meta name="HandheldFriendly" content="true" /> <meta name="viewport" content="width=device-width, user-scalable=no"><!--, minimum-scale=1.0, maximum-scale=1.0--> @@ -17,17 +17,15 @@ <link href="../shared/css/all.min.css" rel="stylesheet" /> <title>MemoRekall</title> - - <script language="javascript" type='text/javascript' src='../shared/js/libs/jquery.min.js'></script> - <script language="javascript" type='text/javascript' src='../shared/js/libs/jquery-migrate.js'></script> + + <script language="javascript" type='text/javascript' src='../shared/js/libs/jquery.min.js'></script> + <script language="javascript" type='text/javascript' src='../shared/js/libs/jquery-migrate.js'></script> <script language="javascript" type='text/javascript' src='../shared/js/libs/url.min.js'></script> <script language="javascript" type='text/javascript' src='../shared/js/libs/tinycolor.js'></script> <script language="javascript" type='text/javascript' src='../shared/js/libs/sha1.js'></script> <script language="javascript" type='text/javascript' src='../shared/js/libs/fastdom.js'></script> <script language="javascript" type='text/javascript' src='../shared/js/libs/moment-with-langs.min.js'></script> - <script type="module" src="../shared/php/rekallApp.js.php"></script> - <script language="javascript" type='text/javascript' src='../shared/js/rekall/Utils.js'></script> <script language="javascript" type='text/javascript' src='../shared/js/online-rekall/Rekall.js'></script> <script language="javascript" type='text/javascript' src='../shared/js/rekall/Source.js'></script> @@ -40,6 +38,7 @@ <script language="javascript" type='text/javascript' src='../shared/js/iannix.js'></script> <script language="javascript" type='text/javascript' src='../shared/js/online-script.js'></script> + <script type="module" src="../shared/php/rekallApp.js.php"></script> <script language="javascript" type='text/javascript' src="../shared/js/libs/video-js/video.min.js"></script> <link rel="stylesheet" type="text/css" href="../shared/js/libs/video-js/video-js.min.css" /> @@ -72,191 +71,188 @@ window.PubSub = PubSub; } </script> - + <link rel="stylesheet" type="text/css" href="../shared/css/online-theme.css" /> </head> -<body> - - - <div id='container'> - <div id="ruban"></div> - <!-- <div id="popupFormSpace"> - <div id="popupForm"> - <div id="popupFormMessage"></div> - <div class="popupFormButton" id="popupFormButtonCancel">Cancel</div> - <input class="popupFormButton" id="popupFormButtonUpload" type="submit" value="Upload" name="submit"> - </div> - </div> --> - <a class="displayMode" id="watermarkBox" href="javascript:window.app.rekall.Rekall('openUrl', window.app.urls.memberHome)" title="Open in MemoRekall" target="_parent"><img id="watermark" src="../shared/css/images/watermark.png" /></a> - <!--<a class="displayMode" id="openFullScreenBox" href="http://www.memorekall.fr" alt="Open in MemoRekall" target="_blank"><img id="openFullScreen" src="../shared/css/images/expand.png" /></a>--> - <div class="displayMode" id="projectInfoBtn" title="Project informations">i</div> - <div id="popupAlertSpace"> - <div id="popupAlert"> - <div id="popupAlertMessage"></div> - <input type="text" id="popupAlertInput" /> - <textarea rows="5" id="popupAlertTextarea"></textarea> - <div id="popupAlertButtons"> - <div class="popupAlertButton" id="popupAlertButtonOk">OK</div> - <div class="popupAlertButton" id="popupAlertButtonCancel">Cancel</div> - <div class="popupAlertButton" id="popupAlertButtonYesdelete">Delete</div> - <div class="popupAlertButton" id="popupAlertButtonYesdeleteproject">Delete</div> - </div> +<body> + + +<div id='container'> + <div id="ruban"></div> + <!-- <div id="popupFormSpace"> + <div id="popupForm"> + <div id="popupFormMessage"></div> + <div class="popupFormButton" id="popupFormButtonCancel">Cancel</div> + <input class="popupFormButton" id="popupFormButtonUpload" type="submit" value="Upload" name="submit"> + </div> + </div> --> + <a class="displayMode" id="watermarkBox" href="javascript:window.app.rekall.Rekall('openUrl', window.app.urls.memberHome)" title="Open in MemoRekall" target="_parent"><img id="watermark" src="../shared/css/images/watermark.png" /></a> + <!--<a class="displayMode" id="openFullScreenBox" href="http://www.memorekall.fr" alt="Open in MemoRekall" target="_blank"><img id="openFullScreen" src="../shared/css/images/expand.png" /></a>--> + <div class="displayMode" id="projectInfoBtn" title="Project informations">i</div> + <div id="popupAlertSpace"> + <div id="popupAlert"> + <div id="popupAlertMessage"></div> + <input type="text" id="popupAlertInput" /> + <textarea rows="5" id="popupAlertTextarea"></textarea> + <div id="popupAlertButtons"> + <div class="popupAlertButton" id="popupAlertButtonOk">OK</div> + <div class="popupAlertButton" id="popupAlertButtonCancel">Cancel</div> + <div class="popupAlertButton" id="popupAlertButtonYesdelete">Delete</div> + <div class="popupAlertButton" id="popupAlertButtonYesdeleteproject">Delete</div> </div> </div> - <div id="popupAddLinkSpace"> - <div id="popupAddLink"> - <div id="popupAddLinkMessage">Add a link</div> - <input id="popupAddLinkInput" type="text" value="" placeHolder="Paste URL here"/> - <div id="popupAddLinkButtons"> - <div class="popupAddLinkButton" id="popupAddLinkButtonCancel">Cancel</div> - <div class="popupAddLinkButton" id="popupAddLinkButtonOk">Add Link</div> - </div> + </div> + <div id="popupAddLinkSpace"> + <div id="popupAddLink"> + <div id="popupAddLinkMessage">Add a link</div> + <input id="popupAddLinkInput" type="text" value="" placeHolder="Paste URL here"/> + <div id="popupAddLinkButtons"> + <div class="popupAddLinkButton" id="popupAddLinkButtonCancel">Cancel</div> + <div class="popupAddLinkButton" id="popupAddLinkButtonOk">Add Link</div> </div> - </div> - <div id="popupMosaicSpace"> - <div id="popupMosaic"> - <div id="popupMosaicMessage">Notes and documents</div> - <div id="closePopupMosaic">✕</div> - <div id="popupMosaicMosaic"></div> - </div> - </div> - <div id="popupSettingsSpace"> - <table id="popupSettings"> - <tr> - <td id="popupSettingsLeft"> - <div class="popupSettingsTxt" id="popupSettingsTitleDiv" title="Project title"><span class="popupSettingsLabel" id="popupSettingsTitleLabel">Project</span> <span id="popupSettingsTitle"></span></div> - <input class="popupSettingsInput" id="popupSettingsTitleInput" type="text"></input> - - <div class="popupSettingsTxt" id="popupSettingsAuthorDiv" title="Project author"><span class="popupSettingsLabel" id="popupSettingsAuthorLabel">By</span> <span id="popupSettingsAuthor"></span></div> - <input class="popupSettingsInput" id="popupSettingsAuthorInput" type="text"></input> - - <div class="popupSettingsTxt" id="popupSettingsEmailDiv" title="Project author email"><span class="popupSettingsLabel" id="popupSettingsEmailLabel">@</span> <span id="popupSettingsEmail"></span></div> - <input class="popupSettingsInput" id="popupSettingsEmailInput" type="text"></input> - - <div class="popupSettingsTxt" id="popupSettingsCreditsDiv" title="Project credits"><span class="popupSettingsLabel" id="popupSettingsCreditsLabel">Credits</span><br/><span id="popupSettingsCredits"></span></div> - <textarea rows="3" class="popupSettingsInput" id="popupSettingsCreditsInput" type="text"></textarea> - </td> - <td id="popupSettingsRight"> - <div class="popupSettingsBtn" id="popupSettingsBtnShare">Share</div> - <div class="popupSettingsBtn" id="popupSettingsBtnEmbed">Embed</div> - <div class="popupSettingsBtn editmode" id="popupSettingsBtnDownloadXml">Download XML</div> - <a class="popupSettingsA" href="http://www.memorekall.com" target="_blank">www.memorekall.com</a> - - <!-- <input id="popupSettingsShare" type="text" value="http://projects.rekall.com/monprojet" placeHolder=""/> - <textarea id="popupSettingsEmbed" type="text"></textarea> - <div id="popupSettingsDownloadXml">Download project XML</div> --> - </td> - </tr> - </table> </div> - <div id="popupSpace"> - <table id="popupEdit"> - <tr> - <td id="popupLeft"> - <div class="editmode" id="popupSetHighlight">★ Highlight</div> - <div class="popupLeftItem" id="popupImgBox"> - <img id="popupImg" src="file/rekall_cache/568261E53001FA741A069C684C6E25E7571006E8-45972424CDE1275C6FDD9DD7D52216C878F04AB8.jpg"/> - <div class="popupLeftItem" id="popupType"></div> - </div> - <!--<div class="popupRightItem separationHDark editmode"></div>--> - <div class="editmode" id="popupEditSupprimer">Delete file</div> - </td> - <td id="popupRight"> - <div id="closePopupEdit">✕</div> - - <div class="popupRightItem" id="popupNom"></div> - <input class="popupInput" id="popupNomInput" type="text" value=""/> - - <div class="popupRightItem" id="popupAuthor" title="Author"></div> - <input class="popupInput" id="popupAuthorInput" type="text"></input> - - <div class="popupRightItem" id="popupTC"> - <div class="popupTCdisplay" id="popupTCin"></div> - <div class="popupTCdisplay" id="popupTCout"></div> - </div> - <div class="popupInput" id="popupTCedit"> - <span class="popupTClabel">start</span> - <input class="popupTCeditfield" id="popupTCinMin" maxlength="2" type="text" value=""/> : <input class="popupTCeditfield" id="popupTCinSec" maxlength="2" type="text" value=""/> - <div class="nowTCbtn" id="nowTCin">now</div> - <br/> - <span class="popupTClabel">end</span> - <input class="popupTCeditfield" id="popupTCoutMin" maxlength="2" type="text" value=""/> : <input class="popupTCeditfield" id="popupTCoutSec" maxlength="2" type="text" value=""/> - <div class="nowTCbtn" id="nowTCout">now</div> / <div class="nowTCbtn" id="eovTCout">end of video</div> - <!--<div class="TCvalidBtn" id="TCvalidModif">✓</div> - <div class="TCvalidBtn" id="TCinvalidModif">✗</div> --> - </div> + </div> + <div id="popupSettingsSpace"> + <table id="popupSettings"> + <tr> + <td id="popupSettingsLeft"> + <div class="popupSettingsTxt" id="popupSettingsTitleDiv" title="Project title"><span class="popupSettingsLabel" id="popupSettingsTitleLabel">Project</span> <span id="popupSettingsTitle"></span></div> + <input class="popupSettingsInput" id="popupSettingsTitleInput" type="text"></input> + + <div class="popupSettingsTxt" id="popupSettingsAuthorDiv" title="Project author"><span class="popupSettingsLabel" id="popupSettingsAuthorLabel">By</span> <span id="popupSettingsAuthor"></span></div> + <input class="popupSettingsInput" id="popupSettingsAuthorInput" type="text"></input> - <div class="popupRightItem" id="popupLegende" title="Comment"></div> - <textarea class="popupInput" id="popupLegendeInput" type="text"></textarea> - - <div class="popupRightItem" id="popupLink" title="Link"></div> - <textarea class="popupInput" id="popupLinkInput" type="text"></textarea> - - <!-- <div class="popupRightItem separationHDark editmode"></div> --> - </td> - </tr> - </table> - </div> - <table id='left_menu' class="editmode"> - <tr><td id="left_menu_top"> - <div class="left_menu_item dropable"> - <a href="javascript:window.app.rekall.Rekall('openUrl', window.app.urls.memberHome)" > - <div><i class="fas fa-home fa-3x left_menu_item_icn"></i></div> - Go back to my capsules - </a> - </div> - <div class="left_menu_item dropable" id="left_menu_item_settings" title="Settings"> - <div class="left_menu_item_icn" id="left_menu_item_icn_settings"></div> - <div class="left_menu_item_title">Settings</div> - <div class="left_menu_item_value"></div> - </div> - <div class="left_menu_item dropable" id="left_menu_item_preview" title="Preview"> - <div class="left_menu_item_icn" id="left_menu_item_icn_preview"></div> - <div class="left_menu_item_title">Preview</div> - <div class="left_menu_item_value"></div> - </div> - </tr></td> - <tr><td id="left_menu_bottom"> - - <div class="left_menu_item dropable" id="left_menu_item_addlink" title="AddLink"> - <div class="left_menu_item_icn" id="left_menu_item_icn_addlink"></div> - <div class="left_menu_item_title">Add Link</div> - <div class="left_menu_item_value"></div> - </div> - - <div class="left_menu_item dropable" id="left_menu_item_addnote" title="AddNote"> - <div class="left_menu_item_icn" id="left_menu_item_icn_addnote"></div> - <div class="left_menu_item_title">Add Note</div> - <div class="left_menu_item_value"></div> - </div> - - <div class="left_menu_item dropable" id="left_menu_item_addfile" title="AddFile"> - <form id="uploadForm" action="php/upload.php" method="post" enctype="multipart/form-data"> - <input type="file" name="fileToUpload[]" multiple="multiple" id="left_menu_item_btn_addfile"> - </form> - <div class="left_menu_item_icn" id="left_menu_item_icn_addfile"></div> - <div class="left_menu_item_title">Add File</div> - <div class="left_menu_item_value"></div> + <div class="popupSettingsTxt" id="popupSettingsEmailDiv" title="Project author email"><span class="popupSettingsLabel" id="popupSettingsEmailLabel">@</span> <span id="popupSettingsEmail"></span></div> + <input class="popupSettingsInput" id="popupSettingsEmailInput" type="text"></input> + + <div class="popupSettingsTxt" id="popupSettingsCreditsDiv" title="Project credits"><span class="popupSettingsLabel" id="popupSettingsCreditsLabel">Credits</span><br/><span id="popupSettingsCredits"></span></div> + <textarea rows="3" class="popupSettingsInput" id="popupSettingsCreditsInput" type="text"></textarea> + </td> + <td id="popupSettingsRight"> + <div class="popupSettingsBtn" id="popupSettingsBtnShare">Share</div> + <div class="popupSettingsBtn" id="popupSettingsBtnEmbed">Embed</div> + <div class="popupSettingsBtn editmode" id="popupSettingsBtnDownloadXml">Download XML</div> + <div class="popupSettingsBtn editmode" id="popupSettingsBtnDelete">Delete project</div> + <a class="popupSettingsA" href="http://www.memorekall.com" target="_blank">www.memorekall.com</a> + + <!-- <input id="popupSettingsShare" type="text" value="http://projects.rekall.com/monprojet" placeHolder=""/> + <textarea id="popupSettingsEmbed" type="text"></textarea> + <div id="popupSettingsDownloadXml">Download project XML</div> --> + </td> + </tr> + </table> + </div> + <div id="popupSpace"> + <table id="popupEdit"> + <tr> + <td id="popupLeft"> + <div class="editmode" id="popupSetHighlight">★ Highlight</div> + <div class="popupLeftItem" id="popupImgBox"> + <img id="popupImg" src="file/rekall_cache/568261E53001FA741A069C684C6E25E7571006E8-45972424CDE1275C6FDD9DD7D52216C878F04AB8.jpg"/> + <div class="popupLeftItem" id="popupType"></div> + </div> + <!--<div class="popupRightItem separationHDark editmode"></div>--> + <div class="editmode" id="popupEditSupprimer">Delete file</div> + </td> + <td id="popupRight"> + <div id="closePopupEdit">✕</div> + + <div class="popupRightItem" id="popupNom"></div> + <input class="popupInput" id="popupNomInput" type="text" value=""/> + + <div class="popupRightItem" id="popupAuthor" title="Author"></div> + <input class="popupInput" id="popupAuthorInput" type="text"></input> + + <div class="popupRightItem" id="popupTC"> + <div class="popupTCdisplay" id="popupTCin"></div> + <div class="popupTCdisplay" id="popupTCout"></div> + </div> + <div class="popupInput" id="popupTCedit"> + <span class="popupTClabel">start</span> + <input class="popupTCeditfield" id="popupTCinMin" maxlength="2" type="text" value=""/> : <input class="popupTCeditfield" id="popupTCinSec" maxlength="2" type="text" value=""/> + <div class="nowTCbtn" id="nowTCin">now</div> + <br/> + <span class="popupTClabel">end</span> + <input class="popupTCeditfield" id="popupTCoutMin" maxlength="2" type="text" value=""/> : <input class="popupTCeditfield" id="popupTCoutSec" maxlength="2" type="text" value=""/> + <div class="nowTCbtn" id="nowTCout">now</div> / <div class="nowTCbtn" id="eovTCout">end of video</div> + <!--<div class="TCvalidBtn" id="TCvalidModif">✓</div> + <div class="TCvalidBtn" id="TCinvalidModif">✗</div> --> </div> - <div class="left_menu_item dropable" id="left_menu_item_open_mosaic" title="Mosaic"> - <div class="left_menu_item_icn" id="left_menu_item_icn_mosaic"></div> - <div class="left_menu_item_title">Open Mosaic</div> - <div class="left_menu_item_value"></div> - </div> - </tr></td> + + <div class="popupRightItem" id="popupLegende" title="Comment"></div> + <textarea class="popupInput" id="popupLegendeInput" type="text"></textarea> + + <div class="popupRightItem" id="popupLink" title="Link"></div> + <textarea class="popupInput" id="popupLinkInput" type="text"></textarea> + + <!-- <div class="popupRightItem separationHDark editmode"></div> --> + </td> + </tr> </table> - <video id="video" class="video-js vjs-default-skin vjs-big-play-centered"> - <p class="vjs-no-js">Your browser is not compatible with HTML5. Please upgrade!</p> - <!-- - <track kind="captions" src="demo.captions.vtt" srclang="en" label="English"></track> - <track kind="subtitles" src="demo.captions.vtt" srclang="en" label="English"></track> - --> - </video> - <div id='flattentimeline'> - <div id="flattentimeline_highlight"> + </div> + + <form id="uploadForm" action="php/upload.php" method="post" enctype="multipart/form-data" style='display: none;'> + <input type="file" name="fileToUpload[]" multiple="multiple" id="left_menu_item_btn_addfile"> + </form> + + <div id='left_menu' class='flex-col editmode'> + <div class='top'> + <a class="left_menu_item dropable" href="javascript:window.app.rekall.Rekall('openUrl', window.app.urls.memberHome)"> + <i class="fas fa-home fa-3x left_menu_item_icn"></i> + <p>Go back to my capsules</p> + </a> + <div class="left_menu_item dropable" id="left_menu_item_settings" title="Settings"> + <div class="left_menu_item_icn" id="left_menu_item_icn_settings"></div> + <div class="left_menu_item_title">Settings</div> + </div> + <div class="left_menu_item dropable" id="left_menu_item_preview" title="Preview"> + <div class="left_menu_item_icn" id="left_menu_item_icn_preview"></div> + <div class="left_menu_item_title">Preview</div> + </div> + </div> + <div class='bottom'> + <div class="left_menu_item dropable" id="left_menu_item_addlink" title="AddLink"> + <div class="left_menu_item_icn" id="left_menu_item_icn_addlink"></div> + <div class="left_menu_item_title">Add Link</div> + </div> + <div class="left_menu_item dropable" id="left_menu_item_addnote" title="AddNote"> + <div class="left_menu_item_icn" id="left_menu_item_icn_addnote"></div> + <div class="left_menu_item_title">Add Note</div> + </div> + <div class="left_menu_item dropable" id="left_menu_item_addfile" title="AddFile"> + <div class="left_menu_item_icn" id="left_menu_item_icn_addfile"></div> + <div class="left_menu_item_title">Add File</div> + </div> + </div> + </div> + + <div id='tabs' class='flex flex-col'> + + <div id='tab_selector' class='flex-row flex-center editmode'> + <form id='tab_selector_form' class='flex-row flex-space-around'> + <input id='inp_vid' name='tab' value='video' type='radio' checked /> + <label for='inp_vid'>video</label> + <input id='inp_tab' name='tab' value='mosaic' type='radio' /> + <label for='inp_tab'>mosaic</label> + </form> + + </div> + + <div id='mosaic_tab' style='display: none;'></div> + <div id='video_tab' class='flex flex-row'> + <video id="video" class="video-js vjs-default-skin vjs-big-play-centered"> + <p class="vjs-no-js">Your browser is not compatible with HTML5. Please upgrade!</p> + <!-- + <track kind="captions" src="demo.captions.vtt" srclang="en" label="English"></track> + <track kind="subtitles" src="demo.captions.vtt" srclang="en" label="English"></track> + --> + </video> + <div id='flattentimeline' class='flex-col'> + <div id="flattentimeline_highlight"></div> + <p id='videoProgress'> </p> </div> - <p id='videoProgress'> </p> </div> - </div> + </div> +</div> </body> </html> diff --git a/capsule-prototype/js/online-script.js b/capsule-prototype/js/online-script.js index 94ac3ec79b0f0898f9447caeef045e1719f0e392..710b59551216bcca234155e95fb234c5f7250318 100644 --- a/capsule-prototype/js/online-script.js +++ b/capsule-prototype/js/online-script.js @@ -1,11 +1,19 @@ var rekall = new Rekall(); var rekall_common = new Object(); +var pubSub = null; + +window.onload = function() { + pubSub = window.top.PubSub; + pubSub.subscribe('mosaic', openMosaic); + pubSub.subscribe('video', openVideo); +}; + $(document).ready(function() { rekall.allowProjectDeletion(window.app.Settings.Project.ProjectDeletionEnabled) Utils.actionPrefix = "php/"; Utils.actionSuffix = ".php?r="; - + rekall_common.owner = {"canEdit": false, "author": "", "locationGps": "", "locationName": ""}; rouletteStart(); @@ -15,7 +23,7 @@ $(document).ready(function() { if(httpGetData.p.length != 40) httpGetData.p = (CryptoJS.SHA1(getParameterByName("p").toUpperCase()) + "").toUpperCase(); } - + $.ajax("php/project.php", { type: "POST", dataType: "json", @@ -25,16 +33,16 @@ $(document).ready(function() { if(getParameterByName("w") != "") rekall_common.owner.canEdit = false; // -//rekall_common.owner.canEdit = true; - +//rekall_common.owner.canEdit = true; + if(rekall_common.owner.canEdit) { //Mode preview or not $(".editmode").removeClass("editmode"); $(".empty").show(); $(".displayMode").hide(); - + setEditionControls(); - + //Geoloc en mode édition if((false) && (navigator.geolocation)) { navigator.geolocation.getCurrentPosition(function(position) { @@ -49,39 +57,39 @@ $(document).ready(function() { }, error: function() { } - }); + }); }); } - } else { + } else { $(".empty").hide(); $(".displayMode").show(); - - $("#projectInfoBtn").click(function(event){ - event.stopPropagation(); - $("#popupSettingsSpace").show(); + + $("#projectInfoBtn").click(function(event){ + event.stopPropagation(); + $("#popupSettingsSpace").show(); - $("#popupSettingsTitle").html(rekall.project.metadata["Title"]).removeClass("empty"); + $("#popupSettingsTitle").html(rekall.project.metadata["Title"]).removeClass("empty"); $("#popupSettingsAuthor").html(rekall.project.metadata["Author"]).removeClass("empty"); - $("#popupSettingsEmail").html(rekall.project.metadata["Email"]).removeClass("empty"); - $("#popupSettingsCredits").html(rekall.project.metadata["Comments"].replace(/\n/gi, "<br/>")).removeClass("empty"); + $("#popupSettingsEmail").html(rekall.project.metadata["Email"]).removeClass("empty"); + $("#popupSettingsCredits").html(rekall.project.metadata["Comments"].replace(/\n/gi, "<br/>")).removeClass("empty"); - }); - - $("#popupSettings").click(function(event){ - event.stopPropagation(); + }); + + $("#popupSettings").click(function(event){ + event.stopPropagation(); closeSettingsPopup(); }); - - $("#popupSettingsSpace").click(function(event){ - event.stopPropagation(); + + $("#popupSettingsSpace").click(function(event){ + event.stopPropagation(); closeSettingsPopup(); }); - } - + } + rouletteEnd(); - rekall.loadXMLFile(); - + rekall.loadXMLFile(); + var tmpUrl = shareLink(); $("#watermarkBox").attr("href",tmpUrl); @@ -93,181 +101,171 @@ $(document).ready(function() { }); $("#popupAlertSpace").click(function(event){ - event.stopPropagation(); + event.stopPropagation(); }); - $("#popupAlertButtonOk").click(function(event){ - event.stopPropagation(); + $("#popupAlertButtonOk").click(function(event){ + event.stopPropagation(); $("#popupAlertSpace").hide(); }); $("#popupSpace").click(function(event){ - event.stopPropagation(); - closeEdit(); - }); + event.stopPropagation(); + closeEdit(); + }); $("#closePopupEdit").click(function(event){ - event.stopPropagation(); - closeEdit(); + event.stopPropagation(); + closeEdit(); }); - + $("#popupAlertButtonCancel").click(function(){ closeAlert(); - }); - + }); + $("#popupAlertButtonYesdelete").click(function(){ var keyDoc = $("#popupRight").attr("keyDoc"); deleteFromDom(keyDoc); - }); - - $("#popupAlertButtonYesdeleteproject").click(function(){ + }); + + $("#popupAlertButtonYesdeleteproject").click(function(){ //alert("pouf"); removeProject(); - }); - - $("#popupSettingsBtnEmbed").click(function(event){ + }); + + $("#popupSettingsBtnEmbed").click(function(event){ event.stopPropagation(); - var tmp = shareEmbed(); + var tmp = shareEmbed(); openAlert("textarea",tmp); }); - $("#popupSettingsBtnShare").click(function(event){ - event.stopPropagation(); - var tmp = shareLink(); + $("#popupSettingsBtnShare").click(function(event){ + event.stopPropagation(); + var tmp = shareLink(); openAlert("input",tmp); }); }); -function setEditionControls() { +function setEditionControls() { //Drag&drop files $(document).on({ - dragenter: function(event) { + dragenter: function(event) { event.stopImmediatePropagation(); - event.preventDefault(); + event.preventDefault(); }, - dragleave: function(event) { + dragleave: function(event) { event.stopImmediatePropagation(); - event.preventDefault(); + event.preventDefault(); }, - dragover: function(event) { + dragover: function(event) { event.stopImmediatePropagation(); - event.preventDefault(); + event.preventDefault(); }, - drop: function(event) { + drop: function(event) { if(event.originalEvent.dataTransfer.files.length) { event.stopImmediatePropagation(); event.preventDefault(); uploadFiles(event.originalEvent.dataTransfer.files); - } + } } - }); + }); $("#flattentimeline").on({ - dragenter: function(event) { - //$(".flattentimeline_item").removeClass("draggable").addClass("drag"); - }, - dragleave: function(event) { - $("#flattentimeline").removeClass("draggable").removeClass("drag"); - }, - dragover: function(event) { - $("#flattentimeline").removeClass("draggable").addClass("drag"); - }, - drop: function(event) { - $("#flattentimeline").removeClass("draggable").removeClass("drag"); - } + dragenter: function(event) { /*$(".flattentimeline_item").removeClass("draggable").addClass("drag");*/ }, + dragleave: function(event) { $("#flattentimeline").removeClass("draggable").removeClass("drag"); }, + dragover: function(event) { $("#flattentimeline").removeClass("draggable").addClass("drag"); }, + drop: function(event) { $("#flattentimeline").removeClass("draggable").removeClass("drag"); } }); $("#left_menu_bottom").click(function(event){ //var tmp = $(".vjs-marker").css("z-index"); //alert("val = "+tmp); }); - - $("#left_menu_item_settings").click(function(event){ - event.stopPropagation(); + + $("#left_menu_item_settings").click(function(event){ + event.stopPropagation(); rekall.timeline.pause(); - $("#popupSettingsSpace").show(); + $("#popupSettingsSpace").show(); if(rekall.project.metadata["Title"]!="") { - $("#popupSettingsTitle").html(rekall.project.metadata["Title"]).removeClass("empty"); + $("#popupSettingsTitle").html(rekall.project.metadata["Title"]).removeClass("empty"); $("#popupSettingsTitleLabel").show(); } else { - $("#popupSettingsTitle").html("+ Add project name").addClass("empty"); + $("#popupSettingsTitle").html("+ Add project name").addClass("empty"); $("#popupSettingsTitleLabel").hide(); } - + if(rekall.project.metadata["Author"]!="") { - $("#popupSettingsAuthor").html(rekall.project.metadata["Author"]).removeClass("empty"); + $("#popupSettingsAuthor").html(rekall.project.metadata["Author"]).removeClass("empty"); $("#popupSettingsAuthorLabel").show(); - } else { - $("#popupSettingsAuthor").html("+ Add project author").addClass("empty"); + } else { + $("#popupSettingsAuthor").html("+ Add project author").addClass("empty"); $("#popupSettingsAuthorLabel").hide(); } - + if(rekall.project.metadata["Email"]!="") { - $("#popupSettingsEmail").html(rekall.project.metadata["Email"]).removeClass("empty"); + $("#popupSettingsEmail").html(rekall.project.metadata["Email"]).removeClass("empty"); $("#popupSettingsEmailLabel").show(); - } else { - $("#popupSettingsEmail").html("+ Add email address").addClass("empty"); + } else { + $("#popupSettingsEmail").html("+ Add email address").addClass("empty"); $("#popupSettingsEmailLabel").hide(); } - + if(rekall.project.metadata["Comments"]!="") { - $("#popupSettingsCredits").html(rekall.project.metadata["Comments"].replace(/\n/gi, "<br/>")).removeClass("empty"); + $("#popupSettingsCredits").html(rekall.project.metadata["Comments"].replace(/\n/gi, "<br/>")).removeClass("empty"); $("#popupSettingsCreditsLabel").show(); } else { - $("#popupSettingsCredits").html("+ Add project credits").addClass("empty"); + $("#popupSettingsCredits").html("+ Add project credits").addClass("empty"); $("#popupSettingsCreditsLabel").hide(); - } - + } + if(rekall_common.owner.canEdit) { $(".empty").show(); } - }); - + }); - - $("#popupSettingsTitleDiv").click(function(event){ - event.stopPropagation(); + $("#popupSettingsTitleDiv").click(function(event){ + event.stopPropagation(); closeSettingsInputs(); - $(this).hide(); + $(this).hide(); if(!$("#popupSettingsTitle").hasClass("empty")) $("#popupSettingsTitleInput").val($("#popupSettingsTitle").html()); - $("#popupSettingsTitleInput").show().focus(); - }); - $("#popupSettingsAuthorDiv").click(function(event){ - event.stopPropagation(); + $("#popupSettingsTitleInput").show().focus(); + }); + $("#popupSettingsAuthorDiv").click(function(event){ + event.stopPropagation(); closeSettingsInputs(); - $(this).hide(); + $(this).hide(); if(!$("#popupSettingsAuthor").hasClass("empty")) $("#popupSettingsAuthorInput").val($("#popupSettingsAuthor").html()); - $("#popupSettingsAuthorInput").show().focus(); - }); - $("#popupSettingsEmailDiv").click(function(event){ - event.stopPropagation(); + $("#popupSettingsAuthorInput").show().focus(); + }); + $("#popupSettingsEmailDiv").click(function(event){ + event.stopPropagation(); closeSettingsInputs(); - $(this).hide(); + $(this).hide(); if(!$("#popupSettingsEmail").hasClass("empty")) $("#popupSettingsEmailInput").val($("#popupSettingsEmail").html()); - $("#popupSettingsEmailInput").show().focus(); - }); - $("#popupSettingsCreditsDiv").click(function(event){ - event.stopPropagation(); + $("#popupSettingsEmailInput").show().focus(); + }); + $("#popupSettingsCreditsDiv").click(function(event){ + event.stopPropagation(); closeSettingsInputs(); - $(this).hide(); + $(this).hide(); if(!$("#popupSettingsCredits").hasClass("empty")) $("#popupSettingsCreditsInput").val($("#popupSettingsCredits").html()); - $("#popupSettingsCreditsInput").show().focus(); - }); - - $(".popupSettingsInput").keyup(function(event){ - event.stopPropagation(); - if(event.which == 13) { + $("#popupSettingsCreditsInput").show().focus(); + }); + + $(".popupSettingsInput").keyup(function(event){ + event.stopPropagation(); + if(event.which == 13) { closeSettingsInputs(); } - }); - - $(".popupSettingsInput").click(function(event){ + }); + + $(".popupSettingsInput").click(function(event){ event.stopPropagation(); - }); - + }); + $("#popupSettingsCreditsInput").unbind( "keyup" ); - $("#popupSettingsCreditsInput").keyup(function(event){ - event.stopPropagation(); - - var isEnter = false; + $("#popupSettingsCreditsInput").keyup(function(event){ + event.stopPropagation(); + + var isEnter = false; if (event.key !== undefined) { if (event.key === 'Enter' && event.altKey) { //openAlert('Alt + Enter pressed!'); @@ -283,272 +281,260 @@ function setEditionControls() { } if(isEnter == true) { - closeSettingsInputs(); + closeSettingsInputs(); } }); - - $("#popupSettings").click(function(event){ - event.stopPropagation(); + + $("#popupSettings").click(function(event){ + event.stopPropagation(); closeSettingsInputs(); }); - - - $("#popupSettingsSpace").click(function(event){ - event.stopPropagation(); + + $("#popupSettingsSpace").click(function(event){ + event.stopPropagation(); closeSettingsPopup(); - }); - - $("#left_menu_item_preview").click(function(event){ + }); + + $("#left_menu_item_preview").click(function(event){ event.stopPropagation(); window.open(window.app.urls.memberHome + 'capsule/preview/' + window.location.pathname.replace('/legacy/', '').slice(0, -1), '_blank'); /*window.open("?w=1", "Preview Rekall", "menubar=no, status=no, scrollbars=no, menubar=no, width=1150, height=560"); */ }); - $("#popupSettingsBtnDownloadXml").click(function(event){ + $("#popupSettingsBtnDownloadXml").click(function(event){ event.stopPropagation(); - window.open("php/project.php?downloadXML=1", '_self'); + window.open("php/project.php?downloadXML=1", '_self'); }); - $("#popupSettingsBtnDelete").click(function(event){ + $("#popupSettingsBtnDelete").click(function(event){ event.stopPropagation(); - //alert("DELETE"); - openAlert("Do you really want to delete this project ?", "yesnodeleteproject"); - }); + openAlert("Do you really want to delete this project ?", "yesnodeleteproject"); + }); $("#left_menu_item_addnote").click(function(event){ - event.stopPropagation(); + event.stopPropagation(); rekall.timeline.pause(); - uploadFiles(["New note"]); - }); + uploadFiles(["New note"]); + }); $("#left_menu_item_addfile").mousedown(function(event) { rekall.timeline.pause(); + $("#left_menu_item_btn_addfile").click(); }); - $("#left_menu_item_btn_addfile").change(function(event){ - event.stopPropagation(); - uploadFiles($("#left_menu_item_btn_addfile").get(0).files); - }); - - $("#left_menu_item_addlink").click(function(event){ - event.stopPropagation(); + $("#left_menu_item_btn_addfile").change(function(event){ + event.stopPropagation(); + uploadFiles($("#left_menu_item_btn_addfile").get(0).files); + }); + + $("#left_menu_item_addlink").click(function(event){ + event.stopPropagation(); rekall.timeline.pause(); - $("#popupAddLinkSpace").show(); + $("#popupAddLinkSpace").show(); $("#popupAddLinkInput").focus(); - }); + }); $("#popupAddLinkButtonCancel").click(function(event){ - event.stopPropagation(); + event.stopPropagation(); closeAddLinkPopup(); - }); - $("#popupAddLinkSpace").click(function(event){ - event.stopPropagation(); + }); + $("#popupAddLinkSpace").click(function(event){ + event.stopPropagation(); closeAddLinkPopup(); }); - - $("#popupAddLinkButtonOk").click(function(event){ - var myLink = $("#popupAddLinkInput").val(); + + $("#popupAddLinkButtonOk").click(function(event){ + var myLink = $("#popupAddLinkInput").val(); addLink(myLink); - }); - - $("#popupAddLinkInput").keyup(function(event){ - event.stopPropagation(); - if(event.which == 13) { + }); + + $("#popupAddLinkInput").keyup(function(event){ + event.stopPropagation(); + if(event.which == 13) { var myLink = $("#popupAddLinkInput").val(); addLink(myLink); } }); - $("#left_menu_item_open_mosaic").click(function(event){ - event.stopPropagation(); - rekall.timeline.pause(); - openMosaic(); - }); + $('#tab_selector_form').change(function(event) { pubSub.publish(event.target.value) }); - $("#closePopupMosaic").click(function(event){ - event.stopPropagation(); - closeMosaic(); - }); - - - $("#popupEdit").click(function(event){ - event.stopPropagation(); + $("#popupEdit").click(function(event){ + event.stopPropagation(); closeInputs(); }); $("#popupNom").click(function(event){ - event.stopPropagation(); + event.stopPropagation(); closeInputs(); $(this).hide(); - $("#popupNomInput").show().focus(); - }); - - $("#popupTC").click(function(event){ - event.stopPropagation(); + $("#popupNomInput").show().focus(); + }); + + $("#popupTC").click(function(event){ + event.stopPropagation(); closeInputs(); $("#popupTC").hide(); - $("#popupTCedit").show();//.focus(); - }); - + $("#popupTCedit").show();//.focus(); + }); + $(".popupTCeditfield").click(function(event){ event.stopPropagation(); - }); + }); $("#nowTCin").click(function(event){ - event.stopPropagation(); - var timeCurrent = convertToTime(Math.round(rekall.timeline.timeCurrent)); - $("#popupTCinMin").val(timeCurrent.split(":")[0]); - $("#popupTCinSec").val(timeCurrent.split(":")[1]); - }); + event.stopPropagation(); + var timeCurrent = convertToTime(Math.round(rekall.timeline.timeCurrent)); + $("#popupTCinMin").val(timeCurrent.split(":")[0]); + $("#popupTCinSec").val(timeCurrent.split(":")[1]); + }); $("#nowTCout").click(function(event){ - event.stopPropagation(); + event.stopPropagation(); var timeCurrent = convertToTime(Math.round(rekall.timeline.timeCurrent)); - $("#popupTCoutMin").val(timeCurrent.split(":")[0]); - $("#popupTCoutSec").val(timeCurrent.split(":")[1]); - }); + $("#popupTCoutMin").val(timeCurrent.split(":")[0]); + $("#popupTCoutSec").val(timeCurrent.split(":")[1]); + }); $("#eovTCout").click(function(event){ - event.stopPropagation(); - var endVideo = rekall.videoPlayer.duration(); + event.stopPropagation(); + var endVideo = rekall.videoPlayer.duration(); var timeEnd = convertToTime(Math.round(endVideo)); - $("#popupTCoutMin").val(timeEnd.split(":")[0]); - $("#popupTCoutSec").val(timeEnd.split(":")[1]); - }); - + $("#popupTCoutMin").val(timeEnd.split(":")[0]); + $("#popupTCoutSec").val(timeEnd.split(":")[1]); + }); + $("#TCvalidModif").click(function(event){ - event.stopPropagation(); - var keyDoc = $(this).parent().parent().attr("keydoc"); + event.stopPropagation(); + var keyDoc = $(this).parent().parent().attr("keydoc"); var inMin = $("#popupTCinMin").val(); var inSec = $("#popupTCinSec").val(); var outMin = $("#popupTCoutMin").val(); var outSec = $("#popupTCoutSec").val(); - var TCin = (inMin*60)+(inSec*1); - var TCout = (outMin*60)+(outSec*1); + var TCin = (inMin*60)+(inSec*1); + var TCout = (outMin*60)+(outSec*1); var endVideo = Math.ceil(rekall.videoPlayer.duration()); - - if(TCin>TCout) openAlert("Start time must be set before end time", "ok"); - else if(TCout>endVideo) openAlert("End time must not be set after " + convertToTime(endVideo) + " (end of the video)", "ok"); + + if(TCin>TCout) openAlert("Start time must be set before end time", "ok"); + else if(TCout>endVideo) openAlert("End time must not be set after " + convertToTime(endVideo) + " (end of the video)", "ok"); else { - setTCFromDom(keyDoc, TCin, TCout); + setTCFromDom(keyDoc, TCin, TCout); + + $("#popupTCin").html(inMin+":"+inSec); + $("#popupTCout").html(outMin+":"+outSec); - $("#popupTCin").html(inMin+":"+inSec); - $("#popupTCout").html(outMin+":"+outSec); - - closeInputs(); + closeInputs(); } }); $("#TCinvalidModif").click(function(event){ - event.stopPropagation(); - var TCin = $("#popupTCin").html().split(":"); - var TCout = $("#popupTCout").html().split(":"); + event.stopPropagation(); + var TCin = $("#popupTCin").html().split(":"); + var TCout = $("#popupTCout").html().split(":"); $("#popupTCinMin").val(TCin[0]); $("#popupTCinSec").val(TCin[1]); $("#popupTCoutMin").val(TCout[0]); $("#popupTCoutSec").val(TCout[1]); - closeInputs(); + closeInputs(); }); $("#popupLegende").click(function(event){ - event.stopPropagation(); + event.stopPropagation(); closeInputs(); $(this).hide(); - $("#popupLegendeInput").show().focus(); - }); - - $("#popupAuthor").click(function(event){ - event.stopPropagation(); + $("#popupLegendeInput").show().focus(); + }); + + $("#popupAuthor").click(function(event){ + event.stopPropagation(); closeInputs(); $(this).hide(); - $("#popupAuthorInput").show().focus(); - }); - - $("#popupLink").click(function(event){ - event.stopPropagation(); + $("#popupAuthorInput").show().focus(); + }); + + $("#popupLink").click(function(event){ + event.stopPropagation(); closeInputs(); $(this).hide(); - $("#popupLinkInput").show().focus(); - }); - - + $("#popupLinkInput").show().focus(); + }); + $(".popupInput").click(function(event){ event.stopPropagation(); - }); + }); $("#popupNomInput").keyup(function(event){ - event.stopPropagation(); - if(event.which == 13) { - closeInputs(); + event.stopPropagation(); + if(event.which == 13) { + closeInputs(); } }); //Validation du commentaire avec Entrée = désactivé - /*$("#popupLegendeInput").keyup(function(event){ - event.stopPropagation(); - - var isEnter = false; + /*$("#popupLegendeInput").keyup(function(event){ + event.stopPropagation(); + + var isEnter = false; if (event.key !== undefined) { if (event.key === 'Enter' && event.altKey) { //openAlert('Alt + Enter pressed!'); - } else if(event.key === 'Enter') isEnter = true; + } else if(event.key === 'Enter') isEnter = true; } else if (event.keyIdentifier !== undefined) { if (event.keyIdentifier === "Enter" && event.altKey) { //openAlert('Alt + Enter pressed!'); - } else if(event.keyIdentifier === 'Enter') isEnter = true; + } else if(event.keyIdentifier === 'Enter') isEnter = true; } else if (event.keyCode !== undefined) { if (event.keyCode === 13 && event.altKey) { //openAlert('Alt + Enter pressed!'); - } else if(event.keyCode === 13) isEnter = true; + } else if(event.keyCode === 13) isEnter = true; } - - if(isEnter == true) { - closeInputs(); - } - }); */ - $("#popupAuthorInput").keyup(function(event){ - event.stopPropagation(); - if(event.which == 13) { - closeInputs(); + if(isEnter == true) { + closeInputs(); + } + }); */ + + $("#popupAuthorInput").keyup(function(event){ + event.stopPropagation(); + if(event.which == 13) { + closeInputs(); } }); - - $("#popupLinkInput").keyup(function(event){ - event.stopPropagation(); - if(event.which == 13) { - closeInputs(); - } + + $("#popupLinkInput").keyup(function(event){ + event.stopPropagation(); + if(event.which == 13) { + closeInputs(); + } }); $("#popupSetHighlight").click(function(event){ event.stopPropagation(); var keyDoc = $(this).parent().attr("keydoc"); - var isHL = $(this).attr("isHighlight"); + var isHL = $(this).attr("isHighlight"); if(isHL=="true") { - setMetaFromDom(keyDoc, "Rekall->Highlight", ""); - $(this).attr("isHighlight", "false").removeClass("selected"); + setMetaFromDom(keyDoc, "Rekall->Highlight", ""); + $(this).attr("isHighlight", "false").removeClass("selected"); $("#popupEdit").removeClass("highlightPopup"); - } else { - setMetaFromDom(keyDoc, "Rekall->Highlight", "true"); - var tmpColor = $("#popupNom").css("color"); + } else { + setMetaFromDom(keyDoc, "Rekall->Highlight", "true"); + var tmpColor = $("#popupNom").css("color"); $(this).attr("isHighlight", "true").addClass("selected"); - $("#popupEdit").addClass("highlightPopup"); - } + $("#popupEdit").addClass("highlightPopup"); + } }); - + $("#popupEditSupprimer").click(function(){ openAlert("Do you really want to delete this file from the project ?", "yesnodelete"); }); -} - +} + /*var rubanTimeout = 0; var rubanMessage = ""; var rubanTimeoutTime = 0; function openAlert(message, duration) { alert("ça passe ?"); - if(message == undefined) { + if(message == undefined) { clearInterval(rubanTimeout); $("#ruban").slideUp(function() { $("#ruban").html(""); }); } - else if($("#ruban").text().length == 0) { + else if($("#ruban").text().length == 0) { openAlert(); messageWithClose = message; if(duration == undefined) @@ -569,248 +555,252 @@ function openAlert(message, duration) { }, 1000); } }*/ - -function closeSettingsPopup() { +function closeSettingsPopup() { closeSettingsInputs(); $("#popupSettingsSpace").hide(); } function addLink(url) { - + if(url.trim()=="") openAlert("Invalid URL"); else { if(url!="") if(url.indexOf("http")!=0) url = "http://"+url; - uploadFiles(["NewLink"+url]); + uploadFiles(["NewLink"+url]); closeAddLinkPopup(); } -} +} function closeAddLinkPopup() { - $("#popupAddLinkInput").val(""); + $("#popupAddLinkInput").val(""); $("#popupAddLinkSpace").hide(); } - - function openAlert(message, buttons) { //Rétro-compatibilité Rekall-Pro if((message == undefined) && (buttons == undefined)) - closeAlert(); - - if(message=="input"){ - $("#popupAlertMessage").html("Copy this link to share <i>"+rekall.project.metadata["Title"]+"</i>"); - $(".popupAlertButton").hide(); - $("#popupAlertButtonOk").show(); - + closeAlert(); + + if(message=="input"){ + $("#popupAlertMessage").html("Copy this link to share <i>"+rekall.project.metadata["Title"]+"</i>"); + $(".popupAlertButton").hide(); + $("#popupAlertButtonOk").show(); + $("#popupAlertInput").val(buttons); - $("#popupAlertInput").show(); - $("#popupAlertTextarea").hide(); + $("#popupAlertInput").show(); + $("#popupAlertTextarea").hide(); $("#popupAlertSpace").show(); $("#popupAlertInput").focus().select(); - - } else if(message=="textarea"){ + + } else if(message=="textarea"){ $("#popupAlertMessage").html("Embed <i>"+rekall.project.metadata["Title"]+"</i> on your webpage"); - $(".popupAlertButton").hide(); - $("#popupAlertButtonOk").show(); + $(".popupAlertButton").hide(); + $("#popupAlertButtonOk").show(); $("#popupAlertTextarea").val(buttons); - $("#popupAlertInput").hide(); - $("#popupAlertTextarea").show(); + $("#popupAlertInput").hide(); + $("#popupAlertTextarea").show(); $("#popupAlertSpace").show(); $("#popupAlertTextarea").focus().select(); - - } else { - $("#popupAlertInput").hide(); - $("#popupAlertTextarea").hide(); - - $("#popupAlertMessage").html(message); + + } else { + $("#popupAlertInput").hide(); + $("#popupAlertTextarea").hide(); + + $("#popupAlertMessage").html(message); if(buttons == "nobuttons") { $(".popupAlertButton").hide(); } - else if(buttons == "yesnodelete") { - $(".popupAlertButton").hide(); - $("#popupAlertButtonYesdelete").show(); - $("#popupAlertButtonCancel").show(); - } - else if(buttons == "yesnodeleteproject") { - $(".popupAlertButton").hide(); - $("#popupAlertButtonYesdeleteproject").show(); - $("#popupAlertButtonCancel").show(); - } + else if(buttons == "yesnodelete") { + $(".popupAlertButton").hide(); + $("#popupAlertButtonYesdelete").show(); + $("#popupAlertButtonCancel").show(); + } + else if(buttons == "yesnodeleteproject") { + $(".popupAlertButton").hide(); + $("#popupAlertButtonYesdeleteproject").show(); + $("#popupAlertButtonCancel").show(); + } else { - $(".popupAlertButton").hide(); - $("#popupAlertButtonOk").show(); + $(".popupAlertButton").hide(); + $("#popupAlertButtonOk").show(); } - $("#popupAlertSpace").show(); + $("#popupAlertSpace").show(); } -} +} + function closeAlert() { - $("#popupAlertMessage").html(""); - $(".popupAlertButton").hide(); - $("#popupAlertSpace").hide(); -} + $("#popupAlertMessage").html(""); + $(".popupAlertButton").hide(); + $("#popupAlertSpace").hide(); +} -function closeSettingsInputs() { - $.each($(".popupSettingsInput"), function() { +function closeSettingsInputs() { + $.each($(".popupSettingsInput"), function() { if($(this).css("display") != "none") { - if($(this).attr("id")=="popupSettingsTitleInput") { + if($(this).attr("id")=="popupSettingsTitleInput") { var newName = $(this).val().trim(); - $(this).val(newName); + $(this).val(newName); setProjectMeta("Title", newName); if(newName!="") { - $("#popupSettingsTitle").html(newName).removeClass("empty"); + $("#popupSettingsTitle").html(newName).removeClass("empty"); $("#popupSettingsTitleLabel").show(); - } else { - $("#popupSettingsTitle").html("+ Add project name").addClass("empty").show(); + } else { + $("#popupSettingsTitle").html("+ Add project name").addClass("empty").show(); $("#popupSettingsTitleLabel").hide(); } } else if($(this).attr("id")=="popupSettingsAuthorInput") { var newAuthor = $(this).val().trim(); - $(this).val(newAuthor); - setProjectMeta("Author", newAuthor); + $(this).val(newAuthor); + setProjectMeta("Author", newAuthor); if(newAuthor!="") { - $("#popupSettingsAuthor").html(newAuthor).removeClass("empty"); + $("#popupSettingsAuthor").html(newAuthor).removeClass("empty"); $("#popupSettingsAuthorLabel").show(); } else { $("#popupSettingsAuthor").html("+ Add project author").addClass("empty").show(); - $("#popupSettingsAuthorLabel").hide(); + $("#popupSettingsAuthorLabel").hide(); } } else if($(this).attr("id")=="popupSettingsEmailInput") { var newEmail = $(this).val().trim(); - $(this).val(newEmail); + $(this).val(newEmail); setProjectMeta("Email", newEmail); if(newEmail!="") { - $("#popupSettingsEmail").html(newEmail).removeClass("empty"); + $("#popupSettingsEmail").html(newEmail).removeClass("empty"); $("#popupSettingsEmailLabel").show(); } else { - $("#popupSettingsEmail").html("+ Add email address").addClass("empty").show(); + $("#popupSettingsEmail").html("+ Add email address").addClass("empty").show(); $("#popupSettingsEmailLabel").hide(); - } + } } else if($(this).attr("id")=="popupSettingsCreditsInput") { var newCredits = $(this).val().trim(); - $(this).val(newCredits); + $(this).val(newCredits); setProjectMeta("Comments", newCredits); if(newCredits!="") { - $("#popupSettingsCredits").html(newCredits.replace(/\n/gi, "<br/>")).removeClass("empty"); + $("#popupSettingsCredits").html(newCredits.replace(/\n/gi, "<br/>")).removeClass("empty"); $("#popupSettingsCreditsLabel").show(); } else { - $("#popupSettingsCredits").html("+ Add project credits").addClass("empty").show(); + $("#popupSettingsCredits").html("+ Add project credits").addClass("empty").show(); $("#popupSettingsCreditsLabel").hide(); } - + } } - - //alert("ok"); + + //alert("ok"); }); $(".popupSettingsInput").hide(); - $(".popupSettingsTxt").show(); + $(".popupSettingsTxt").show(); } -function closeInputs() { - $.each($(".popupInput"), function() { +function closeInputs() { + $.each($(".popupInput"), function() { if($(this).css("display") != "none") { - if($(this).attr("id")=="popupNomInput") { - - var keyDoc = $(this).parent().attr("keydoc"); - var newName = $(this).val().trim(); + if($(this).attr("id")=="popupNomInput") { + + var keyDoc = $(this).parent().attr("keydoc"); + var newName = $(this).val().trim(); $(this).val(newName); - setMetaFromDom(keyDoc, "Rekall->Name", newName); + setMetaFromDom(keyDoc, "Rekall->Name", newName); - if(newName!="") $("#popupNom").html(newName).removeClass("empty"); + if(newName!="") $("#popupNom").html(newName).removeClass("empty"); else $("#popupNom").html("+ Add a name").addClass("empty"); } else if($(this).attr("id")=="popupLegendeInput") { - - var keyDoc = $(this).parent().attr("keydoc"); - var newComment = $(this).val().trim(); + + var keyDoc = $(this).parent().attr("keydoc"); + var newComment = $(this).val().trim(); $(this).val(newComment); - setMetaFromDom(keyDoc, "Rekall->Comments", newComment.replace(/\n/gi, "<br/>")); + setMetaFromDom(keyDoc, "Rekall->Comments", newComment.replace(/\n/gi, "<br/>")); - if(newComment!="") $("#popupLegende").html(newComment.replace(/\n/gi, "<br/>")).removeClass("empty"); - else $("#popupLegende").html("+ Add a comment").addClass("empty"); + if(newComment!="") $("#popupLegende").html(newComment.replace(/\n/gi, "<br/>")).removeClass("empty"); + else $("#popupLegende").html("+ Add a comment").addClass("empty"); } else if($(this).attr("id")=="popupAuthorInput") { - - var keyDoc = $(this).parent().attr("keydoc"); - var newAuthor = $(this).val().trim(); + + var keyDoc = $(this).parent().attr("keydoc"); + var newAuthor = $(this).val().trim(); $(this).val(newAuthor); - setMetaFromDom(keyDoc, "Rekall->Author", newAuthor); + setMetaFromDom(keyDoc, "Rekall->Author", newAuthor); - if(newAuthor!="") $("#popupAuthor").html(newAuthor).removeClass("empty"); - else $("#popupAuthor").html("+ Add an author").addClass("empty"); + if(newAuthor!="") $("#popupAuthor").html(newAuthor).removeClass("empty"); + else $("#popupAuthor").html("+ Add an author").addClass("empty"); } else if($(this).attr("id")=="popupLinkInput") { + + var keyDoc = $(this).parent().attr("keydoc"); + var newLink = $(this).val().trim(); - var keyDoc = $(this).parent().attr("keydoc"); - var newLink = $(this).val().trim(); - if(newLink!="") if(newLink.indexOf("http")!=0) newLink = "http://"+newLink; $(this).val(newLink); - setMetaFromDom(keyDoc, "Rekall->Link", newLink); + setMetaFromDom(keyDoc, "Rekall->Link", newLink); if(newLink!="") { - if(rekall_common.owner.canEdit) $("#popupLink").html(newLink).removeClass("empty"); + if(rekall_common.owner.canEdit) $("#popupLink").html(newLink).removeClass("empty"); else $("#popupLink").html("<a href='"+newLink+"' target='_blank'>"+newLink+"</a>").removeClass("empty"); } else $("#popupLink").html("+ Add a link").addClass("empty"); - + } else if($(this).attr("id")=="popupTCedit") { - var keyDoc = $("#popupRight").attr("keydoc"); + var keyDoc = $("#popupRight").attr("keydoc"); var inMin = $("#popupTCinMin").val(); var inSec = $("#popupTCinSec").val(); var outMin = $("#popupTCoutMin").val(); var outSec = $("#popupTCoutSec").val(); - var TCin = (inMin*60)+(inSec*1); - var TCout = (outMin*60)+(outSec*1); + var TCin = (inMin*60)+(inSec*1); + var TCout = (outMin*60)+(outSec*1); var endVideo = Math.ceil(rekall.videoPlayer.duration()); - - var isReturn = true; + + var isReturn = true; if((inMin>=120)||(inSec>=60)||(outMin>=120)||(outSec>=60)||(inMin<0)||(inSec<0)||(outMin<0)||(outSec<0)) openAlert("Invalid time code", "ok"); - else if(TCin>TCout) openAlert("Start time must be set before end time", "ok"); - else if(TCout>endVideo) openAlert("End time must not be set after " + convertToTime(endVideo) + " (end of the video)", "ok"); - else { - setTCFromDom(keyDoc, TCin, TCout); - $("#popupTCin").html(inMin+":"+inSec); - $("#popupTCout").html(outMin+":"+outSec); + else if(TCin>TCout) openAlert("Start time must be set before end time", "ok"); + else if(TCout>endVideo) openAlert("End time must not be set after " + convertToTime(endVideo) + " (end of the video)", "ok"); + else { + setTCFromDom(keyDoc, TCin, TCout); + $("#popupTCin").html(inMin+":"+inSec); + $("#popupTCout").html(outMin+":"+outSec); isReturn = false; - } + } if(isReturn) return true; } } - - //alert("ok"); + + //alert("ok"); }); $(".popupInput").hide(); - $(".popupRightItem").show(); + $(".popupRightItem").show(); $("#popupTC").show(); $("#popupTCedit").hide(); -} +} function closeEdit() { - closeInputs(); - var isPaused = $("#popupEdit").attr("isPaused"); + closeInputs(); + var isPaused = $("#popupEdit").attr("isPaused"); if(isPaused=="false") rekall.timeline.play(); - $("#popupSpace").hide(); + $("#popupSpace").hide(); $("#popupEdit").hide(); -} +} + +function openVideo() { + $('#mosaic_tab').hide(); + $('#video_tab').show(); + $('#left_menu .bottom').show(); +} function openMosaic() { function getMosaicItem(tagOrDoc) { @@ -818,13 +808,16 @@ function openMosaic() { let name = tagOrDoc.getMetadata("Rekall->Name"); let url =''; if ('undefined' === typeof path) { - let icon = ('rekall/link' === tagOrDoc.getMetadata("Rekall->Type")) ? "link" : "note"; - url = "../shared/css/images/img-"+icon+".png"; + let [reg, type] = tagOrDoc.getMetadata("Rekall->Type").split('/'); + if (reg === 'rekall') { + if (type === 'marker') type = 'note'; + } + url = "../shared/css/images/img-"+type+".png"; } else { url = path; } let div=$('<div/>').addClass('mosaic_item').on('click', function() {tagOrDoc.openPopupEdit();}); - div.append($('<img/>').attr('src', url)); + div.append($('<img/>').attr('src', url).attr('onerror', "this.src='../shared/css/images/img-document.png';")); div.append($('<span/>').addClass('caption').text(name)); return div; } @@ -833,12 +826,17 @@ function openMosaic() { .addClass('mosaic_filter_item') .addClass(css_class) .on('click', callback) - .css('background', color) + .css('background-color', color) .append($('<h2/>').text(text)); } - $("#popupMosaicSpace").show(); - let container = $('#popupMosaicMosaic'); + + rekall.timeline.pause(); + $('#mosaic_tab').show(); + $('#video_tab').hide(); + $('#left_menu .bottom').hide(); + + let container = $('#mosaic_tab'); container.html(''); let filterdiv = $('<div/>').addClass('mosaic_filter'); filterdiv.append(getFilterElement( @@ -888,46 +886,42 @@ function getTagGradientColor(tag) { return "-o-linear-gradient(right bottom, rgba(20,46,51,1) 0%, "+tag.color+" 100%)"; } if(isFirefox) { - return "-moz-linear-gradient(right bottom, rgba(20,46,51,1) 0%, "+tag.color+" 100%)"; + return "-moz-linear-gradient(right bottom, rgba(20,46,51,1) 0%, "+tag.color+" 100%)"; } if((isSafari)||(isChrome)){ - return "-webkit-linear-gradient(right bottom, rgba(20,46,51,1) 0%, "+tag.color+" 100%)"; + return "-webkit-linear-gradient(right bottom, rgba(20,46,51,1) 0%, "+tag.color+" 100%)"; } } -function closeMosaic() { - $("#popupMosaicSpace").hide(); -} - -function fillPopupEdit(tag) { - - //if(rekall_common.owner.canEdit) { alert("edit mode !"); } - var isPaused = rekall.timeline.isPaused(); - rekall.timeline.pause(); - +function fillPopupEdit(tag) { + + //if(rekall_common.owner.canEdit) { alert("edit mode !"); } + var isPaused = rekall.timeline.isPaused(); + rekall.timeline.pause(); + // var bgColor = "-webkit-linear-gradient(right bottom, rgb(20,46,51) 0%, #757F81 150%)" ; //"rgb(20,46,51)"; - $("#popupEdit").attr("isPaused",isPaused);//.css("background",bgColor); - $("#popupTC").css("background",tag.color); + $("#popupEdit").attr("isPaused",isPaused);//.css("background",bgColor); + $("#popupTC").css("background",tag.color); /*$("#popupType").css("color",tag.color);*/ var bgColorLeft = tag.color.replace(/rgb/g, "rgba").replace(/\)/g, ",.35)"); - - bgColorLeft = getTagGradientColor(tag); - + +bgColorLeft = getTagGradientColor(tag); + $("#popupLeft").css("background",bgColorLeft); - if(tag.isMarker()==true){ - $("#popupImg").show(); + if(tag.isMarker()==true){ + $("#popupImg").show(); $("#popupImg").attr("src","../shared/css/images/img-note.png"); - $("#popupImg").unbind( "click" ); - - } else { + $("#popupImg").unbind( "click" ); + + } else { if(tag.thumbnail.url){ $("#popupImg").attr("src",tag.thumbnail.url); - } else { + } else { var type = tag.getMetadata("Rekall->Type"); - //alert(type); + //alert(type); if(type.indexOf("image") > -1) $("#popupImg").attr("src","../shared/css/images/img-image.png"); //alert("image"); else if(type.indexOf("pdf") > -1) $("#popupImg").attr("src","../shared/css/images/img-pdf.png"); //alert("pdf"); else if(type.indexOf("audio") > -1) $("#popupImg").attr("src","../shared/css/images/img-music.png"); //alert("son"); @@ -936,96 +930,95 @@ function fillPopupEdit(tag) { else if(type.indexOf("msword") > -1) $("#popupImg").attr("src","../shared/css/images/img-word.png"); //alert("word"); else if(type.indexOf("link") > -1) $("#popupImg").attr("src","../shared/css/images/img-link.png"); //alert("son"); else $("#popupImg").attr("src","../shared/css/images/img-document.png"); //alert(type); - } + } $("#popupImg").unbind( "click" ); - $("#popupImg").click(function(event){ - event.stopPropagation(); + $("#popupImg").click(function(event){ + event.stopPropagation(); if(tag.isLink()) { if(link != "") - window.open(link,'_blank'); + window.open(link,'_blank'); } else - tag.openBrowser(); - }); - } - - $("#popupNom").css("color",tag.color); + tag.openBrowser(); + }); + } + + $("#popupNom").css("color",tag.color); $("#popupType").html(tag.getMetadata("Rekall->Type")).css("color",tag.color); - var name = tag.getMetadata("Rekall->Name"); + var name = tag.getMetadata("Rekall->Name"); if(name!="") $("#popupNom").html(name).removeClass("empty"); - else $("#popupNom").html("+ Add a name").addClass("empty"); + else $("#popupNom").html("+ Add a name").addClass("empty"); var startVerb = convertToTime(tag.getTimeStart()); - $("#popupTCin").html(startVerb); + $("#popupTCin").html(startVerb); var endVerb = convertToTime(tag.getTimeEnd()); $("#popupTCout").html(endVerb); var comments = tag.getMetadata("Rekall->Comments"); if((comments)&&(comments!="")) $("#popupLegende").html(comments).removeClass("empty"); - else $("#popupLegende").html("+ Add a comment").addClass("empty"); - + else $("#popupLegende").html("+ Add a comment").addClass("empty"); + var author = tag.getMetadata("Rekall->Author"); if((author)&&(author!="")) $("#popupAuthor").html(author).removeClass("empty"); - else $("#popupAuthor").html("+ Add an author").addClass("empty"); - - var link = tag.getMetadata("Rekall->Link"); + else $("#popupAuthor").html("+ Add an author").addClass("empty"); + + var link = tag.getMetadata("Rekall->Link"); if((link)&&(link!="")) { - if(rekall_common.owner.canEdit) $("#popupLink").html(link).removeClass("empty"); + if(rekall_common.owner.canEdit) $("#popupLink").html(link).removeClass("empty"); else $("#popupLink").html("<a href='"+link+"' target='_blank'>"+link+"</a>").removeClass("empty"); } - else $("#popupLink").html("+ Add a link").addClass("empty"); + else $("#popupLink").html("+ Add a link").addClass("empty"); if(rekall_common.owner.canEdit) { - if(tag.isMarker()==true) $("#popupEditSupprimer").html("Delete Note"); - else $("#popupEditSupprimer").html("Delete File"); + if(tag.isMarker()==true) $("#popupEditSupprimer").html("Delete Note"); + else $("#popupEditSupprimer").html("Delete File"); $(".empty").show(); $(".displayMode").hide(); - $("#popupNomInput").val(tag.getMetadata("Rekall->Name")); - + $("#popupNomInput").val(tag.getMetadata("Rekall->Name")); + $("#popupTCinMin").val(startVerb.split(":")[0]); $("#popupTCinSec").val(startVerb.split(":")[1]); - + $("#popupTCoutMin").val(endVerb.split(":")[0]); $("#popupTCoutSec").val(endVerb.split(":")[1]); - - $("#popupLegendeInput").val(""+comments.replace(/<br\/>/gi, '\n')); - $("#popupAuthorInput").val(""+author); - $("#popupLinkInput").val(""+link); - - var highlight = tag.getMetadata("Rekall->Highlight"); + + $("#popupLegendeInput").val(""+comments.replace(/<br\/>/gi, '\n')); + $("#popupAuthorInput").val(""+author); + $("#popupLinkInput").val(""+link); + + var highlight = tag.getMetadata("Rekall->Highlight"); if(highlight=="true") { - $("#popupSetHighlight").attr("isHighlight","true").addClass("selected"); - $("#popupEdit").addClass("highlightPopup"); + $("#popupSetHighlight").attr("isHighlight","true").addClass("selected"); + $("#popupEdit").addClass("highlightPopup"); } else { - $("#popupSetHighlight").attr("isHighlight","false").removeClass("selected"); - $("#popupEdit").removeClass("highlightPopup"); + $("#popupSetHighlight").attr("isHighlight","false").removeClass("selected"); + $("#popupEdit").removeClass("highlightPopup"); } } else { $(".empty").hide(); $(".editmode").hide(); $(".displayMode").show(); } - - $("#popupLeft") .attr("keydoc", tag.document.key); - $("#popupRight").attr("keydoc", tag.document.key); - $("#popupSpace").show(); + $("#popupLeft") .attr("keydoc", tag.document.key); + $("#popupRight").attr("keydoc", tag.document.key); + + $("#popupSpace").show(); $("#popupEdit").show(); } - -function convertToTime(seconds) { - var minutes = Math.floor(seconds/60); - seconds = Math.floor(seconds-(minutes*60)); + +function convertToTime(seconds) { + var minutes = Math.floor(seconds/60); + seconds = Math.floor(seconds-(minutes*60)); if(minutes<10) minutes="0"+minutes; - if(seconds<10) seconds="0"+seconds; + if(seconds<10) seconds="0"+seconds; var time = minutes+":"+seconds; return time; -} - +} function removeProject() { rouletteStart(); @@ -1041,7 +1034,7 @@ function removeProject() { openAlert("Server error. Try again."); rouletteEnd(); } - }); + }); } function setProjectMeta(metaType, meta) { @@ -1058,8 +1051,9 @@ function setProjectMeta(metaType, meta) { openAlert("Server error. Try again."); rouletteEnd(); } - }); + }); } + function setMetaFromDom(keyDoc, metaType, meta) { rouletteStart(); $.ajax("php/project.php", { @@ -1074,8 +1068,9 @@ function setMetaFromDom(keyDoc, metaType, meta) { openAlert("Server error. Try again."); rouletteEnd(); } - }); + }); } + function setTCFromDom(keyDoc, TCin, TCout) { rouletteStart(); $.ajax("php/project.php", { @@ -1091,8 +1086,8 @@ function setTCFromDom(keyDoc, TCin, TCout) { openAlert("Server error. Try again."); rouletteEnd(); } - }); -} + }); +} function deleteFromDom(keyDoc) { rouletteStart(); @@ -1109,32 +1104,32 @@ function deleteFromDom(keyDoc) { openAlert("Server error. Try again."); rouletteEnd(); } - }); + }); } + function deleteFromDomFinished() { - closeAlert(); + closeAlert(); closeEdit(); } - - -//Gestion d'upload + +//Gestion d'upload var filesToUpload = [], fileIsUploading = false; function uploadFiles(files) { $.each(files, function(index, file) { var formData = new FormData(); - + if(file.name != undefined) { var colorCategory = rekall.sortings["colors"].categories[Sorting.prefix + file.type]; if(colorCategory != undefined) { } var fileType = (file.type.split("/"))[0]; var fileDateTime = moment(file.lastModifiedDate); - + if (file.size > rekall_common.uploadMax) { openAlert("File size is too large! Maximum is " + rekall_common.uploadMax + " bytes."); return; } - + //Données du formulaire if($("uploadForm")[0] != undefined) formData = new FormData($('form')[0]); //à vérifier @@ -1144,23 +1139,23 @@ function uploadFiles(files) { } } else if(file.indexOf("NewLink") == 0){ - formData.append("name", "NewLink"); + formData.append("name", "NewLink"); formData.append("link", file.replace("NewLink","")); formData.append("type", "rekall/link"); } else { formData.append("name", file); } - + var tcOut = rekall.timeline.timeCurrent + 15; if(tcOut>=rekall.videoPlayer.duration()) tcOut = rekall.videoPlayer.duration(); - + formData.append("tcIn", rekall.timeline.timeCurrent); formData.append("tcOut", tcOut); formData.append("author", rekall_common.owner.author); formData.append("locationGps", rekall_common.owner.locationGps); formData.append("locationName", rekall_common.owner.locationName); - + if(formData != undefined) { filesToUpload.push({ file: file, @@ -1211,18 +1206,19 @@ function uploadFiles(files) { } }); } + function uploadFilesNext() { if(!fileIsUploading) { if(filesToUpload.length > 0) { fileIsUploading = true; rouletteStart(true); $.ajax(filesToUpload[0]); - + if(filesToUpload[0].file.name != undefined) openAlert("Starting upload of " + filesToUpload[0].file.name); else openAlert("Creation of " + filesToUpload[0].file + " in progress"); - + filesToUpload.splice(0, 1); uploadFilesNext(); } @@ -1241,6 +1237,7 @@ function shareEmbed() { // openAlert("Embed code in console"); return embedUrl; } + function shareLink() { var width = 960, height = round(width * 0.44); var embedUrl = rekall.baseUrl + "?w=1"; @@ -1254,10 +1251,12 @@ function rouletteStart(isProgress) { else console.log("Début de la roulette avec progression"); } + function rouletteProgress(progress) { console.log("Progression de la roulette @ " + progress + "%"); window.document.title = "Téléchargement " + progress + "%"; } + function rouletteEnd() { console.log("Fin de la roulette"); closeAlert(); @@ -1276,6 +1275,5 @@ $(window).resize(function(e) { rekall.videoPlayer.height(($("#container").height()) + "px"); $("#video").addClass("resized"); } -}); +}); $(window).trigger("resize"); - diff --git a/capsule-prototype/js/rekall/Sorting.js b/capsule-prototype/js/rekall/Sorting.js index 2e527cbd3c7d69d16763c5fcd1acbb6a9ef05394..799f5a9956d05c782ab21e250e181826c9f867f0 100644 --- a/capsule-prototype/js/rekall/Sorting.js +++ b/capsule-prototype/js/rekall/Sorting.js @@ -261,9 +261,9 @@ Sorting.prototype.analyseEnd = function(minTagCount) { else { this.categories = Utils.sortObj(this.categories, this.valAreFloats); if(this.analyse) { - console.log("----------------------------------------------------------------"); + console.debug("----------------------------------------------------------------"); for (var key in this.categories) - console.log(key); + console.debug(key); } diff --git a/legacy/create.zip b/legacy/create.zip index 3b6e843b53835f01ea7fdefbde2685d730eba1fa..40b7e727a0ccf08db83eb7b5c69648df3018fc90 100644 Binary files a/legacy/create.zip and b/legacy/create.zip differ diff --git a/templates/project/edit.html.twig b/templates/project/edit.html.twig index 82a101839135fd026f977e33e49a9cae2d3ebad4..258695da5bea6714aac4860af2885645e53d7d1e 100644 --- a/templates/project/edit.html.twig +++ b/templates/project/edit.html.twig @@ -16,7 +16,7 @@ <script> window.onload = function (){ const iframe = document.getElementById('legacyContent').contentWindow; - iframe.init('init', PubSub); + iframe.rekall.Rekall('init', PubSub); } </script> -{% endblock %} \ No newline at end of file +{% endblock %} diff --git a/tools/update_capsule_html.sh b/tools/update_capsule_html.sh new file mode 100755 index 0000000000000000000000000000000000000000..ff2f0c910f4958a04f28cb8ceb26969d361ce8ff --- /dev/null +++ b/tools/update_capsule_html.sh @@ -0,0 +1,4 @@ +#!/bin/sh + +( cd capsule-prototype && zip -ru ../legacy/create.zip .htaccess * ) +find legacy -type f -name 'index.html' -exec cp capsule-prototype/index.html {} \;