Promoted Tiles - Popup Prior to Click

Scenario

• You have a promoted tiles web part on a page
• You need to prompt the user with a dialog box prior to navigating to the link on click

Issue

• The onclick attribute is dynamically populated by the control, so it's hard to manipulate using Javascript or JQuery

Resolution

• The key is to use the mousedown event instead.
• Note: This will not support keyboard navigation so you may need to handle the keydown event as well.
• Here is the code for the Script Editor.  Adapt the URLs for your environment

<script type="text/javascript" src="/SiteAssets/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="/teams/print/SiteAssets/PromotedLinkPrompt.js"></script>

• Here is the PromotedLinkPrompt.js code

console.log("PromotedLinkPrompt.js Loaded");

localStorage.setItem("PopupContentDone", "false");

function PopupContent()
{
var done = localStorage.getItem("PopupContentDone");
if (done == "false")
{
if (confirm("Does this work?\n\nClick OK to Proceed.\nClick Cancel for More Info.")) 
{
$(this).find("a")[0].click();
}
else
{
window.location = "http://www.votematrix.com";
}
localStorage.setItem("PopupContentDone", "true");
}
}

$(document).ready(function () {$("div .ms-tileview-tile-content").mousedown(PopupContent)});

Use a JSON file in a SharePoint Library

Scenario

• You want to utilize a JSON file uploaded by an automated process to a SharePoint Document Library
• In this case we will use the SiteAssets (Site Assets) document library in an Office 365 SharePoint Online (O365) site

Issue

• If you use a direct path to the file you get the "Sorry, something went wrong"  "File Not Found." error
• Ex: https://mycompany.sharepoint.com/sites/MySite/SiteAssets/MyFile.json
• If you click on the file or get a link to the file you are given a URL to an AllItems display form which renders a file editor, but will not grant access to the JSON via script
• Ex: https://mycompany.sharepoint.com/sites/MySite/SiteAssets/Forms/AllItems.aspx?id=%2Fsites%2FMySite%2FSiteAssets%2FMyFile%2Ejson&parent=%2Fsites%2FMySite%2FSiteAssets

Resolution

• Using the Download button and Fiddler (or IE dev tools / network), you can identify the correct URL to access the raw JSON file.
• Look for the HTTPS GET for download.aspx
• Alternatively, you can use the following URL format and replace mycompany, MySite, and MyFile text with your own values:
• https://mycompany.sharepoint.com/sites/MySite/_layouts/15/download.aspx?SourceUrl=%2Fsites%2FMySite%2FSiteAssets%2FMyFile%2Ejson
• Note: This is for a site at /sites/MySite.  You may need to modify this path.
• If using JQuery, here is some code to get it:

$(document).ready(function () 
{
 $.ajax({
   type: "GET",
   url: "/sites/MySite/_layouts/15/download.aspx?SourceUrl=%2Fsites%2FMySite%2FSiteAssets%2FMyFile%2Ejson",
   success: function(result)
   {
            console.log(result[0].property1+ " - " + result[0].property2);
   }
  });
});