PHP Classes

File: ExampleUsage.php

Recommend this page to a friend!
  Classes of Hensel Hartmann   OpenGraph Reader with Template Output   ExampleUsage.php   Download  
File: ExampleUsage.php
Role: Auxiliary data
Content type: text/plain
Description: a primitve facebook like wall
Class: OpenGraph Reader with Template Output
Extract and display OpenGraph data in Web pages
Author: By
Last change:
Date: 12 years ago
Size: 3,239 bytes
 

Contents

Class file image Download
<!DOCTYPE html> <html> <head> <!-- /* * @author Hensel Hartmann, simpeligent.ch * @version 2.0 * @copyright Hensel Hartmann, simpeligent.ch * @license GPL * @package OpenGraphReader with Template Output * filename: get.og.as.html.php * date: 2011-12-31 * */ --> <style> fieldset { margin-bottom: 1em; } input { display: block; margin-bottom: .25em; } #print-output { width: 100%; } .print-output-line { white-space: pre; padding: 5px; font-family: monaco, monospace; font-size: .7em; } </style> <script src="http://code.jquery.com/jquery-latest.js"></script> </head> <body> <h1 style="margin-bottom:6px;">usage demo of class.opengraphreader.php</h1> <strong>This shows the basics of replicating the behaviour of the Facebook wall.</strong> <br /><br /> <form> <fieldset style="width: 900px;"> <div style="float: right;"> try one of these:<br /> http://www.youtube.com/watch?v=BcdNgWs-FSs <br /> http://www.youtube.com/watch?v=Wm8sIP-7xmI <br /> http://music-network.ch/ <br /> http://music-network.ch/videos/media/865/FunkyVirus_talk:_Sarah_Bowman/ <br /> http://vimeo.com/2539741 <br /> http://www.myspace.com/mnet_swiss_music_video <br /> http://www.facebook.com/FunkyVirusTalk </div> <div style="width: 350px;"> In this demo, only one URL (the first) will be gathered!<br /> You can easely adjust the js to get all urls parsed<br /> The script runs on "keyup"! But if "it" happened, an url was found in the text, the script stops - so it will not process the URL over and over again..<br /> In this Demo, you can clear that cache. <br /> To release the "cache", click the button "clear og cache and refresh preview" below<br /><br /> <label for="target">Type something and use an url in text, that leads to an open graph enabled site:</label> </div> <table border="1"><tr> <td> <textarea id="target" style="width: 650px;height: 100px;border:1px solid #707070;"></textarea> <div id="result_cont"></div> </td> </tr></table> </fieldset> </form> <button id="other">clear og cache and refresh preview</button> <script> geturl = new RegExp( "(^|[ \t\r\n])((http|https):(([A-Za-z0-9$_.+!*(),;/?:@&~=-])|%[A-Fa-f0-9]{2}){2,}(#([a-zA-Z0-9][a-zA-Z0-9$_.+!*(),;/?:@&~=%-]*))?([A-Za-z0-9$_+!*();/?:~-]))" ,"g" ); var cache=0; $('#target').keyup(function(event){ var string = $('#target').val(); if(string.match(geturl) === null) { return; } var url = string.match(geturl)[0]; if(!url){ url = string.match(geturl); } if(string.match(geturl).length>0 && !cache) { jQuery('#result_cont').load('get.og.as.HTML.php?url='+url); cache=1; } }); $('#other').click(function() { cache=0; $('#target').keyup(); }); </script> </body> </html>