diff --git a/capsule-prototype/css/online-theme.css b/capsule-prototype/css/online-theme.css
index 2793e4ac11871ed2816a20ea8df5d48ecaa8e58d..92a45e4a3fcd897159632416b79330a65a7ebd43 100644
--- a/capsule-prototype/css/online-theme.css
+++ b/capsule-prototype/css/online-theme.css
@@ -7,6 +7,7 @@
:root {
--tab_selector_height: 30px;
--rk-light-blue: #559299;
+ --rk-greyblue: #243538;
}
.flex-col, .flex-row, .flex-center, .flex { display: flex; }
diff --git a/capsule-prototype/css/popup.css b/capsule-prototype/css/popup.css
index 8dc528e120ffd1579efbee467872d398e362e2aa..b8baa3e33acc276e6cfe75feb0fc1746987a091e 100644
--- a/capsule-prototype/css/popup.css
+++ b/capsule-prototype/css/popup.css
@@ -25,7 +25,7 @@ font-weight: 400;
font-size: 1vw;
display: inline-block;
text-align: center;
-background: #243538;
+background: var(--rk-greyblue);
} */
#popupSettings {
@@ -36,7 +36,7 @@ background: #243538;
font-size: 1vw;
display: inline-block;
text-align: left;
- background: #243538;
+ background: var(--rk-greyblue);
}
#popupSettingsLeft {
@@ -246,7 +246,7 @@ font-weight: 400;
font-size: 1vw;
display: inline-block;
text-align: center;
-background: #243538;
+background: var(--rk-greyblue);
/*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; */
@@ -291,7 +291,7 @@ background: #243538;
font-size: 1vw;
display: inline-block;
text-align: left;
- background: #243538;
+ background: var(--rk-greyblue);
}
#popupLeft {
@@ -712,3 +712,70 @@ color: rgba(255,255,255,.75); /*#FFF; */
}
}
+#paste_modal {
+ align-items: center;
+ position: absolute;
+ margin: 10%;
+ width: 60%;
+ min-width: 400px;
+ height: 60%;
+ min-height: 300px;
+ z-index: 50;
+
+ padding: 10px;
+
+ border-radius: 2px;
+ box-shadow: 0 5px 25px #000;
+ background-color: var(--rk-greyblue);
+
+ font-weight: 100;
+ color: rgba(255,255,255,.75);
+ text-align: center;
+ font-size: 1em;
+
+ display: none;
+}
+
+#paste_modal h1 {
+ margin: 5px;
+ padding: 5px;
+ font-weight: 100;
+ color: rgba(255,255,255,.75);
+ font-size: 15px;
+}
+
+#paste_modal button {
+ color: #fff;
+ background: rgba(255,255,255,.15);
+ box-shadow: 0 1px 3px rgba(0,0,0,.1);
+ border-radius: 3px;
+ cursor: pointer;
+ padding: 20px;
+ border: 0;
+ margin: 20px;
+ text-transform: uppercase;
+}
+
+#paste_modal button:hover {
+ background: rgba(255,255,255,.05);
+ color: #fff
+}
+
+#paste_modal div.content {
+ max-width: 90%;
+ max-height: 90%;
+ height: 80%;
+ width: 80%;
+ padding: 5px;
+ background-color: rgba(0, 0, 0, .3);
+ caret-color: transparent;
+}
+
+#paste_modal img {
+ max-height: 90%;
+ max-width: 90%;
+ height: auto;
+ width: auto;
+ margin: auto;
+ border: 2px dotted grey;
+}
diff --git a/capsule-prototype/index.html b/capsule-prototype/index.html
index acdd48571737bcbdc4247225a7af438bb9a73928..2113b46a8112c32de7eea4d4751d4af9b183dc39 100644
--- a/capsule-prototype/index.html
+++ b/capsule-prototype/index.html
@@ -195,6 +195,15 @@
<input type="file" name="fileToUpload[]" multiple="multiple" id="left_menu_item_btn_addfile">
</form>
+ <div id="paste_modal" class='flex-col'>
+ <h1>Paste your image below</h1>
+ <div id='paste_modal_content' class='content' contenteditable='true' autofocus='true'></div>
+ <div class='actions flex-row'>
+ <button class='validate'>validate</button>
+ <button class='cancel'>cancel/close</button>
+ </div>
+ </div>
+
<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)">
@@ -219,6 +228,10 @@
<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_pastefile" title="PasteFile">
+ <div class="left_menu_item_icn" id="left_menu_item_icn_pastefile"></div>
+ <div class="left_menu_item_title">Paste File</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>
diff --git a/capsule-prototype/js/online-script.js b/capsule-prototype/js/online-script.js
index 710b59551216bcca234155e95fb234c5f7250318..6204a50e1d5e9035cae32843f71e803a80d0e30f 100644
--- a/capsule-prototype/js/online-script.js
+++ b/capsule-prototype/js/online-script.js
@@ -6,6 +6,8 @@ window.onload = function() {
pubSub = window.top.PubSub;
pubSub.subscribe('mosaic', openMosaic);
pubSub.subscribe('video', openVideo);
+ pubSub.subscribe('open_paste_modal', openPasteModal);
+ pubSub.subscribe('close_paste_modal', closePasteModal);
};
$(document).ready(function() {
@@ -44,6 +46,7 @@ $(document).ready(function() {
setEditionControls();
//Geoloc en mode édition
+ /*
if((false) && (navigator.geolocation)) {
navigator.geolocation.getCurrentPosition(function(position) {
rekall_common.owner.locationGps = position.coords.latitude + "," + position.coords.longitude;
@@ -60,6 +63,7 @@ $(document).ready(function() {
});
});
}
+ */
} else {
$(".empty").hide();
@@ -174,10 +178,12 @@ function setEditionControls() {
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();
@@ -325,6 +331,30 @@ function setEditionControls() {
uploadFiles($("#left_menu_item_btn_addfile").get(0).files);
});
+ $("#left_menu_item_pastefile").click(function(event) { pubSub.publish('open_paste_modal'); });
+ $("#paste_modal button.cancel").click(function(event) { pubSub.publish('close_paste_modal'); });
+
+ $("#paste_modal_content").on("paste", function(event) {
+ $('#paste_modal_content').empty();
+ });
+
+ $("#paste_modal button.validate").click(function(event) {
+ var img = $("#paste_modal img");
+ if (img.length < 1)
+ return;
+ var b64img = img[0].src;
+ var data = b64img.match(/data:([a-z]+)\/([a-z]+);base64,(.*)/);
+ var type = data[1], subtype = data[2], b64data = data[3];
+ var bin_str = atob(b64data);
+ var n = b64data.length;
+ var uar = new Uint8Array(n);
+ while (n--) uar[n] = bin_str.charCodeAt(n);
+ var file = new File([uar], 'pasted_' + Math.floor(random()*100000) + '.' + subtype, {type: type+'/'+subtype});
+ $('#left_menu_item_btn_addfile').files += file;
+ uploadFiles([file]);
+ pubSub.publish('close_paste_modal');
+ });
+
$("#left_menu_item_addlink").click(function(event){
event.stopPropagation();
rekall.timeline.pause();
@@ -1277,3 +1307,6 @@ $(window).resize(function(e) {
}
});
$(window).trigger("resize");
+
+function openPasteModal() { $('#paste_modal').css('display', 'flex'); $('#paste_modal_content').first().focus() }
+function closePasteModal() { $('#paste_modal').hide(); $('#paste_modal_content').empty(); }