|
@@ -40,7 +40,7 @@
|
|
border: 0px !important;
|
|
border: 0px !important;
|
|
}
|
|
}
|
|
|
|
|
|
- .rightMenuItem button{
|
|
|
|
|
|
+ .rightMenuItem button:not(.inverted){
|
|
background-color: white !important;
|
|
background-color: white !important;
|
|
}
|
|
}
|
|
|
|
|
|
@@ -73,6 +73,22 @@
|
|
border-bottom: 2px solid #41e8e5;
|
|
border-bottom: 2px solid #41e8e5;
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+ #bookmarkbar{
|
|
|
|
+ position: fixed;
|
|
|
|
+ right: 0px;
|
|
|
|
+ top: 42px;
|
|
|
|
+ background-color: white;
|
|
|
|
+ height: calc(100% - 42px);
|
|
|
|
+ width: 25em;
|
|
|
|
+ padding: 1.2em;
|
|
|
|
+ border: 1px solid #dedede;
|
|
|
|
+
|
|
|
|
+ box-shadow: -10px 1px 11px -5px rgba(0,0,0,0.15);
|
|
|
|
+ -webkit-box-shadow: -10px 1px 11px -5px rgba(0,0,0,0.15);
|
|
|
|
+ -moz-box-shadow: -10px 1px 11px -5px rgba(0,0,0,0.15);
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+
|
|
</style>
|
|
</style>
|
|
</head>
|
|
</head>
|
|
<body>
|
|
<body>
|
|
@@ -94,13 +110,13 @@
|
|
</div>
|
|
</div>
|
|
<div id="urlbar" class="ui tiny action fluid input">
|
|
<div id="urlbar" class="ui tiny action fluid input">
|
|
<input id="urlText" type="text" value="about:blank" onkeydown="handleURLKeydown(event);">
|
|
<input id="urlText" type="text" value="about:blank" onkeydown="handleURLKeydown(event);">
|
|
- <button id="starBtn" class="ui icon basic circular tiny button">
|
|
|
|
|
|
+ <button id="starBtn" class="ui icon basic circular tiny button" onclick="addBookMark();">
|
|
<i class="star icon"></i>
|
|
<i class="star icon"></i>
|
|
</button>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="right menu">
|
|
<div class="right menu">
|
|
<div class="ui rightMenuItem">
|
|
<div class="ui rightMenuItem">
|
|
- <button class="ui tiny icon button">
|
|
|
|
|
|
+ <button class="ui tiny icon button" onclick="toggleBookmark();">
|
|
<i class="blue bookmark icon"></i>
|
|
<i class="blue bookmark icon"></i>
|
|
</button>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
@@ -119,6 +135,13 @@
|
|
<iframe id="xframe" src="./blank.html" allow="fullscreen" referrerpolicy="no-referrer">
|
|
<iframe id="xframe" src="./blank.html" allow="fullscreen" referrerpolicy="no-referrer">
|
|
|
|
|
|
</iframe>
|
|
</iframe>
|
|
|
|
+ <div id="bookmarkbar" style="display:none;">
|
|
|
|
+ <div class="ui container">
|
|
|
|
+ <div id="bookmarklist" class="ui middle aligned divided list">
|
|
|
|
+
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
<div id="notvdiWarning">
|
|
<div id="notvdiWarning">
|
|
<div class="ui yellow message">
|
|
<div class="ui yellow message">
|
|
<i class="close icon"></i>
|
|
<i class="close icon"></i>
|
|
@@ -132,6 +155,9 @@
|
|
let historyStack = [];
|
|
let historyStack = [];
|
|
let historyPopStack = [];
|
|
let historyPopStack = [];
|
|
let currentURL = "about:blank";
|
|
let currentURL = "about:blank";
|
|
|
|
+ let currentTitle = "";
|
|
|
|
+ let bookmarkBuffer = [];
|
|
|
|
+ let titleBuffer = {};
|
|
|
|
|
|
//Check if currently under vdi mode
|
|
//Check if currently under vdi mode
|
|
if (ao_module_virtualDesktop == false){
|
|
if (ao_module_virtualDesktop == false){
|
|
@@ -142,6 +168,9 @@
|
|
$(this).closest('.message').transition('fade');
|
|
$(this).closest('.message').transition('fade');
|
|
});
|
|
});
|
|
|
|
|
|
|
|
+ function toggleBookmark(){
|
|
|
|
+ $("#bookmarkbar").fadeToggle('fast');
|
|
|
|
+ }
|
|
|
|
|
|
//Perform window resize element size calculation
|
|
//Perform window resize element size calculation
|
|
$(window).on("resize", function(){
|
|
$(window).on("resize", function(){
|
|
@@ -194,8 +223,12 @@
|
|
window.open(currentURL);
|
|
window.open(currentURL);
|
|
}
|
|
}
|
|
|
|
|
|
- function getTitleFromURL(url){
|
|
|
|
- var title = targetURL.substr(targetURL.indexOf("/") + 2, targetURL.length);
|
|
|
|
|
|
+ function getTitleFromURL(targetURL){
|
|
|
|
+ var title = targetURL;
|
|
|
|
+ if (targetURL.includes("//")){
|
|
|
|
+ title = targetURL.substr(targetURL.indexOf("/") + 2, targetURL.length);
|
|
|
|
+ }
|
|
|
|
+
|
|
return title;
|
|
return title;
|
|
}
|
|
}
|
|
|
|
|
|
@@ -257,8 +290,10 @@
|
|
if (data == ""){
|
|
if (data == ""){
|
|
let title = getTitleFromURL(targetURL);
|
|
let title = getTitleFromURL(targetURL);
|
|
ao_module_setWindowTitle(title);
|
|
ao_module_setWindowTitle(title);
|
|
|
|
+ currentTitle = title;
|
|
}else{
|
|
}else{
|
|
ao_module_setWindowTitle(data);
|
|
ao_module_setWindowTitle(data);
|
|
|
|
+ currentTitle = data;
|
|
}
|
|
}
|
|
});
|
|
});
|
|
$("#xframe").off("load");
|
|
$("#xframe").off("load");
|
|
@@ -274,9 +309,11 @@
|
|
if (matches == null){
|
|
if (matches == null){
|
|
let title = getTitleFromURL(targetURL);
|
|
let title = getTitleFromURL(targetURL);
|
|
ao_module_setWindowTitle(title);
|
|
ao_module_setWindowTitle(title);
|
|
|
|
+ currentTitle = title;
|
|
}else{
|
|
}else{
|
|
var title = matches[0].replace(/(<([^>]+)>)/gi, "");
|
|
var title = matches[0].replace(/(<([^>]+)>)/gi, "");
|
|
ao_module_setWindowTitle(title);
|
|
ao_module_setWindowTitle(title);
|
|
|
|
+ currentTitle = title;
|
|
}
|
|
}
|
|
|
|
|
|
});
|
|
});
|
|
@@ -287,10 +324,89 @@
|
|
$("#urlText").val(redirectTarget);
|
|
$("#urlText").val(redirectTarget);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
+ });
|
|
|
|
+
|
|
|
|
+ updateBookmarkButtonColor();
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ function updateBookmarkButtonColor(){
|
|
|
|
+ if (insideBookmark(currentURL)){
|
|
|
|
+ $("#starBtn").addClass("yellow");
|
|
|
|
+ }else{
|
|
|
|
+ $("#starBtn").removeClass("yellow");
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ function initbookmark(){
|
|
|
|
+ ao_module_agirun("Browser/functions/bookmark.js", {opr: "read"}, function(bookmarkData){
|
|
|
|
+ bookmarkBuffer = bookmarkData;
|
|
|
|
+ console.log("BOOKMARK DATA", bookmarkData);
|
|
|
|
+ ao_module_agirun("Browser/functions/bookmark.js", {rtype: "titles", opr: "read"}, function(data){
|
|
|
|
+ titleBuffer = data;
|
|
|
|
+ $("#bookmarklist").html("");
|
|
|
|
+ bookmarkBuffer.forEach(bookmark => {
|
|
|
|
+ let matchingTitle = titleBuffer[bookmark];
|
|
|
|
+ if (matchingTitle == undefined){
|
|
|
|
+ matchingTitle = getTitleFromURL(bookmark);
|
|
|
|
+ }
|
|
|
|
+ //Render the bookmark table
|
|
|
|
+ $("#bookmarklist").append(`
|
|
|
|
+ <div class="item">
|
|
|
|
+ <div class="right floated content">
|
|
|
|
+ <div class="ui mini icon basic blue circular button" onclick="loadWebsite('${bookmark}');"><i class="ui linkify icon"></i></div>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="content">
|
|
|
|
+ ${matchingTitle}
|
|
|
|
+ </div>
|
|
|
|
+ </div>`);
|
|
|
|
+ });
|
|
|
|
+
|
|
|
|
+ if (bookmarkBuffer.length == 0){
|
|
|
|
+ $("#bookmarklist").append(`<div class="item">
|
|
|
|
+ <div class="content">
|
|
|
|
+ <i class="ui bookmark icon"></i> No bookmark saved
|
|
|
|
+ </div>
|
|
|
|
+ </div>`);
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ });
|
|
|
|
+ });
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+ initbookmark();
|
|
|
|
+
|
|
|
|
+ function addBookMark(){
|
|
|
|
+ if (bookmarkBuffer.includes(currentURL)){
|
|
|
|
+ //Remove bookmark
|
|
|
|
+ bookmarkBuffer = bookmarkBuffer.filter(e => e !== currentURL);
|
|
|
|
+ delete(titleBuffer[currentURL]);
|
|
|
|
+ }else{
|
|
|
|
+ //Add bookmark
|
|
|
|
+ bookmarkBuffer.push(currentURL);
|
|
|
|
+
|
|
|
|
+ //Remove array in the table
|
|
|
|
+ bookmarkBuffer = bookmarkBuffer.filter(function(item, pos, self) {
|
|
|
|
+ return self.indexOf(item) == pos;
|
|
|
|
+ });
|
|
|
|
+
|
|
|
|
+ titleBuffer[currentURL] = currentTitle;
|
|
|
|
+ }
|
|
|
|
|
|
|
|
+ ao_module_agirun("Browser/functions/bookmark.js", {"opr": "write", "newBookmarkArray": JSON.stringify(bookmarkBuffer)}, function(data){
|
|
|
|
+ ao_module_agirun("Browser/functions/bookmark.js", {"rtype": "titles", "opr": "write", "newTitleArray": JSON.stringify(titleBuffer)}, function(data){
|
|
|
|
+ console.log(data);
|
|
|
|
+ updateBookmarkButtonColor();
|
|
|
|
+ initbookmark();
|
|
|
|
+ });
|
|
});
|
|
});
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+ function insideBookmark(url){
|
|
|
|
+ return bookmarkBuffer.includes(url);
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
|
|
function proxyWebContent(url, callback){
|
|
function proxyWebContent(url, callback){
|
|
ao_module_agirun("Browser/functions/proxy.js", {
|
|
ao_module_agirun("Browser/functions/proxy.js", {
|