1 / 12

Hints for HW#8

Hints for HW#8. HW#6 Architecture. Apache web server. client. Use <form> To invoke server-side script. finance.yahoo.com. Send query with arguments. Browser with web page. 1. PHP Script. 2. 5. 3. Retrieve resulting web page (html). 4. Parse the web page

emile
Download Presentation

Hints for HW#8

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Hints for HW#8

  2. HW#6 Architecture Apache web server client Use <form> To invoke server-side script finance.yahoo.com Send query with arguments Browser with web page 1 PHP Script 2 5 3 Retrieve resulting web page (html) 4 Parse the web page using regular expressions and for each music type build an html page Result of Query GOOG

  3. HW#8 Architecture Overview PHP script sends query with arguments Tomcat web Server running on SCF Uses Xmlhttprequest to invoke Java Servlet client AWS Finance.yahoo.com Browser with web page Java Servlet invokes PHP script; Java Servlet transforms XML into JSON PHP script send query with arguments Retrieve web page and convert to XML As part of the exercise use yahoo’s autocomplete widget to predict the stock symbol Xmlhttprequest Object retrieves JSON User clicks on Facebook Resulting screen Posting to Facebook (done programmatically)

  4. HW8 Sample Result

  5. Facebook Output

  6. Outline for the Initial Page (1 of 3) • A set of includes • <link rel="stylesheet" href="http://yui.yahooapis.com/3.13.0/build/cssbutton/cssbutton.css"> • <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/3.14.1/build/tabview/assets/skins/night/tabview.css"> • <script type="text/javascript" src="jquery-1.10.2.min.js"></script> • <script type="text/javascript" src="yui-min.js"></script> • define the autocomplete YUI element which uses this URL to get the autocomplete options http://d.yimg.com/autoc.finance.yahoo.com/autoc • Define the Facebook interface, e.g. • function postToFeed(result) { • Define method:, name:, caption:, description:, link:, picture: • function (response) //the post was published, or not • Call your servlet using Ajax and a URL of the form • http://cs-server.usc.edu:YOURPORT/examples/servlet/SearchServlet

  7. Outline for the Initial Page (2 of 3) • Process the result • Handle +/- • Handle stock chart, e.g. • <imgsrc=\""+result.result.StockChartImageURL+"\" width=\"260\" height=\"140\" /> • Handle Facebook icon • <imgsrc='facebook_logo.jpg' style='cursor: pointer; padding-top:10px;' onclick='postToFeed. . . > • Build a table containing: Previous close, today’s high, Year high, bid, ask, etc • Build a table with the latest News items • Render both using the YUI tabview • YUI().use('tabview', function(Y) { vartabview = new Y.TabView({srcNode:'#tabs'}); • tabview.render(); });

  8. Outline for the Initial Page (3 of 3) • Here is where the <body> begins • Initialize Facebook • FB.init({ appId: xxxxxxxxxxxxxxxx', // App ID from the App Dashboard • channelUrl: 'http://cs-server.usc.edu:yourport/examples/servlets/producer/channel.html', • status : true, // check the login status upon init? • cookie : true, // set sessions cookies to allow your server to access the session? • xfbml: true // parse XFBML tags on this page? }); • // Load the SDK's source Asynchronously • <form class="yui3-form"> • Company: <input type="text" id="company" name="company“ placeholder="Enter company symbol" size="90" /> • <button class="yui3-button" onClick="return verify(this.form.company.value);">Search</button> • </form>

  9. Posting to Facebook • function postToFeed(result) { • result = JSON.parse(unescape(result)); FB.ui( { • method: 'feed', name: (result.result.Name ? result.result.Name : "NA") , • caption: "Stock Information of "+(result.result.Name ? result.result.Name : "NA") • + " "+(result.result.Symbol ? "("+result.result.Symbol+")" : "") , • description: "Last Trade Price: "+ (result.result.Quote.LastTradePriceOnly ? result.result.Quote.LastTradePriceOnly : "NA") • +", Change: "+ (result.result.Quote.ChangeType ? result.result.Quote.ChangeType : "") • +""+ (result.result.Quote.Change ? result.result.Quote.Change : "NA") • +"("+ (result.result.Quote.ChangeInPercent ? result.result.Quote.ChangeInPercent : "NA") +")", • link: (result.result.Symbol ? "http://finance.yahoo.com/q?s="+result.result.Symbol : "http://finance.yahoo.com"), • picture: (result.result.StockChartImageURL ? result.result.StockChartImageURL: "") }, • function(response) { • if (response && response.post_id) { alert('Post was published.'); • } else { alert('Post was not published.'); } } ); }

  10. Java Servlet running on Tomcat (1 of 2) • import java.io.BufferedReader; • import java.io.IOException; • import java.io.InputStreamReader; • import java.io.PrintWriter; • import java.net.URL; • import java.net.URLEncoder; • import javax.servlet.ServletException; • import javax.servlet.http.HttpServlet; • import javax.servlet.http.HttpServletRequest; • import javax.servlet.http.HttpServletResponse; • import org.json.JSONObject; • import org.json.XML;

  11. Outline for Your Java Servlet Running on Tomcat (2 of 2) • Public class SearchServlet extends HttpServlet { • Protected void doGet (request, response) throws . . . { • Response.setContentType(“application/json; charset=utf-8”); • Retrieve company name; check if it is null; • Try { URL url = new URL(“http://. . . elasticbeanstalk.com/?companyname=“, encode company name); • bufferedReader = new buggeredReader(new INputStreamReader(url.openStream(),. . . ); • While ((line = bufferedReader.readLine()) !- null) { • xmlContent += line; } • JSONObjectjsonObject = XML.toJSONObject(xmlContent); • Out.print(jsonObject); • Notes: modify the web.xml file • Include servlet.jar and json.jar (converts XML to json)

  12. Outline for Your Php Program • <?php • Header(“Content-type: text/xml”); retrieve stock info and output as XML • $symbol_url = "http://autoc.finance.yahoo.com/autoc?query=".$name."&callback=YAHOO.Finance.SymbolSuggest.ssCallback"; • $url = "http://query.yahooapis.com/v1/public/yql?q=Select%20Name%2C%20Symbol%2C%20LastTradePriceOnly%2C%20Change. . ."; • $output .= "<Name>".htmlspecialchars($name, ENT_QUOTES)."</Name>"; • $output .= "<Symbol>".htmlspecialchars($symbol, ENT_QUOTES)."</Symbol>"; • $output .= "<Quote>"; • $changeType = substr($change,0, 1); • $output .= "<ChangeType>".$changeType."</ChangeType>"; • $output .= "<Change>".substr($change, 1)."</Change>"; • $output .= "<ChangeInPercent>".substr($changeinPercent, 1)."</ChangeInPercent>"; • $output .= "<LastTradePriceOnly>".number_format((double) $lastTradePriceOnly, 2)."</LastTradePriceOnly>"; • Also <PreviousClose>, <DaysLow>, <DaysHigh>, <Open>, <YearLow>, <YearHigh>, <Bid>, <Volume>, <Ask>, <AverageDailyVolume>, <OneYearTargetPrice>, <MarketCapitalization>, • </Quote>"; • displayHeadlines($symbol); /* a separate routine that goes to http://feeds.finance.yahoo.com/rss/2.0/headline?s=SYMBOL, ETC*/ • $output .= "<StockChartImageURL>http://chart.finance.yahoo.com/t?s=".$symbol."&amp;lang=en-US&amp;amp;width=300&amp;height=180</StockChartImageURL>";

More Related