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="srw.developers@sabre.com"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