Showing source for: https://topiqs.online/
Duration: 0.197856s
Server: Microsoft-IIS/10.0
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Topiqs - Your Feed</title>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-1523271-23"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() { dataLayer.push(arguments); }
gtag('js', new Date());
gtag('config', 'UA-1523271-23');
</script>
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="theme-color" content="#ffffff">
<meta property="og:title" content="Topiqs - Your Feed" />
<meta name="description" content="Collaborate & share bookmark collections, blogs and content" />
<meta property="og:description" content="Collaborate & share bookmark collections, blogs and content" />
<link rel="canonical" href="http://topiqs.online" />
<meta property="og:url" content="http://topiqs.online" />
<meta property="og:site_name" content="Topiqs" />
<link rel="chrome-webstore-item" href="https://chrome.google.com/webstore/detail/kppfgbofahhlhgjmdehoninnbmhjnnbb">
<link href="https://fonts.googleapis.com/css?family=Quicksand" rel="stylesheet">
<link rel="stylesheet" href="/Styles/External/bootstrap.min.4.1.2.css" />
<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-2.1.4.min.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jquery.ui/1.12.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/jquery.ui/1.12.1/themes/redmond/jquery-ui.css" />
<script src="/Scripts/External/popper-1.12.9.min.js"></script>
<script src="/Scripts//External/bootstrap.min.4.1.2.js"></script>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/pretty-checkbox.min.css" rel="stylesheet" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css" rel="stylesheet" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2-bootstrap-theme/0.1.0-beta.10/select2-bootstrap.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jQuery.dotdotdot/3.2.2/jquery.dotdotdot.js"></script>
<link href="/Styles/External/ionicons_2_0_1/css/ionicons.css" rel="stylesheet" />
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.6/styles/vs.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.6/highlight.min.js"></script>
<link href="/Styles/External/bootstrap-social.css" rel="stylesheet" />
<link href="/Styles/External/Animate.css" rel="stylesheet" />
<script src="/Scripts/External//spin.min.js"></script>
<script src="/Scripts/External/notify.min.js"></script>
<script src="/Scripts/External/bootstrap-notify.min.js"></script>
<script src="/Scripts/External/bootbox.min.js"></script>
<script src="/CKEditor/dist/ckeditor_20200121.js"></script>
<script src="/Scripts/vmUtils_20181031.js"></script>
<script src="/Scripts/Browser_20190130.js"></script>
<script src="/Scripts/QueryString_20180923.js"></script>
<script src="/Scripts/FlexTree_20200218.js"></script>
<script src="/Scripts/BrowserExtensions_20190226.js"></script>
<script src="/Scripts/Comments_20190614.js"></script>
<script src="/Scripts/Preview_20191025.js"></script>
<script src="/Scripts/Feed_20200703.js"></script>
<script src="/Scripts/Pages_20190402.js"></script>
<script src="/Scripts/PageSelector_20190927.js"></script>
<script src="/Scripts/ListView_20200425.js"></script>
<script src="/Scripts/GridView_20200517.js"></script>
<script src="/Scripts/PageSlide_20200406.js"></script>
<script src="/Scripts/ImageView_20200513.js"></script>
<script src="/Scripts/Favourites_20190218.js"></script>
<script src="/Scripts/Video_20181213.js"></script>
<script src="/Scripts/Email_20190920.js"></script>
<script src="/Scripts/CategorySelector_20200420.js"></script>
<script src="/Scripts/OrganizeLink_20191003.js"></script>
<script src="/Scripts/Following_20190930.js"></script>
<script src="/Scripts/Social_20200319.js"></script>
<script src="/Scripts/HowTo.js"></script>
<script src="/Scripts/Screenshot_20200806.js"></script>
<script src="/Scripts/Layout_20200305.js"></script>
<link rel="stylesheet" href="/Styles/External/fontawesome-pro-5.10.0-web/css/all.min.css" />
<link rel="stylesheet" href="/Styles/styles_20200806.css" />
<link rel="stylesheet" href="/Styles/Bootstrap_20200616.css" />
<link rel="stylesheet" href="/Styles/Comments_20190124.css" />
<link rel="stylesheet" href="/Styles/PageSlide_20190102.css" />
<link rel="stylesheet" href="/Styles/ImageView_20190913.css" />
<link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.1.1/cookieconsent.min.css" />
<script src="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.1.1/cookieconsent.min.js"></script>
<script>
function removeHash() {
var scrollV, scrollH, loc = window.location;
console.log("loc.hash = " + loc.hash);
//if (loc.hash == "#_=_" || loc.hash == "#") { // "#" : Google, "#_=_" Facebook
if ("pushState" in history)
history.pushState("", document.title, loc.pathname + loc.search);
else {
// Prevent scrolling by storing the page's current scroll offset
scrollV = document.body.scrollTop;
scrollH = document.body.scrollLeft;
loc.hash = "";
// Restore the scroll offset, should be flicker free
document.body.scrollTop = scrollV;
document.body.scrollLeft = scrollH;
}
//}
}
//removeHash();
</script>
<script>
window.addEventListener("load", function () {
window.cookieconsent.initialise({
"palette": {
"popup": {
"background": "#000"
},
"button": {
"background": "#f1d600"
}
},
"content": {
"href": "/home/privacy"
}
})
});
function SetNoOpenCookie() {
Cookies.Create("NoOpen", "true", 1);
}
function DeleteNoOpenCookie() {
Cookies.Delete("NoOpen");
}
</script>
<script>
$(function () {
$.fn.bootstrapBtn = $.fn.button.noConflict();
document.querySelectorAll('span[data-ckpro-popover]').forEach(elm => {
elm.classList.add("ckpro-popover-client");
$(elm).popover({
trigger: "hover",
placement: "top",
html: true,
content: function () {
return this.getAttribute("data-ckpro-popover");
}
});
});
});
$('[data-toggle="popover"]').popover();
</script>
<script>
document.addEventListener("DOMContentLoaded", function () {
$("input[type='text']").attr("spellcheck", "false");
$("textarea").attr("spellcheck", "false");
});
</script>
<script>
document.addEventListener("DOMContentLoaded", function () {
Topiqs.Screenshot.initialize({
popupZIndex: 1000,
popupActivation: 'click',
placement: Topiqs.Screenshot.PlacementEnum.corner_bottom_right,
offset: {
horizontal: 2,
vertical: -12
},
//iconPopupRegular: '/Images/view_screenshot_reg.png',
//iconPopupHover: '/Images/view_screenshot_hot.png',
//imageUrlPrefix: '/FileServer/ContentImages/',
maxImageWidth: 500,
maxImageHeight: 400,
loaderUrl: '/Images/spinner.png'
});
});
</script>
<script>
document.addEventListener("DOMContentLoaded", function () {
Topiqs.Utils.adjustAnchors();
});
</script>
<script>
var Loading = {
spinnerType: { "Topiq": 0, "Spinner": 1 },
startSpinner: function (spinnerId, elmContainer, objConfig) {
//Loading.stopSpinner(spinnerId); ??
var spinnerType = objConfig && typeof (objConfig.spinnerType) != "undefined" ? objConfig.spinnerType : Loading.spinnerType.Topiq;
var marginTop = objConfig && typeof (objConfig.marginTop) != "undefined" ? objConfig.marginTop : 0;
var lineCount = objConfig && typeof (objConfig.lineCount) != "undefined" ? objConfig.lineCount : 10;
var lineLength = objConfig && typeof (objConfig.lineLength) != "undefined" ? objConfig.lineLength : 8;
var lineWidth = objConfig && typeof (objConfig.lineWidth) != "undefined" ? objConfig.lineWidth : 2;
var innerRadius = objConfig && typeof (objConfig.innerRadius) != "undefined" ? objConfig.innerRadius : 5;
var size = objConfig && typeof (objConfig.size) != "undefined" ? objConfig.size : 48;
var divSpinner = document.createElement("div"); elmContainer.appendChild(divSpinner);
divSpinner.id = spinnerId;
divSpinner.style.marginTop = marginTop + "px";
if (spinnerType == Loading.spinnerType.Topiq) {
divSpinner.style.textAlign = "center";
var imgSpinner = document.createElement("img"); divSpinner.appendChild(imgSpinner);
imgSpinner.src = "/Images/spinner.png";
imgSpinner.style.width = size + "px";
}
else if (spinnerType == Loading.spinnerType.Spinner) {
divSpinner.style.display = "inline-block";
var spinnerOptions = {
lines: lineCount,
length: lineLength,
width: lineWidth,
radius: innerRadius
}
spinner = new Spinner(spinnerOptions).spin(divSpinner);
}
else {
alert("spinnerType is invalid");
throw new Error("spinnerType is invalid.")
}
},
stopSpinner: function (spinnerId) {
var divSpinner = document.getElementById(spinnerId);
if (divSpinner) {
divSpinner.parentNode.removeChild(divSpinner);
}
}
}
</script>
<script>
var Topiqs = Topiqs || {};
Topiqs.Globals = {
urlTopicsLogo: '/Images/Topiqs.png',
urlFaviconsFolder: "/FileServer/Favicons/",
urlTempFolder: "/FileServer/Temp/",
isHome: false,
isInspect: false,
urlId: 0,
pageId: 0,
userId: "",
defaultProfilePictureUrl: "/images/defaultProfilePicture.png",
defaultDisplayName: "Anonymous",
isLoggedIn: false,
antiCsrfRequestToken: 'CfDJ8KzgkeZ-z5tDo_n2q9Q3utKS4JEAEQMqtQh7bZcsZKOJ53RCNnTKxyrnPnTVXKYx98pi9--TbMqYMV4EvlQwf43NF7sDMN55pBFUIqA3_4O54Rx6O3XPQBpSYu_ChMBqT867nx3bhDvummO6HvCGNSo',
//baseUrl: 'http' + '://' + 'topiqs.online',
baseUrl: 'https://' + 'topiqs.online',
user: {
DisplayName: '',
ProfilePictureUrl: '/images/defaultProfilePicture.png'
},
privacyEnum: {
Unknown: 1,
Anonymous: 2,
ShowOwner: 3
},
resourceTypeEnum: {
Url: 1,
Video: 2,
Image: 3,
Pdf: 4,
Unknown: 5
}
}
Topiqs.Utils = {
executePageUpdateHandlers: function() {
Topiqs.Layout.initialize();
},
resourceUrlToThumbUrl: function (resourceUrl) {
if (resourceUrl.indexOf("_thumb") > 0) {
return resourceUrl;
}
else if (resourceUrl.toLowerCase().startsWith("http") && resourceUrl.toLowerCase().indexOf("topiqs.online") == -1) {
return resourceUrl;
}
var lastIndexOfSlash = resourceUrl.lastIndexOf('/');
if (lastIndexOfSlash > 0) {
var fileName = resourceUrl.substring(lastIndexOfSlash + 1);
var indexOfDot = fileName.lastIndexOf('.');
if (indexOfDot > 0) {
var fileExtension = fileName.substring(indexOfDot);
var fileNameNoExtension = fileName.substring(0, indexOfDot);
var thumbUrl = resourceUrl.substring(0, lastIndexOfSlash + 1) + fileNameNoExtension + "_thumb" + fileExtension;
return thumbUrl;
}
}
return resourceUrl;
},
setImageSrc: function (imageObj, imageUrl) {
var thumbUrl = Topiqs.Utils.resourceUrlToThumbUrl(imageUrl);
var imgTest = document.createElement("img");
imgTest.imageObj = imageObj;
imgTest.imageUrl = imageUrl;
imgTest.thumbUrl = thumbUrl;
imgTest.onload = function () { this.imageObj.src = this.thumbUrl; };
imgTest.onerror = function () { this.imageObj.src = this.imageUrl; };
imgTest.src = thumbUrl;
},
sanitizeImageUrls: function (html) { // Local version does nothing, however code still needs to run through since on external website this function will actually do somthing
//var rx = new RegExp("src=[\"|']/FileServer/", "gi");
////var sanitizedHtml = html.replace(rx, "src=\"" + Topiqs.ListView.baseUrl + "FileServer/");
//return sanitizedHtml;
return html;
},
adjustAnchors: function () { // bookmarks (anchors) - attach anchor class to adjust bookmarks for fixed top bar
var bookmarks = document.querySelectorAll("a[name]");
for (var b = 0; b < bookmarks.length; b++) {
var bookmark = bookmarks[b];
bookmark.className = "anchor";
}
},
updateCommentsLink: function (descriptionContainer, topiqId, commentCount) { // if the user have added <a href="#comments"> to a topiq description
var aComment = descriptionContainer.querySelector("a[href='#comments']");
if (aComment) {
aComment.setAttribute("href", "#comments" + topiqId);
if (commentCount > 0) {
let spanCount = document.createElement("span"); spanCount.appendChild(document.createTextNode("\u00a0(" + commentCount + ")"));
aComment.parentNode.insertBefore(spanCount, aComment.nextSibling);
}
}
},
htmlImagesToThumbs: function (html) { // used by Shared\Components\MenuRight\Default.cshtml
var imageUrls = Topiqs.Utils.getImageUrlsFromHtml(html);
imageUrls.forEach(imageUrl => {
var thumbUrl = Topiqs.Utils.resourceUrlToThumbUrl(imageUrl);
html = html.replace(imageUrl, thumbUrl);
});
return html;
},
getImageUrlsFromHtml: function (html) {
var imageUrls = [];
var rxImage = new RegExp("<img src=\"([0-9A-Za-z_\\-\\?\&=;:/\\.]+)\"", "gi");
var rxMatch;
while ((rxMatch = rxImage.exec(html)) !== null) {
if (rxMatch.length == 2) {
var imageUrl = rxMatch[1];
imageUrls.push(imageUrl);
}
}
return imageUrls;
},
modalizeDescriptionImages: function () {
var divImageModal = document.getElementById("divImageModal");
if (!divImageModal) {
divImageModal = document.createElement("div");
divImageModal.setAttribute("id", "divImageModal");
let spanImageModalClose = document.createElement("span"); divImageModal.appendChild(spanImageModalClose);
spanImageModalClose.setAttribute("id", "spanImageModalClose");
spanImageModalClose.appendChild(document.createTextNode("x"));
let imgImageModal = document.createElement("img"); divImageModal.appendChild(imgImageModal);
imgImageModal.setAttribute("id", "imgImageModal");
document.body.appendChild(divImageModal);
}
let imgImageModal = document.getElementById("imgImageModal");
document.querySelectorAll("div.topiq-description figure.image img").forEach((img) => {
img.onclick = function (e) {
var evt = e || event;
evt.stopPropagation();
divImageModal.style.display = "block";
imgImageModal.src = this.src;
imgImageModal.style.cursor = "zoom-out";
imgImageModal.onclick = function () {
imgImageModal.style.animationName = "zoomout";
setTimeout(function () {
divImageModal.style.display = "none";
imgImageModal.style.animationName = "zoom";
}, 600);
}
}
});
var spanImageModalClose = document.getElementById("spanImageModalClose");
spanImageModalClose.style.position = "absolute";
spanImageModalClose.style.top = "15px";
spanImageModalClose.style.right = "35px";
spanImageModalClose.style.color = "#f1f1f1";
spanImageModalClose.style.fontSize = "40px";
spanImageModalClose.style.fontWeight = "bold";
spanImageModalClose.style.cursor = "pointer";
spanImageModalClose.style.transition = "0.3s";
spanImageModalClose.onmouseover = function () {
this.style.color = "#bbb";
}
spanImageModalClose.onmouseout = function () {
this.style.color = "#f1f1f1";
}
spanImageModalClose.onclick = function () {
divImageModal.style.display = "none";
}
}
}
</script>
<style>
#divGridLayout {
width: 1020px;
margin: 0 auto;
display: grid;
grid-gap: 10px;
grid-template-columns: 160px 650px 200px;
grid-template-rows: 50px auto;
}
#divGridLayout > div.layout-grid-item {
/*border: 2px solid rgb(233,171,88);*/
/*border-radius: 5px;
background-color: rgba(233,171,88,.5);
padding: 10px;
color: #d9480f;*/
}
#divGridTop {
grid-column-start: 1;
grid-column-end: 4;
}
#divFixedTop {
position: fixed;
top: 0;
left: 0;
right: 0;
height: 50px; /* height equal to divGridTop */
z-index: 11;
background-color: #f7f7f7;
}
/* place here so I dont need the same css in both MenuLeft.Default.cshtml & MenuRight.Default.cshtml */
#divMenuRight span.menu-category, #divMenuLeft span.menu-category {
color: #616770;
font-size: 13px;
font-weight: 600;
line-height: 13px;
}
</style>
<script></script>
</head>
<body>
<div id="divFixedTop">
<style>
#divTopLeft {
position: absolute;
top: 0;
left: 0;
display: flex;
align-items: center;
height: 100%;
}
#divTopMiddle {
width: 680px;
margin: 0 auto;
display: flex;
align-items: center;
justify-content: space-between;
height: 100%;
/*border:solid 1px red;*/
padding-right: 32px;
}
#divTopRight {
position: absolute;
right: 0;
top: 0;
display: flex;
align-items: center;
height: 100%;
}
#divAdminDropdown {
margin-left: 16px;
top: 1px;
}
#aHomeButton {
display: inline-block;
text-decoration: none;
border-radius: 12px;
font-size: 1.4rem;
font-weight: normal;
position: relative;
/*top: -4px;*/
/*margin: auto 0;*/
margin-left: 14px;
}
#aHomeButton:hover {
/*background-color: rgba(230, 230, 230, 0.62);*/
/*box-shadow: 0px 0px 0px 5px rgba(230, 230, 230, 0.62);
-moz-box-shadow: 0px 0px 0px 5px rgba(230, 230, 230, 0.62);
-webkit-box-shadow: 0px 0px 0px 5px rgba(230, 230, 230, 0.62);*/
/*background-color: rgba(237, 242, 250, 0.62);
box-shadow: 0px 0px 0px 5px rgba(237, 242, 250, 0.62);
-moz-box-shadow: 0px 0px 0px 5px rgba(237, 242, 250, 0.62);
-webkit-box-shadow: 0px 0px 0px 5px rgba(237, 242, 250, 0.62);*/
background-color: rgba(217, 228, 245, 0.62);
box-shadow: 0px 0px 0px 5px rgba(217, 228, 245, 0.62);
-moz-box-shadow: 0px 0px 0px 5px rgba(217, 228, 245, 0.62);
-webkit-box-shadow: 0px 0px 0px 5px rgba(217, 228, 245, 0.62);
}
#tbTopSearch {
position: relative;
border: 1px solid #ccc;
background-color: transparent;
font-size: 1rem;
padding: 4px 2px 4px 40px;
width: 175px;
}
#tbTopSearch:focus {
border-color: green;
box-shadow: 0 0 5px green;
}
#divTbTopSearchWrapper {
display: inline-block;
position: relative;
}
#divTbTopSearchWrapper:after {
font-family: 'Ionicons';
font-size: 1.4rem;
color: green;
position: absolute;
top: 4px;
left: 10px;
content: "\f4a4";
}
#divGlobalStats {
position: absolute;
width:160px;
margin-left: -171px;
padding: 2px;
border-radius: 4px;
border: solid 1px rgb(217, 222, 87);
background-color: rgb(246, 255, 0);
color: rgb(168, 173, 12);
font-size:12px;
display:flex;
justify-content:space-around;
}
</style>
<style>
#divTopMine {
/*border: solid 1px red;*/
padding: 0 10px 10px 20px;
max-height: 500px;
overflow-y: scroll;
overflow-x: auto;
}
.top-masonry {
display: flex;
flex-flow: column wrap;
max-height: 400px;
width: 100%;
border: solid 0px blue;
padding-left: 0; /* ulTopMine */
}
.top-masonry-brick {
width: 200px;
border: solid 0px red;
margin-top: 20px;
margin-right: 20px;
}
.top-masonry-brick-title {
width: 150px;
display: inline-block;
vertical-align: middle;
/*position:relative;
bottom: 0px;*/
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 0.9rem;
font-weight: bold;
}
/*.top-masonry-linq {
display: inline-block;
position: relative;
overflow: hidden;
width: 160px;
text-overflow: ellipsis;
/*top: 4px;*/
/*background-color: red;*/
}
*/
.top-masonry-linq-label {
color: black;
text-decoration: none;
}
.top-masonry-linq-label:hover {
text-decoration: none;
padding: 0 3px 2px 2px;
border-radius: 2px;
background-color: #F0AD4E;
color: white;
}
</style>
<div id="divTopLeft">
<img src="/Images/topiqs.png" alt="" style="height:32px;display:inline-block;position:relative;margin: auto 0;margin-left:10px;border:solid 0px red;" />
<a id="aHomeButton" class="color-topiq" href="/"> Topiqs </a>
</div>
<div id="divTopMiddle">
<div id="divGlobalStats">
<span>Users : <span style="font-weight:bold;">1000</span></span>
<span>Topiqs : <span style="font-weight:bold;">625</span></span>
</div>
<a href="/Home/Edit" class="btn btn-primary" style="">Create New Topiq</a>
<div style="margin-left:20px;display:flex;align-items:center;">
<a id="btnNavigationHome" class="btn btn-outline-dark btn-sm" href="/">Home</a>
<div id="divTopMineGroup" class="btn-group" style="margin-left:10px;">
<button type="button" id="btnNavigationMine" onclick="location.href='/Home/Mine'" class="btn btn-outline-dark btn-sm">Mine</button>
<button id="btnTopMineDropdown" type="button" class="btn btn-outline-dark btn-sm dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<span class="sr-only">Toggle Dropdown</span>
</button>
<div id="divTopMineDropdown" class="dropdown-menu" style="margin-left:-330px;padding:0;">
<div id="divTopMine" style="width:700px;position:absolute;background-color:white;border:solid 1px #666;">
<ul id="ulTopMine" class="top-masonry"></ul>
</div>
</div>
</div>
<a id="btnNavigationFindFriends" class="btn btn-outline-dark btn-sm" href="/Follow/Following?show=friends" style="margin-left:10px;">Find Friends</a>
</div>
<div id="divTbTopSearchWrapper" style="margin-left:20px;visibility:visible">
<div class="input-group">
<input type="text" id="tbTopSearch" class="form-control" placeholder="Search Topiqs" aria-label="Search Urls" aria-describedby="btnTopSearch" spellcheck="false">
<div class="input-group-append">
<button id="btnTopSearch" class="btn btn-outline-success" onclick="topSearch()" type="button">Search</button>
</div>
</div>
</div>
</div>
<div id="divTopRight">
<style>
#divLoginLeft {
width: 260px;
float: left;
padding: 0 30px 0 20px;
border-right: solid 0px #ccc;
}
#divLoginRight {
width: 260px;
float: right;
padding: 0 20px 0 30px;
border-left: solid 1px #ccc;
}
#divLoginConfirmPassword {
display: none;
}
#btnLoginCancel {
color: #999;
font-weight: normal;
float: right;
margin-top: 5px;
}
#aLoginForgotPassword {
color: #999;
font-weight: normal;
float: left;
margin-top: 5px;
}
button.btn-social-topiq {
padding-top: 9px;
padding-bottom: 9px;
margin-bottom: 8px;
}
span.btn-social-topiq {
width: 40px !important;
margin-top: 3px;
}
div#divLoginLocal div.input-group {
margin-bottom: 8px;
}
</style>
<script>
var isHomeFeed = true;
$(function () {
if (isHomeFeed) {
//var qs = QueryString.FromCurrent();
//var pageSlide = qs.params["pageslide"];
//var urlId = qs.params["urlid"];
//if (!(pageSlide && urlId)) {
$('#divLoginModal').modal({
backdrop: 'static',
keyboard: false
});
//}
}
});
function openLogin(email, bookmark, targetUrl) {
if (email) {
var tbLoginEmail = document.getElementById("tbLoginEmail");
tbLoginEmail.value = email;
}
if (bookmark) {
var hiddenLoginBookmark = document.getElementById("hiddenLoginBookmark");
hiddenLoginBookmark.value = bookmark;
}
if (targetUrl) {
/* for social login */
var formLoginModal = document.querySelector("#formLoginModal");
var action = formLoginModal.getAttribute("action");
var indexOfQs = action.indexOf('?');
if (indexOfQs > 0) {
var qs = action.split('?')[1].toLowerCase();
var indexOfReturnUrl = qs.indexOf("returnurl");
if (indexOfReturnUrl == 0) {
action = action.split('?')[0] + "?returnurl=" + encodeURIComponent(targetUrl);
formLoginModal.setAttribute("action", action);
}
}
/* for local login */
var hiddenLoginTargetUrl = document.querySelector("#hiddenLoginTargetUrl");
hiddenLoginTargetUrl.value = targetUrl;
}
$('#divLoginModal').modal();
}
function closeLogin() {
setLoginBoxToDefault();
$('#divLoginModal').modal('hide');
}
function setLoginBoxToDefault() {
$('#spanLoginEmailValidation').empty();
$('#spanLoginPasswordValidation').empty();
$('#spanLoginConfirmPasswordValidation').empty();
$("#tbLoginEmail").val("");
$("#tbLoginPassword").val("");
$("#tbLoginConfirmPassword").val("");
var divLoginConfirmPassword = document.getElementById("divLoginConfirmPassword");
$(divLoginConfirmPassword).css("display", "none");
}
</script>
<script>
function login_Login() {
var loginData = {
Email: $('#tbLoginEmail').val(),
Password: $('#tbLoginPassword').val()
}
$(divLoginConfirmPassword).css("display", "none");
var targetUrl = (document.querySelector("#hiddenLoginTargetUrl")).value;
$.ajax({
url: '/Account/Login',
type: 'POST',
data: JSON.stringify(loginData),
contentType: "application/json; charset=utf-8",
headers: { 'RequestVerificationToken': Topiqs.Globals.antiCsrfRequestToken },
dataType: 'json',
success: function (resultData) {
var haveError = false;
var spanLoginEmailValidation = document.getElementById("spanLoginEmailValidation"); $(spanLoginEmailValidation).empty();
var spanLoginPasswordValidation = document.getElementById("spanLoginPasswordValidation"); $(spanLoginPasswordValidation).empty();
var spanLoginConfirmPasswordValidation = document.getElementById("spanLoginConfirmPasswordValidation"); $(spanLoginConfirmPasswordValidation).empty();
if (resultData.EmailNotSupplied) {
haveError = true;
spanLoginEmailValidation.appendChild(document.createTextNode("Email is mandatory."));
}
if (resultData.EmailDoesNotExists) {
haveError = true;
spanLoginEmailValidation.appendChild(document.createTextNode("Email does not exists."));
}
if (resultData.EmailNotConfirmed) {
haveError = true;
spanLoginEmailValidation.appendChild(document.createTextNode("Email is registered but not confirmed. Please find the account confirmation email from Topiq that ask you to confirm your email."));
}
if (resultData.EmailFormatIsNotValid) {
haveError = true;
spanLoginEmailValidation.appendChild(document.createTextNode("Email format not valid."));
}
if (resultData.PasswordNotSupplied) {
haveError = true;
spanLoginPasswordValidation.appendChild(document.createTextNode("Password is mandatory."));
}
if (resultData.PasswordIsWrong) {
haveError = true;
spanLoginPasswordValidation.appendChild(document.createTextNode("Password is wrong."));
}
if (resultData.GenericError != "") {
haveError = true;
alert(resultData.GenericError);
}
if (!haveError) {
if (resultData.Bookmark) {
alert("Page is bookmarked");
}
else if (targetUrl) {
location.href = targetUrl;
}
else {
if (
location.href.toLowerCase().indexOf("confirmemail") > 0
|| location.href.toLowerCase().indexOf("resetpasswordconfirmation") > 0
) {
location.href = "/";
}
else {
location.reload(true);
}
}
}
},
error: function (xmlHttpRequest, textStatus, errorThrown) {
alert(errorThrown);
}
});
}
function login_Register() {
var divLoginConfirmPassword = document.getElementById("divLoginConfirmPassword");
var btnLoginRegister = document.getElementById("btnLoginRegister");
if ($(divLoginConfirmPassword).css("display") == "block") {
var registerData = {
Email: $('#tbLoginEmail').val(),
Password: $('#tbLoginPassword').val(),
ConfirmPassword: $("#tbLoginConfirmPassword").val()
}
var divRegisterSpinner = document.getElementById("divRegisterSpinner");
btnLoginRegister.style.display = "none";
divRegisterSpinner.style.display = "inline-block";
var registerSpinnerOptions = {
lines: 10,
length: 8,
width: 2,
radius: 5
}
var registerSpinner = new Spinner(registerSpinnerOptions).spin(divRegisterSpinner);
$.ajax({
url: '/Account/Register',
type: 'POST',
data: JSON.stringify(registerData),
contentType: "application/json; charset=utf-8",
headers: { 'RequestVerificationToken': Topiqs.Globals.antiCsrfRequestToken },
dataType: 'json',
success: function (resultData) {
var haveError = false;
var spanLoginEmailValidation = document.getElementById("spanLoginEmailValidation"); $(spanLoginEmailValidation).empty();
var spanLoginPasswordValidation = document.getElementById("spanLoginPasswordValidation"); $(spanLoginPasswordValidation).empty();
var spanLoginConfirmPasswordValidation = document.getElementById("spanLoginConfirmPasswordValidation"); $(spanLoginConfirmPasswordValidation).empty();
if (resultData.EmailNotSupplied) {
haveError = true;
spanLoginEmailValidation.appendChild(document.createTextNode("Email is mandatory."));
}
if (resultData.EmailAlreadyExists) {
haveError = true;
spanLoginEmailValidation.appendChild(document.createTextNode("Email already exists."));
}
if (resultData.EmailFormatIsNotValid) {
haveError = true;
spanLoginEmailValidation.appendChild(document.createTextNode("Email format not valid."));
}
if (resultData.PasswordNotSupplied) {
haveError = true;
spanLoginPasswordValidation.appendChild(document.createTextNode("Password is mandatory."));
}
if (resultData.PasswordFormatNotValid) {
haveError = true;
spanLoginPasswordValidation.appendChild(document.createTextNode(resultData.RequiredPasswordFormat));
}
if (resultData.ConfirmPasswordNotIdentitical) {
haveError = true;
spanLoginConfirmPasswordValidation.appendChild(document.createTextNode("'Password & 'Confirm password' must be identical."));
}
if (resultData.ConfirmPasswordNotSupplied) {
haveError = true;
spanLoginConfirmPasswordValidation.appendChild(document.createTextNode("Confirm password is mandatory."));
}
if (resultData.GenericError != "") {
haveError = true;
alert(resultData.GenericError);
}
if (!haveError) {
closeLogin();
bootbox.alert("We have sent you an account confirmation email with a link that confirms your are the owner of the email you just used to register with.<br /><br />After you click the confirmation link, you can login to Topiqs.", function () { location.reload(true); });
}
},
error: function (xmlHttpRequest, textStatus, errorThrown) {
alert(errorThrown);
},
complete: function () {
var btnLoginRegister = document.getElementById("btnLoginRegister");
var divRegisterSpinner = document.getElementById("divRegisterSpinner");
btnLoginRegister.style.display = "inline-block";
divRegisterSpinner.style.display = "none";
}
});
}
else {
$(divLoginConfirmPassword).css("display", "block");
var tbLoginEmail = document.getElementById("tbLoginEmail");
var tbLoginPassword = document.getElementById("tbLoginPassword");
var tbLoginConfirmPassword = document.getElementById("tbLoginConfirmPassword");
var spanLoginEmailValidation = document.getElementById("spanLoginEmailValidation"); $(spanLoginEmailValidation).empty();
var spanLoginPasswordValidation = document.getElementById("spanLoginPasswordValidation"); $(spanLoginPasswordValidation).empty();
var spanLoginConfirmPasswordValidation = document.getElementById("spanLoginConfirmPasswordValidation"); $(spanLoginConfirmPasswordValidation).empty();
if (tbLoginEmail.value.trim() == "") {
tbLoginEmail.value = "";
tbLoginEmail.focus();
}
else if (tbLoginPassword.value.trim() == "") {
tbLoginPassword.value = "";
tbLoginPassword.focus();
}
else if (tbLoginConfirmPassword.value.trim() == "") {
tbLoginConfirmPassword.value = "";
tbLoginConfirmPassword.focus();
}
}
function addFormFieldsToSubmit(form, fieldName, fieldValue) {
var hidden = document.createElement("input");
hidden.setAttribute("type", "hidden");
hidden.setAttribute("name", fieldName);
hidden.setAttribute("value", fieldValue);
form.appendChild(hidden);
}
}
</script>
<div style="position:relative;right:50px;">
<span class="btn btn-primary" onclick="openLogin()">Sign in</span>
</div>
<form id="formAntiForgeryToken">
<input name="__RequestVerificationToken" type="hidden" value="CfDJ8KzgkeZ-z5tDo_n2q9Q3utKS4JEAEQMqtQh7bZcsZKOJ53RCNnTKxyrnPnTVXKYx98pi9--TbMqYMV4EvlQwf43NF7sDMN55pBFUIqA3_4O54Rx6O3XPQBpSYu_ChMBqT867nx3bhDvummO6HvCGNSo" />
</form>
</div>
<script>
$(function () {
if (location.href.toLowerCase().indexOf("home/mine") > -1) {
document.getElementById("btnNavigationMine").className = "btn btn-dark btn-sm";
}
else if (location.href.toLowerCase().indexOf("follow/findfriends") > -1) {
document.getElementById("btnNavigationFindFriends").className = "btn btn-dark btn-sm";
}
else if (Topiqs.Globals.isHome) { // location.href.toLowerCase().indexOf("home/index") > -1 || location.href.toLowerCase().endsWith("topiqs.online/"))
document.getElementById("btnNavigationHome").className = "btn btn-dark btn-sm";
}
});
</script>
<script>
$(function () {
var tbTopSearch = document.getElementById("tbTopSearch");
if (tbTopSearch) {
tbTopSearch.addEventListener("keydown", function (e) {
e = e || window.event;
if (e.keyCode == 13) {
e.preventDefault();
topSearch();
}
}, false);
}
});
function topSearch() {
var tbTopSearch = document.getElementById("tbTopSearch");
var searchString = tbTopSearch.value;
var qs = QueryString.FromCurrent();
qs.Add("searchString", encodeURIComponent(searchString));
location.href = "/Home/Search" + qs.ToString(false);
}
</script>
<script>
$(function () {
$('#divTopMineGroup').on('hidden.bs.dropdown', function (e) {
$('#divTopMine').find('.dropdown-menu').hide();
});
if (Topiqs.Globals.isLoggedIn) {
TopMine.getMine();
}
else {
TopMine.drawNotLoggedIn();
}
});
TopMine = {
data: [],
ulMine: null,
tree: null,
initialize: function (data) {
TopMine.data = data;
TopMine.dressData();
if (TopMine.data.length == 0) {
TopMine.drawNoTopiqs();
}
else {
TopMine.ulMine = document.getElementById("ulTopMine");
TopMine.drawTree();
TopMine.calculateMasonHeight();
Topiqs.Preview.Topiq.initializeTopiqPopover({
isPreloaded: false,
cssTrigger: 'top-masonry-linq-label'
});
}
$('a.dummyPreventCloseOnClick').on('click', function (e) {
e.stopPropagation();
var $dropdownMenu = $(this).next('.dropdown-menu');
var isVisible = $dropdownMenu.is(":visible");
$('#divTopMine').find('.dropdown-menu:not(#divTopMineDropdown)').hide();
if (!isVisible) {
var dropdownMenu = $dropdownMenu[0];
$(dropdownMenu).toggle();
}
});
},
dressData: function () {
//removeFavouritesNotMine();
removePeers();
clientSideSort(); // MUST come before removeFirstCategoryLevel
removeFirstCategoryLevel();
removeIrrelevantCategories();
categorizeNonCategorizedTopiqs();
function removeFavouritesNotMine() {
var indexesOfFavouritesNotMine = [];
for (var i = 0; i < TopMine.data.length; i++) {
var item = TopMine.data[i];
if (item.Type == "Topiq") {
if (item.Access != "Mine" && item.IsFavourite) {
indexesOfFavouritesNotMine.push(i);
}
}
}
for (var i = indexesOfFavouritesNotMine.length - 1; i >= 0; i--) {
var index = indexesOfFavouritesNotMine[i];
TopMine.data.splice(index, 1);
}
}
function removePeers() {
var indexesOfPeers = [];
for (var i = 0; i < TopMine.data.length; i++) {
var item = TopMine.data[i];
if (item.Type == "Topiq") {
if ((item.Access == "Edit" || item.Access == "View") && !item.IsFavourite) {
indexesOfPeers.push(i);
}
}
}
for (var i = indexesOfPeers.length - 1; i >= 0; i--) {
var index = indexesOfPeers[i];
TopMine.data.splice(index, 1);
}
}
function clientSideSort() {
var clientSortOrder = 0;
for (var i = 0; i < TopMine.data.length; i++) {
var item = TopMine.data[i];
if (item.Type == "SystemCategory" && item.Pid == 0) {
for (var s = 0; s < TopMine.data.length; s++) {
var subCategory = TopMine.data[s];
if (subCategory.Type == "SystemCategory" && subCategory.MergedPid == item.MergedId) {
clientSortOrder = clientSortOrder + 1;
subCategory["clientSortOrder"] = clientSortOrder;
}
}
}
}
}
function removeFirstCategoryLevel() {
var indexesOfFirstCategoryLevel = [];
for (var i = 0; i < TopMine.data.length; i++) {
var item = TopMine.data[i];
if (item.Type == "SystemCategory") {
if (item.Pid == 0) {
indexesOfFirstCategoryLevel.push(i);
}
else {
item.MergedPid = "0";
}
}
}
for (var i = indexesOfFirstCategoryLevel.length - 1; i >= 0; i--) {
var index = indexesOfFirstCategoryLevel[i];
TopMine.data.splice(index, 1);
}
}
function removeIrrelevantCategories() {
var indexesOfIrrelevantCategories = [];
for (var i = 0; i < TopMine.data.length; i++) {
var item = TopMine.data[i];
if (item.Type == "SystemCategory") {
if (!haveTopiqs(item)) {
indexesOfIrrelevantCategories.push(i);
}
}
}
for (var i = indexesOfIrrelevantCategories.length - 1; i >= 0; i--) {
var index = indexesOfIrrelevantCategories[i];
TopMine.data.splice(index, 1);
}
function haveTopiqs(categoryItem) {
for (var i = 0; i < TopMine.data.length; i++) {
var item = TopMine.data[i];
if (item.MergedPid == categoryItem.MergedId) {
return true;
break;
}
}
return false;
}
}
function categorizeNonCategorizedTopiqs() {
var nonCategorizedTopiqs = [];
for (var i = 0; i < TopMine.data.length; i++) {
var item = TopMine.data[i];
if (item.Type == "Topiq" && item.Pid == 0) {
nonCategorizedTopiqs.push(item);
}
}
if (nonCategorizedTopiqs.length > 0) {
var dummyCategory = {
Type: "SystemCategory",
Id: 1000000,
Pid: 0,
MergedId: "s" + 1000000,
MergedPid: "0",
Name: "UN-CATEGORIZED",
IconUrl: "",
SortOrder: 1000000,
clientSortOrder: 1000000,
canSort: false
}
TopMine.data.push(dummyCategory);
for (var i = 0; i < nonCategorizedTopiqs.length; i++) {
var item = nonCategorizedTopiqs[i];
item.MergedPid = dummyCategory.MergedId;
}
}
}
},
drawTree: function () {
while (TopMine.ulMine.hasChildNodes()) { TopMine.ulMine.removeChild(TopMine.ulMine.lastChild); }
TopMine.tree = $(TopMine.ulMine).FlexTree({
idField: 'MergedId',
pidField: 'MergedPid',
labelField: 'Name',
sortOrderField: 'clientSortOrder',
canToggle: false,
showHierarchyLines: false,
hierarchyIndentation: "0px",
sort: {
canSort: false,
hasSortHandle: false,
},
data: TopMine.data,
callbackDrawItem: function (item) {
if (item.Type == "SystemCategory") {
TopMine.drawSystemCategoryItem(item);
}
else if (item.Type == "Topiq") {
TopMine.drawTopiqItem(item);
}
}
});
},
drawSystemCategoryItem: function (item) {
item.liSelf.classList.add("top-masonry-brick");
item.divItem.style.whiteSpace = "nowrap";
if (item.IconUrl) {
var imgIcon = document.createElement("img"); item.divItem.appendChild(imgIcon);
imgIcon.src = item.IconUrl;
imgIcon.style.marginRight = "6px";
imgIcon.style.height = "24px";
}
if (item.hLevel == 1) {
item.divItem.style.borderBottom = "solid 2px #ccc";
item.divItem.style.paddingRight = "50px";
var aLabel = document.createElement("a"); item.divItem.appendChild(aLabel);
aLabel.appendChild(document.createTextNode(item.Name));
aLabel.className = "top-masonry-brick-title";
}
},
drawTopiqItem: function (item) {
//item.liSelf.classList.add("top-masonry-linq");
//item.divItem.style.position = "relative";
item.divItem.style.whiteSpace = "nowrap";
var divIndent = document.createElement("div"); item.divItem.appendChild(divIndent);
divIndent.style.display = "inline-block";
divIndent.style.width = "25px";
if (item.IsFavourite) {
var iconFavourite = document.createElement("i"); divIndent.appendChild(iconFavourite);
iconFavourite.className = "fas fa-heart color-favouritecount";
iconFavourite.style.marginLeft = "4px";
}
var haveProfilePicture = item.Access == "Edit" || item.Access == "View" || item.Access == "Favourite";
if (haveProfilePicture) {
var imgOwner = document.createElement("img"); item.divItem.appendChild(imgOwner);
imgOwner.style.height = "24px";
imgOwner.style.width = "24px";
imgOwner.src = item.OwnerProfilePictureUrl;
imgOwner.style.marginRight = "6px";
imgOwner.title = item.OwnerDisplayName;
}
var divActions = document.createElement("div"); item.divItem.appendChild(divActions);
divActions.setAttribute("role", "group");
divActions.className = "btn-group dummyPreventCloseOnClick";
divActions.style.marginRight = "6px";
//divActions.style.top = "-3px";
var aActions = document.createElement("a"); divActions.appendChild(aActions);
aActions.setAttribute("id", "dropdownminetopiq" + item.Id);
aActions.setAttribute("href", "#");
//aActions.setAttribute("onclick", "return false");
//aActions.onclick = function (e) { e.stopPropagation(); return false; }
aActions.setAttribute("data-toggle", "dropdown");
aActions.setAttribute("aria-haspopup", "true");
aActions.setAttribute("aria-expanded", "false");
aActions.className = "dummyPreventCloseOnClick";
var iconAction = document.createElement("i"); aActions.appendChild(iconAction);
iconAction.className = "fas fa-cog";
iconAction.style.fontSize = "1.2rem";
var divActionsDropdown = document.createElement("div"); divActions.appendChild(divActionsDropdown);
divActionsDropdown.setAttribute("aria-labelledby", "dropdownminetopiq" + item.Id);
divActionsDropdown.className = "dropdown-menu";
var aActionOpen = document.createElement("a"); divActionsDropdown.appendChild(aActionOpen);
aActionOpen.setAttribute("href", "/Home/Index/" + item.Id + "?open=true");
aActionOpen.className = "dropdown-item";
var iconActionOpen = document.createElement("i"); aActionOpen.appendChild(iconActionOpen);
iconActionOpen.className = "fas fa-share color-opencount";
aActionOpen.appendChild(document.createTextNode("\u00a0Open"));
var aActionFavourite = document.createElement("a"); divActionsDropdown.appendChild(aActionFavourite);
aActionFavourite.setAttribute("href", "#");
aActionFavourite.className = "dropdown-item";
var iconActionFavourite = document.createElement("i"); aActionFavourite.appendChild(iconActionFavourite);
iconActionFavourite.className = "fas fa-heart color-favouritecount";
if (item.IsFavourite) {
aActionFavourite.onclick = function () { RemoveFromFavourites(item.Id); return false; }
aActionFavourite.appendChild(document.createTextNode("\u00a0Remove from favourites"));
}
else {
aActionFavourite.onclick = function () { AddToFavourites(item.Id); return false; }
aActionFavourite.appendChild(document.createTextNode("\u00a0Add to favourites"));
}
var aActionInspect = document.createElement("a"); divActionsDropdown.appendChild(aActionInspect);
aActionInspect.setAttribute("href", "/Home/Index/" + item.Id);
aActionInspect.className = "dropdown-item";
var iconActionInspect = document.createElement("i"); aActionInspect.appendChild(iconActionInspect);
iconActionInspect.className = "fas fa-search color-inspect";
aActionInspect.appendChild(document.createTextNode("\u00a0Inspect"));
var aActionEmail = document.createElement("a"); divActionsDropdown.appendChild(aActionEmail);
aActionEmail.setAttribute("href", "#");
aActionEmail.onclick = function () { EmailTopiq.openEmailDialog(item.Id); return false; }
aActionEmail.className = "dropdown-item";
var iconActionEmail = document.createElement("i"); aActionEmail.appendChild(iconActionEmail);
iconActionEmail.className = "fa fa-envelope color-email";
aActionEmail.appendChild(document.createTextNode("\u00a0Email"));
if (item.CanEdit) {
var aActionEdit = document.createElement("a"); divActionsDropdown.appendChild(aActionEdit);
aActionEdit.setAttribute("href", "/Home/Edit/" + item.Id);
aActionEdit.className = "dropdown-item";
var iconActionEdit = document.createElement("i"); aActionEdit.appendChild(iconActionEdit);
iconActionEdit.className = "far fa-edit color-edit";
aActionEdit.appendChild(document.createTextNode("\u00a0Edit"));
var aActionDelete = document.createElement("a"); divActionsDropdown.appendChild(aActionDelete);
aActionDelete.setAttribute("href", "#");
aActionDelete.onclick = function () { DeleteTopiq.confirmDeleteTopiq(item.Id, item.Name); return false; }
aActionDelete.className = "dropdown-item";
var iconActionDelete = document.createElement("i"); aActionDelete.appendChild(iconActionDelete);
iconActionDelete.className = "fas fa-times color-delete";
aActionDelete.appendChild(document.createTextNode("\u00a0Delete"));
}
//var itemTitle = "";
var itemName = item.Name;
if (itemName.length > 20) {
itemName = itemName.substr(0, 17) + " ..";
//itemTitle = item.Name;
}
var aLabel = document.createElement("a"); item.divItem.appendChild(aLabel);
aLabel.appendChild(document.createTextNode(itemName));
aLabel.setAttribute("href", "/Home/Index/" + item.Id);
aLabel.setAttribute("data-topiqId", item.Id);
aLabel.setAttribute("data-topiqName", item.Name);
aLabel.style.whiteSpace = "nowrap";
aLabel.className = "top-masonry-linq-label"
//if (itemTitle) {
// aLabel.setAttribute("title", itemTitle);
//}
},
calculateMasonHeight: function () {
var ulMineParent = TopMine.ulMine.parentNode;
var divDummy = document.createElement("div"); document.body.appendChild(divDummy);
divDummy.style.position = "absolute";
divDummy.style.left = "-10000px";
divDummy.style.top = "-10000px";
divDummy.appendChild(TopMine.ulMine);
var props = {
grid: '.top-masonry',
gridCell: '.top-masonry-brick',
gridGutter: 20,
columns: 3
}
calculateMasonHeight(props.grid, props.gridCell, props.gridGutter, props.columns);
function calculateMasonHeight(grid, gridCell, gridGutter, columns) {
var g = document.getElementById("ulTopMine"),// document.querySelector(grid),
gc = document.querySelectorAll(gridCell),
gcLength = gc.length,
totalHeight = 0;
for (var i = 0; i < gcLength; ++i) {
totalHeight += gc[i].offsetHeight + parseInt(gridGutter);
}
var masonHeight = totalHeight / columns + totalHeight / (gcLength + 1) + 100;
ulMineParent.appendChild(TopMine.ulMine);
document.body.removeChild(divDummy);
g.style.maxHeight = masonHeight + "px";
}
},
getMine: function () {
$.ajax({
url: '/Home/GetMine',
method: 'GET',
dataType: 'json',
success: function (apiResult) {
if (apiResult.error != "") {
alert("getMine server error : " + apiResult.error);
}
else if (apiResult.validation != "") {
alert("getMine server validation : " + apiResult.validation);
}
else {
TopMine.initialize(apiResult.data);
}
},
error: function (xmlHttpRequest, textStatus, errorThrown) {
alert("getMine client error : " + errorThrown);
}
});
},
drawNoTopiqs: function () {
var divTopMineDropdown = document.getElementById("divTopMineDropdown");
divTopMineDropdown.style.marginLeft = "-200px";
var divTopMine = document.getElementById("divTopMine");
divTopMine.style.width = "400px";
divTopMine.style.paddingBottom = "20px";
var h1Title = document.createElement("h1"); divTopMine.appendChild(h1Title);
h1Title.appendChild(document.createTextNode("Your Shortcuts"));
var divMessage = document.createElement("div"); divTopMine.appendChild(divMessage);
divMessage.style.textAlign = "center";
divMessage.style.marginTop = "-23px";
spanMessage = document.createElement("span"); divMessage.appendChild(spanMessage);
spanMessage.appendChild(document.createTextNode("(You have no Linqs)"));
divMessage.appendChild(document.createElement("br"));
divMessage.appendChild(document.createElement("br"));
var btnCreateLinq = document.createElement("a"); divMessage.appendChild(btnCreateLinq);
btnCreateLinq.appendChild(document.createTextNode("Create new Linq"));
btnCreateLinq.setAttribute("href", "/Home/Edit");
btnCreateLinq.className = "btn btn-primary";
},
drawNotLoggedIn: function () {
var divTopMineDropdown = document.getElementById("divTopMineDropdown");
divTopMineDropdown.style.marginLeft = "-200px";
var divTopMine = document.getElementById("divTopMine");
divTopMine.style.width = "400px";
divTopMine.style.paddingBottom = "20px";
var h1Title = document.createElement("h1"); divTopMine.appendChild(h1Title);
h1Title.appendChild(document.createTextNode("Your Shortcuts"));
var divLogin = document.createElement("div"); divTopMine.appendChild(divLogin);
divLogin.style.textAlign = "center";
divLogin.style.marginTop = "-15px";
var aLogin = document.createElement("a"); divLogin.appendChild(aLogin);
aLogin.appendChild(document.createTextNode("Sign in"));
aLogin.href = "#";
aLogin.onclick = function () { openLogin(); return false; }
aLogin.style.fontSize = "1.2rem";
}
}
</script></div>
<div id="divGridLayout">
<div id="divGridTop" class="layout-grid-item">
<div id="divTop"></div>
</div>
<div id="divGridLeft" class="layout-grid-item">
<div id="divLeft">
<style>
#divMenuLeftPopular {
padding: 5px;
background-color: white;
border-radius: 4px;
margin-bottom: 10px;
}
#divMenuLeftTools {
padding: 5px;
border-radius: 4px;
background-color: white;
}
#divMenuLeftFavourites {
padding: 5px;
border-radius: 4px;
background-color: white;
margin-top: 10px;
}
#divMenuLeftRelated {
padding: 5px;
border-radius: 4px;
background-color: white;
margin-top: 10px;
}
#divMenuLeftCategories {
padding: 5px;
border-radius: 4px;
background-color: white;
margin-top: 10px;
}
div.menuleft-header {
display: flex;
justify-content: space-between;
}
div.menuleft-url {
/*position: relative;*/
/*padding: 2px 2px 3px 3px;*/
cursor: pointer;
font-size: 0.9rem;
border-radius: 6px;
display: flex;
align-items: center;
position: relative;
}
div.menuleft-url:hover {
background-color: #E9EBEE; /* f7f7f7 */
}
img.menuleft-profilepicture {
height: 22px;
border-radius: 50%;
/*margin-right: 6px;*/
margin: 2px 6px 2px 3px;
}
img.menuleft-profilepicture:hover {
box-shadow: 0px 0px 0px 2px rgba(0, 140, 255, 0.62);
-moz-box-shadow: 0px 0px 0px 2px rgba(0, 140, 255, 0.62);
-webkit-box-shadow: 0px 0px 0px 2px rgba(0, 140, 255, 0.62);
}
.menuleft-pop-name {
align-self: stretch;
display: inline-block;
width: 110px !important;
padding-top: 2px;
}
.menuleft-ellipsis {
width: 145px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
</style>
<style>
#divMenuLeftBookmark {
position: relative;
margin-top: 10px;
background-color: white;
border-radius: 4px;
height: 110px;
cursor: pointer;
box-shadow: 0 3px 3px 0 rgba(255, 0, 0, 0.4), -3px -2px 3px 0 rgba(255, 0, 0, 0.4);
}
#divMenuLeftBookmark.divMenuLeftBookmark {
position: relative;
margin-top: 10px;
background-color: white;
/*padding: 5px;*/
border-radius: 4px;
height: 110px;
cursor: pointer;
box-shadow: 0 3px 3px 0 rgba(0, 0, 255, 0.4), -3px -2px 3px 0 rgba(0, 0, 255, 0.4);
}
#divMenuLeftBookmarkArrow {
box-sizing: border-box;
position: absolute;
/*left: 1px;*/
right: 5px;
bottom: -1px;
}
#divMenuLeftBookmarkArrow::after {
content: "";
position: absolute;
width: 0;
height: 0;
box-sizing: border-box;
border: 40px solid black;
border-color: transparent transparent white white;
transform-origin: 0 0;
transform: rotate(-135deg);
box-shadow: -3px 3px 3px 0 rgba(255, 0, 0, 0.4);
}
#divMenuLeftBookmarkArrow.divMenuLeftBookmarkArrow::after {
content: "";
position: absolute;
width: 0;
height: 0;
box-sizing: border-box;
border: 40px solid black;
border-color: transparent transparent white white;
transform-origin: 0 0;
transform: rotate(-135deg);
box-shadow: -3px 6px 3px 0 rgba(0, 0, 255, 0.4);
}
</style>
<div id="divMenuLeftBookmark" style="display:none;z-index:10000">
<div id="divMenuLeftBookmarkArrow"></div>
<div style="padding:5px 0px 5px 0px;height:100%;display:flex;justify-content:space-between;align-items:center;">
<i id="iMenuLeftBookmark" class="far fa-bookmark" style="font-size:3.4rem;color:red;margin-left:6px; margin-right:6px;"></i>
<span id="spanMenuLeftBookmark" style="font-size:15px;">
Bookmark this Topiq. <!-- start a collection -->
</span>
</div>
</div>
<div id="divMenuLeftTools">
<div class="menuleft-header">
<span class="menu-category">Tools</span>
<div style="position:relative;margin-right:10px;margin-top:-6px;">
<i class="fas fa-wrench" style="font-size:0.8rem;color:orange"></i>
</div>
</div>
<div id="divMenuLeftAdhocLinks" style="display:flex;align-items:center;">
<i class="fab fa-bitbucket color-bucket" style="font-size:1.2em;margin-right:12px;margin-left:6px;"></i>
<a href="/Tool/AdhocLinks">Link Bucket</a>
</div>
<div id="divMenuLeftPages">
<div style="display:flex;align-items:center;position:relative;">
<i class="far fa-newspaper color-pages" style="font-size:1.2em;margin-right:10px;margin-left:5px;"></i>
<a href="/Page/Mine">Pages</a>
<a href="#" onclick="openLogin(null, null, '/Page/Edit'); return false;" class="btn btn-primary btn-sm" style="position:absolute;right:10px;padding:.25rem .4rem;font-size:.875rem;line-height:.5;border-radius:.2rem;"><i class="far fa-plus"></i></a>
</div>
</div>
<div id="divMenuLeftShortcuts" style="display:none;">
<i class="fas fa-bolt" style="font-size:1.2em;color:orange;"></i>
Shortcuts
</div>
<div id="divMenuLeftGroups" style="display:none;">
<i class="fas fa-users" style="font-size:1.2em;color:orange;"></i>
Groups
</div>
<div id="divMenuLeftNews" style="display:none;">
<i class="fas fa-rss" style="font-size:1.2em;color:orange;"></i>
News
</div>
<div id="divMenuLeftPlaylists" style="display:none;">
<i class="fab fa-itunes-note" style="font-size:1.2em;color:orange;"></i>
Playlists
</div>
</div>
<div id="divMenuLeftFavourites" style="display:none;">
<div class="menuleft-header">
<span class="menu-category">Favourites</span>
<div style="margin-right:10px;position:relative;margin-top:-6px;">
<i class="fas fa-heart color-favouritecount" style="font-size:0.8rem;"></i>
</div>
</div>
<div style="text-align:right;position:relative;margin-top:-8px;">
<a href="/Home/Mine?favourites=1" style="font-size:0.8rem;">All Favourites</a>
</div>
</div>
<div id="divMenuLeftRelated" style="display:none;">
<div class="menuleft-header">
<span class="menu-category">Related</span>
</div>
<div style="text-align:right;position:relative;margin-top:-8px;">
</div>
</div>
<div id="divMenuLeftCategories" style="display:none;">
<div class="menuleft-header">
<span class="menu-category">Categories</span>
</div>
<div style="text-align:right;position:relative;margin-top:-8px;">
<a href="/Home/Mine?favourites=1" style="font-size:0.8rem;">Preferences</a>
</div>
</div>
<script>
$(function () {
Topiqs.Preview.User.initializeUserPopover({
isPreloaded: false,
cssTrigger: 'profileActionImage-menuLeft'
});
Topiqs.Preview.Topiq.initializeTopiqPopover({
isPreloaded: false,
cssTrigger: 'menuleft-pop-name'
});
});
</script>
<script>
$(function () {
MenuLeft.showFavourites = Topiqs.Globals.isLoggedIn && false;
MenuLeft.showRelated = Topiqs.Globals.isInspect && false;
MenuLeft.showCategories = false && false;
if (MenuLeft.showFavourites) {
var divMenuLeftFavourites = document.getElementById("divMenuLeftFavourites");
divMenuLeftFavourites.style.display = "block";
}
if (MenuLeft.showRelated) {
var divMenuLeftRelated = document.getElementById("divMenuLeftRelated");
divMenuLeftRelated.style.display = "block";
}
if (MenuLeft.showCategories) {
var divMenuLeftCategories = document.getElementById("divMenuLeftCategories");
divMenuLeftCategories.style.display = "block";
}
/* Bookmark */
if (false && Topiqs.Globals.isInspect && !Topiqs.Globals.isLoggedIn) {
var divMenuLeftBookmark = document.getElementById("divMenuLeftBookmark");
divMenuLeftBookmark.style.display = "block";
$('#divMenuLeftBookmark').popover({
trigger: 'hover',
placement: 'top',
html: true,
title: '<img src="/Images/topiqs.png" style="height:16px;" /> Topiqs',
content: 'Topiqs allows you to collect all kinds of <b>interesting things</b> you find on the Internet, organize it, comment on it and share it.<br /><br />Using Topiqs you can work together with other people to both collect and <b>create information</b> and other people can follow you or follow your content.'
});
divMenuLeftBookmark.onmouseover = function () {
var spanMenuLeftBookmark = document.getElementById("spanMenuLeftBookmark");
spanMenuLeftBookmark.style.color = "blue";
var iMenuLeftBookmark = document.getElementById("iMenuLeftBookmark");
iMenuLeftBookmark.style.color = "blue";
var divMenuLeftBookmark = document.getElementById("divMenuLeftBookmark");
divMenuLeftBookmark.classList.add("divMenuLeftBookmark");
var divMenuLeftBookmarkArrow = document.getElementById("divMenuLeftBookmarkArrow");
divMenuLeftBookmarkArrow.classList.add("divMenuLeftBookmarkArrow");
}
divMenuLeftBookmark.onmouseout = function () {
var spanMenuLeftBookmark = document.getElementById("spanMenuLeftBookmark");
spanMenuLeftBookmark.style.color = "black";
var iMenuLeftBookmark = document.getElementById("iMenuLeftBookmark");
iMenuLeftBookmark.style.color = "red";
var divMenuLeftBookmark = document.getElementById("divMenuLeftBookmark");
divMenuLeftBookmark.classList.remove("divMenuLeftBookmark");
var divMenuLeftBookmarkArrow = document.getElementById("divMenuLeftBookmarkArrow");
divMenuLeftBookmarkArrow.classList.remove("divMenuLeftBookmarkArrow");
}
divMenuLeftBookmark.onclick = function () {
Topiqs.Favourites.promiseBookmark(Topiqs.Globals.urlId);
openLogin();
}
}
});
var MenuLeft = {
showFavourites: false,
showRelated: false,
showCategories: false
}
</script>
<script>
function menuLeft_pageShortcut_mouseover(pageId) {
var imgPageShortcut = document.getElementById("imgPageShortcut" + pageId);
if (imgPageShortcut) {
imgPageShortcut.style.display = "inline";
}
else {
var iconPageShortcut = document.getElementById("iconPageShortcut" + pageId)
if (iconPageShortcut) {
iconPageShortcut.style.display = "inline";
}
}
}
function menuLeft_pageShortcut_mouseout(pageId) {
var imgPageShortcut = document.getElementById("imgPageShortcut" + pageId);
if (imgPageShortcut) {
imgPageShortcut.style.display = "none";
}
else {
var iconPageShortcut = document.getElementById("iconPageShortcut" + pageId)
if (iconPageShortcut) {
iconPageShortcut.style.display = "none";
}
}
}
</script></div>
</div>
<div id="divGridMain" class="layout-grid-item">
<div id="divMain">
<style>
.tooltip.left {
margin-left: 50px;
}
table.urlopener {
width: 700px;
}
table.urlopener th {
width: 100px;
}
table.urlopener ul {
margin: 0;
padding: 0;
list-style: none;
}
.tab-pane {
padding: 10px 0;
}
img.howto-disable-popupblocker {
max-width: 600px;
}
div.divUrlActions {
display: table;
}
div.divUrlActions a {
display: table-cell;
vertical-align: middle;
}
div.divUrlActions span.spacer {
padding-left: 20px;
}
</style>
<script>
Topiqs.Globals.isHome = true;
$(function () {
Feed.feedContent = Feed.FeedContent.Home;
});
</script>
<style>
div.divFeedItem {
background-color: #fff;
padding: 0px;
margin-bottom: 12px;
border-width: 0px 0 1px 0;
border-style: solid;
border-color: #eee;
border-radius: 4px;
}
div.divFeedItemHeader {
padding: 5px 10px 5px 10px;
border-bottom: solid 1px #eee;
display: flex;
justify-content: space-between;
line-height: 32px;
align-items:center;
}
div.divFeedItemBody {
padding: 10px 10px 5px 10px;
/*overflow:hidden; /* overflow: hidden | auto will fix ckeditor float classes */
/*max-height:200px;*/
}
div.divFeedDescription {
overflow: hidden;
/*white-space:nowrap;*/
text-overflow: ellipsis;
/*text-overflow:clip;*/
}
div.divFeedItemChildUrls {
padding: 5px 10px 0px 10px;
/*border-top: solid 1px #eee;*/ /*after ViewTabs this line is not relevant */
}
.nav-tabs {
border-bottom: 1px solid #eee;
}
</style>
<div id="divFeedContainer"></div>
<script>
var videoCurrentSrcs = {};
function toggleVideo(urlId, videoSrc) {
if (typeof (videoCurrentSrcs[urlId]) == "undefined" || videoCurrentSrcs[urlId] == "") {
openVideo(urlId, videoSrc);
window.scrollBy(0, 300);
}
else if (videoCurrentSrcs[urlId] == videoSrc) {
closeVideo(urlId);
}
else {
closeVideo(urlId);
openVideo(urlId, videoSrc);
}
}
function openVideo(urlId, videoSrc) {
videoCurrentSrcs[urlId] = videoSrc;
var divChildUrls = document.getElementById("divChildUrlsFeed" + urlId);
var iframe = document.createElement("iframe"); divChildUrls.insertBefore(iframe, divChildUrls.firstChild);
iframe.style.width = "448px"; // "560px";
iframe.style.height = "252px"; // "315px";
iframe.src = videoSrc;
iframe.setAttribute("frameborder", "0");
iframe.setAttribute("allow", "autoplay; encrypted-media");
iframe.setAttribute("allowfullscreen", "");
}
function closeVideo(urlId) {
videoCurrentSrcs[urlId] = "";
var divChildUrls = document.getElementById("divChildUrlsFeed" + urlId);
var iframe = divChildUrls.getElementsByTagName("IFRAME")[0];
divChildUrls.removeChild(iframe);
}
</script>
<script>
Comments.initialize({ isLoggedIn: Topiqs.Globals.isLoggedIn, userId: Topiqs.Globals.userId, baseUrl: Topiqs.Globals.baseUrl });
</script>
<script>
$(function () {
Feed.getFeed();
});
</script>
</div>
</div>
<div id="divGridRight" class="layout-grid-item">
<div id="divRight">
<style>
#divMenuRightFeatured {
padding: 5px;
background-color: white;
border-radius: 4px;
position: relative;
}
#divMenuRightFeaturedInner:hover {
background-color: #fafafa;
}
/*#divMenuRightBookmark {
position: relative;
margin-top: 10px;
background-color: white;
border-radius: 4px;
height: 110px;
cursor: pointer;
box-shadow: 0 3px 3px 0 rgba(255, 0, 0, 0.4), -3px -2px 3px 0 rgba(255, 0, 0, 0.4);
}
#divMenuRightBookmark.divMenuRightBookmark {
position: relative;
margin-top: 10px;
background-color: white;
border-radius: 4px;
height: 110px;
cursor: pointer;
box-shadow: 0 3px 3px 0 rgba(0, 0, 255, 0.4), -3px -2px 3px 0 rgba(0, 0, 255, 0.4);
}
#divMenuRightBookmarkArrow {
box-sizing: border-box;
position: absolute;
left: 1px;
top: -2px;
}
#divMenuRightBookmarkArrow::after {
content: "";
position: absolute;
width: 0;
height: 0;
box-sizing: border-box;
border: 40px solid black;
border-color: transparent transparent white white;
transform-origin: 0 0;
transform: rotate(45deg);
box-shadow: -3px 3px 3px 0 rgba(255, 0, 0, 0.4);
}
#divMenuRightBookmarkArrow.divMenuRightBookmarkArrow::after {
content: "";
position: absolute;
width: 0;
height: 0;
box-sizing: border-box;
border: 40px solid black;
border-color: transparent transparent white white;
transform-origin: 0 0;
transform: rotate(45deg);
box-shadow: -3px 6px 3px 0 rgba(0, 0, 255, 0.4);
}*/
#divMenuRightChromeExtension {
margin-top: 10px;
background-color: white;
padding: 5px;
border-radius: 4px;
}
#divMenuRightLegal {
margin-top: 10px;
padding: 0 5px;
color: #666;
font-size: 0.9rem;
/*background-color: #f5f5f5;*/
}
#divMenuRightLegal a {
color: #999;
}
img.pageLink-staticImage {
width: 160px;
}
img.pageLink-staticImage:hover {
opacity:0.7;
}
</style>
<div id="divMenuRightFeatured" style="display:none;">
<span class="menu-category">Featured</span>
<div id="divMenuRightFeaturedInner" style="cursor:pointer;">
<h5 id="h5FeaturedTitle" style="color:blue;text-align:center;"></h5>
<div id="divMenuRightFeaturedInnerImage" style="text-align:center;"></div>
</div>
<div id="divMenuRightFeaturedControls" style="position:absolute;top:0;right:0;display:none;"></div>
</div>
<div id="divMenuRightBookmark" style="display:none;z-index:10000;">
<div id="divMenuRightBookmarkArrow"></div>
<div style="padding:5px 12px 5px 5px;height:100%;display:flex;justify-content:space-between;align-items:center;">
<span id="spanMenuRightBookmark" style="font-size:15px;">
Bookmark this Topiq, start a collection.
</span>
<i id="iMenuRightBookmark" class="far fa-bookmark" style="font-size:3.6rem;color:red;"></i>
</div>
</div>
<div id="divMenuRightChromeExtension" style="display:none;justify-content:space-between;">
<div>
<span class="menu-category">Chrome Extension</span>
<br />
<div>
<img src="/Images/topiqs.png" style="height:16px;margin-right:2px;margin-left:2px;margin-top:-1px;" />
<span style="font-size:0.9rem;"><span style="font-weight:bold;">Clear your tabs</span><br />Save as Links & Topiqs.</span>
</div>
</div>
<div onclick="layoutInstallChromeExtension();" class="btn-circle" style="width:54px;height:54px;font-size:2rem;padding-top:8px;margin-top:2px;">+</div>
</div>
<div id="divMenuRightLegal" style="display:none;">
<span style="color:#333;">Copyright © 2019</span> | <a href="/Home/Tos">Terms of Service</a> | <a href="/Home/Privacy">Privacy Policy</a> | <a href="/Home/Api" style="color:#000;">API</a> | <a href="/Home/Examples">Examples</a> | <a href="/Home/About">About</a> | <a href="/Home/Contact">Contact</a>
</div>
<div id="divMenuRightPage" style="display:none;position:relative;"></div>
<script>
var pageId = 0;
$(function () {
if (pageId) {
Page.get(pageId);
}
else {
Featured.initialize();
var divMenuRightLegal = document.getElementById("divMenuRightLegal");
divMenuRightLegal.style.display = "block";
if (Topiqs.Browser.getBrowserAgent() == Topiqs.Browser.BrowserAgentEnum.Chrome) {
BrowserExtensions.Chrome.testIfChromeExtensionIsInstalled(false, function (extensionIsInstalled) {
if (extensionIsInstalled) {
// don't display the install menu
}
else {
var divMenuRightChromeExtension = document.getElementById("divMenuRightChromeExtension");
divMenuRightChromeExtension.style.display = "flex";
}
});
}
}
/* Bookmark - moved to left side */
if (false && Topiqs.Globals.isInspect && !Topiqs.Globals.isLoggedIn) {
var divMenuRightBookmark = document.getElementById("divMenuRightBookmark");
divMenuRightBookmark.style.display = "block";
$('#divMenuRightBookmark').popover({
trigger: 'hover',
placement: 'top',
html: true,
title: '<img src="/Images/topiqs.png" style="height:16px;" /> Topiqs',
content: 'Topiqs allows you to collect all kinds of <b>interesting things</b> you find on the Internet, organize it, comment on it and share it.<br /><br />Using Topiqs you can work together with other people to both collect and <b>create information</b> and other people can follow you or follow your content.'
});
divMenuRightBookmark.onmouseover = function () {
var spanMenuRightBookmark = document.getElementById("spanMenuRightBookmark");
spanMenuRightBookmark.style.color = "blue";
var iMenuRightBookmark = document.getElementById("iMenuRightBookmark");
iMenuRightBookmark.style.color = "blue";
var divMenuRightBookmark = document.getElementById("divMenuRightBookmark");
divMenuRightBookmark.classList.add("divMenuRightBookmark");
var divMenuRightBookmarkArrow = document.getElementById("divMenuRightBookmarkArrow");
divMenuRightBookmarkArrow.classList.add("divMenuRightBookmarkArrow");
}
divMenuRightBookmark.onmouseout = function () {
var spanMenuRightBookmark = document.getElementById("spanMenuRightBookmark");
spanMenuRightBookmark.style.color = "black";
var iMenuRightBookmark = document.getElementById("iMenuRightBookmark");
iMenuRightBookmark.style.color = "red";
var divMenuRightBookmark = document.getElementById("divMenuRightBookmark");
divMenuRightBookmark.classList.remove("divMenuRightBookmark");
var divMenuRightBookmarkArrow = document.getElementById("divMenuRightBookmarkArrow");
divMenuRightBookmarkArrow.classList.remove("divMenuRightBookmarkArrow");
}
divMenuRightBookmark.onclick = function () {
Topiqs.Favourites.promiseBookmark(Topiqs.Globals.urlId);
openLogin();
}
}
});
</script>
<script>
var Page = {
divMenuRightPage: null,
vmPage: null,
initialize: function () {
Page.divMenuRightPage = document.getElementById("divMenuRightPage");
divMenuRightPage.style.display = "block";
Page.drawPageLinks();
},
drawPageLinks: function () {
while (Page.divMenuRightPage.hasChildNodes()) { Page.divMenuRightPage.removeChild(Page.divMenuRightPage.lastChild); }
var pageLogo = Page.vmPage.Logo;
var pageLogoThumb = Page.vmPage.LogoThumb;
var currentUrlShort = "-";
var currentUrlLong = "-";
var locationHref = location.href.toLowerCase();
if (locationHref.lastIndexOf("topiqs.online")) {
var path = location.pathname;
var lastIndexOfSlash = path.lastIndexOf('/');
if (path.length >= lastIndexOfSlash + 1) {
let topiqId = path.substring(lastIndexOfSlash + 1);
if (!isNaN(topiqId)) {
var baseUrl = location.protocol + "//" + location.host;
currentUrlShort = baseUrl + "/" + topiqId;
currentUrlLong = baseUrl + "/home/index/" + topiqId;
}
}
}
var LinkTypes = {
Spacer: 0,
Header: 1,
Image: 2,
Url: 3,
Custom: 4
}
for (var pl = 0; pl < Page.vmPage.PageLinks.length; pl++) {
var pageLink = Page.vmPage.PageLinks[pl];
var isPublished = pageLink.IsPublished;
var linkFavicon = pageLink.Favicon;
var linkUrl = pageLink.Url; //.toLowerCase();
var linkName = pageLink.Name;
var linkNameToUse = linkName || linkUrl;
var linkResourceUrl = pageLink.ResourceUrl;
var linkDescription = pageLink.Description;
linkDescription = Topiqs.Utils.htmlImagesToThumbs(linkDescription);
var linkType;
if (linkResourceUrl) {
linkType = LinkTypes.Image
}
else if (linkUrl) {
linkType = LinkTypes.Url;
}
else if (linkName && !(linkUrl || linkResourceUrl)) {
linkType = LinkTypes.Header;
}
else if (linkDescription && !(linkUrl || linkName || linkResourceUrl)) {
linkType = LinkTypes.Custom;
}
else { // if (!(linkUrl || linkName || linkResourceUrl || linkDescription))
linkType = LinkTypes.Spacer;
}
var divPageLink = document.createElement("div"); Page.divMenuRightPage.appendChild(divPageLink);
divPageLink.setAttribute("id", "divPageLink" + pageLink.Id); // not in use, only for testing popover container
divPageLink.style.display = "flex";
divPageLink.style.alignItems = "center";
var iconNotPublished_right = 1;
if (linkType == LinkTypes.Spacer) { // spacer
divPageLink.style.height = "30px";
}
else if (linkType == LinkTypes.Custom) { // custom
divPageLink.style.paddingLeft = "4px";
var divCustom = document.createElement("div"); divPageLink.appendChild(divCustom);
divCustom.innerHTML = linkDescription;
}
else {
var haveDescription = linkDescription && linkDescription.length > 0;
var activeSymbolClass = haveDescription ? "fas fa-circle" : "far fa-circle";
var activeSymbolColor = "black"; // isActive ? "blue" : "black";
var spanActiveSymbol = document.createElement("span");
var activeSymbolPopoverTrigger = haveDescription ? "activeSymbol-pageLink" : "";
divPageLink.className = activeSymbolPopoverTrigger;
if (haveDescription) {
linkDescription = Topiqs.Utils.sanitizeImageUrls(linkDescription);
divPageLink.setAttribute("data-content", linkDescription.replace(",", ","));
divPageLink.setAttribute("data-title", linkNameToUse.replace(",", ","));
}
if (linkType == LinkTypes.Header) { // header
divPageLink.style.padding = "4px 4px";
var spanHeader = document.createElement("span"); divPageLink.appendChild(spanHeader);
spanHeader.style.fontWeight = "bold";
spanHeader.style.fontSize = "1.1rem";
spanHeader.appendChild(document.createTextNode(linkName));
iconNotPublished_right = 1; // something strange is going on
}
else { // Image | Url
/* activeSymbol - currently not attached */
spanActiveSymbol.className = activeSymbolClass + " topiq-descriptionCircle";
spanActiveSymbol.style.color = activeSymbolColor;
spanActiveSymbol.style.position = "relative";
spanActiveSymbol.style.fontSize = "0.6rem";
spanActiveSymbol.style.top = "3px";
//divPageLink.appendChild(spanActiveSymbol); -- not attached
/* favicon */
if (!linkResourceUrl) {
var divFavicon = document.createElement("div"); divPageLink.appendChild(divFavicon);
divFavicon.className = "topiq-divFavicon";
if (linkUrl) {
var imgFavicon = document.createElement("img"); divFavicon.appendChild(imgFavicon);
imgFavicon.src = linkFavicon ? Topiqs.Globals.urlFaviconsFolder + linkFavicon : "/FileServer/PageLogos/" + pageLogoThumb;// Topiqs.Globals.urlTopicsLogo;
imgFavicon.style.height = "16px";
imgFavicon.style.width = "16px";
imgFavicon.style.top = "-1px";
//imgFavicon.style.marginLeft = "6px";
}
else if (linkResourceUrl) {
var iconFavicon = document.createElement("i"); divFavicon.appendChild(iconFavicon);
iconFavicon.className = "far fa-image";
iconFavicon.style.position = "relative";
iconFavicon.style.marginRight = "6px";
//iconFavicon.style.top = "1px";
iconFavicon.style.color = "red";
}
}
/* Url */
if (linkType == LinkTypes.Image) { // linkResourceUrl
var imgPageLink = document.createElement("img");
imgPageLink.onload = function () {
Topiqs.Utils.executePageUpdateHandlers();
}
imgPageLink.className = "pageLink-staticImage";
Topiqs.Utils.setImageSrc(imgPageLink, linkResourceUrl);
if (linkUrl) {
var aPageLink = document.createElement("a"); divPageLink.appendChild(aPageLink);
var isVideo = false; // urlChild.ResourceType == Topiqs.Globals.resourceTypeEnum.Video
if (isVideo) {
//aPageLink.setAttribute("href", "#");
//aPageLink.urlId = Topiqs.ListView.urlId;
//aPageLink.url = url;
//aPageLink.onclick = function () { Topiqs.Video.toggleVideo(this.urlId, this.url); return false; }
}
else {
aPageLink.setAttribute("href", linkUrl);
if (linkUrl.toLowerCase().indexOf("topiqs.online") == -1) {
aPageLink.setAttribute("target", "_blank");
}
}
aPageLink.style.marginTop = "3px";
aPageLink.appendChild(imgPageLink);
}
else {
imgPageLink.style.marginLeft = "6px";
imgPageLink.style.marginTop = "3px";
divPageLink.appendChild(imgPageLink);
}
}
else {
var aPageLink = document.createElement("a"); divPageLink.appendChild(aPageLink);
aPageLink.appendChild(document.createTextNode(linkNameToUse));
var isVideo = false; // urlChild.ResourceType == Topiqs.Globals.resourceTypeEnum.Video
if (isVideo) {
//aPageLink.setAttribute("href", "#");
//aPageLink.urlId = Topiqs.ListView.urlId;
//aPageLink.url = url;
//aPageLink.onclick = function () { Topiqs.Video.toggleVideo(this.urlId, this.url); return false; }
}
else {
//if (!url.toLowerCase().startsWith("http")) {
// url = Topiqs.Views.Config.baseUrl + (url.startsWith('/') ? url : '/' + url);
//}
aPageLink.setAttribute("href", linkUrl);
if (linkUrl.toLowerCase().indexOf("topiqs.online") == -1) {
aPageLink.setAttribute("target", "blank");
}
}
aPageLink.className = "urlChild";
aPageLink.style.display = "block"; /* text-overflow does not work on achors except if display=block */
//if (Topiqs.ListView.overflow == "hidden") {
aPageLink.style.whiteSpace = "nowrap";
aPageLink.style.overflow = "hidden";
aPageLink.style.textOverflow = "ellipsis";
//}
aPageLink.style.marginLeft = "6px";
aPageLink.style.width = "150px";
}
if (linkUrl == currentUrlShort || linkUrl == currentUrlLong) {
divPageLink.style.backgroundColor = "#f3f3f3";
divPageLink.style.borderRadius = "4px";
}
}
}
if (!isPublished) {
var iconNotPublished = document.createElement("i"); divPageLink.appendChild(iconNotPublished);
iconNotPublished.className = "fas fa-do-not-enter";
iconNotPublished.style.position = "absolute";
iconNotPublished.style.right = iconNotPublished_right + "px";
iconNotPublished.style.color = "#DF0B0B";
}
}
//$('.activeSymbol-pageLink').popover({
// trigger: 'hover',
// placement: 'left',
// html: true,
// //title: function () {
// // var dataTitle = $this.attr("data-title");
// // return dataTitle;
// //},
// //content: function () {
// // var dataContent = $this.attr("data-content");
// // console.log(dataContent);
// // return dataContent;
// //}
//});
$('div.activeSymbol-pageLink').each(function () {
var $this = this;
($(this)).popover({
trigger: 'hover',
placement: 'left',
container: $this,
html: true
});
});
Topiqs.Utils.executePageUpdateHandlers();
},
get: function (pageId) {
$.ajax({
url: '/Page/GetPage?id=' + pageId,
method: 'get',
dataType: 'json',
success: function (apiResult) {
if (apiResult.error) {
alert("Page.get server error : " + apiResult.error);
}
else if (apiResult.validation) {
alert("Page.get server validation : " + apiResult.validation);
}
else {
Page.vmPage = apiResult.data;
Page.initialize();
}
},
error: function (xmlHttpRequest, textStatus, errorThrown) {
alert("Page.get client error : " + errorThrown);
}
});
}
}
</script>
<script>
var Featured = {
isAdmin: false,
featured: null,
initialize: function () {
Featured.isAdmin = false;
Featured.getFeatured();
},
drawFeatured: function () {
var divMenuRightFeatured = document.getElementById("divMenuRightFeatured");
var featured = Featured.featured;
if (!featured) {
divMenuRightFeatured.style.display = "none";
return;
}
else {
divMenuRightFeatured.style.display = "block";
}
var divMenuRightFeaturedControls = document.getElementById("divMenuRightFeaturedControls");
while (divMenuRightFeaturedControls.hasChildNodes()) { divMenuRightFeaturedControls.removeChild(divMenuRightFeaturedControls.lastChild); }
var divMenuRightFeaturedInner = document.getElementById("divMenuRightFeaturedInner");
divMenuRightFeaturedInner.onclick = function () { location.href = "/Home/Index/" + featured.UrlId; }
var h5FeaturedTitle = document.getElementById("h5FeaturedTitle");
while (h5FeaturedTitle.hasChildNodes()) { h5FeaturedTitle.removeChild(h5FeaturedTitle.lastChild); }
h5FeaturedTitle.appendChild(document.createTextNode(featured.UrlName));
var description = featured.Description;
var divDummy = document.createElement("div");
divDummy.innerHTML = description;
var images = divDummy.getElementsByTagName("img");
if (images.length == 0) {
var childUrls = featured.UrlChilds;
for (var cu = 0; cu < childUrls.length; cu++) {
var childUrl = childUrls[cu];
if (childUrl.Description) {
divDummy.innerHTML = childUrl.Description;
images = divDummy.getElementsByTagName("img");
if (images.length > 0) {
break;
}
}
}
}
if (images.length > 0) {
var firstImage = images[0];
firstImage.style.maxWidth = "100%";
firstImage.style.maxHeight = "200px";
var divMenuRightFeaturedInnerImage = document.getElementById("divMenuRightFeaturedInnerImage");
while (divMenuRightFeaturedInnerImage.hasChildNodes()) { divMenuRightFeaturedInnerImage.removeChild(divMenuRightFeaturedInnerImage.lastChild); }
divMenuRightFeaturedInnerImage.appendChild(firstImage);
}
if (Featured.isAdmin && !featured.Accepted) {
divMenuRightFeatured.onmouseover = function () { divMenuRightFeaturedControls.style.display = "block"; }
divMenuRightFeatured.onmouseout = function () { divMenuRightFeaturedControls.style.display = "none"; }
var btnAccept = document.createElement("button"); divMenuRightFeaturedControls.appendChild(btnAccept);
btnAccept.setAttribute("type", "button");
btnAccept.setAttribute("id", "btnAcceptFeatured");
btnAccept.onclick = function () { Featured.acceptFeatured(); }
var iconAccept = document.createElement("i"); btnAccept.appendChild(iconAccept);
iconAccept.className = "fas fa-check";
iconAccept.style.fontSize = "1rem";
iconAccept.style.color = "blue";
var btnCancel = document.createElement("button"); divMenuRightFeaturedControls.appendChild(btnCancel);
btnCancel.setAttribute("type", "button");
btnCancel.setAttribute("id", "btnCancelFeatured");
btnCancel.onclick = function () { Featured.cancelFeatured(); }
var iconCancel = document.createElement("i"); btnCancel.appendChild(iconCancel);
iconCancel.classList = "fas fa-times";
iconCancel.style.fontSize = "1rem";
iconCancel.style.color = "red";
}
},
getFeatured: function () {
$.ajax({
url: '/Featured/GetFeatured?cc=' + Math.random(),
method: 'GET',
dataType: 'json',
success: function (apiResult) {
if (apiResult.error != "") {
alert("getFeatured server error : " + apiResult.error);
}
else if (apiResult.validation != "") {
alert("getFeatured server validation : " + apiResult.validation);
}
else {
Featured.featured = apiResult.data;
Featured.drawFeatured();
}
},
error: function (xmlHttpRequest, textStatus, errorThrown) {
alert("getFeatured client error : " + errorThrown);
}
});
},
setFeatured: function (urlId, urlName) {
bootbox.confirm({
title: "<span style='color:red'>Confirm Featuring</span>",
message: "Topiq to feature : <span style='color:blue'>" + urlName + "</span><br /><br />Are you sure you want to feature this Topiqs.",
buttons: {
confirm: {
label: "Feature",
className: "btn btn-danger"
}
},
callback: function (result) {
if (result) {
Featured.setFeaturedDoIt(urlId);
}
}
});
},
setFeaturedDoIt: function (urlId) {
$.ajax({
url: '/Featured/Feature?urlId=' + urlId,
method: 'GET',
dataType: 'json',
success: function (apiResult) {
if (apiResult.error != "") {
alert("featureTopiq server error : " + apiResult.error);
}
else if (apiResult.validation != "") {
alert("featureTopiq server validation : " + apiResult.validation);
}
else {
bootbox.alert("Topiq was featured.");
if (apiResult.data.redirectUrl && apiResult.data.redirectUrl != "") {
location.href = apiResult.data.redirectUrl;
}
else {
location.reload(true);
}
}
},
error: function (xmlHttpRequest, textStatus, errorThrown) {
alert("featureTopiq client error : " + errorThrown);
}
});
},
acceptFeatured: function () {
$.ajax({
url: '/Featured/AcceptFeatured',
method: 'GET',
dataType: 'json',
success: function (apiResult) {
if (apiResult.error != "") {
alert("acceptFeatured server error : " + apiResult.error);
}
else if (apiResult.validation != "") {
alert("acceptFeatured server validation : " + apiResult.validation);
}
else {
Featured.getFeatured();
}
},
error: function (xmlHttpRequest, textStatus, errorThrown) {
alert("acceptFeatured client error : " + errorThrown);
}
});
},
cancelFeatured: function () {
$.ajax({
url: '/Featured/CancelFeatured',
method: 'GET',
dataType: 'json',
success: function (apiResult) {
if (apiResult.error != "") {
alert("cancelFeatured server error : " + apiResult.error);
}
else if (apiResult.validation != "") {
alert("cancelFeatured server validation : " + apiResult.validation);
}
else {
Featured.getFeatured();
}
},
error: function (xmlHttpRequest, textStatus, errorThrown) {
alert("cancelFeatured client error : " + errorThrown);
}
});
}
}
</script>
<script>
function layoutInstallChromeExtension() {
BrowserExtensions.Chrome.installChromeExtension(function (success) {
var useInlineInstallation = false; // not supported by Google anymore
if (useInlineInstallation) {
if (success) {
alert('Topiq Chrome Extension successfully installed.');
}
else {
alert("Chrome Extension failed to install.");
}
}
});
}
</script>
</div>
</div>
</div>
<script>
document.addEventListener("DOMContentLoaded", () => {
var divGridLayout = document.querySelector("#divGridLayout");
var divGridLayoutRect = divGridLayout.getBoundingClientRect();
var divGridLayoutLeft = divGridLayoutRect.left;
var divMessageLeft = document.createElement("div");
divMessageLeft.style.position = "fixed";
divMessageLeft.style.top = "100px";
divMessageLeft.style.left = "0px";
divMessageLeft.style.width = divGridLayoutLeft + "px";
divMessageLeft.style.textAlign = "center";
//divMessageLeft.style.fontFamily = "'Century Gothic', 'HelveticaNeueLT Pro 45 Lt', sans-serif";
divMessageLeft.style.fontSize = "4em";
divMessageLeft.style.fontWeight = "bold";
divMessageLeft.style.color = "#ddd";
//divMessageLeft.style.textShadow = "0px 1px 0px rgba(255,255,255,.3), 0px -1px 0px rgba(0,0,0,.7)";
divMessageLeft.style.textShadow = "0px -1px 0px #444, 0px 1px 0px #aaa";
var mediaMin1920 = window.matchMedia("(min-width: 1920px)");
var bookmarkMessage = 'Organize all your bookmarks & images in one place available everywhere.<br /><br />Categorize & name your bookmark & image collections. ';
var shareMessage = 'Publish your Topiqs, Bookmark collections & Blog posts to other users - publish to everybody or publish just to your friends or your colleagues.';
var collaborateMessage = 'Work together with other users on any Topiq, any Collection & any Blog.';
var blogMessage = 'Create as many different blogs on as many different topiqs you like. Collaborate on whole blogs or just on topiqs within a blog.';
createMessage({ text: "Bookmark", fontSize: 3, marginTop: 50, textAlign: "center", padding: 0, popover: {placement: 'left', content: bookmarkMessage } });
createMessage({ text: "Share Anything", fontSize: 3, marginTop: 50, textAlign: "left", padding: 50, popover: { placement: 'right', content: shareMessage } });
createMessage({ text: "Collaborate", fontSize: 3, marginTop: 50, textAlign: "right", padding: 40, popover: { placement: 'top', content: collaborateMessage } });
createMessage({ text: "Blog", fontSize: 4, marginTop: 50, textAlign: "center", padding: 0, popover: { placement: 'top', content: blogMessage } });
document.body.appendChild(divMessageLeft);
function createMessage(options) {
if (!mediaMin1920.matches) {
options.fontSize--;
}
var divMessage = document.createElement("div");
var spanMessage = document.createElement("span"); divMessage.appendChild(spanMessage);
spanMessage.appendChild(document.createTextNode(options.text));
divMessage.style.fontSize = options.fontSize + "rem";
divMessage.style.marginTop = options.marginTop + "px";
divMessage.style.textAlign = options.textAlign;
if (options.textAlign == "left") {
divMessage.style.paddingLeft = options.padding + "px";
}
else if (options.textAlign == "right") {
divMessage.style.paddingRight = options.padding + "px";
}
divMessageLeft.appendChild(divMessage);
$(spanMessage).popover({
trigger: 'hover',
placement: options.popover.placement,
html: true,
title: options.text,
content: options.popover.content
});
}
});
</script>
<div id="divMessageLeft"></div>
<script>
var DeleteTopiq = {
confirmDeleteTopiq: function (urlId, urlName) {
bootbox.confirm({
title: "<span style='color:red'>Confirm Delete</span>",
message: "Topiq to delete : <span style='color:blue'>" + urlName + "</span><br /><br />Are you sure you want to delete this Topiqs. It will NOT be possible to retrieve it again. All statistics on the link will be lost and it will disappear from all favourites.",
buttons: {
confirm: {
label: "Delete",
className: "btn btn-danger"
}
},
callback: function (result) {
if (result) {
DeleteTopiq.deleteTopiq(urlId);
}
}
});
},
deleteTopiq: function (urlId) {
$.ajax({
url: '/Home/Delete?id=' + urlId,
method: "GET",
dataType: 'json',
success: function (apiResult) {
if (apiResult.error != "") {
alert(apiResult.error);
}
else if (apiResult.validation != "") {
alert(apiResult.validation);
}
else {
bootbox.alert("Topiq was deleted.");
if (apiResult.data.redirectUrl && apiResult.data.redirectUrl != "") {
location.href = apiResult.data.redirectUrl;
}
else {
location.reload(true);
}
}
},
error: function (xmlHttpRequest, textStatus, errorThrown) {
alert(errorThrown);
}
});
}
}
</script>
<script>
function ToggleUpvote(urlId, elmToSendBack, callback) {
$.ajax({
url: '/Vote/ToggleUpvote?urlId=' + urlId,
type: "GET",
dataType: "json",
success: function (apiResult) {
if (apiResult.error != "") {
alert("ToggleUpvote server error : " + apiResult.error);
}
else if (apiResult.validation != "") {
alert("ToggleUpvote server validation : " + apiResult.validation);
}
else {
callback(elmToSendBack, apiResult.data.isUpvoteNow);
}
},
error: function (xmlHttpRequest, textStatus, errorThrown) {
alert("ToggleUpvote client error : " + errorThrown);
}
});
}
function Upvote(urlId) {
$.ajax({
url: '/Vote/Upvote?urlId=' + urlId,
method: "GET",
dataType: "json",
success: function (apiResult) {
if (apiResult.error != "") {
alert(apiResult.error);
}
else if (apiResult.validation != "") {
alert(apiResult.validation);
}
else {
SetNoOpenCookie();
location.reload(true);
}
},
error: function (xmlHttpRequest, textStatus, errorThrown) {
alert(errorThrown);
}
});
}
function RemoveUpvote(urlId) {
$.ajax({
url: '/Vote/RemoveUpvote?urlId=' + urlId,
method: "GET",
dataType: "json",
success: function (apiResult) {
if (apiResult.error != "") {
alert(apiResult.error);
}
else if (apiResult.validation != "") {
alert(apiResult.validation);
}
else {
SetNoOpenCookie();
location.reload(true);
}
},
error: function (xmlHttpRequest, textStatus, errorThrown) {
alert(errorThrown);
}
});
}
</script>
<div id="divReportDialog" style="display:none;"></div>
<script>
function openReportDialog(urlId) {
$.ajax({
url: '/Report/GetTopiqForReport?urlId=' + urlId,
method: "GET",
dataType: "json",
success: function (apiResult) {
if (apiResult.error != "") {
alert(apiResult.error);
}
else if (apiResult.validation != "") {
alert(apiResult.validation);
}
else {
drawReportDialog(apiResult.data)
$("#divReportDialog").dialog({
modal: true,
width: 600,
title: "Report Topiq"
});
}
},
error: function (xmlHttpRequest, textStatus, errorThrown) {
alert(errorThrown);
}
});
}
function drawReportDialog(data) {
var divReportDialog = document.getElementById("divReportDialog");
while (divReportDialog.hasChildNodes()) { divReportDialog.removeChild(divReportDialog.firstChild); }
var pIntro = document.createElement("p"); divReportDialog.appendChild(pIntro);
pIntro.appendChild(document.createTextNode("Please state your reason why you think this Topiq is inappropriate."));
var divTopiqName = document.createElement("div"); divReportDialog.appendChild(divTopiqName);
var spanTopiqName = document.createElement("span"); divTopiqName.appendChild(spanTopiqName);
spanTopiqName.appendChild(document.createTextNode(data.TopiqName));
spanTopiqName.style.fontWeight = "bold";
var tbReportMessage = document.createElement("textarea"); divReportDialog.appendChild(tbReportMessage);
tbReportMessage.setAttribute("spellcheck", "false");
tbReportMessage.setAttribute("placeholder", "Reason for this Topiq to be inappropriate ...");
tbReportMessage.id = "tbReportMessage";
tbReportMessage.className = "form-control";
tbReportMessage.style.height = "100px";
var divSpacer = document.createElement("div"); divReportDialog.appendChild(divSpacer);
divSpacer.style.height = "10px";
var btnSave = document.createElement("button"); divReportDialog.appendChild(btnSave);
btnSave.appendChild(document.createTextNode("Save"));
btnSave.onclick = function (e) { Report(data.UrlId); }
btnSave.className = "btn btn-primary";
var btnCancel = document.createElement("button"); divReportDialog.appendChild(btnCancel);
btnCancel.appendChild(document.createTextNode("Cancel"));
btnCancel.onclick = function (e) { $("#divReportDialog").dialog("close"); }
btnCancel.className = "btn btn-default";
btnCancel.style.marginLeft = "5px";
}
function Report(urlId) {
var tbReportMessage = document.getElementById("tbReportMessage");
var reportMessage = tbReportMessage.value;
var model = {
UrlId: urlId,
ReportMessage: reportMessage
}
$.ajax({
url: '/Report/Report?urlId=' + urlId,
method: "POST",
dataType: "json",
contentType: 'application/json; charset=utf-8',
headers: {'RequestVerificationToken': 'CfDJ8KzgkeZ-z5tDo_n2q9Q3utKS4JEAEQMqtQh7bZcsZKOJ53RCNnTKxyrnPnTVXKYx98pi9--TbMqYMV4EvlQwf43NF7sDMN55pBFUIqA3_4O54Rx6O3XPQBpSYu_ChMBqT867nx3bhDvummO6HvCGNSo'},
data: JSON.stringify(model),
success: function (apiResult) {
if (apiResult.error != "") {
alert(apiResult.error);
}
else if (apiResult.validation != "") {
alert(apiResult.validation);
}
else {
SetNoOpenCookie();
location.reload(true);
}
},
error: function (xmlHttpRequest, textStatus, errorThrown) {
alert(errorThrown);
}
});
}
function RemoveReport(urlId) {
if (!confirm("Are you sure ?")) {
return;
}
$.ajax({
url: '/Report/RemoveReport?urlId=' + urlId,
method: "GET",
dataType: "json",
success: function (apiResult) {
if (apiResult.error != "") {
alert(apiResult.error);
}
else if (apiResult.validation != "") {
alert(apiResult.validation);
}
else {
SetNoOpenCookie();
location.reload(true);
}
},
error: function (xmlHttpRequest, textStatus, errorThrown) {
alert(errorThrown);
}
});
}
</script>
<div id="divLoginModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" style="width:320px;" role="document">
<div class="modal-content">
<div class="modal-body" style="padding:30px 40px 40px 40px;">
<input type="hidden" id="hiddenLoginBookmark" />
<input type="hidden" id="hiddenLoginTargetUrl" />
<div id="divLoginLogo" style="text-align:center;">
<img src="/Images/topiqs.png" alt="" style="height:32px;" />
</div>
<div class="color-topiq" style="margin-top:10px;text-align:center;font-size:1.6rem;">Welcome to Topiqs</div>
<div style="position:relative;top:-3px;margin-bottom:10px;text-align:center;color:#aaa;font-size:1rem;">Share link collections</div>
<div id="divLoginSocial">
<form id="formLoginModal" method="post" role="form" action="/Account/ExternalLogin?returnUrl=%2F">
<button type="submit" class="btn btn-block btn-social btn-facebook btn-social-topiq" name="provider" value="Facebook" style="font-size:0.9em;">
<i class="fab fa-facebook-f" style="margin:auto;"></i> Sign in with Facebook
</button>
<button type="submit" class="btn btn-block btn-social btn-google btn-social-topiq" name="provider" value="Google" style="font-size:0.9em;">
<span class="fab fa-google-plus-g" style="margin:auto;"></span> Sign in with Google
</button>
<button type="submit" class="btn btn-block btn-social btn-twitter btn-social-topiq" name="provider" value="Twitter" style="font-size:0.9em;margin-bottom:0;">
<span class="fab fa-twitter" style="margin:auto;"></span> Sign in with Twitter
</button>
<input name="__RequestVerificationToken" type="hidden" value="CfDJ8KzgkeZ-z5tDo_n2q9Q3utKS4JEAEQMqtQh7bZcsZKOJ53RCNnTKxyrnPnTVXKYx98pi9--TbMqYMV4EvlQwf43NF7sDMN55pBFUIqA3_4O54Rx6O3XPQBpSYu_ChMBqT867nx3bhDvummO6HvCGNSo" /></form>
</div>
<div id="divLoginDivider" class="color-topiq" style="display:flex;align-items:center;justify-content:center;height:60px;">
<div id="divLoginDividerLine" style="border-bottom:solid 1px;height:0px;width:100%;"></div>
<div id="divLoginDividerOr" style="position:absolute;width:40px;height:40px;border:solid 1px;text-align:center;background-color:white;line-height:38px;border-radius:50%;">OR</div>
</div>
<div id="divLoginLocal">
<span id="spanLoginEmailValidation" class="text-danger"></span>
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text" id="loginEmailAddOn"><i class="far fa-envelope"></i></span>
</div>
<input id="tbLoginEmail" class="form-control" placeholder="Email" aria-label="Email" aria-describedby="loginEmailAddOn" />
</div>
<span id="spanLoginPasswordValidation" class="text-danger"></span>
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text" id="loginPasswordAddOn"><i class="fas fa-lock"></i></span>
</div>
<input type="password" id="tbLoginPassword" class="form-control" placeholder="Password" autocomplete="new-password" aria-label="Password" aria-describedby="loginPasswordAddOn" />
</div>
<div id="divLoginConfirmPassword">
<span id="spanLoginConfirmPasswordValidation" class="text-danger"></span>
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text" id="loginConfirmPasswordAddOn"><i class="fas fa-lock"></i></span>
</div>
<input type="password" id="tbLoginConfirmPassword" class="form-control" placeholder="Confirm password" aria-label="Confirm Password" aria-describedby="loginConfirmPasswordAddOn" />
</div>
</div>
<button class="btn btn-danger" style="float:left;width:100px;" onclick="login_Login()">Login</button>
<button id="btnLoginRegister" class="btn btn-warning" onclick="login_Register()" style="float:right;width:100px;">Register</button>
<div id="divRegisterSpinner" style="display:none;position:relative;top:2px;width:50px;"></div>
<div style="clear:both;"></div>
<a href="#" id="btnLoginCancel" onclick="closeLogin(); return false;">Cancel</a>
<a id="aLoginForgotPassword" href="/Account/Recovery">Forgot password ?</a>
</div>
</div>
</div>
</div>
</div>
</body>
</html>