Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

An infinit.e widget is a flex module that gets run inside a window in the infinit.e application.
Image Removed Image Added

The Infinit.e Webpage handles all interactions with the window such as moving, dragging, changing size, hiding/showing, and data transfer.  You are responsible for handling the content inside the widget.

...

Now we can run our example, login and do a sample query and we should have some data displayed in our lists, all the results titles, and every entity in all the resulting documents!
Image Removed Image Added

An alternative that just showed the aggregated entity information might look like:

...

Code annex

Code Block
langjavascript
<?xml version="1.0" encoding="utf-8"?>
<?xml version="1.0" encoding="utf-8"?>
<!--
 The MIT License Copyright (c) 2011 IKANOW llc

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY 2012, The Infinit.e Open Source Project
   
   Licensed under the Apache License, Version 2.0 (the "License");
   you may not use this file except in compliance with the License.
   You may obtain a copy of the License at
   
   http://www.apache.org/licenses/LICENSE-2.0
   
   Unless required by applicable law or agreed to in writing, software
   distributed under the License is distributed on an "AS IS" BASIS,
   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, EXPRESSeither ORexpress IMPLIED,or INCLUDINGimplied.
BUT NOT LIMITED TOSee THEthe WARRANTIESLicense OFfor MERCHANTABILITY,the FITNESSspecific FORlanguage Agoverning PARTICULARpermissions PURPOSEand
AND NONINFRINGEMENT. IN NOlimitations EVENTunder SHALLthe THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.

-->
<mx:Module xmlns:fx="httpLicense.
-->
<components:WidgetModule
            xmlns:fx="http://ns.adobe.com/mxml/2009"
            xmlns:components="com.ikanow.infinit.e.widget.library.components.*"
            xmlns:s="library://ns.adobe.com/mxmlflex/2009spark"
     		   xmlns:s="library://ns.adobe.com/flex/spark" 		   xmlns:mx="library://ns.adobe.com/flex/mx"
layout="absolute"
		            implements="com.ikanow.infinit.e.widget.library.widget.IWidget"
            creationComplete="{dispatchEvent(new Event("Done Loading"));}">
	<s:HGroup width="100%" height="100%">
		<s:List id="titleList" width="50%" height="100%" dataProvider="{titleArrayList}" />
		<s:List id="entityList" width="50%" height="100%" dataProvider="{entityArrayList}" />
	</s:HGroup>
    <fx:Style source="../com/ikanow/infinit/e/assets/styles/infiniteDefaultStyle.css" />
    <fx:Style>
		@namespace s "library: try { onWidgetCreationComplete(); } catch (e:Error) {  } dispatchEvent(new Event('Done Loading')); }">
    <fx:Style source="/com/ikanow/infinit/e/assets/styles/infiniteStyles.css" />
    <fx:Style>
        @namespace s "library://ns.adobe.com/flex/spark";
        @namespace mx "library://ns.adobe.com/flex/sparkmx";
		@namespace mx "library://ns.adobe.com/flex/mx";
		
        /* If you need to override a style in our stylesheet, or add another
		        style that we did not support you can do so here, an example has been commented out
		        Please see documentation about over-riding MX component styles to display fonts
		*/
		/*
		
        /*
        mx|Text
		{
			
        {
        font-family: infiniteNonCFFFont;
		}
		
        }
        */
	    </fx:Style>
	    <fx:Script>
		
        <![CDATA[
			
            import com.ikanow.infinit.e.widget.library.datawidget.IWidgetContextIWidget;
			
            import com.ikanow.infinit.e.widget.library.widget.IWidget;

			IWidgetContext;
            
            import mx.collections.ArrayCollection;
  			private var _context:IWidgetContext; 			[Bindable] private var titleArrayList:ArrayCollection = new ArrayCollection(); 			[Bindable]
private var entityArrayList:ArrayCollection = new ArrayCollection();  			/** 			 * IWidget interface to receive data object (IWidgetContext).
			 * Store the iwidgetcontext so we can receieve data later.
			 */
			public function onInit(context:IWidgetContext):void
			{
				_context = context;
			}

			/**
			 * IWidget interface that fires when a new query is done.
			 * We can access the data from the query by using our
			 * iwidgetcontext object _context.getQueryResults().
			 */
			public function onReceiveNewQuery():void
			{
				titleArrayList.removeAll();
				entityArrayList.removeAll();
				var queryResults:ArrayCollection =  _context.getQuery_AllResults().getTopDocuments();
				for each (var doc:Object in queryResults )
				{
					titleArrayList.addItem(doc.title);
					for each ( var entity:Object in doc.entities )
					{
						entityArrayList.addItem(entity.disambiguous_name);
					}
				}
			}

			/**
			 * IWidget interface that fires when a new filter is done (including from ourself)
			 * We can access the data fromt he filter by using our
			 * iwidgetcontext object _context.getFilterResults().
			 */
			public function onReceiveNewFilter():void
			{
				var filterResults:ArrayCollection = _context.getQuery_FilteredResults().getTopDocuments();import org.alivepdf.pdf.PDF;
            
            private var _context:IWidgetContext;
            private var titleArray:ArrayCollection = new ArrayCollection();
            
            /**
             * Method fired when module is done loading.  Sends
             * message to parent letting it know that module is
             * ready to receive data.
             */
            private function onWidgetCreationComplete():void
       // Eg duplicate  code from{
onReceiveNewQuery 			}  			/** 			 * function to rescale the module when the parent container is being
resized 			 * 			 * @param newHeight The new height the component needs}
to be set to 			 * @param newWidth The new width the component
needs to be set to 			 */ 			public function onParentResize(newHeight:Number,newWidth:Number):void
			{
				this.height = newHeight;
				this.width = newWidth;
			}
			/**
			 * Stubbed out/unusued callbacks:
			 */
			public function supportedExportFormats():ArrayCollection
			{
				return null;
			}
			public function onGenerateExportData(filename:String, format:String):ByteArray
			{
				return null;
			}
			public function onGeneratePDF(printPDF:PDF, title:String):PDF
			{
				return null;
			}
			public function onSaveWidgetOptions():Object
			{
				return null;
			}
			public function onLoadWidgetOptions(widgetOptions:Object):void
			{
			}

		]]>
	</fx:Script>
	<fx:Declarations>
		<!-- Place non-visual elements (e.g., services, value objects) here -->
	</fx:Declarations>
</mx:Module>    /**
             * IWidget interface to receive data object (IWidgetContext).
             * Store the iwidgetcontext so we can receieve data later.
             */
            public function onInit(context:IWidgetContext):void
            {
                _context = context;
            }
            
            /**
             * IWidget interface that fires when a new query is done.
             * We can access the data from the query by using our
             * iwidgetcontext object context.getQuery_TopResults().getTopDocuments();
             */
            public function onReceiveNewQuery():void
            {    
                //get documents
                var queryResults:ArrayCollection = _context.getQuery_TopResults().getTopDocuments();
                //set the labels of these docs and use as dataprovider for list
                for each ( var doc:Object in queryResults )
                doc.label = doc.title;
                titlesList.dataProvider = queryResults;
                
            }
            
            /**
             * IWidget interface that fires when a new filter is done (including from ourself)
             * We can access the data fromt he filter by using our
             * iwidgetcontext object _context.getQuery_FilteredResults().getTopDocuments();
             */  
            public function onReceiveNewFilter():void
            {
                //get filtered logic here
                //_context.getQuery_FilteredResults().getTopDocuments();
            }
            
            /**
             * function to rescale the component when the parent container is being resized
             * 
             * @param newHeight The new height the component needs to be set to
             * @param newWidth The new width the component needs to be set to
             */ 
            public function onParentResize(newHeight:Number,newWidth:Number):void
            {
                this.height = newHeight;
                this.width = newWidth;
            }
            
            /**
             * Allow users to export the widget contents in the specified format
             * @format filename: the filename+path to which the data will be written (in case it needs to be embedded)
             * @param format: the format from the "supportedFormats" call
             * 
             * @returns a ByteArray containing the data to output
             */
            public function onGenerateExportData(filename:String, format:String):ByteArray
            {
                return null;
            }
            
            /**
             * This function gets called when the user clicks to output 
             * data to a PDF. Return null if custom PDF generation is
             * not desired.
             * 
             * @return a new alivePdf Page containing the converted data
             */
            public function onGeneratePDF(printPDF:PDF, title:String):PDF
            {
                return null;
            }
            
            /**
             * If a save object has been saved from 'onSaveWidgetOptions' then
             * when the app gets reloaded the last save string
             * will be passed to this function.
             * 
             * @param widgetOptions the last save object or null if there was none
             */
            public function onLoadWidgetOptions(widgetOptions:Object):void
            {
                //TODO
            }
            
            /**
             * This function gets called when the workspace is being saved.
             * return null if no save object is needed.
             * 
             * @return an object this widget can use to reload state
             */
            public function onSaveWidgetOptions():Object
            {
                return null;
            }
            
            /**
             * @returns A list of supported formats, displayed in a context menu in the format
             * "Export <string>" - these are called with "generateExportData"
             * Note this doesn't cover the "built-in" Alive PDF export.
             * However if the developer specifies PDF and generatePdf() returns non-null then this will be used.
             */
            
            public function supportedExportFormats():ArrayCollection
            {
                return null;
            }    

            /**
             * The callback handler for clicking the sample button in the header of the app.
             * 
             * @param event The mouse event when clicking the button.
             **/
            protected function sampleButton_clickHandler(event:MouseEvent):void
            {
                //perform some action when header button is clicked
            }

        ]]>
    </fx:Script>
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
        
    <!-- If you would like this widget to be styled similar to the other infinite widgets
        you may place items in the headerContent section shown below and they will be drawn at
        the top of the widget.  If you want to use similar looking buttons explore the 
        com.ikanow.infinit.e.widget.library.components.* items looking for components
        prefixed with Widget*.  Other components may be added to the header as well.
    -->
    <components:headerContent>        
        <s:HGroup gap="-3">            
            <!-- Ignore Filter Toggle Button -->
            <components:WidgetToggleButton id="sampleButton"
                                           label="Sample Header Button"
                                           toolTip="This is the tooltip for a header button"
                                           click="sampleButton_clickHandler(event)"
                                            />
        </s:HGroup>
    </components:headerContent>
    
    <s:VGroup width="100%" height="100%" verticalAlign="middle" horizontalAlign="center" 
              paddingBottom="5" paddingLeft="5" paddingRight="5" paddingTop="5">
        <s:Label text="Sample Module" fontSize="30" />        
        <s:List id="titlesList" width="100%" height="100%" />
    </s:VGroup>
</components:WidgetModule>