Skip to content

Commit

Permalink
Revise & Expand OpenGraph Support. (#135)
Browse files Browse the repository at this point in the history
* Refactor opengraph data handling & mildly expand coverage.
* Add simple OpenGraph support for raceday pages.
  • Loading branch information
robsiemb authored Mar 23, 2022
1 parent 881e625 commit c24aced
Show file tree
Hide file tree
Showing 3 changed files with 124 additions and 42 deletions.
59 changes: 23 additions & 36 deletions content/history/opengraph/opengraphdata.inc
Original file line number Diff line number Diff line change
@@ -1,23 +1,21 @@
<?php
// Helper to generate open graph metadata for certain history pages.

function getHistoryOpenGraphContent() {
// $ogMap is a map of open graph <meta> parameters (e.g. og:type, og:title, etc).
// we return an updated copy of this map.
function getHistoryOpenGraphContent($ogMap) {
if (empty($_GET['p']) ||
!in_array($_GET['p'], ['buggy', 'org'])
|| empty($_GET["urlkey"])) {
// Either we don't know how to handle this page, or we don't have a paremeter.
// Either way, No OG data.
return "";
// Either way, No new OG data.
return $ogMap;
}

$historyPage = $_GET['p'];
$urlKey = $_GET["urlkey"];
$url = "https://cmubuggy.org/history/".$historyPage."/".$urlKey."/";

$OUTPUT = "<!-- OpenGraph Metadata -->\n"
. "<meta property=\"og:type\" content= \"website\" />\n"
. "<meta property=\"og:site_name\" content=\"CMU Buggy Alumni Association\" />\n"
. "<meta property=\"og:url\" content=\"".$url."\" />\n";
$url = "https://cmubuggy.org/history/".$historyPage."/".$urlKey."/";
$ogMap["og:url"] = $url;

// TODO: Several of these extra bits require a database query, which sucks, since when the history code
// itself runs we'll likely be grabbing the same information again. For now, keep the queries simple and
Expand All @@ -26,66 +24,55 @@ function getHistoryOpenGraphContent() {

switch($historyPage) {
case "buggy":
$OUTPUT .= getBuggyExtraData($urlKey);
getBuggyExtraData($urlKey, $ogMap);
break;
case "org":
$OUTPUT .= getOrgExtraData($urlKey);
getOrgExtraData($urlKey, $ogMap);
break;
default:
die("unknown page for opengraph"); // er. what? we checked for this above.
};

return $OUTPUT;
return $ogMap;
}

function getOrgExtraData($orgUrlKey) {
function getOrgExtraData($orgUrlKey, &$ogMap) {
global $HISTORY_DATABASE;

$metaDataQuery = "SELECT shortname FROM hist_orgs o WHERE o.orgid=?;";
$metaData = dbBoundQuery($HISTORY_DATABASE, $metaDataQuery, "s", $orgUrlKey);

if ($metaData->num_rows == 1) {
$org = $metaData->fetch_assoc();
$ret = "<meta property=\"og:title\" content=\"History | Org: ".$org["shortname"]."\" />\n";
$ogMap["og:title"] = "History | Org: ".$org["shortname"];

// We could obviously also fetch the logo here, unfortuinately OpenGraph is pretentious and does not
// accept SVG as a valid image format. Thus, most of our orgs would get no image anyway (since we
// prefer SVGs for logos), and therefore we chose to skip it.

return $ret;
} else {
// Provide a reasonable title if we couldn't find the org.
$ogMap["og:title"] = "History | Unknown Org";
}

// If we do not have this org, we actually don't care that much, but we should be reasonable if we can.
return "<meta property=\"og:title\" content=\"History | Unknown Buggy\" />\n";
return $ogMap;
}

function getBuggyExtraData($buggyUrlKey) {
function getBuggyExtraData($buggyUrlKey, &$ogMap) {
global $HISTORY_DATABASE;

$metaDataQuery = "SELECT name, smugmug_slug FROM hist_buggies WHERE buggyid=?;";
$metaData = dbBoundQuery($HISTORY_DATABASE, $metaDataQuery, "s", $buggyUrlKey);

if ($metaData->num_rows == 1) {
$buggy = $metaData->fetch_assoc();
$ret = "<meta property=\"og:title\" content=\"History | Buggy: ".$buggy["name"]."\" />\n";
$ogMap["og:title"] = "History | Buggy: ".$buggy["name"];

if(!empty($buggy["smugmug_slug"])) {
$image_url = makeSmugmugUrl($buggy["smugmug_slug"], "S");
$ret .= "<meta property=\"og:image\" content=\"".$image_url."\" />\n";
$ogMap["og:image"] = makeSmugmugUrl($buggy["smugmug_slug"], "S");
}
return $ret;
} else {
// If we do not have this buggy, we actually don't care that much, but we should be reasonable if we can.
$ogMap["og:title"] = "History | Unknown Buggy";
}

// If we do not have this buggy, we actually don't care that much, but we should be reasonable if we can.
return "<meta property=\"og:title\" content=\"History | Unknown Buggy\" />\n";
}

//<meta property="og:type" content= "website" />
//<meta property="og:site_name" content="Stack Overflow" />
//<meta property="og:url" content="https://stackoverflow.com/questions/59100553/link-description-of-wordpress-site-on-discord"/>

//<meta property="og:title" content="History | Buggy: Aurora" />
//<meta property="og:image" content="https://photos.smugmug.com/photos/i-QpzjK6T/0/S/i-QpzjK6T-S.jpg" /><!--Favicon-->

//<meta property="og:image" itemprop="image primaryImageOfPage" content="https://cdn.sstatic.net/Sites/stackoverflow/Img/[email protected]?v=73d79a89bded" />

?>
80 changes: 80 additions & 0 deletions content/raceday/opengraph/opengraphdata.inc
Original file line number Diff line number Diff line change
@@ -0,0 +1,80 @@
<?php
// Helper to generate open graph metadata for raceday pages.
// $ogMap is a map of open graph <meta> parameters (e.g. og:type, og:title, etc).
// we return an updated copy of this map.
function getRacedayOpenGraphContent($ogMap) {
if (empty($_GET['p']) ||
!in_array($_GET['p'], ['rosters', 'rostersorg', 'leaderboard'])) {
// If it isn't one of these three, we don't know what to do. No changes.
return $ogMap;
}

$racedayPage = $_GET['p'];
$year = date("Y");

if(in_array($racedayPage, ['rosters', 'rostersorg'])) {
if(!empty($_GET['year'])) {
$year = $_GET['year'] * 1;
}
if ($racedayPage == "rostersorg") {
if (!empty($_GET['org'])) {
$orgUrlKey = $_GET['org'];
} else {
// If we don't have an org parameter, for OpenGraph purposes, act like this is just the regular roster page.
// Our rewrite code should prevent this for normal users though.
$racedayPage = 'rosters';
}
}
}

switch($racedayPage) {
case "rosters":
$ogMap["og:title"] = "Raceday $year: All Entries";
$ogMap["og:url"] = "https://cmubuggy.org/raceday/rosters/$year/";
break;
case "rostersorg":
// Fast DB query to confirm org existance and get shortname.
$shortName = getOrgShortname($orgUrlKey);
if (empty($shortName)) {
// Don't know what this org is, so $orgUrlKey isn't safe, so we can't use it.
// Default to just the year in the URL.
$ogMap["og:title"] = "Raceday $year: Unknown Org";
$ogMap["og:url"] = "https://cmubuggy.org/raceday/rosters/$year/";
} else {
$ogMap["og:title"] = "Raceday $year: $shortName Rosters";
$ogMap["og:url"] = "https://cmubuggy.org/raceday/rosters/$year/$orgUrlKey/";
}
break;
case "leaderboard":
$ogMap["og:title"] = "Raceday: Leaderboard";
$ogMap["og:url"] = "https://cmubuggy.org/raceday/leaderboard/";
break;
default:
die("unknown page for opengraph"); // er. what? we checked for this above.
};

return $ogMap;
}

// Just does the query to get the proper shortname for an org and return it (or an empty string)
//
// Doesn't check to see if they're actually valid entered for this year or not, since this is only for
// opengraph purposes.
function getOrgShortname($orgUrlKey) {
global $HISTORY_DATABASE;

$metaDataQuery = "SELECT shortname FROM hist_orgs o WHERE o.orgid=?;";
$metaData = dbBoundQuery($HISTORY_DATABASE, $metaDataQuery, "s", $orgUrlKey);

if ($metaData->num_rows == 1) {
$org = $metaData->fetch_assoc();
return $org["shortname"];

// We could obviously also fetch the logo here, unfortuinately OpenGraph is pretentious and does not
// accept SVG as a valid image format. Thus, most of our orgs would get no image anyway (since we
// prefer SVGs for logos), and therefore we chose to skip it.
} else {
return "";
}
}
?>
27 changes: 21 additions & 6 deletions index.php
Original file line number Diff line number Diff line change
Expand Up @@ -10,21 +10,36 @@
}
$title = "CMU Buggy Alumni Association";

$OPENGRAPH_DATA = "";
$OGMAP = array(
"og:type" => "website",
"og:site_name" => "CMU Buggy Alumni Association"
// TODO: Default "og:url" (apparently facebook cannot render og:image without it?)
);

switch($s){
case "history":
include_once("./content/history/opengraph/opengraphdata.inc");
$OPENGRAPH_DATA = getHistoryOpenGraphContent();
$OGMAP = getHistoryOpenGraphContent($OGMAP);
$title = "History | ".$title;
break;
case "search":
$title = "Search Results | ".$title;
break;
case "raceday":
include_once("./content/raceday/opengraph/opengraphdata.inc");
$OGMAP = getRacedayOpenGraphContent($OGMAP);
$title = "Raceday | ".$title;
break;
}

// If we haven't yet found a specific opengraph title, use <title>.
if (!isset($OGMAP["og:title"])) {
$OGMAP["og:title"] = $title;
if ($OGMAP["og:site_name"] == $OGMAP["og:title"]) {
unset($OGMAP["og:site_name"]);
}
}

if(empty($s)){
$content = ("./content/homepage.inc");
} else if(file_exists("./content/".$s.".inc")){
Expand All @@ -41,12 +56,12 @@
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
<meta name="google-site-verification" content="GXsMGGkXYJADa-Rw8I0azRbCk_ILRSXWwTkiHODCBrw" />
<title><?php echo($title); ?></title>
<!-- OpenGraph Metadata -->
<?php
echo($OPENGRAPH_DATA);
include_once(ROOT_DIR."/content/cssjs.inc");
if (!empty($OEMBED_LINK)) {
echo("my oembed is: ". $OEMBED_LINK);
foreach ($OGMAP as $key => $value) {
echo(" <meta property=\"".$key."\" content=\"".$value."\" />\n");
}
include_once(ROOT_DIR."/content/cssjs.inc");
?>
</head>
<?php
Expand Down

0 comments on commit c24aced

Please sign in to comment.