00:01You should all be here because you want to know more about the ArcGIS viewer for Flex.

00:03We're going to be talking about configuring and customizing the Flex viewer.

00:07My name is Bjorn Svensson. I'm the lead product engineer for the Flex team at Esri.

00:12And with me today, we have our newest member on the Flex team, Heather Gonzago.

00:16Good morning.

00:18Oh, you should have had your mike on now. It's always turned off, but no. Yeah. They got that. Sorry.

00:28We're going to talk about the few different things, primarily about building new widgets...

00:33...how you can easily get started with them and also go talk a little bit about the Application Builder.

00:39And we're going to finish it off with talking about how you can use custom widgets and Application Builder together.

00:45So let's get started with the Flex viewer.

00:49How many people have used the Flex viewer before?

00:53Alright, let's do the other way.

00:54How many people have not used the Flex viewer before?

00:56Alright, the few people.

01:00Your probably already know, more or less, what the Flex viewer is.

01:02It's a configurable, read- to-deploy web application.

01:06You can pretty easily download it, configure, and deploy it.

01:11And that was our story up until end of last year when we introduced the Application Builder.

01:16The Application Builder is a great starting point where you don't have to edit configuration files.

01:21It's an application that helps you build Flex viewer applications.

01:27The way it's built up, that's the same thing as you did before if you were editing configuration files, and you can still do that.

01:34And we still have the source code available, so there's really three different ways you can access or use the Flex viewer.

01:40So out here, how many people have used the Flex...sorry, the Application Builder?

01:45I get like 10 or so people. And the compiled source code with configuration files?

01:51Maybe half. And the source code people?

01:54That's a big majority.

01:57Alright. I think we put it the right thing.

01:59We talk...we're mostly going to have code, so.

02:04Now one thing we did last year was make a truly open source for Flex viewer and all the source code is on GitHub...

02:10...and we started with that with 2.5 and also the 3.0 prerelease released last week is also on GitHub.

02:21For those who haven't used the Flex viewer before, basically it allows you to in configuration files or using Application Builder...

02:27...you can change the appearance, functionality.

02:30When we talk about the functionality, we often refer to adding widgets and the widgets have certain functionality.

02:35And then, of course, with data contents, the maps part.

02:40The widgets takes advantage of a Flex functionality called modules.

02:46Flex modules basically are when you run it in the browser, each module will get called when you need it.

02:51So if you have a lot of widgets, they don't get loaded or downloaded until the person opens it to click on it.

02:57And this is a really good feature when you're working in a browser and you don't want to download everything at the beginning...

03:02...because that would be a big, heavy download.

03:05The problem of it is that a lot of people want to use tabloids and they have learned...they know that you can with...

03:13...the new Flash Builder 4.6, you can deploy to an Android device or to an iPad.

03:17The problem with that is that the Flex viewer is not supported in that scenario because it uses modules.

03:21So we had a lot of questions in the last few days asking, How can I put the Flex viewer on my tabloid?

03:28That's not right. Tablet. Tablet. Tablet.

03:36And so basically, you can't do it because the structure that's good for the web, it's not good on a tablet.

03:42And a tablet much more, when you have an application, you install it, and you have all the code there...

03:47...and that's quite different from a web application, where it's a nice feature to download it as you need it.

03:53The main part of the widget is the XML file that comes with it and the compiled Flash or SWF files.

04:02And we'll talk more about this several times and come back to it.

04:07The widget's really what makes up the Flex viewer functionality.

04:11More widgets is a good thing, in general.

04:14There's a lot of widgets are included out of the box, and there's a lot of people who have created their own widgets.

04:19I know some of them are sitting here.

04:21How many people here have used the custom widgets? From anybody else?

04:25That's a lot...a majority.

04:26How many people wrote their own custom widgets?

04:30Almost half. Good job, guys.

04:40A lot of people haven't used Application Builder yet, so we're going to start off and just quickly describe what it is...

04:45...and then do a demo about it, with it.

04:49You use it to build your applications.

04:52It doesn't change.

04:53If you liked the way you did it before, you don't have to use it.

04:56It doesn't really add any functionality.

04:58It does make things easier.

05:00The goal is also that when we did it was that, you might use this as a starting point...

05:05...then you go back and do certain things in the configuration files so with your code...

05:09...and then you can still integrate it and work with the Application Builder, and that was the goal.

05:13It's not just a one-stop thing for some people.

05:16Even if you're working with your own source code, you might have use of using the Application Builder to compile your apps...

05:23...creating the bookmarks for the bookmark widget, you know.

05:25How do you know of extents to use?

05:27How do you connect and set up a geoprocessing?

05:29This is one of the hardest parts usually because each geoprocessing task is set up very different...

05:34...and so there's a lot of configuration you have to do, and the Application Builder can help you do that.

05:44Enough talk. Let's just see it.

05:50This is the Application Builder.

05:51The first time you create it, you will get a big arrow saying, Click here to create new applications.

05:59Once you have a few applications, they'll get listed.

06:03The first time you install it, one of the scariest screens you will see, and the hardest part about installing the Flex viewer...

06:09...is this screen.

06:10This is part of your setup.

06:12And, basically, when you have a Flex viewer application, or when you work with the Application Builder...

06:17...you need to have a web server.

06:19Most people will have IIS, and so by default, we provide a link here or the path to [unintelligible]...

06:28...and we've decided to call the default folder Flex viewers, and before we defaulted to Flex viewer...

06:35...and to not overwrite and distract those people, we now pluralize it.

06:39So it's a little [unintelligible] difference.

06:41But you can call that folder whatever you want.

06:44The key thing is also to match it up with your web base...your web server URL.

06:49And so a lot of people run into problems here if they don't have a web server or they don't know what a web server is...

06:55...and those are kind of the requirements in a documentation to get started.

07:00But if you have IIS installed, it's a very smooth process to get past this screen.

07:04You just click Save, and everything works.

07:10When you want to create the new application, you give it a name, and I already have too many demos, so we're up to demo three.

07:19What that does is basically just create that folder under a Flex viewer folder, and it contains all the SWF files and all the XML files.

07:26You can take that folder and catalog, that folder and move it to any other machine.

07:32And that's also if you go back out here and we say, Right-click on the little arrow, export...

07:38...basically what the export does is copies this folder and moves it out to anywhere you want it.

07:43So it's an easy way of have an environment you started with, usually on your desktop.

07:49We set things up, your development environment...

07:51...and you probably have a production environment where you have the real thing.

07:57And if you don't have two environments, you should have about...you should think seriously about having that.

08:01Don't mess with your production site until you're happy on your dev site.

08:07The export here, all it does is copy that folder, so you can do it yourself, as well, in the file system.

08:12Just copy the folder to wherever you want it.

08:15Each folder is its own full application.

08:18I'm pointing this out because some of the earlier Dev Summits and talks we've been giving...

08:22...we've been talking about how you can have multiple configuration files in one folder and just say, Config equal...

08:28...and then a different configuration file.

08:30Now we're trying to promote having a separate folder for each application.

08:33This makes it...there's a few benefits with that.

08:36One is that it works in Application Builder, and the second part is that it makes it very easy to move one application out...

08:42...and not have lots of extra files in there.

08:47Let's go back to our demo three.

08:50You have two options.

08:51You can either create the web maps or basemaps in operational layers.

08:55One thing that I want to point out if you're using the basemaps in operational layers is, you can add lots of these...

09:05...save it, and we go and look in the preview right away, you'll notice that our basemaps which has changed.

09:11So right now, it shows those free basemaps I added.

09:15You could add basemaps from your own server, and if you do that, you wouldn't get the nice icon by default...

09:22...but you could add an icon that shows your example.

09:25So instead of just showing the text that we had before, you can show the icons.

09:29We still support the old way, but this is a new default.

09:36Widgets. We have a number of widgets that's part of the core Flex viewer.

09:42Bookmark widget, for example, like I mentioned, it makes a lot easier to zoom into an area, like Southern California...

09:49...and say, I want to create a bookmark, So Cal, with a space.

09:55And basically now, I have a bookmark that shows that.

09:59So it makes it much easier in the Application Builder that would be before to get the [unintelligible] for that.

10:08Some of the widgets, the print widget, for example, one of the nice features with 10.1 that you might already have heard about several times...

10:16...is the print task.

10:18So I can connect to a servicesbeta2...what's the URL? Sorry. Esri.com?

10:30Anybody else gets confused about these things?

10:32There we go.

10:37By default, it will list all the possible print tasks that's available.

10:43So the default one is under utilities and its Export Web Map Task.

10:47Basically, it's something we set up on the server, and most of you would set up your own print tasks on the server...

10:53...with your own layouts.

10:54This is the default on one of our sample servers.

10:57The title of the map, Nice Map, and author Bjorn, and maybe no copyright.

11:05The for scale is another feature that we added and basically allows you to print at a certain scale...your map at a certain scale.

11:13I can save this, go to my preview, and I can preview it in browser or in the Application Builder.

11:23Europe is a nice place.

11:26The print task that I added, by default it comes up with these.

11:30I can change it from a map only to show a specific layout...A for landscape, the format I want to have.

11:38PDF might be the better format you want to have.

11:40And when you publish your print task, you can set these.

11:42If you only want people to do PDFs and if you only want to give the A for layout or your own, you could limit those.

11:48If there's only one option, we don't even show it, and then it becomes the default.

11:54When you send it to print, it basically goes to the server, creates the PDF, and you have your little nice map.

12:01Heather will show later how you can take this print widget and customize it and do a little few extra cool stuff with it.

12:11There are a number of other widgets that we've updated and improved.

12:14The edit widgets we added a lot of functionality for 10.1, geoprocessing updated.

12:18Most of the widgets have been updated to some extent to take advantage of 10.1 functionality.

12:25The layout now allows you to edit things like about.

12:29Some people complained that was hard to do.

12:31We still don't have a very nice interface for editing the HTML in here.

12:34That's something we're working on.

12:39In the design mode, a lot of people keep the title, ArcGIS viewer for Flex.

12:44You might want to name it something else.

12:46My Map Is Great.

12:49Subtitle, other things, changing colors.

12:52A lot of people start playing around with...start with the normal black/gold, which is the gold-colored text in the front...

13:00...and then white text in most other places on a black background.

13:03But you can really either pick one of these out-of-the-box ones as well as changing any of the colors.

13:13And then the preview.

13:14So that's a basic run-through in the Application Builder.

13:24A lot of people here...are here to learn about creating new widgets.

13:28Why would you want to create a new widget?

13:31Well, you guys probably already know that since a lot of you have created new widgets.

13:34Either could be because there was some functionality that was not available in the core viewer...

13:39...or it was there but it wasn't just right.

13:42You want to change a little thing here and there.

13:44Well, both of those are possible, and we're going to talk today about both those scenarios.

13:53If you want to create your own widgets, you have to write Flex code.

14:00There are a few things to keep in mind.

14:02You need to use Adobe Flex 4.5 or later, and if you want to work with Arabic [unintelligible] right to left, Arabic or Hebrew...

14:10...you need really 4.51, but you can also use 4.6 or later.

14:15All the source code you can download from GitHub.

14:17The API is not a component you need to download.

14:19And then basically you need the read the resource center, or you do like most people and don't read the help...

14:24...and ask your questions in the forum and hope that people there are friendly, which they are.

14:31Alright. I've talked enough. It's time for Heather.

14:36Heather, could you take an API sample and make a widget out of it?

14:43Yes. Yes, you can.

14:44Alright. So just a little background.

14:47I'm the newest member of the team, but I have...I've been around for a while.

14:51I've worked in various areas within support on the SDK portion of things and have had a lot of Flex-type questions that have come in.

15:00One of the ones that we get a lot were, Hey, I see this functionality in an API sample, but I don't quite...

15:08...I don't see it. Is it somewhere in the viewer? Is there a widget for this?

15:12Not always.

15:13So in this particular case, what I'm going to show you is, is we have a widget, I'm sorry, not a widget...

15:18...an API sample called Generate Renderers.

15:21Another person on our team, Lloyd's been really, really busy going in and updating a lot of these samples for 10.1 and for 3.0...

15:30...and one of them here that I want to show you is this Generates Renderers...

15:33...and basically what this does is it goes in and it creates dynamic layers on the server side.

15:38It does your server-side rendering.

15:41You guys have been asking for this for a really long time. Right?

15:45So what we have here is, basically, it's creating our renderers, class breaks renderer, and in this particular case...

15:53...we're going to go ahead and...I'm going to restart it...and what we have is our classification.

16:03We can go into our natural breaks or quantile.

16:07We can choose the number of breaks.

16:10You guys can't even see this. There we go. There you go.

16:15So basically, what I wanted to do was I wanted to take this same functionality and bring it on over into Flex viewer...

16:23...and create my own custom widget.

16:25So right now, we do not have this.

16:29We do have it coming and in the plans for later future releases.

16:33But currently right now we don't.

16:34So what would you do to go ahead and get this in place?

16:38So first things first.

16:39What I needed to do was I went in, downloaded the source code, went into GitHub, and got the prerelease source code for that.

16:46So what we see here is...there you go...got my project and then from there, I went in and you guys...

16:53...some of you may already be familiar with Julie Powell.

16:56She has that...there's like a recording online that goes in and shows you how to go in and create your own custom widget...

17:03...and she always starts with the Hello World.

17:05So I basically went in and did exactly that.

17:08We have a Hello World, just a basic template widget that's provided for you within the samples folder here.

17:13And if you go into it, you can actually see that it basically breaks it down.

17:17So what we have here is, we can a look, and you can see that there's really not a whole lot to it, just a basic Hello World.

17:25But what I wanted to show you was is that if you go back in, I copied and pasted this and called it Dynamic Rendering...

17:31...and then from there, I've got my configuration file, and I got my...the actual MXML.

17:38Alright, there's going to be a little bit more to it, right?

17:41So what I wanted to show you, and go into the actual code, first things first.

17:48So this is the actual MXML, right?

17:50So what I have here is, I'm going to start off within the widget template.

17:55So when you create your own custom widget, we give you this widget template that basically encompasses...

18:00...it handles all of the UI for you.

18:02So it takes care of it for you, for the most part.

18:06So what I wanted to show you was is if you go in--and what I did was I copied and pasted the same source code...

18:13...from that API sample into Notepad here, and I wanted to show you slight differences, right?

18:20So we've got the MXML, the markup I should say, and then, there's not a whole lot to it, but I changed a couple things, right?

18:32I went in here.

18:34In Lloyd's sample, he has predefined colors that he's got specified.

18:38Well, you could keep it if you wanted to, but I didn't want to in this case.

18:42I want to try to keep the look and feel very, very consistent with what you get within Flex viewer.

18:49So I could if I wanted to. I could've just gone in and copied and pasted basically what he has within the source code...

18:55...and it would show up looking pretty much just like this.

18:58But I wanted to make it look a little bit different. Okay?

19:01I want it a lot different. I wanted to keep it consistent with what you get within the Flex viewer.

19:07So before we go into all of this, I actually just want to show you what it looks like.

19:17Okay. Kind of boring. Yeah. It's just [unintelligible].

19:20But basically what I'm going to do here is, I'm going to go in and create these dynamic layers...

19:28...and do that thematic mapping that, you know, you've been hearing about for the past few days. Right?

19:33So we've got this classification.

19:34I can go in, just like what we had within the sample, specify our class breaks.

19:43You see, it looks a little bit different. Right?

19:45It doesn't have quite the same look as what we had for the legend within the sample.

19:51And all I really did was, I went into...and this was his...this is the main...this is the sample code.

19:59I went in and I referenced where he actually goes in and hard-codes the colors.

20:05And then in my code for the widget, I basically just took all of that out.

20:10The widget template takes care of all that for you.

20:14It's going to take note of what you've got specified in your main configuration file for your focus colors. Okay?

20:23I did go in here and I specified a focus color for, I don't if you guys remember or not, I had a little border around the legend.

20:31So I've got the focus color specified for that and also, I think that was it, yeah.

20:39So if we go into the main configuration file, and I am...some of you guys may already be familiarized with this...

20:48...but I kind of wanted to point it out just because it is something that I think a lot of people do, just, they just miss.

20:53You can specify the colors here within your main configuration file, very similar to what Bjorn just showed you...

20:59...within the Application Builder.

21:00You've got separate colors that you can specify by default.

21:04It's that gold and then the black.

21:06We can go ahead and, within here, specify what you want.

21:10So if you want a little bit more info on that, you can go into our resources center and underneath the viewer for Flex...

21:18...under main configuration file, you'll notice here under main configuration...

21:23...we've got a section that talks a little bit about the style and then the colors.

21:29And then there's a link there for setting styles for the viewer.

21:32And that actually goes in and talks a little bit more about what each individual...what each individual color is representing.

21:41Okay?

21:42So that was the first thing.

21:44It wasn't a whole lot that I basically just copied and pasted, brought it on over...

21:47...and then just updated that markup so that the colors kept consistent with what the widget currently has.

21:54So I have that. Great.

21:56So now let's actually get into the code and see what it's doing.

22:01So when I fire off my widget, it's actually going to go in here and call this widget config loaded event...

22:07...which, in turn, is going to go in and fire off my [unintelligible] function.

22:12The [unintelligible] function is going to go in and read through and check to see if you've got configuration files. Alright?

22:18These are optional.

22:20You guys...probably most of you are already familiarized with this...but basically all these configuration files are...

22:25...is just XML files that you associate with your widget...

22:29...that allows you to pass in additional parameters for your functionality that you need to do.

22:34So in this particular case, I have an XML file...wrong one...that I've got three tags that I'm referencing...

22:43...one for my service name, one for the layer, and then one for the field. Okay.

22:47So in this particular case, I'm going in and I'm going to render the population per square mile. Okay?

22:55So and in this particular case, the way I wrote the code out for demonstration purposes...

23:00...I have a layer in my main configuration file that I brought in that has the same name as demographics.

23:10You guys can see that somewhere here. There we go. There we go.

23:14And we're pointing here to...it's a 10.1 service that we're hosting publicly.

23:20Alright. So basically, checking that configuration file, grabbing the service name, grabbing the layer, grabbing the field...

23:27...and then I do just...really, there's not a whole more.

23:30I took the code from the sample, which I have right here, and I copied and pasted it.

23:41Not really...not much more changes to it than that.

23:45Basically, all it's doing, in a nutshell, I'll go into every line of code, is when I click on those drop-downs...

23:53...it's firing off a generate renderer task.

23:57That generate renderer...I'm sorry, not the generate renderer task.

23:59General renderer function, and in that function, I'm calling this task.

24:03This task is new with 3.0 and 10.1.

24:07Basically what we're doing here is, we are going in, and this is where the magic is, right?

24:13I think Bjorn actually, if you guys watched the plenary, he showed this as well with his demo.

24:19What we have given you is on the dynamic layers, and if you guys watched Tanu's sessions as well...

24:23...I think he talked about this, too.

24:25You have a layer drawing options now off of the dynamic layers.

24:30Within the layer drawing options, there's a renderer property.

24:34You can pass in, you can set you renderer properties specific, and in this case, it's that class breaks renderer.

24:40So basically I'm going in. I'm getting that layer drawing options, passing in that class breaks renderer, and that's basically it.

24:47Not a whole lot more. Okay?

24:50So I have the code copied and pasted.

24:52Everything looks great.

24:53But now I actually have to get it into my Flex viewer. Right?

24:56So this might sound really basic to some of you, but I have to say it because I catch myself doing this all the time.

25:03It's compiled code. You need to have that compiled SWF file in order for Flex viewer to bring it up and load it in.

25:10So the next step you need to do is, you have to go in, into your project, and I've already done this...

25:17...but for demonstration purposes, go to your properties, under your Flex modules...now I already have it in here...

25:24...but you're going to go in and you're going to point to that MXML file that you've just created with that code. Right?

25:30Browse to it.

25:32It's going to recompile it, create that SWF with this compiled code in whatever your output directory is that you've specified.

25:39Now you've got that SWF.

25:41One last thing that you need to do.

25:43So you're going to go in to your configuration, your main configuration file...

25:48...and that gets spun up when you first open up your viewer.

25:51And then from here, within the widget container, this is what you're going to have specified for every widget...

25:58...that you want to have shown when you bring up your Flex viewer.

26:01In this particular case, I've got my API sample renderer, and then I'm passing in the XML file from my configurations...

26:09...and then the SWF that I just generated, and it's located in my samples directory, dynamic rendering. Okay?

26:16And that's pretty much it.

26:18So go in, see it, alright, and that's it, guys.

26:31So you get the same functionality from the API sample, brought it on over into a widget.

26:37Sounds pretty simplistic for some of you, some of you, maybe not.

26:41But it is something, again, that we see a lot of people asking these questions on, and at a very high level...

26:47...those would be the steps that you would need to take.

26:50Thank you, Heather.

26:51So I think that was a pretty...did I change the screen? No. BS and Bjorn. Alright.

27:01These are pretty common.

27:02We've gotten a lot of questions, both for us and to tech support and also seeing questions on the form of this.

27:07I think it's a great way of learning more about new functionality.

27:11The samples and the APIs are usually the first place where we put new functionality...

27:16...and if you can't wait for us to make a widget of it or somebody else, then this is a very good workflow for you guys and us.

27:27Now often, we talked about a second [unintelligible] was when we already have a widget that does something that's almost right...

27:33...but you either want to add an option or you want to remove an option or you want to hard-code something...

27:38...or you want to make it look different than the widget.

27:43The example we're going to look at now is the print widget that I just showed.

27:48Are you ready? Alright.

27:51Okay. Heather's print widget.

27:53Yes. So, okay. So a lot of times as well, you may, like Bjorn was saying, you might need to do some sort of functionality.

28:01You need something within your widget, but...is this on? Now it is. Sorry about that, guys.

28:09So you need some specific functionality, but you're thinking, Hmm, do I need to go in and how much work is actually going...

28:16...is this going to require?

28:18I was thinking about this, and it's actually kind of ironic, Ashley, right?

28:22Ashley came in a couple days ago at the showcase and she asked this same exact question.

28:26I thought about this a couple weeks ago.

28:29Wouldn't it be cool, now that we can have an output from our print task, if we can generate some sort of an e-mail...

28:35...like a widget where, you know, we have your viewer and, you know, your boss, your manager, whoever it may be...

28:41...you have this...you're working with this and they need to have the map.

28:45They don't care, you know, about the viewer at all.

28:48They just want the output. Right?

28:50So how can we go ahead and generate a widget that would make that pretty simplistic.

28:55I'm like, well, we already have the output from the PDF, right?

28:58So what can I do to just go ahead and bring that on over and create, you know, within an e-mail?

29:05So I went ahead and, actually it was really, really very simplistic, to be truthful.

29:12So what I want to show you is basically the print task directly with what you get within Viewer. Alright.

29:17And this is going to look very similar to what Bjorn just showed you.

29:21But, basically, you have your dialog, the widget, that pops up, and it allows you to specify the parameters, the print parameters...

29:28...that you're going to pass in to the print task. Okay.

29:31So what we're doing here is our layout template, and I'm just going to let it go to something like landscape.

29:36And I'm a...I like my PDFs, so I'm just going to go ahead and give it a PDF format and then printing this out.

29:43And basically what this is doing, it's behind the scenes, it's calling the print task, passing in those print parameters...

29:49...and generating that output on the server.

29:51And then, what we're doing, and I'll show you in a moment, in our code, is we are actually just calling...

29:58...it's a non-Esri function, just navigate to URL, and passing in the URL of our output file here for the PDF...

30:05...and bringing it into a browser.

30:07That's great and all, but I want to have it as an e-mail, so how can I do that?

30:12So I went in, widget's pretty much the same, changed a couple things like the label.

30:19I want to do the same exact thing.

30:26But, instead of it being in my browser, I just put it directly into the body of that e-mail. Alright?

30:34So go ahead, send it to myself since I know I'm going to get it, and then from there, fire it up...

30:46...and then, in this case, since it's a PDF, I can go in and just save it out onto my machine if I wanted to.

30:52So, but basically, I mean, like I said, there's not a whole lot more to it, but really, all I'm doing is...

30:57...is I'm just passing this on over and then instead of a browser, just bringing it into an actual e-mail window instead.

31:05So what I want to do, just going to show you very quickly how I went in and actually did this.

31:13So the print task itself, there's quite a bit to it.

31:19Most of the code is, for the most part, more on the parameters configuring the author, the copyright, and so forth.

31:27I just let that go for now.

31:30But basically, what I did was I copied the existing print and I pasted it, in this case, into my samples...

31:39...and I called it just My e-mail, just a quick sample, and then I have one configuration file, nothing fancy.

31:46All it basically is, is just passing in the URL from my print task, and then, from there, show you guys, all we're doing is...

32:01...is that we're firing up this component and then from here, and you can see, yeah, there's a lot of stuff in here.

32:11But I didn't have to mess with pretty much...nah, a few lines of code. That's about it.

32:16So what I did is first things first, I went in, changed the label. Didn't want it to say print, changed it to e-mail.

32:27So basically what we were doing, and if you looked at the original print task, is we checked the configuration files...

32:33...just to see whether or not we have a tag for that label.

32:36If not, do something else.

32:38In this case, I just hard-coded it. Nothing fancy.

32:42And then from there, what's happening is, is when you, any MXML, and I'm not go in and show you all of that.

32:48You specify that print task.

32:50Give it the URL. In this case, I've got everything configured in my config file.

32:56But on this execute, what's actually happening is, it calls on the execute complete handler, that event.

33:07It's going to go in, and I created a function, just called it an e-mail task, and then from there...

33:13...I'm passing in the URL of the file, that output file, and you get that from what gets passed in from that event.

33:21And then from there, this is it. This is all I changed. Okay?

33:25I went in here, specified and just had to go in and give it the correct format...

33:31...so gave it the mail, the body, the subject, and so forth, and then the URL of that output PDF.

33:40And then navigate to the URL, and that is it.

33:43If you took a look at the original, that navigate to URL, it's basically...see here...probably have it a couple places...

33:54...I just commented out the original one.

33:57We have it written in the print task for the get result data and then also on, if you're working...

34:03...if you're working with a synchronous process as well.

34:06So asynchronous or synchronous, we have it written in there.

34:08And I did the same thing.

34:09So basically, depending upon what your print task is set as within that particular event...

34:18...we're going to go in there and then just call my e-mail task function, commented out what we originally had...

34:24...and that is it.

34:26And then, again, just like what I showed you with the dynamic renderers, you just have to go back in and, in your project...

34:33...make sure that you are compiling everything correctly, so I added that here, my e-mail widget.

34:41I have a SWF for that, and then from there, I added it into my main configuration file...

34:49...and then voilà, I have it within my Flex viewer.

34:54[Inaudible audience question]

34:57I knew someone was going to ask that, and I actually, I double-checked on all of this.

35:01That's a...the question was, how long does that map stay...how long can they access that?

35:08I let it go to the default for right now.

35:10I mean, this is a public server.

35:11I can't go in and mess with the configuration on that end.

35:15By default, they're 10 minutes. You can change that, though.

35:18In 10.1, if you go into Manager, there's, I think it's a site tab, and you can actually configure the time.

35:26You can actually turn it off, too, so that they never get cleaned out.

35:29So, but you would probably want to do something like that.

35:32You probably wouldn't like you can access this for this long, you know, make sure you get it within the next blah, blah, blah.

35:38[Inaudible audience question]

35:49Set like an actual attachment, is that it?

35:50[Inaudible audience question]

35:51No. [Inaudible audience question]

35:55Yes. So the question is, instead of sending the actual PDF, how about saying, the REST request that would create the PDF.

36:02So, yes, you could do that.

36:03I mean, this might not be the best example of how to do e-mail and keep them on your server for long...I mean PDFs on a long time.

36:09But it's more about how you can extend an existing functionality.

36:12So this would work for certain use cases, but not for everything.

36:16And if you, I'm sorry, I was going to say, if you want afterwards, we can talk a little bit more about the full-on, like you were saying...

36:24...the REST call and so forth, and we can talk about that.

36:28White shirt.

36:29[Inaudible audience question]

36:34Yeah. Yes. Yep. Yep.

36:38Question in the back.

36:39[Inaudible audience question]

36:43The question is, if the print task is a GP service, is that right? Yes.

36:51So the print task is basically just a GP service.

36:54It comes out of the box.

36:55All you have to do with 10.1 is click it on, but you can also take, if all the code is there, and you can make it...

37:01...customize it and do whatever you want, but it's still a GP.

37:06If you customize it and make into your own version, as long as you keep some of the basic functionality...

37:10...it will work with the print widget out of the box.

37:13[Inaudible audience question]

37:18None of the code that we've shown is available yet, but we're planning to put these online.

37:23It would be in the code gallery, yes.

37:27I'm going to switch a little bit, so if you have questions about these two samples...

37:32...now is a good time to ask those questions, like you all are doing.

37:38[Inaudible audience question]

37:50The question is, on these layouts, can you add custom things like copyright and so on, and the answer is yes.

37:57The key [unintelligible] is that in ArcMap you create the layouts, and you do whatever you want.

38:02You put your north arrows, your copyright statements, and people cannot change those.

38:06So I showed an example of how you can change the copyright, but you might just want to hard-code that and not display it to people...

38:11...and you can do that either in the viewer or you could do it on the server side.

38:16At 10.1, you probably want to do it on the server and make it work right there.

38:23Alright. Going to switch slides.

38:31So we talked about how to create new widgets from scratch, and we talked about how to take a widget and extend it.

38:38Either way, we end up with a custom widget.

38:43A question that I've gotten a lot the last few days is, okay, I have a custom widget, but how do I give it...

38:47...how do I distribute it to people, especially now when people start using the Application Builder...

38:51...how do I put my...how do I give my widgets so they can use it?

38:56So there's two basic ways.

38:58The first is, you do it the same as before.

39:01You tell them to copy the file somewhere.

39:02You tell them to update the config file, and with the specific...add a widget, and that would just work.

39:08When you work in the Application Builder, we would not remove those tags for things...

39:13...things that Application Builder doesn't understand, it still keeps.

39:16So it allows you for editing those files and adding your own thing into it.

39:20But, more likely, you want to have it inside the Application Builder.

39:26First of all, it doesn't...it's a preview of what's to come.

39:29It's not in the prerelease that released last week.

39:33But the basic principle is that you have to provide a ZIP file with a few important files.

39:39And this is the same...so the basic thing is a SWF file and XML file...

39:44...and the third required file is a new file called a meta.XML.

39:48It's basically a file that tells us what your widget's about.

39:51What's the default configuration file? Should it have an icon? What's its name? Those kind of things.

39:56And that helps us include it in the Application Builder.

39:59You can also add other [unintelligible] things like assets.

40:02You might have a specific icon you want to use.

40:04You might have a text file, excuse me, a text file that gets loaded, a second SWF file.

40:12You might have a pretty complex widget.

40:16You might or might not want to share your source code.

40:19So one way of sharing the source code is included in this ZIP file...

40:22...and we're going to be working more with some of the community members that have been working a lot with widgets...

40:26...on what should this ZIP file look like.

40:28But the key things we're looking for is the SWF, XML, meta.XML, and we might change the name of meta.XML...

40:33...but we need another XML file that describes the ZIP file, basically.

40:40So if you look today, in some of the words you find online, there are, and this is case that identify widget by Robert...

40:47...and if you scroll down through a few folders, there's basically the identify folder and inside it you have a SWF and XML.

40:54So that same thing if you add the meta.XML would work in the Application Builder.

41:00Another widget, e-search, it has a few more files.

41:03There's assets and a second SWF file, but basically the same principle applies.

41:08If you add the meta.XML, then this would be able to be used by the Application Builder.

41:19So as you might already have seen, in this special Application Builder on my machine only...

41:25...there are supports for custom widgets, and the support for one custom widget...

41:30...well, I did have the e-mail before, but I cleaned that out.

41:34And basically when you open up this custom widget, by default...

41:37...you get an XML screen where you can type in the configuration for your custom widgets.

41:43There are...this is...our plans for the first release of this is to make it look like this...

41:48...and we're also looking long-term for you to be able to provide more information here.

41:53So right now, what you would have in your meta.XML file would be, What's the default label name...

41:59...What's the icon I want to use by default?

42:01Do I want it to be shown on default to be open or not, the widget?

42:05Preload equal open and also a URL...an optional URL if you want to have people read about your custom widgets.

42:17And [unintelligible] of course.

42:20I lost my [unintelligible] somewhere.

42:21I was talking about the next future, big future, where not only do you have a configuration file...

42:26...but you could actually have the service name would be, you have a drop-down list by selecting things from a different place...

42:32...you might have a date figure or something like this.

42:34But that way, it would require you to write a Flex component just for the configuration.

42:40And that's not probably going to be supported out the box in the first release.

42:44But this part about supporting the custom widgets, the label, icon, open or not, and a help link, that would be there.

42:58And that's basically what I demoed already, you know, blah, blah.

43:05So we got a few more slides, actually a little misleading, but about the custom widget and app builder...

43:11...I know there's been a lot of questions about it, and I've asked...I've answered a lot of them.

43:16Are there more questions about the custom widget support in the Application Builder?

43:22I did a very good job of explaining it, I see.

43:26I feel proud, because you look awake.

43:29Alright. What's coming at 3.0?

43:32If you went to our presentation yesterday at What's New in the 3.0 API?

43:36How many did that?

43:40Come on, guys. You're awake. Hands up, you know.

43:42Alright. Little bit less than half.

43:44Well, that's a workshop is online, will be online. You can read more there.

43:50But based there's a lot of new functionality and not going into detail here, but read it at the resource center...

43:56...and you will find out more about what's coming at 3.0.

44:01How do I get it?

44:02There's a download center.

44:04One of the things you will notice that we changed the resource center a little bit.

44:07So there's a new look and feel, and the 10.1 resource centers are slightly different...

44:14...but basically the easiest way to find Flex in here is going to library and in a web API, it's just API...

44:20...and in the web apps, it's the Flex viewer.

44:24And if you're in one of them, you can go back and forth between the two.

44:27You have a download link in the top right for both API and the viewer.

44:33And then the normal concept samples and forums in two places.

44:36So this is kind of the aspects where we have...we're working on it, and most of the documentation is up-to-date...

44:43...but not all of it's up-to-date with the 3.0, but that's part of our 3.0 final release.

44:51So I want to point it out that if you've been working with the 3.0 beta...

44:58...the URLs have changed a little bit for 3.0 prerelease...

45:00...but the URLs for 3.0 prerelease is basically the normal URLs that we'll be using for 3.0 final and for onwards of the 10.1 cycle.

45:09The only little change is the word, you know, beta will be dropped when 10.1 goes final.

45:16So a lot of the links that you might find in the next two months, some will go to our old resource center...

45:22...and some of it to new resource center, but if you get used to the new look and feel, the blue look and feel...

45:29...then you know you have a new place.

45:31So just keep that in mind.

45:39And also, if you click the download link, there is a link to all the previous versions as well...

45:45...download the 2.5, 2.4, 2.3, 2.1, and so on.

45:49...and we'll keep those links there.

45:53...and basically I'd like to open up for, you know, questions.

45:58That's the presentation we have, so, yep.