sabre red app sdk - reinvent travel · sabre red app sdk destination hack web red ......
TRANSCRIPT
SabreRedAppSDK Destination Hack Web Red App Widget Development
sabredevstudio.com
New Sabre Red Workspace
sabredevstudio.com
SabreRedWorkspaceisaflexibleuserinterfacepla:ormfortravelagentstoaccesstheSabrereserva?onssystem.ThenewWorkspaceintroducesaDecisionSupportBarandPanelWidgets;alldesignedtoquicklyprovideinsightstothetravelagentandtoefficientlyadvancetheworkflow.TolearnmoreaboutDecisionSupportBarvisit:h7ps://www.sabre.com/insights/innova<on-hub/prototypes/new-sabre-red-workspace/
NOTE:
Sabre Red App SDK
sabredevstudio.com
NOTE:
TheSabreRedAppDeveloperToolkit-enablesdeveloperstobuildappsthatintegratedirectlyintotheSabreRedWorkspacepla:orm.Theseapps,aretechnicallyEclipseplugins,integratedintoSabreRedWorkspace,thatisbuiltontopoftheEclipseRCPpla:orm.AtSabreDes?na?onHackSingaporeweareexposinganearlyalphaversionofanewSDKBuildthatallowsRedAppDeveloperstobuildcustomWebRedAppWidgetstoprovidebroaderandmoreadvancedinsightstoTravelConsultantsthatu?lizeSabreRedWorkspacePla:orm.
Sabre Web Red App Widget Hackathon Challenges
sabredevstudio.com
NOTE:
#1 Develop Best Idea for Decision Support Bar - $500 Prize
#2 Develop Best Widget for Red App Panel - $500 Prize
What you need to Develop Web Red App Widget? InstallRedAppDeveloperPla2orm• DownloadEclipseIDE32bitLuna.hVp://www.eclipse.org/downloads/packages/eclipse-rcp-and-rap-developers/lunasr1a• DownloadJava1.8u2532bit.hVp://www.oracle.com/technetwork/java/javase/downloads/java-archive-javase8-2177648.html#jre-8u25-oth-JPR• DownloadRedAppSDKAlphaHackathonBuildforWebRedAppWidgetDevelopment.This
includesallthesampledocumenta?onandfileresources.hVps://drive.google.com/file/d/0B8i3pUfLy_rLWDZkMm9SdWRmalk/view?usp=sharingRequirementsforDevelopingWebRedAppWidgetsModules• node.JSandNPM• IDEofchoice,preferablewithTypeScriptSupport.InExample:Sublime,Notepad++
RedAppDevelopmentisonlysupportedonMicrosoDWindowsopera<ngsystem.
Red App Platform Installation and Configuration • InstallJavadownload.• ExtractandLaunchtheEclipseIDE• ExtracttheRedAppSDKzipfiletoyourlocalworksta?on• WatchtheInstalla?onvideoofhowtoinstallandconfiguretheRedAppSDKonEclipseIDE,and
LaunchtheSabreRedAppPla:orm.hVps://www.dropbox.com/s/kgmj5jer028pz6y/hackathon.mp4?dl=0• AddthefollowingVMArgumentsbeforelaunchingtheRedAppTargetPla:orm.Thiswillenable
RemoteDebuggingandSandboxmode:-Dosgi.parentClassloader=ext-Ddynamo_tes?ng_remote_debugging=true-Ddynamo.service=mocks-Dredapp.fake.session=true
• Installnode.jswithnpm.
Formoreinforma<onaboutinstalla<on,readtheRedAppDevGeJngStartedGuideintheRedAppSDKDownloaddocumenta<onfolder.
Developing the Web Red App Widget • ReadtheRedAppWebModulesGuide.pdffoundinthedocumenta<onfolderofRedAppSDK
Download.
CreateWidgetSkeleton:1.Copy`/samples/web/module-skeleton`fromRedAppSDKdownloadtoanewfolder.2.Edit`manifest.json`locatedin`src`subdirectoryofthenewfolderandsetpropervalueto“name”aVribute,withforexample:
{"name":"com.sabre.ngv.yourwidgetname","dependencies":["com.sabre.ngv.core"]}
3.Edit`package.json`locatedinmaindirectoryofyournewfolderandsetpropervaluetothe`name`aVribute,toequalthesamenamedefinedinstep2.4.Makesureyouhavenode.JSalongwithnpmtoolinstalledonyourPC5.Runngvinstalltodownloadallnecessarydependencies**Codeyourmodule**ReadPage3ofWebModulesGuide.pdf6.RunngvbuildtocompileyourTypeScriptproject.
Wrapping the Web Red App Widget into Eclipse Plugin • ReturntoEclipseIDE• CreateanewPluginProject.File->New->PluginProject
• DefineprojectnamewiththesamenameaVributefromyourWebAppWidget.com.sabre.ngv.yourwidgetname
Wrapping the Web Red App Widget into Eclipse Plugin - Continue • Adda“redapp.xml”filetoyourPluginprojectwiththefollowingcontent.
<CFBundle><RedAppid="com.sabre.ngv.yourwidgetname"></RedApp></CFBundle>
• Editthe“plugin.xml”inyourPluginprojectwithyourwidgetinforma?on.<extensionpoint="com.sabre.edge.redapp.contactdetails.provider"><contactDetailscompany="SabreInc."contactName="SRWDevelopers"email="[email protected]"phoneNumber="123-456-789"website="hVp://www.sabre.com"></contactDetails></extension><extensionpoint="com.sabre.edge.dynamo.web.module"><modules><moduleid="com.sabre.ngv.yourwidgetname"/></modules></extension>
Wrapping the Red App Widget into Eclipse Plugin - Continued • AddthecompiledTypescriptmodulefilestoyourPluginprojectinthefollowingfilefolder
structureweb->com.sabre.ngv.yourwidgetname
Launch and Test your Web Red App Widget • LaunchRun/DebugConfigura?onswithyourPluginProjectselected.• ShopforAirFlightsinSabreRedWorkspacebyclickingonCommandHelper->AirandLowFare
ShoppingScreen.
Launch and Test your Web Red App Widget • YourWebRedAppWidgetshouldappearlikebelowintheLowFareShoppingresponse.
Appendix DebuggingyourWebRedAppWidget• OpenGoogleChrome• NavigatetohVp://localhost:9222
Makesureyouaddthe-Ddynamo_tes?ng_remote_debugging=trueVMArgumentsreferencedinPage5.SampleWebRedAppWidgetPluginProjects:ForcodeexamplesonWebRedAppPluginProjectsthatyoucanimportintoyourEclipseIDEWorkspace,gotosamplesinRedAppSDKdownload.• com.sabre.redapp.example3.web.decisionsupportbar-1.0.0-SNAPSHOT-v20161010-1437• com.sabre.redapp.example3.web.drawer-1.0.0-SNAPSHOT-v20161010-1437