Application.ewu

$version 12.00

$rect <40,300,220,340>
$output false
$multilingual true
class ContactsPage : Core::Group
{
  $rect <310,40,480,80>
  inherited method Init()
  {
    attachobserver onListItemsUpdate, ^Device::Device.Contacts.NoOfItems;
    postsignal onListItemsUpdate;

    attachobserver onListItemsUpdate, ^Device::Device.Contacts.Sorting;
    postsignal onListItemsUpdate;

    attachobserver onListItemsUpdate, ^Device::Device.MyContact;
    postsignal onListItemsUpdate;









  }

  $rect <310,80,480,120>
  inherited property Bounds = <0,0,272,440>;

  $rect <830,60,1030,100>
  slot onCreateNewContact
  {
    createContact = new Application::AddContactPage;

    createContact.OnSave  = onSaveAdd;
    createContact.OnClose = onCancelAdd; 
    createContact.Contact = new Device::Contact;

    SwitchToDialog( createContact, Res::SlideUpCentered, null, null, null, null, null,
                               null, null, null, false );
  }

  $rect <680,60,830,100>
  var Application::AddContactPage createContact = null;

  $rect <850,100,1030,140>
  slot onSaveAdd
  {
    Device::Device.Contacts.AddLast( createContact.Contact );

    DismissDialog( createContact, Res::SlideDownCentered, null, null, null, null, false);

    createContact = null;
  }

  $rect <850,140,1030,180>
  slot onCancelAdd
  {
    DismissDialog( createContact, Res::SlideDownCentered, null, null, null, null, false);

    createContact = null;

  }

  // Initialization
  note group Note2
  {
    attr Bounds = <290,0,660,140>;
  }

  $rect <850,270,1030,310>
  slot onDelete
  {
    DismissDialog( detailsPage, Res::SlideRightCentered, null, null, null, null, false);

    postsignal onListItemsUpdate;

    detailsPage = null;
  }

  $rect <309,389,509,429>
  slot onSearch
  {
    if ( SearchExt.String != "" )
    {
      
      Device::Device.Contacts.Search( SearchExt.String );

      ContactsInsideSearch.Bounds.origin = <0,0>;

      SearchExt.Icon = Res::XIcon;
    }
    else
    {
      postsignal onCancelSearch;
    }
  }

  $rect <680,190,830,230>
  var Application::DetailsPage detailsPage;

  $rect <850,230,1030,270>
  slot onClose
  {
    DismissDialog( detailsPage, Res::SlideRightCentered, null, null, null, null, false);

    postsignal onListItemsUpdate;

    detailsPage = null;
  }

  // Touch screen events
  note group Note
  {
    attr Bounds = <669,0,1229,440>;
  }

  $rect <300,240,500,280>
  slot onUpPress
  {
    Device::Device.Contacts.Sorting = Device::Sorting.Ascending;
    postsignal onListItemsUpdate;


  }

  $rect <300,280,500,320>
  slot onDownPress
  {
    Device::Device.Contacts.Sorting = Device::Sorting.Descending;
    postsignal onListItemsUpdate;

  }

  // This method is called by 'VerticalList' every time the list loads or updates \
  // an item.
  $rect <296,189,496,229>
  slot OnLoadItem
  {
    var int32 itemNo = VerticalList.Item;

    var Device::Contact contact = Device::Device.Contacts.GetContactAtIndex( itemNo );

    var Application::ContactItem itemView = (Application::ContactItem)VerticalList.View;
                                                  
    if ( itemView == null )
      return;

    itemView.Contact    = contact;
    itemView.OnActivate = onContactPressed;

    itemView.Bounds.size = point( VerticalList.Bounds.w, VerticalList.ItemHeight );
  }

  // Vertical list
  note group Note1
  {
    attr Bounds = <289,149,660,329>;
  }

  $rect <20,20,160,60>
  object Views::Rectangle Background
  {
    preset Layout = Core::Layout[AlignToBottom, AlignToLeft, AlignToRight, AlignToTop, ResizeHorz, ResizeVert];
    preset Bounds = <0,0,272,440>;
    preset Color = Res::WhiteComponents;
  }

  $rect <20,20,160,60>
  object Core::VerticalList VerticalList
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Bounds = <11,167,261,440>;
    preset OnLoadItem = OnLoadItem;
    preset SlideHandler = SlideTouchHandler;
    preset ItemHeight = 32;
    preset ItemClass = Application::ContactItem;
  }

  $rect <20,20,160,60>
  object Core::SlideTouchHandler SlideTouchHandler
  {
    preset StackingPriority = -1;
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Bounds = <12,167,261,440>;
    preset SnapNext = <0,35>;
    preset SlideHorz = false;
  }

  $rect <20,20,160,60>
  object Components::SButton25x25 UpButton
  {
    preset Layout = Core::Layout[AlignToRight, AlignToTop];
    preset Bounds = <236,141,262,167>;
    preset Icon = Res::UpIcon;
    preset OnActivate = onUpPress;
    preset IconColor = Res::Blue;
    preset BackgoundColor = Res::Transparent;
    preset BackgoundColorPressed = Res::Transparent;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::ButtonRoundSmall;
    preset BackgroundColorEnabled = Res::Transparent;
  }

  $rect <20,20,160,60>
  object Components::SButton25x25 DownButton
  {
    preset Layout = Core::Layout[AlignToRight, AlignToTop];
    preset Bounds = <210,141,236,167>;
    preset Enabled = true;
    preset Icon = Res::DownIcon;
    preset OnActivate = onDownPress;
    preset IconColor = Res::Blue;
    preset BackgoundColor = Res::Transparent;
    preset BackgoundColorPressed = Res::Transparent;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::ButtonRoundSmall;
    preset BackgroundColorEnabled = Res::Transparent;
  }

  $rect <20,20,160,60>
  object Components::InputBtnEtxt SearchExt
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToRight, AlignToTop, ResizeHorz];
    preset Bounds = <3,67,269,99>;
    preset OnChange = onSearch;
    preset String = "";
    preset Color = Res::BlackComponents;
    preset Placeholder = Strings::SearchTxt;
    preset OnIcon = onCancelSearch;
  }

  $rect <20,20,160,60>
  object Views::Text TitleTxt
  {
    preset Bounds = <11,27,261,61>;
    preset Alignment = Views::TextAlignment[AlignHorzLeft, AlignVertCenter];
    preset String = Strings::ContactsTxtx;
    preset Font = Res::TitileFont32;
    preset Color = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Components::SButton25x25 PlusButton
  {
    preset Bounds = <242,12,272,42>;
    preset Enabled = true;
    preset Icon = Res::PlusIcon;
    preset OnActivate = onCreateNewContact;
    preset IconColor = Res::Blue;
    preset BackgoundColor = Res::Transparent;
    preset BackgoundColorPressed = Res::Transparent;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::ButtonRoundSmall;
    preset BackgroundColorEnabled = Res::Transparent;
  }

  $rect <830,190,1030,230>
  slot onContactPressed
  {
    var Application::ContactItem itemView = (Application::ContactItem)sender;

    if ( itemView != null )
    {
      detailsPage          = new Application::DetailsPage;
      detailsPage.OnBack   = onClose;
      detailsPage.OnDelete = onDelete;
      detailsPage.Contact  = itemView.Contact;
      
      SwitchToDialog( detailsPage, Res::SlideLeftCentered, null, null, null, null, null,
                               null, null, null, false );
    }

  }

  $rect <487,190,657,230>
  slot onListItemsUpdate
  {
    VerticalList.NoOfItems = Device::Device.Contacts.NoOfItems;
    VerticalList.InvalidateItems ( 0, VerticalList.NoOfItems -1 );

  }

  $rect <20,20,160,60>
  object Application::MyCardItem MyCardItem
  {
    preset Bounds = <6,99,266,144>;
    preset Text = "";
    preset OnActivate = onMyCardPress;
  }

  $rect <849,389,1029,429>
  slot onMyCardPress
  {
    if ( Device::Device.MyContact != null )
    {
      var Device::Contact contact = Device::Device.Contacts.FindMatchingIDContact( Device::Device.MyContact );

      if ( contact != null ){

        detailsPage          = new Application::DetailsPage;
        detailsPage.OnBack   = onClose;
        detailsPage.Contact  = contact;
      
        SwitchToDialog( detailsPage, Res::SlideLeftCentered, null, null, null, null, null,
                                   null, null, null, false );
       }
    }
  }

  $rect <849,329,1029,369>
  slot onTapMessage
  {
    postsignal OnMessage;
     
  }

  $rect <689,329,849,369>
  property slot OnMessage;

  $rect <309,429,509,469>
  slot onCancelSearch
  {
    Device::Device.Contacts.CancelSearch();

    ContactsInsideSearch.Bounds.origin.y = Bounds.y2; 

    SearchExt.Text.String = " ";
    SearchExt.Icon = Res::SerachIcon;
  }

  $rect <20,20,160,60>
  object Application::ContactsInsideSearch ContactsInsideSearch
  {
    preset Bounds = <1,457,273,937>;
    preset OnSelectedContact = onFilteredContactPressed;
  }

  // Search
  note group Note3
  {
    attr Bounds = <291,340,660,520>;
  }

  $rect <1029,189,1229,229>
  slot onFilteredContactPressed
  {
    detailsPage          = new Application::DetailsPage;
    detailsPage.OnBack   = onClose;
    detailsPage.OnDelete = onDelete;
    detailsPage.Contact  = ContactsInsideSearch.Contact;
      
    SwitchToDialog( detailsPage, Res::SlideLeftCentered, null, null, null, null, null,
                               null, null, null, false );
  }
}

// Contacts
note group Note
{
  attr Bounds = <0,220,429,789>;
}

$rect <70,340,220,380>
$output false
$multilingual true
class ContactItem : Core::Group
{
  $rect <503,147,683,187>
  inherited method Init()
  {
    $if $composer
      FirstNameTxt.String = "Firstname";
      LastNameTxt.String = "Lastname";
    $endif

    attachobserver onContactUpdated, ^Device::Device.MyContact;
    postsignal onContactUpdated; 

  }

  $rect <10,500,210,540>
  inherited property Bounds = <0,0,250,32>;

  $rect <10,100,210,140>
  inherited method UpdateViewState()
  {
    // Always invoke the inherited method.
    super( aState );

    var bool isEnabled  = aState.contains( Core::ViewState[ Enabled  ]);
    var bool isSelected = aState.contains( Core::ViewState[ Selected ]);
    var bool isPressed  = ( TouchHandler.Down && TouchHandler.Inside ) || 
                            FlashTimer.Enabled;

    if ( !isEnabled )
    {
      Background.Color = ButtonColor;
      LastNameTxt.Color = Res::Grey;
      FirstNameTxt.Color = Res::Grey;
      MeTxt.Color = Res::Transparent;
      MeTxt.String = MeText;
    }

    else if ( isPressed )
    {
      Background.Color = Res::PressColor;
    }

    else if ( isSelected )
    {
      Background.Color =  Res::GreyLight;
      }

    // Enabled but not pressed nor selected.
    else
    {
      Background.Color = ButtonColor;
      LastNameTxt.Color = TextColor;
      FirstNameTxt.Color = TextColor;
      MeTxt.String = MeText;
      MeTxt.Color = Res::Transparent;
    }


    enabled  = isEnabled;
    selected = isSelected;
    pressed  = isPressed;


  }

  $rect <230,110,430,150>
  property Device::Contact Contact = null;

  $rect <230,150,430,190>
  onset Contact
  {
    // The value doesn't change - nothing to do.
    if ( pure Contact == value )
      return;

    if ( pure Contact != null )
    {
       detachobserver onContactUpdated, pure Contact;
    }

    // Remember the property's new value.
    pure Contact = value;

    if ( pure Contact != null )
    {
      attachobserver onContactUpdated, pure Contact;
    }
    postsignal onContactUpdated;

  }

  $rect <230,190,430,230>
  slot onContactUpdated
  {
    if ( Contact == null ){
      FirstNameTxt.String = "";
      LastNameTxt.String = "";
      PrfofilButton.Icon = "";
    }else{
      if ( pure Contact.LastName == "")
        LastNameTxt.String = pure Contact.FirstName;
      else{
        FirstNameTxt.String = pure Contact.FirstName;
        LastNameTxt.String  = pure Contact.LastName;
       }
      PrfofilButton.Icon  = pure Contact.NameInitials;

    if (  Device::Device.MyContact != null )
    {
      if ( pure Contact.ID == Device::Device.MyContact.ID ){
        MeTxt.Color = Res::Grey;
        }
      else
        MeText = "";
      }
    }
  }

  // Contact data
  note group Note4
  {
    attr Bounds = <220,60,440,270>;
  }

  // State management
  note group Note5
  {
    attr Bounds = <0,60,220,310>;
  }

  $rect <10,260,210,300>
  var Views::Text textView;

  // This variable stores the current state of the button.
  $rect <10,220,210,260>
  var bool pressed;

  // This variable stores the current state of the button.
  $rect <10,180,210,220>
  var bool selected;

  // This variable stores the current state of the button.
  $rect <10,140,210,180>
  var bool enabled;

  // The property 'Label' specifies the text to display as label in this push button \
  // widget. The desired font as well as the colors for all individual button states \
  // have to be specified in the configuration object assigned to the property @Appearance. \
  // If there is no configuration object associated to this push button widget (the \
  // property @Appearance is 'null'), no label is displayed.
  // Per default, the label is displayed centered within the push button area. You \
  // can modify the alignment of the label as well as its margins by specifying them \
  // in the configuration object.
  $rect <580,0,780,40>
  property string Icon;

  $rect <790,0,990,40>
  property string MeText = Strings::meTxt;

  $rect <790,40,990,80>
  onset MeText
  {
    // The value doesn't change - nothing to do.
    if ( pure MeText == value )
      return;

    // Remember the property's new value.
    pure MeText = value;

    // ... and trigger the component to update its actual state.
    InvalidateViewState();
  }

  $rect <990,0,1190,40>
  property color ButtonColor = Res::WhiteComponents;

  $rect <990,40,1190,80>
  onset ButtonColor
  {
    // The value doesn't change - nothing to do.
    if ( pure ButtonColor == value )
      return;

    // Remember the property's new value.
    pure ButtonColor = value;

    // ... and trigger the component to update its actual state.
    InvalidateViewState();
  }

  // Feedback flash effect
  note group Note3
  {
    attr Bounds = <460,320,680,450>;
  }

  // Keyboard events
  note group Note2
  {
    attr Bounds = <230,320,450,450>;
  }

  // Touch screen events
  note group Note1
  {
    attr Bounds = <0,320,220,490>;
  }

  // This timer object is used to flash the button when the user has tapped it very \
  // quickly or the button has been activated with the keyboard. This is just a visual \
  // feedback effect.
  $rect <470,360,670,400>
  object Core::Timer FlashTimer
  {
    preset OnTrigger = onFlashTimer;
    preset Period = 0;
    preset Begin = 50;
  }

  // This key handler reacts to key press events. When the user presses the key specified \
  // in the property 'Filter' of the key handler, the handler is activated and the \
  // method '@onPressKey' is called.
  $rect <240,360,440,400>
  object Core::KeyPressHandler KeyHandler
  {
    preset OnPress = onPressKey;
    preset Filter = Core::KeyCode.Enter;
  }

  // This internal slot method is called when the '@FlashTimer' is expired. It ends \
  // the short flash feedback effect.
  $rect <470,400,670,440>
  slot onFlashTimer
  {
    // The feedback flash timer is finished. Request the button to update its
    // appearance. The update will occur in the UpdateViewState() method.
    InvalidateViewState();

    // With the end of the feedback flash effect the button is activated.
    postsignal OnActivate;
  }

  // This internal slot method is called when the '@KeyHandler' is activated (when \
  // the user has pressed the key specified in the property 'Filter' of the key handler).
  $rect <240,400,440,440>
  slot onPressKey
  {
    // Ignore keyboard events when the user is interacting with the button via the
    // touch screen.
    if ( TouchHandler.Down )
      return;

    // Ignore repetitions of key events (e.g. when the user holds the key pressed)
    if ( KeyHandler.Repetition )
      return;

    // Pressing the key flashes the button for a short period. This is a kind of 
    // feedback effect. Request the button to update its appearance accordingly.
    // The update will occur in the UpdateViewState() method.
    InvalidateViewState();

    // The button is still performing the feedback flash effect from the preceding
    // tap/key event. This can occur when the user taps the button or presses the
    // key in a very rapid succession. Thus complete this preceding tap (simulate
    // the timer expiration) before starting a new button interaction.
    if ( FlashTimer.Enabled )
    {
      postsignal OnActivate;
      FlashTimer.Enabled = false;
    }

    // Start the feedback flash effect.
    FlashTimer.Enabled = true;
  }

  $rect <580,40,780,80>
  onset Icon
  {
    // The value doesn't change - nothing to do.
    if ( pure Icon == value )
      return;

    // Remember the property's new value.
    pure Icon = value;

    // ... and trigger the component to update its actual state.
    InvalidateViewState();
  }

  // This internal slot method is called when the user drags the finger while pressing \
  // the button. This only updates the button to appear pressed or released.
  $rect <10,440,210,480>
  slot onEnterLeaveTouch
  {
    // Every time the user touches the button or drags the finger inside/outside
    // the button's area request the button update its appearance. The update will
    // occur in the UpdateViewState() method.
    InvalidateViewState();
  }

  // This internal slot method is called when the user releases the touch screen \
  // after touching the button's area. This activates the button.
  $rect <10,400,210,440>
  slot onReleaseTouch
  {
    // Did the user moved the finger outside the button's area? In such case
    // the button is not activated.
    if ( !TouchHandler.Inside )
      return;

    // The user interaction has been passed over to the another touch handler
    if ( TouchHandler.AutoDeflected )
      return;

    // The user has pressed and held the button for longer time. This was enough
    // long to give a visual 'press' feedback to the user. The button can be
    // activated immediately.
    if ( TouchHandler.HoldPeriod >= FlashTimer.Begin )
      postsignal OnActivate;

    // The user has tapped the button very quickly. Defer the button activation
    // to give the user first a short visual feedback that the button has been
    // pressed.
    else
      FlashTimer.Enabled = true;
  }

  // The property 'OnActivate' can refer to a slot method, which will receive a signal \
  // as soon as the user has activated the button. Thereupon the method's logic will \
  // be executed.
  $rect <370,0,570,40>
  property slot OnActivate = null;

  // This internal slot method is called when the user touches the button's area.
  $rect <10,360,210,400>
  slot onPressTouch
  {
    // The button is still performing the feedback flash effect from the preceding
    // tap. This can occur when the user taps the button in a very rapid succession. 
    // Thus complete this preceding tap (simulate the timer expiration) before 
    // starting a new button interaction.
    if ( FlashTimer.Enabled )
    {
      postsignal OnActivate;
      FlashTimer.Enabled = false;
    }
  }

  $rect <1200,0,1400,40>
  property color TextColor = Res::BlackComponents;

  $rect <20,20,160,60>
  object Core::SimpleTouchHandler TouchHandler
  {
    preset Layout = Core::Layout[AlignToBottom, AlignToLeft, AlignToRight, AlignToTop, ResizeHorz, ResizeVert];
    preset Point4 = <0,32>;
    preset Point3 = <250,32>;
    preset Point2 = <250,0>;
    preset Point1 = <0,0>;
    preset OnLeave = onEnterLeaveTouch;
    preset OnEnter = onEnterLeaveTouch;
    preset OnRelease = onReleaseTouch;
    preset OnPress = onPressTouch;
    preset RetargetCondition = Core::RetargetReason[WipeDown, WipeLeft, WipeRight, WipeUp];
    preset MaxStrikeCount = 100;
  }

  $rect <20,20,160,60>
  object Views::Rectangle Background
  {
    preset Bounds = <0,0,250,32>;
    preset ColorBL = #FDFDFDC8;
    preset ColorBR = #FDFDFDC8;
    preset Color = Res::WhiteComponents;
  }

  $rect <20,20,160,60>
  object Views::Text LastNameTxt
  {
    preset Bounds = <39,3,130,33>;
    preset Alignment = Views::TextAlignment[AlignHorzLeft, AlignVertCenter];
    preset String = "";
    preset Font = Res::ContactFontBold15;
    preset Color = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Views::Text FirstNameTxt
  {
    preset StackingPriority = 0;
    preset Layout = Core::Layout[AlignToLeft, ResizeHorz];
    preset Bounds = <129,3,244,33>;
    preset Alignment = Views::TextAlignment[AlignHorzLeft, AlignVertCenter];
    preset String = "";
    preset Font = Res::ContactFont15;
    preset Color = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Views::Line Line
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Point2 = <250,32>;
    preset Point1 = <0,32>;
    preset Width = 2;
    preset Color = Res::GreyLight;
  }

  $rect <20,20,160,60>
  object Components::SButton25x25 PrfofilButton
  {
    preset Bounds = <6,4,31,29>;
    preset DescriptColor = Res::WhiteComponents;
    preset DescriptFont = Res::ContactFont15;
    preset IconFont = Res::ContactFont15;
    preset Backgound = Res::ButtonRoundSmall;
  }

  $rect <20,20,160,60>
  object Views::Line Line1
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Point2 = <250,0>;
    preset Point1 = <0,0>;
    preset Width = 2;
    preset Color = Res::GreyLight;
  }

  $rect <20,20,160,60>
  object Views::Text MeTxt
  {
    preset Bounds = <231,10,244,22>;
    preset AutoSize = true;
    preset Alignment = Views::TextAlignment[AlignHorzRight, AlignVertCenter];
    preset Font = Res::ContactFont12;
    preset Color = Res::Transparent;
    preset Visible = true;
  }
}

$rect <50,421,220,460>
$output false
$multilingual true
class DetailsPage : Core::Group
{
  $rect <-10,510,190,550>
  inherited property Bounds = <0,0,272,440>;

  $rect <450,50,630,90>
  slot onTapEdit
  {
    editPage = new Application::EditPage;

    editPage.OnSave   = onSaveEdit;
    editPage.OnClose  = onCancelEdit;
    editPage.Contact  = Contact;
    editPage.OnDelete = onDelete;

    SwitchToDialog( editPage, Res::SlideLeftCentered, null, null, null, null, null,
                               null, null, null, false );
     



  }

  // Displayed contact info
  note group Note1
  {
    attr Bounds = <770,0,1020,200>;
  }

  $rect <300,220,460,260>
  slot onDelete
  {
    signal OnDelete;

    DismissDialog( editPage, Res::FadeInOutCentered, null, null, null, null, false);

    editPage = null;
  }

  $rect <460,220,620,260>
  property slot OnDelete;

  $rect <300,50,450,90>
  var Application::EditPage editPage;

  $rect <300,280,480,320>
  slot onCall
  {
    Device::Device.SendCallFromContact( Contact );
  }

  $rect <460,90,620,130>
  slot onSaveEdit
  {
    DismissDialog( editPage, Res::FadeInOutCentered, null, null, null, null, false);

    editPage = null;
  }

  $rect <460,130,620,170>
  slot onCancelEdit
  {
    DismissDialog( editPage, Res::FadeInOutCentered, null, null, null, null, false);

    editPage = null;

  }

  // Touch screen events
  note group Note
  {
    attr Bounds = <290,0,760,430>;
  }

  $rect <460,180,620,220>
  property slot OnBack;

  $rect <300,180,460,220>
  slot onBackHome
  {
    signal OnBack;
  }

  $rect <790,90,980,130>
  onset Contact
  {
    if ( pure Contact == value )
      return;

    if ( pure Contact != null )
    {
       detachobserver onContactUpdated, pure Contact;
    }

    pure Contact = value;

    if ( pure Contact != null )
    {
      attachobserver onContactUpdated, pure Contact;
      postsignal onContactUpdated;
    }

  }

  $rect <790,130,980,170>
  slot onContactUpdated
  {
    if ( pure Contact != null )
    {
      ContactName.String   = pure Contact.LastName + " "  + pure Contact.FirstName;
      NumberTxt.String     = pure Contact.PhoneNumber;   
      UserInitialsBtn.Icon = pure Contact.NameInitials;
      FavoritTxt.Visible   = pure Contact.IsFavorite ? true : false;  
    }

  }

  $rect <790,50,980,90>
  property Device::Contact Contact;

  $rect <20,20,160,60>
  object Views::Rectangle Background
  {
    preset Bounds = <0,0,272,440>;
    preset Color = Res::WhiteComponents;
  }

  $rect <20,20,160,60>
  object Views::Line Line2
  {
    preset Point2 = <266,287>;
    preset Point1 = <8,287>;
    preset Color = #E2E2E2FD;
  }

  $rect <20,20,160,60>
  object Views::Text NumberTxt
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Bounds = <20,258,264,287>;
    preset ColorBR = #FFFFFF00;
    preset Alignment = Views::TextAlignment[AlignHorzLeft, AlignVertCenter];
    preset String = " +0749320298";
    preset Font = Res::ContactFont15;
    preset Color = Res::Blue;
  }

  $rect <20,20,160,60>
  object Views::Text MobileTxt
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Bounds = <8,232,266,265>;
    preset Alignment = Views::TextAlignment[AlignHorzLeft, AlignVertCenter];
    preset String = Strings::MobileTxt;
    preset Font = Res::ContactFont15;
    preset Color = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Views::Line Line1
  {
    preset Point2 = <266,232>;
    preset Point1 = <8,232>;
    preset Color = #E2E2E2FD;
  }

  $rect <20,20,160,60>
  object Components::Button50x75 CallBtn
  {
    preset Bounds = <51,145,101,220>;
    preset Icon = Res::CallIcon;
    preset OnActivate = onCall;
    preset Descript = Strings::callTxt;
    preset BackgoundColor = Res::Blue;
    preset BackgoundColorPressed = Res::BlueLight;
    preset IconFont = Res::IconsFont20;
    preset Backgound = Res::ButtonRoundMedium;
  }

  $rect <20,20,160,60>
  object Components::Button50x75 VideoCallBtn
  {
    preset Bounds = <111,145,161,220>;
    preset Enabled = false;
    preset Icon = Res::VideoCallIcon;
    preset Descript = Strings::VideoTxt;
    preset BackgoundColor = Res::Blue;
    preset BackgoundColorPressed = Res::BlueLight;
    preset IconFont = Res::IconsFont20;
    preset Backgound = Res::ButtonRoundMedium;
    preset IconColorEnabled = Res::GreyLight;
  }

  $rect <20,20,160,60>
  object Components::Button50x75 PushButtonMediumBlue2
  {
    preset Bounds = <171,145,221,220>;
    preset Enabled = true;
    preset Icon = Res::MessageIcon;
    preset OnActivate = onTapMessage;
    preset Descript = Strings::messageTxt;
    preset BackgoundColor = Res::Blue;
    preset BackgoundColorPressed = Res::BlueLight;
    preset IconFont = Res::IconsFont20;
    preset Backgound = Res::ButtonRoundMedium;
  }

  $rect <20,20,160,60>
  object Views::Text ContactName
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Bounds = <8,98,265,145>;
    preset Alignment = Views::TextAlignment[AlignHorzCenter, AlignVertCenter];
    preset String = "Contact name";
    preset Font = Res::TitileFont29;
    preset Color = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Components::ButtonBase70x90 UserInitialsBtn
  {
    preset Bounds = <101,22,171,113>;
  }

  $rect <20,20,160,60>
  object Components::SButton25x25 EditBtn
  {
    preset Bounds = <240,4,265,29>;
    preset Icon = Res::EditIcon;
    preset OnActivate = onTapEdit;
    preset IconColor = Res::Blue;
    preset BackgoundColor = Res::Transparent;
    preset BackgoundColorPressed = Res::Transparent;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::ButtonRoundSmall;
  }

  $rect <20,20,160,60>
  object Components::SButton25x25 BackBtn
  {
    preset Bounds = <7,4,32,29>;
    preset Icon = Res::BackIcon;
    preset OnActivate = onBackHome;
    preset IconColor = Res::Blue;
    preset BackgoundColor = Res::Transparent;
    preset BackgoundColorPressed = Res::Transparent;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::ButtonRoundSmall;
  }

  $rect <20,20,160,60>
  object Views::Text FavoritTxt
  {
    preset Bounds = <60,233,84,263>;
    preset String = Res::HeartIcon;
    preset Font = Res::IconsFont20;
    preset Color = Res::Grey;
    preset Visible = false;
  }

  $rect <490,330,670,370>
  slot onTapMessage
  {
    chat = new Application::ChatPage;

    chat.Contact = Contact;
    chat.OnBack  = onBack;

    Owner.Owner.Owner.SwitchToDialog( chat, Res::SlideLeftCentered, null, null, null, null, null,
                               null, null, null, false );
     
     
  }

  $rect <290,330,490,370>
  var Application::ChatPage chat = null;

  $rect <510,370,670,410>
  slot onBack
  {
    Owner.Owner.Owner.DismissDialog( chat, Res::FadeInOutCentered, null, null, null, null, false);

    chat = null;
  }
}

$rect <50,501,220,540>
$output false
$multilingual true
class AddContactPage : Core::Group
{
  $rect <0,450,200,490>
  inherited property Bounds = <0,0,272,440>;

  $rect <760,100,960,140>
  inherited method UpdateLayout()
  {
    super(aSize);

    LastNameTxt.Bounds.origin = <3,191>;
    FirstNameTxt.Bounds.origin = <3, 224>;
    PhoneNumberTxt.Bounds.origin = <3, 257>;

    Background.Bounds = Bounds.orect;
  }

  $rect <760,50,960,90>
  inherited method UpdateViewState()
  {
    // Always give the ancestor class a chance to process this event.
    super( aState );

    if(Contact)
    {

    if (FirstNameTxt.String != "" ||
        LastNameTxt.String != "" ||
        PhoneNumberTxt.String !=  "")
    {
      SaveBtn.Enabled = true;
    }

    else
     SaveBtn.Enabled = false;
     }
     
  }

  $rect <311,50,511,90>
  slot onSave
  {
    notifyobservers pure Contact;

    signal OnSave;
  }

  $rect <521,50,721,90>
  property slot OnSave;

  $rect <310,190,510,230>
  property Device::Contact Contact;

  $rect <310,230,510,270>
  onset Contact
  {
    if ( pure Contact == value )
      return;

    if ( pure Contact != null )
    {
       detachobserver onContactUpdated, pure Contact;
    }

    pure Contact = value;

    if ( pure Contact != null )
    {
      attachobserver onContactUpdated, pure Contact;
      postsignal onContactUpdated;
    }
  }

  $rect <310,270,510,310>
  slot onContactUpdated
  {
    Contact.FirstName    = FirstNameTxt.String;
    Contact.LastName     = LastNameTxt.String;
    Contact.PhoneNumber  = PhoneNumberTxt.String;
    Contact.NameInitials = Device::Device.Contacts.GetInitials( LastNameTxt.String, FirstNameTxt.String);

    if ( Contact.LastName == "" &&  Contact.FirstName == "")
      Contact.LastName =  Contact.PhoneNumber;


         



  }

  // Displayed contact info
  note group Note1
  {
    attr Bounds = <290,140,740,340>;
  }

  $rect <311,91,511,131>
  slot onClose
  {
    signal OnClose;
  }

  $rect <521,91,721,131>
  property slot OnClose;

  // Touch screen events
  note group Note
  {
    attr Bounds = <291,0,740,140>;
  }

  $rect <20,20,160,60>
  object Views::Rectangle Background
  {
    preset Bounds = <0,0,272,440>;
    preset Color = Res::WhiteComponents;
  }

  $rect <20,20,160,60>
  object Views::Line Line4
  {
    preset Point2 = <265,289>;
    preset Point1 = <7,289>;
    preset Color = Res::GreyLight;
  }

  $rect <20,20,160,60>
  object Components::InputEtxt PhoneNumberTxt
  {
    preset Layout = Core::Layout[AlignToLeft];
    preset Bounds = <3,257,269,289>;
    preset OnChange = onFieldChanged;
    preset String = "";
    preset Color = Res::Blue;
    preset Placeholder = Strings::MobilenumberTxt;
  }

  $rect <20,20,160,60>
  object Views::Line Line3
  {
    preset Point2 = <264,256>;
    preset Point1 = <6,256>;
    preset Color = Res::GreyLight;
  }

  $rect <20,20,160,60>
  object Components::InputEtxt FirstNameTxt
  {
    preset Layout = Core::Layout[AlignToLeft];
    preset Bounds = <3,224,269,256>;
    preset OnChange = onFieldChanged;
    preset String = "";
    preset Color = Res::BlackComponents;
    preset Placeholder = Strings::FirstNameTxt;
  }

  $rect <20,20,160,60>
  object Views::Line Line2
  {
    preset Point2 = <264,223>;
    preset Point1 = <6,223>;
    preset Color = Res::GreyLight;
  }

  $rect <20,20,160,60>
  object Components::InputEtxt LastNameTxt
  {
    preset Layout = Core::Layout[AlignToLeft];
    preset Bounds = <3,191,269,223>;
    preset OnChange = onFieldChanged;
    preset Alignment = Views::TextAlignment[];
    preset String = "";
    preset Color = Res::GreyLight;
    preset Placeholder = Strings::LastNameTxt;
  }

  $rect <20,20,160,60>
  object Views::Line Line1
  {
    preset Point2 = <264,190>;
    preset Point1 = <6,190>;
    preset Color = Res::GreyLight;
  }

  $rect <20,20,160,60>
  object Components::ButtonBase70x90 UserInitials
  {
    preset Bounds = <100,78,170,169>;
    preset Descript = Strings::AddPhototTxt;
  }

  $rect <20,20,160,60>
  object Views::Text TitleTxt
  {
    preset Bounds = <86,7,186,37>;
    preset String = Strings::NewContactTxt;
    preset Font = Res::ContactFontBold15;
    preset Color = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Components::SButton25x25 SaveBtn
  {
    preset Bounds = <240,4,265,29>;
    preset Enabled = false;
    preset Icon = Res::CkeckIcon;
    preset OnActivate = onSave;
    preset IconColor = Res::Blue;
    preset BackgoundColor = Res::Transparent;
    preset BackgoundColorPressed = Res::Transparent;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::ButtonRoundSmall;
    preset BackgroundColorEnabled = Res::Transparent;
  }

  $rect <20,20,160,60>
  object Components::SButton25x25 CloseButton
  {
    preset Bounds = <7,4,32,29>;
    preset Icon = Res::CloseIcon;
    preset OnActivate = onClose;
    preset IconColor = Res::Blue;
    preset BackgoundColor = Res::Transparent;
    preset BackgoundColorPressed = Res::Transparent;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::ButtonRoundSmall;
    preset BackgroundColorEnabled = Res::Transparent;
  }

  $rect <530,270,730,310>
  slot onFieldChanged
  {
    UserInitials.Icon = Device::Device.Contacts.GetInitials( LastNameTxt.String, FirstNameTxt.String );

    InvalidateViewState();
  }

  // State management
  note group Note4
  {
    attr Bounds = <750,0,970,170>;
  }
}

$rect <50,461,220,500>
$output false
$multilingual true
class EditPage : Core::Group
{
  $rect <0,490,200,530>
  inherited property Bounds = <0,0,272,440>;

  $rect <760,100,960,140>
  inherited method UpdateLayout()
  {
    super(aSize);

    LastNameTxt.Bounds.origin = <2,141>;
    FirstNameTxt.Bounds.origin = <2,174>;
    NumberTxt.Bounds.origin = <7,244>;

    Background.Bounds = Bounds.orect;
  }

  $rect <760,60,960,100>
  inherited method UpdateViewState()
  {
    // Always give the ancestor class a chance to process this event.
    super( aState );

    if(Contact){

      if (Contact.FirstName != FirstNameTxt.String ||
          Contact.LastName != LastNameTxt.String ||
          Contact.PhoneNumber !=  NumberTxt.String 
          ){
        SaveBtn.Enabled = true;
      }else
        SaveBtn.Enabled = false;
    }
     
  }

  $rect <310,50,510,90>
  slot onSave
  {
    Contact.FirstName    = FirstNameTxt.String; 
    Contact.LastName     = LastNameTxt.String;
    Contact.PhoneNumber  = NumberTxt.String;
    Contact.NameInitials = Device::Device.Contacts.GetInitials( Contact.LastName, Contact.FirstName );

    signal OnSave;
  }

  $rect <520,50,720,90>
  property slot OnSave;

  $rect <310,91,510,131>
  slot onClose
  {
    signal OnClose;
  }

  $rect <520,91,720,131>
  property slot OnClose;

  // Touch screen events
  note group Note
  {
    attr Bounds = <290,0,740,190>;
  }

  $rect <310,130,510,170>
  slot onDeleteContact
  {
    Device::Device.Contacts.Remove( Contact );

    signal OnDelete;
  }

  $rect <310,290,510,330>
  onset Contact
  {
    if ( pure Contact == value )
      return;

    if ( pure Contact != null )
    {
       detachobserver onContactUpdated, pure Contact;
    }

    pure Contact = value;

    if ( pure Contact != null )
    {
      attachobserver onContactUpdated, pure Contact;
      postsignal onContactUpdated;
    }

  }

  $rect <310,330,510,370>
  slot onContactUpdated
  {
    if ( Contact != null )
    {
      FirstNameTxt.String = Contact.FirstName;
      LastNameTxt.String  = Contact.LastName;
      NumberTxt.String    = Contact.PhoneNumber;  
      UserInitials.Icon  = Contact.NameInitials;
    }

  }

  $rect <310,250,510,290>
  property Device::Contact Contact;

  $rect <520,130,720,170>
  property slot OnDelete;

  // Displayed contact info
  note group Note1
  {
    attr Bounds = <290,200,740,390>;
  }

  $rect <20,20,160,60>
  object Views::Rectangle Background
  {
    preset Bounds = <0,0,272,440>;
    preset Color = Res::WhiteComponents;
  }

  $rect <20,20,160,60>
  object Components::Button265x470 DeleteBtn
  {
    preset Bounds = <5,398,263,431>;
    preset Enabled = true;
    preset OnActivate = onDeleteContact;
    preset String = Strings::DeleteContactTxt;
  }

  $rect <20,20,160,60>
  object Components::InputEtxt NumberTxt
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Bounds = <7,244,265,273>;
    preset OnChange = onFieldModified;
    preset Alignment = Views::TextAlignment[AlignHorzLeft, AlignVertCenter];
    preset String = "0749320267";
    preset Color = Res::Blue;
    preset Font = Res::ContactFont15;
    preset Placeholder = "0749320267";
  }

  $rect <20,20,160,60>
  object Views::Line Line4
  {
    preset Point2 = <264,239>;
    preset Point1 = <6,239>;
    preset Color = #E2E2E2FD;
  }

  $rect <20,20,160,60>
  object Views::Text MobileTxt
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Bounds = <6,207,264,240>;
    preset Alignment = Views::TextAlignment[AlignHorzLeft, AlignVertCenter];
    preset String = Strings::MobileTxt;
    preset Font = Res::ContactFont15;
    preset Color = Res::GreyLight;
  }

  $rect <20,20,160,60>
  object Views::Line Line3
  {
    preset Point2 = <263,206>;
    preset Point1 = <5,206>;
    preset Color = Res::GreyLight;
  }

  $rect <20,20,160,60>
  object Components::InputEtxt FirstNameTxt
  {
    preset Layout = Core::Layout[AlignToLeft];
    preset Bounds = <2,174,268,206>;
    preset OnChange = onFieldModified;
    preset String = Strings::FirstNameTxt;
    preset Color = Res::BlackComponents;
    preset Placeholder = Strings::FirstNameTxt;
  }

  $rect <20,20,160,60>
  object Views::Line Line2
  {
    preset Point2 = <263,173>;
    preset Point1 = <5,173>;
    preset Color = Res::GreyLight;
  }

  $rect <20,20,160,60>
  object Components::InputEtxt LastNameTxt
  {
    preset Layout = Core::Layout[AlignToLeft];
    preset Bounds = <2,141,268,173>;
    preset OnChange = onFieldModified;
    preset String = Strings::LastNameTxt;
    preset Color = Res::BlackComponents;
    preset Placeholder = Strings::LastNameTxt;
  }

  $rect <20,20,160,60>
  object Views::Line Line1
  {
    preset Point2 = <263,140>;
    preset Point1 = <5,140>;
    preset Color = Res::GreyLight;
  }

  $rect <20,20,160,60>
  object Components::ButtonBase70x90 UserInitials
  {
    preset Bounds = <99,29,169,120>;
    preset Icon = "";
    preset Descript = Strings::AddPhototTxt;
  }

  $rect <20,20,160,60>
  object Components::SButton25x25 CloseBtn
  {
    preset Bounds = <7,4,32,29>;
    preset Icon = Res::CloseIcon;
    preset OnActivate = onClose;
    preset IconColor = Res::Blue;
    preset BackgoundColor = Res::Transparent;
    preset BackgoundColorPressed = Res::Transparent;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::ButtonRoundSmall;
  }

  $rect <20,20,160,60>
  object Components::SButton25x25 SaveBtn
  {
    preset Bounds = <240,4,265,29>;
    preset Enabled = false;
    preset Icon = Res::CkeckIcon;
    preset OnActivate = onSave;
    preset IconColor = Res::Blue;
    preset BackgoundColor = Res::Transparent;
    preset BackgoundColorPressed = Res::Transparent;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::ButtonRoundSmall;
    preset BackgroundColorEnabled = Res::Transparent;
    preset DescriptColorEnabled = Res::Grey;
  }

  $rect <530,330,730,370>
  slot onFieldModified
  {
    UserInitials.Icon = Device::Device.Contacts.GetInitials( LastNameTxt.String, FirstNameTxt.String );

    InvalidateViewState();
  }

  // State management
  note group Note4
  {
    attr Bounds = <750,0,970,150>;
  }
}

$rect <240,560,410,600>
$output false
$multilingual true
class OngoingCall : Application::CallBase
{
  $rect <310,40,510,80>
  inherited method Init()
  {
    signal Stoper.StartTimer;
  }

  $rect <0,490,200,530>
  inherited property Bounds = <0,0,272,480>;

  $rect <510,130,710,170>
  inherited slot onContactUpdated
  {
    if (  Contact.CallState == Device::CallState.Speaking )
    {
      AddCallBtn.Enabled = true;
      VideoCallBtn.Enabled = true;
      
    } 

    super( sender );
  }

  $rect <20,20,160,60>
  inherited object DesclineButton
  {
    preset Bounds = <104,374,169,466>;
  }

  $rect <500,520,700,560>
  slot onSpeakerPress
  {
    //button pressed it changes sate from start/stop and icon PlayIcon/StopIcon

    Device::Device.Speaker =! Device::Device.Speaker;

    SpeakerBtn.BackgoundColor = Device::Device.Speaker ? Res::WhiteComponents : Res::WhiteTransparent;
    SpeakerBtn.IconColor      = Device::Device.Speaker ? Res::BlackComponents : Res::WhiteComponents ;
  }

  $rect <500,480,700,520>
  slot onMicPress
  {
    //button pressed it changes sate from start/stop and icon PlayIcon/StopIcon

    Device::Device.Microphone = ! Device::Device.Microphone;

    MuteBtn.BackgoundColor = Device::Device.Microphone ? Res::WhiteComponents : Res::WhiteTransparent;
    MuteBtn.IconColor      = Device::Device.Microphone ? Res::BlackComponents : Res::WhiteComponents;
  }

  // Touch screen events
  note group Note
  {
    attr Bounds = <290,210,710,640>;
  }

  $rect <700,370,900,410>
  slot onKeypadPress
  {
    Keypad.Bounds.origin =< 0, 30>;

    Keypad.OnHide = onHide;


  }

  $rect <500,340,700,380>
  slot onAddCallPress
  {
    addCall = new Application::ContactsAppInsideCall;

    addCall.OnCancel = onCancelAddCall;

    PresentDialog( addCall, Res::SlideUpCenteredLimit, null, null, null, null, null, null, null, false );
  }

  $rect <300,520,500,560>
  slot onVideoCallPress
  {
    sender; 
  }

  $rect <510,250,700,290>
  slot onContactsPress
  {
    contactsPage = new Application::ContactsInsideCall;

    contactsPage.OnCancel = onCancelContacts; 

    SwitchToDialog( contactsPage, Res::SlideUpCenteredLimit, null, null, null, null, null,
                               null, null, null, false );
  }

  $rect <20,20,160,60>
  object Components::Button65x90 ContactsBtn
  {
    preset Bounds = <182,240,247,332>;
    preset Icon = Res::UserIcon;
    preset OnActivate = onContactsPress;
    preset Descript = Strings::contactsTxt;
    preset DescriptColor = Res::White;
    preset IconColor = Res::White;
    preset BackgoundColor = Res::WhiteTransparent;
    preset BackgoundColorPressed = Res::PressColor;
    preset DescriptFont = Res::ContactFont12;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::ButtonRoundMedium1;
    preset DescriptColorPressed = Res::White;
    preset IconColorPressed = Res::White;
  }

  $rect <20,20,160,60>
  object Components::Button65x90 VideoCallBtn
  {
    preset Bounds = <104,241,169,333>;
    preset Enabled = false;
    preset Icon = Res::VideoCallIcon;
    preset OnActivate = onVideoCallPress;
    preset Descript = Strings::videocallTxt;
    preset DescriptColor = Res::WhiteComponents;
    preset BackgoundColor = Res::WhiteTransparent;
    preset BackgoundColorPressed = Res::PressColor;
    preset DescriptFont = Res::ContactFont12;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::ButtonRoundMedium1;
    preset BackgroundColorEnabled = Res::WhiteSemiTransparent;
  }

  $rect <20,20,160,60>
  object Components::Button65x90 AddCallBtn
  {
    preset Bounds = <26,242,91,334>;
    preset Icon = Res::PlusIcon;
    preset OnActivate = onAddCallPress;
    preset Descript = Strings::addcallTxt;
    preset DescriptColor = Res::White;
    preset IconColor = Res::White;
    preset BackgoundColor = Res::WhiteTransparent;
    preset BackgoundColorPressed = Res::PressColor;
    preset DescriptFont = Res::ContactFont12;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::ButtonRoundMedium1;
    preset BackgroundColorEnabled = Res::WhiteSemiTransparent;
    preset DescriptColorPressed = Res::White;
    preset IconColorPressed = Res::White;
  }

  $rect <20,20,160,60>
  object Components::Button65x90 SpeakerBtn
  {
    preset Bounds = <182,147,247,239>;
    preset Icon = Res::SpeakerIcon;
    preset OnActivate = onSpeakerPress;
    preset Descript = Strings::speakerTxt;
    preset DescriptColor = Res::White;
    preset IconColor = Res::White;
    preset BackgoundColor = Res::WhiteTransparent;
    preset BackgoundColorPressed = Res::PressColor;
    preset DescriptFont = Res::ContactFont12;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::ButtonRoundMedium1;
    preset DescriptColorPressed = Res::White;
    preset IconColorPressed = Res::White;
  }

  $rect <20,20,160,60>
  object Components::Button65x90 KeyPadBtn
  {
    preset Bounds = <104,148,169,240>;
    preset Icon = Res::KeypadIcon;
    preset OnActivate = onKeypadPress;
    preset Descript = Strings::keypadTxt;
    preset DescriptColor = Res::White;
    preset IconColor = Res::White;
    preset BackgoundColor = Res::WhiteTransparent;
    preset BackgoundColorPressed = Res::PressColor;
    preset DescriptFont = Res::ContactFont12;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::ButtonRoundMedium1;
    preset DescriptColorPressed = Res::White;
    preset IconColorPressed = Res::White;
  }

  $rect <20,20,160,60>
  object Components::Button65x90 MuteBtn
  {
    preset Bounds = <26,149,91,241>;
    preset Icon = Res::MicOffIcon;
    preset OnActivate = onMicPress;
    preset Descript = Strings::muteTxt;
    preset DescriptColor = Res::White;
    preset IconColor = Res::White;
    preset BackgoundColor = Res::WhiteTransparent;
    preset BackgoundColorPressed = Res::PressColor;
    preset DescriptFont = Res::ContactFont12;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::ButtonRoundMedium1;
    preset DescriptColorPressed = Res::White;
    preset IconColorPressed = Res::White;
  }

  $rect <300,250,500,290>
  var Application::ContactsInsideCall contactsPage = null;

  $rect <520,290,690,330>
  slot onCancelContacts
  {
    DismissDialog( contactsPage, Res::SlideDownCentered, null, null, null, null, false);

    contactsPage = null;
  }

  $rect <730,450,900,490>
  slot onHide
  {
    Keypad.Bounds.origin.y = Bounds.y2;

    Keypad.InputEtxt.String = "";
    ContactNameTxt.Visible  = true;
    TimeTxt.Visible         = true;
    UserInitials.Visible    = true;

  }

  $rect <20,20,160,60>
  object Application::KeypadInsideCall Keypad
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Bounds = <0,518,272,958>;
    preset inHideTextVisible = false;
    preset IsCallButtonVisible = true;
    preset OnEditTextChanged = onKeypadEdit;
  }

  $rect <700,410,900,450>
  slot onKeypadEdit
  {
    ContactNameTxt.Visible = Keypad.InputEtxt.String == "";
    TimeTxt.Visible        = Keypad.InputEtxt.String == "";
    UserInitials.Visible   = Keypad.InputEtxt.String == "";
  }

  // Initialization
  note group Note2
  {
    attr Bounds = <290,0,750,200>;
  }

  $rect <300,340,500,380>
  var Application::ContactsAppInsideCall addCall = null;

  $rect <530,380,700,420>
  slot onCancelAddCall
  {
    DismissDialog( addCall, Res::SlideDownCentered, null, null, null, null, false);

    addCall = null;
  }

  $rect <310,80,510,120>
  object Core::Timer Stoper
  {
    preset OnTrigger = upDateTalkDuration;
  }

  $rect <510,80,710,120>
  slot upDateTalkDuration
  {
    if (  Contact.CallState == Device::CallState.Speaking )
    {
      TimeTxt.String = Contact.GetDuration();
    }
  }

  $rect <20,20,160,60>
  inherited object TimeTxt
  {
    preset Bounds = <18,73,104,103>;
    preset AutoSize = true;
  }

  // Directives to adapt the order of the above members according to how these members 
  // where arranged when the project content was stored. In this manner the storage 
  // and the expected order of the members don't depend. Merging of changes in the 
  // project files is simplified.
  $member Init
  $member Bounds
  $member onContactUpdated
  $member DesclineButton
  $member TimeTxt
  $member onSpeakerPress
  $member onMicPress
  $member Note
  $member onKeypadPress
  $member onAddCallPress
  $member onVideoCallPress
  $member onContactsPress
  $member ContactsBtn
  $member VideoCallBtn
  $member AddCallBtn
  $member SpeakerBtn
  $member KeyPadBtn
  $member MuteBtn
  $member contactsPage
  $member onCancelContacts
  $member onHide
  $member Keypad
  $member onKeypadEdit
  $member Note2
  $member addCall
  $member onCancelAddCall
  $member Stoper
  $member upDateTalkDuration
}

$rect <240,640,410,680>
$output false
$multilingual true
class DetailsInsideCall : Application::DetailsPage
{
  $rect <0,490,200,530>
  inherited property Bounds = <0,0,272,440>;

  $rect <490,20,690,60>
  inherited slot onTapEdit
  {
    editPage = new Application::EditPage;

    editPage.OnSave  = onSaveEdit;
    editPage.OnClose = onCancelEdit;
    editPage.Contact = Contact;
    editPage.OnDelete = onDelete;

    SwitchToDialog( editPage, Res::FadeInOutCentered, null, null, null, null, null,
                               null, null, null, false );
     



  }

  $rect <290,20,490,60>
  inherited var editPage;

  $rect <20,20,160,60>
  inherited object Background
  {
    preset Bounds = <0,0,272,440>;
  }

  $rect <20,20,160,60>
  inherited object Line2
  {
    preset Point2 = <264,311>;
    preset Point1 = <6,311>;
  }

  $rect <20,20,160,60>
  inherited object NumberTxt
  {
    preset Bounds = <18,282,262,311>;
  }

  $rect <20,20,160,60>
  inherited object MobileTxt
  {
    preset Bounds = <6,256,264,289>;
  }

  $rect <20,20,160,60>
  inherited object Line1
  {
    preset Point2 = <264,256>;
    preset Point1 = <6,256>;
  }

  $rect <20,20,160,60>
  inherited object CallBtn
  {
    preset Bounds = <50,161,100,236>;
    preset Enabled = false;
  }

  $rect <20,20,160,60>
  inherited object VideoCallBtn
  {
    preset Bounds = <110,161,160,236>;
  }

  $rect <20,20,160,60>
  inherited object PushButtonMediumBlue2
  {
    preset Bounds = <170,161,220,236>;
  }

  $rect <20,20,160,60>
  inherited object ContactName
  {
    preset Bounds = <10,114,267,144>;
  }

  $rect <20,20,160,60>
  inherited object UserInitialsBtn
  {
    preset Bounds = <100,30,170,121>;
    preset Enabled = false;
  }

  $rect <20,20,160,60>
  inherited object EditBtn
  {
    preset Bounds = <239,5,264,30>;
  }

  $rect <20,20,160,60>
  inherited object BackBtn
  {
    preset Bounds = <6,5,31,30>;
  }
}

$rect <230,431,410,471>
$output false
$multilingual true
class KeypadPage : Core::Group
{
  $rect <0,490,200,530>
  inherited property Bounds = <0,0,272, 440>;

  $rect <760,40,960,80>
  inherited method UpdateViewState()
  {
    // Always invoke the inherited method.
    super( aState );
    var bool isEnabled  = aState.contains( Core::ViewState[ Enabled  ]);

    if ( inHideTextVisible == false)
    {
      HideBtn.Visible= true;
    }

    if ( inHideTextVisible == true)
    {
      HideBtn.Visible= false;
    }

    if ( IsCallButtonVisible == false)
    {
      callbtn.Visible= true;
    }

    if ( IsCallButtonVisible == true)
    {
      callbtn.Visible= false;
    }


    if ( !isEnabled )
    {
      Background.Color = Res::Grey;
    }

    // Enabled but not pressed nor selected.
    else
    {
       Background.Color = BackgoundColor;
    }


  }

  $rect <300,60,500,100>
  property slot OnHide;

  $rect <500,60,700,100>
  slot onHide
  {
    postsignal OnHide;
  }

  $rect <760,90,960,130>
  property color BackgoundColor = Res::WhiteComponents;

  $rect <960,90,1160,130>
  onset BackgoundColor
  {
    if ( pure BackgoundColor == value )
      return;

    pure BackgoundColor = value;

    InvalidateViewState();
  }

  $rect <760,130,960,170>
  property bool inHideTextVisible = true;

  $rect <960,130,1160,170>
  onset inHideTextVisible
  {
    if ( pure inHideTextVisible == value )
      return;

    pure inHideTextVisible = value;

    InvalidateViewState();
  }

  $rect <300,110,500,150>
  slot onButtonsPress
  {
    var Components::SButton65x65 button = (Components::SButton65x65)sender;

    if ( sender == BtnErase)
      InputEtxt.String = InputEtxt.String.remove( InputEtxt.String.length-1, 1);
    else if ( button != null )
    {
      InputEtxt.String += button.Icon;
    }

    signal OnEditTextChanged;        

  }

  $rect <760,170,960,210>
  property bool IsCallButtonVisible = false;

  $rect <960,170,1160,210>
  onset IsCallButtonVisible
  {
    if ( pure IsCallButtonVisible == value )
      return;

    pure IsCallButtonVisible = value;

    InvalidateViewState();
  }

  $rect <300,150,500,190>
  slot onCallPress
  {
    if( InputEtxt.String != "")
    {
      Device::Device.SendCallFromNumber( InputEtxt.String );

    }
  }

  $rect <300,220,500,260>
  property slot OnEditTextChanged = null;

  $rect <20,20,160,60>
  object Views::Rectangle Background
  {
    preset Bounds = <0,0,272,440>;
    preset Color = #FFFFFFFF;
  }

  $rect <20,20,160,60>
  object Components::SButton65x65 callbtn
  {
    preset Bounds = <104,340,169,405>;
    preset Icon = Res::CallIcon;
    preset OnActivate = onCallPress;
    preset BackgoundColor = Res::GreenDark;
    preset BackgoundColorPressed = Res::Green;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::ButtonRoundMedium1;
  }

  $rect <20,20,160,60>
  object Components::SButton65x65 btn1
  {
    preset Bounds = <39,80,104,145>;
    preset Icon = "1";
    preset OnActivate = onButtonsPress;
    preset DescriptColor = Res::BlackComponents;
    preset IconColor = Res::BlackComponents;
    preset BackgoundColor = Res::GreyLight;
    preset BackgoundColorPressed = Res::Grey;
    preset DescriptFont = Res::ContactFont15;
    preset Backgound = Res::ButtonRoundMedium1;
    preset IconColorPressed = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Components::SButton65x65 btn3
  {
    preset Bounds = <169,80,234,145>;
    preset Icon = "3";
    preset OnActivate = onButtonsPress;
    preset DescriptColor = Res::BlackComponents;
    preset IconColor = Res::BlackComponents;
    preset BackgoundColor = Res::GreyLight;
    preset BackgoundColorPressed = Res::Grey;
    preset DescriptFont = Res::ContactFont15;
    preset Backgound = Res::ButtonRoundMedium1;
    preset IconColorPressed = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Components::SButton65x65 btn2
  {
    preset Bounds = <104,80,169,145>;
    preset Icon = "2";
    preset OnActivate = onButtonsPress;
    preset DescriptColor = Res::BlackComponents;
    preset IconColor = Res::BlackComponents;
    preset BackgoundColor = Res::GreyLight;
    preset BackgoundColorPressed = Res::Grey;
    preset DescriptFont = Res::ContactFont15;
    preset Backgound = Res::ButtonRoundMedium1;
    preset IconColorPressed = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Components::SButton65x65 btn4
  {
    preset Bounds = <39,145,104,210>;
    preset Icon = "4";
    preset OnActivate = onButtonsPress;
    preset DescriptColor = Res::BlackComponents;
    preset IconColor = Res::BlackComponents;
    preset BackgoundColor = Res::GreyLight;
    preset BackgoundColorPressed = Res::Grey;
    preset DescriptFont = Res::ContactFont15;
    preset Backgound = Res::ButtonRoundMedium1;
    preset IconColorPressed = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Components::SButton65x65 btn6
  {
    preset Bounds = <169,145,234,210>;
    preset Icon = "6";
    preset OnActivate = onButtonsPress;
    preset DescriptColor = Res::BlackComponents;
    preset IconColor = Res::BlackComponents;
    preset BackgoundColor = Res::GreyLight;
    preset BackgoundColorPressed = Res::Grey;
    preset DescriptFont = Res::ContactFont15;
    preset Backgound = Res::ButtonRoundMedium1;
    preset IconColorPressed = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Components::SButton65x65 btn5
  {
    preset Bounds = <104,145,169,210>;
    preset Icon = "5";
    preset OnActivate = onButtonsPress;
    preset DescriptColor = Res::BlackComponents;
    preset IconColor = Res::BlackComponents;
    preset BackgoundColor = Res::GreyLight;
    preset BackgoundColorPressed = Res::Grey;
    preset DescriptFont = Res::ContactFont15;
    preset Backgound = Res::ButtonRoundMedium1;
    preset IconColorPressed = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Components::SButton65x65 btn7
  {
    preset Bounds = <39,210,104,275>;
    preset Icon = "7";
    preset OnActivate = onButtonsPress;
    preset DescriptColor = Res::BlackComponents;
    preset IconColor = Res::BlackComponents;
    preset BackgoundColor = Res::GreyLight;
    preset BackgoundColorPressed = Res::Grey;
    preset DescriptFont = Res::ContactFont15;
    preset Backgound = Res::ButtonRoundMedium1;
    preset IconColorPressed = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Components::SButton65x65 btn9
  {
    preset Bounds = <169,210,234,275>;
    preset Icon = "9";
    preset OnActivate = onButtonsPress;
    preset DescriptColor = Res::BlackComponents;
    preset IconColor = Res::BlackComponents;
    preset BackgoundColor = Res::GreyLight;
    preset BackgoundColorPressed = Res::Grey;
    preset DescriptFont = Res::ContactFont15;
    preset Backgound = Res::ButtonRoundMedium1;
    preset IconColorPressed = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Components::SButton65x65 btn8
  {
    preset Bounds = <104,210,169,275>;
    preset Icon = "8";
    preset OnActivate = onButtonsPress;
    preset Descript = "8";
    preset DescriptColor = Res::WhiteComponents;
    preset IconColor = Res::BlackComponents;
    preset BackgoundColor = Res::GreyLight;
    preset BackgoundColorPressed = Res::Grey;
    preset DescriptFont = Res::ContactFont15;
    preset Backgound = Res::ButtonRoundMedium1;
    preset IconColorPressed = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Components::SButton65x65 btnstar
  {
    preset Bounds = <39,275,104,340>;
    preset Icon = "*";
    preset OnActivate = onButtonsPress;
    preset IconColor = Res::BlackComponents;
    preset BackgoundColor = Res::GreyLight;
    preset BackgoundColorPressed = Res::Grey;
    preset Backgound = Res::ButtonRoundMedium1;
    preset IconColorPressed = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Components::SButton65x65 btnDiez
  {
    preset Bounds = <169,275,234,340>;
    preset Icon = "#";
    preset OnActivate = onButtonsPress;
    preset Descript = "#";
    preset DescriptColor = Res::BlackComponents;
    preset IconColor = Res::BlackComponents;
    preset BackgoundColor = Res::GreyLight;
    preset BackgoundColorPressed = Res::Grey;
    preset DescriptFont = Res::ContactFont15;
    preset Backgound = Res::ButtonRoundMedium1;
    preset IconColorPressed = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Components::SButton65x65 btn0
  {
    preset Bounds = <104,275,169,340>;
    preset Icon = "0";
    preset OnActivate = onButtonsPress;
    preset Descript = "0";
    preset DescriptColor = Res::BlackComponents;
    preset IconColor = Res::BlackComponents;
    preset BackgoundColor = Res::GreyLight;
    preset BackgoundColorPressed = Res::Grey;
    preset DescriptFont = Res::ContactFont15;
    preset Backgound = Res::ButtonRoundMedium1;
    preset IconColorPressed = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Components::InputEtxt InputEtxt
  {
    preset Bounds = <39,48,234,80>;
    preset String = "";
    preset Color = Res::BlackComponents;
    preset Font = Res::TitileFont25;
  }

  $rect <20,20,160,60>
  object Components::TextButton HideBtn
  {
    preset Bounds = <39,360,101,385>;
    preset Embedded = true;
    preset Text = Strings::HideTxt;
    preset OnActivate = onHide;
    preset TextColor = Res::BlackComponents;
    preset TextColorPress = Res::Grey;
  }

  // State management
  note group Note4
  {
    attr Bounds = <750,0,1170,220>;
  }

  // Touch screen events
  note group Note
  {
    attr Bounds = <290,0,740,280>;
  }

  $rect <20,20,160,60>
  object Components::SButton65x65 BtnErase
  {
    preset Bounds = <169,340,234,405>;
    preset Icon = Res::BackspaceIcon;
    preset OnActivate = onButtonsPress;
    preset Descript = "#";
    preset DescriptColor = Res::BlackComponents;
    preset IconColor = Res::BlackComponents;
    preset BackgoundColor = Res::Transparent;
    preset BackgoundColorPressed = Res::Transparent;
    preset DescriptFont = Res::ContactFont15;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::ButtonRoundMedium1;
    preset IconColorPressed = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Core::Outline Outline
  {
    preset Bounds = <4,340,104,405>;
    preset Formation = Core::Formation.RightToLeft;
  }

  // Directives to adapt the order of the above members according to how these members 
  // where arranged when the project content was stored. In this manner the storage 
  // and the expected order of the members don't depend. Merging of changes in the 
  // project files is simplified.
  $member Bounds
  $member UpdateViewState
  $member OnHide
  $member onHide
  $member BackgoundColor
  $member OnSetBackgoundColor
  $member inHideTextVisible
  $member OnSetinHideTextVisible
  $member onButtonsPress
  $member IsCallButtonVisible
  $member OnSetIsCallButtonVisible
  $member onCallPress
  $member OnEditTextChanged
  $member Background
  $member callbtn
  $member btn1
  $member btn3
  $member btn2
  $member btn4
  $member btn6
  $member btn5
  $member btn7
  $member btn9
  $member btn8
  $member btnstar
  $member btnDiez
  $member btn0
  $member InputEtxt
  $member Note4
  $member Note
  $member BtnErase
  $member Outline
  $member HideBtn
}

// This is the root component of the entire GUI application.
$rect <20,255,220,295>
$output false
$multilingual true
class PhoneApp : Core::Group
{
  $rect <300,40,480,80>
  inherited method Init()
  {
    SelectedPage = 2;
  }

  $rect <0,500,200,540>
  inherited property Bounds = <0,0,272,480>;

  $rect <20,20,160,60>
  object Core::Group Outline
  {
    preset Bounds = <0,0,272,440>;
  }

  $rect <20,20,160,60>
  object Views::Rectangle Rectangle
  {
    preset Bounds = <0,440,272,480>;
    preset Color = Res::WhiteComponents;
  }

  $rect <20,20,160,60>
  object Components::NavBarButton64x40 NavBarButtons
  {
    preset Bounds = <0,440,68,480>;
    preset Icon = Res::HeartIcon;
    preset Descript = Strings::FavoritesTxt;
    preset Outlet = ^SelectedPage;
  }

  $rect <20,20,160,60>
  object Components::NavBarButton64x40 NavBarButtons1
  {
    preset Bounds = <68,440,136,480>;
    preset Icon = Res::CallIcon;
    preset Descript = Strings::RecentTxt;
    preset OutletSelector = 1;
    preset Outlet = ^SelectedPage;
  }

  $rect <20,20,160,60>
  object Components::NavBarButton64x40 NavBarButtons2
  {
    preset Bounds = <136,440,204,480>;
    preset Icon = Res::UserIcon;
    preset Descript = Strings::ContactsTxtx;
    preset OutletSelector = 2;
    preset Outlet = ^SelectedPage;
  }

  $rect <20,20,160,60>
  object Components::NavBarButton64x40 NavBarButtons3
  {
    preset Bounds = <204,440,272,480>;
    preset Icon = Res::KeypadIcon;
    preset Descript = Strings::KeypadTxt;
    preset OutletSelector = 3;
    preset Outlet = ^SelectedPage;
  }

  $rect <20,20,160,60>
  object Views::Line Line
  {
    preset Point2 = <270,440>;
    preset Point1 = <0,440>;
    preset Color = Res::GreyLight;
  }

  $rect <300,90,500,130>
  property int32 SelectedPage = -1;

  $rect <300,130,500,170>
  onset SelectedPage
  {
    if ( pure SelectedPage == value )
      return;

    pure SelectedPage = value;

    notifyobservers ^SelectedPage;

    signal onSwitchToSelectedPage;
  }

  $rect <300,170,500,210>
  onget SelectedPage
  {
    return pure SelectedPage;
  }

  // Initialization
  note group Note
  {
    attr Bounds = <290,0,510,290>;
  }

  $rect <300,230,500,270>
  slot onSwitchToSelectedPage
  {
    switch ( pure SelectedPage )
    {
      case 0: 
      {
        var Core::Group favorites = new Application::FavoritesPage;
        Outline.SwitchToDialog( favorites, null, null, null, null, null, null, null, null, null,false );
      }
      case 1: 
      {
        var Core::Group recent = new Application::RecentPage;
        Outline.SwitchToDialog( recent, null, null, null, null, null, null, null, null, null,false );
      }
      case 2: 
      {
        var Core::Group contacts = new Application::ContactsPage;
       
        Outline.SwitchToDialog( contacts, null, null, null, null, null, null, null, null, null,false );
      }
      case 3: 
      {
        var Core::Group keypad = new Application::KeypadPage;
        Outline.SwitchToDialog( keypad, null, null, null, null, null, null,
                                null, null, null,false );
      }

      default:
        trace "ERROR: invalid selected page ", pure SelectedPage;
    }

  }
}

$rect <240,680,410,720>
$output false
$multilingual true
class KeypadInsideCall : Application::KeypadPage
{
  $rect <20,20,160,60>
  inherited object Background
  {
    preset Visible = false;
  }

  $rect <20,20,160,60>
  object Views::Rectangle BackgroundSmall
  {
    preset Bounds = <0,80,272,340>;
    preset ColorBL = #838383FA;
    preset ColorBR = #4F4F4FFF;
    preset ColorTR = #898989FF;
    preset ColorTL = #898989FF;
    preset Color = #3C3C3CFF;
  }

  $rect <20,20,160,60>
  inherited object callbtn
  {
    preset Visible = false;
  }

  $rect <20,20,160,60>
  inherited object btn1;

  $rect <20,20,160,60>
  inherited object btn3
  {
    preset Enabled = true;
  }

  $rect <20,20,160,60>
  inherited object btn2;

  $rect <20,20,160,60>
  inherited object btn4;

  $rect <20,20,160,60>
  inherited object btn6;

  $rect <20,20,160,60>
  inherited object btn5;

  $rect <20,20,160,60>
  inherited object btn7;

  $rect <20,20,160,60>
  inherited object btn9;

  $rect <20,20,160,60>
  inherited object btn8;

  $rect <20,20,160,60>
  inherited object btnstar;

  $rect <20,20,160,60>
  inherited object btnDiez;

  $rect <20,20,160,60>
  inherited object btn0;

  $rect <20,20,160,60>
  inherited object InputEtxt
  {
    preset Bounds = <39,32,234,64>;
    preset Color = Res::White;
  }

  $rect <20,20,160,60>
  inherited object HideBtn
  {
    preset Bounds = <59,360,104,385>;
    preset TextColor = Res::White;
  }

  $rect <20,20,160,60>
  inherited object BtnErase
  {
    preset IconColor = Res::WhiteComponents;
  }

  $rect <20,20,160,60>
  inherited object Outline
  {
    preset Bounds = <4,362,104,403>;
  }

  // Directives to adapt the order of the above members according to how these members 
  // where arranged when the project content was stored. In this manner the storage 
  // and the expected order of the members don't depend. Merging of changes in the 
  // project files is simplified.
  $member Background
  $member callbtn
  $member BackgroundSmall
  $member btn1
  $member btn3
  $member btn2
  $member btn4
  $member btn6
  $member btn5
  $member btn7
  $member btn9
  $member btn8
  $member btnstar
  $member btnDiez
  $member btn0
  $member InputEtxt
  $member BtnErase
  $member Outline
  $member HideBtn

  // Directives to adapt the order of members belonging to this class so they appear 
  // correctly arranged relative to the members inherited from the ancestor (super) 
  // classes. The numbers indicate the order-displacement to apply on the respective 
  // member once all members have been loaded and combined with members from the 
  // ancestor classes.
  $reorder BackgroundSmall 16
}

$rect <240,600,410,640>
$output false
$multilingual true
class ContactsInsideCall : Application::ContactsPage
{
  $rect <290,110,490,150>
  inherited var detailsPage;

  $rect <20,20,160,60>
  inherited object Background;

  $rect <20,20,160,60>
  inherited object VerticalList
  {
    preset Bounds = <11,134,261,440>;
  }

  $rect <20,20,160,60>
  inherited object SlideTouchHandler
  {
    preset Bounds = <12,134,261,440>;
  }

  $rect <20,20,160,60>
  inherited object UpButton
  {
    preset Bounds = <236,108,262,134>;
  }

  $rect <20,20,160,60>
  inherited object DownButton
  {
    preset Bounds = <210,108,236,134>;
  }

  $rect <20,20,160,60>
  inherited object SearchExt;

  $rect <20,20,160,60>
  inherited object TitleTxt
  {
    preset Bounds = <11,12,261,61>;
    preset Font = Res::ContactFontBold15;
  }

  $rect <20,20,160,60>
  inherited object PlusButton
  {
    preset Bounds = <241,12,271,42>;
  }

  $rect <20,20,160,60>
  inherited object MyCardItem
  {
    preset Visible = false;
  }

  $rect <20,20,160,60>
  object Components::TextButton TextButton
  {
    preset Bounds = <182,16,238,41>;
    preset Embedded = true;
    preset Text = Strings::CancelTxt;
    preset OnActivate = onCancel;
  }

  $rect <290,0,490,40>
  property slot OnCancel;

  $rect <490,0,690,40>
  slot onCancel
  {
    postsignal OnCancel;
  }

  $rect <490,110,690,150>
  inherited slot onContactPressed
  {
    var Application::ContactItem itemView = (Application::ContactItem)sender;

    if ( itemView != null )
    {
      detailsPage = new Application::DetailsInsideCall;
      detailsPage.OnBack = onClose;
      detailsPage.OnDelete = onDelete;

      detailsPage.Contact = itemView.Contact;
      SwitchToDialog( detailsPage, Res::SlideLeftCentered, null, null, null, null, null,
                               null, null, null, false );
    }

  }

  $rect <20,20,160,60>
  object Core::Outline Outline1
  {
    preset Bounds = <67,15,237,46>;
    preset Formation = Core::Formation.RightToLeft;
  }

  // Directives to adapt the order of the above members according to how these members 
  // where arranged when the project content was stored. In this manner the storage 
  // and the expected order of the members don't depend. Merging of changes in the 
  // project files is simplified.
  $member detailsPage
  $member Background
  $member VerticalList
  $member SlideTouchHandler
  $member UpButton
  $member DownButton
  $member SearchExt
  $member TitleTxt
  $member PlusButton
  $member onContactPressed
  $member MyCardItem
  $member OnCancel
  $member onCancel
  $member Outline1
  $member TextButton
}

$rect <460,50,660,87>
$multilingual true
$variant WebGlLocalhost, WebGlMindware
vclass ApplicationSimulation : Application::Application
{
  $rect <920,20,1120,60>
  inherited property Bounds = <0,0,400,630>;

  $rect <20,20,160,60>
  object Views::Image Image
  {
    preset Bounds = <-110,-31,552,661>;
    preset ColorBL = #A8A8A8FF;
    preset ColorBR = #E0E0E0FF;
    preset ColorTR = #C7C7C7FF;
    preset Color = Res::Grey;
    preset Bitmap = Res::iphoneCase;
  }

  $rect <20,20,160,60>
  object Core::SimpleTouchHandler SimpleTouchHandler
  {
    preset Point4 = <161,610>;
    preset Point3 = <228,610>;
    preset Point2 = <227,548>;
    preset Point1 = <161,548>;
    preset OnPress = onHomeBtnPressed;
  }

  // Directives to adapt the order of members belonging to this class so they appear 
  // correctly arranged relative to the members inherited from the ancestor (super) 
  // classes. The numbers indicate the order-displacement to apply on the respective 
  // member once all members have been loaded and combined with members from the 
  // ancestor classes.
  $reorder Image 5
}

// Simulation
note group Note4
{
  attr Bounds = <440,0,909,209>;
}

$rect <240,520,410,560>
$output false
$multilingual true
class IncomingCall : Application::CallBase
{
  $rect <300,40,500,80>
  inherited method Init()
  {
  }

  $rect <0,500,200,540>
  inherited property Bounds = <0,0,272,480>;

  $rect <20,20,160,60>
  inherited object DesclineButton;

  $rect <20,20,160,60>
  inherited object UserInitials
  {
    preset IconColorPressed = Res::Grey;
  }

  // Touch screen events
  note group Note
  {
    attr Bounds = <290,210,760,320>;
  }

  $rect <310,260,510,300>
  slot onAcceptCall
  {
    Device::Device.SendCallAnswer( Contact );
  }

  $rect <20,20,160,60>
  object Components::Button65x90 AcceptButton
  {
    preset Bounds = <171,340,236,432>;
    preset Icon = Res::CallIcon;
    preset OnActivate = onAcceptCall;
    preset Descript = Strings::acceptTxt;
    preset DescriptColor = Res::White;
    preset IconColor = Res::White;
    preset BackgoundColor = Res::GreenDark;
    preset BackgoundColorPressed = Res::Green;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::ButtonRoundMedium1;
    preset DescriptColorPressed = Res::White;
    preset IconColorPressed = Res::White;
  }

  // Initialization
  note group Note2
  {
    attr Bounds = <290,0,760,200>;
  }

  // Directives to adapt the order of members belonging to this class so they appear 
  // correctly arranged relative to the members inherited from the ancestor (super) 
  // classes. The numbers indicate the order-displacement to apply on the respective 
  // member once all members have been loaded and combined with members from the 
  // ancestor classes.
  $reorder Note 2
  $reorder onAcceptCall 2
  $reorder AcceptButton 2
  $reorder Note2 2
}

$rect <229,300,409,340>
$output false
$multilingual true
class FavoritesPage : Core::Group
{
  $rect <290,50,470,90>
  inherited method Init()
  {
    attachobserver onListItemsUpdated, ^Device::Device.Favorites.NoOfItems;
    postsignal onListItemsUpdated;
  }

  $rect <0,450,190,490>
  inherited property Bounds = <0,0,272,440>;

  $rect <470,260,660,300>
  slot onAddPress
  {
    addFav = new Application::ContactsList;

    addFav.OnCancel      = onClose;
    addFav.OnAddFav      = onAdd;
    addFav.Contact = new Device::Contact;

    SwitchToDialog( addFav, Res::SlideUpCentered, null, null, null, null, null, null, null, null, false );

  }

  $rect <290,260,470,300>
  var Application::ContactsList addFav = null;

  // This method is called by 'VerticalList' every time the list loads or updates \
  // an item.
  $rect <820,60,1020,100>
  slot OnLoadItem
  {
    var int32 itemNo = VerticalList.Item;

    var Device::Contact contact = Device::Device.Favorites.GetContactAtIndex( itemNo );

    var Application::FavContactItem itemView = (Application::FavContactItem)VerticalList.View;
    Contact = itemView.Contact;
                                                  
    if ( itemView == null )
      return;

    itemView.Contact    = contact;
    itemView.OnActivate = onPressedContact;
    itemView.OnDelete   = onDeleteContact;
    itemView.OnInfo     = onInfoContact;  
    itemView.EditMode   = EditMode;

    itemView.Bounds.size = point( VerticalList.Bounds.w, VerticalList.ItemHeight );


  }

  $rect <850,100,1020,140>
  slot onPressedContact
  {
    Contact = (( Application::FavContactItem ) sender ).Contact;

    Device::Device.SendCallFromContact( Contact );

    Contact = null;

  }

  $rect <490,300,660,340>
  slot onClose
  {
    DismissDialog( addFav, Res::SlideDownCentered, null, null, null, null, false );

    addFav = null;

  }

  $rect <290,90,470,130>
  slot onListItemsUpdated
  {
    VerticalList.NoOfItems = Device::Device.Favorites.NoOfItems;

    VerticalList.InvalidateItems( 0, VerticalList.NoOfItems -1 );
  }

  $rect <490,50,660,90>
  property Device::Contact Contact = null;

  $rect <490,90,660,130>
  onset Contact
  {
    if ( pure Contact == value )
      return;

    pure Contact = value;

    notifyobservers ^Contact; 
  }

  // Touch screen events
  note group Note
  {
    attr Bounds = <280,170,670,390>;
  }

  $rect <20,20,160,60>
  object Views::Rectangle Background
  {
    preset Layout = Core::Layout[AlignToBottom, AlignToLeft, AlignToRight, AlignToTop, ResizeHorz, ResizeVert];
    preset Bounds = <0,0,272,440>;
    preset Color = Res::WhiteComponents;
  }

  $rect <20,20,160,60>
  object Core::VerticalList VerticalList
  {
    preset Bounds = <11,95,261,408>;
    preset OnLoadItem = OnLoadItem;
    preset SlideHandler = SlideTouchHandler;
    preset ItemHeight = 32;
    preset ItemClass = Application::FavContactItem;
  }

  $rect <20,20,160,60>
  object Core::SlideTouchHandler SlideTouchHandler
  {
    preset StackingPriority = -2;
    preset Bounds = <11,95,261,408>;
    preset SlideHorz = false;
  }

  $rect <20,20,160,60>
  object Views::Text TitleTxt1
  {
    preset Bounds = <11,42,261,76>;
    preset Alignment = Views::TextAlignment[AlignHorzLeft, AlignVertCenter];
    preset String = Strings::FavoritesTxt;
    preset Font = Res::TitileFont32;
    preset Color = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Components::SButton25x25 PlusButton
  {
    preset Bounds = <11,12,41,42>;
    preset Enabled = true;
    preset Icon = Res::PlusIcon;
    preset OnActivate = onAddPress;
    preset IconColor = Res::Blue;
    preset BackgoundColor = Res::Transparent;
    preset BackgoundColorPressed = Res::Transparent;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::ButtonRoundSmall;
  }

  $rect <20,20,160,60>
  object Components::TextButton EditButton
  {
    preset Bounds = <225,15,261,38>;
    preset Embedded = true;
    preset Text = Strings::EditTxt;
    preset OnActivate = onEdit;
  }

  $rect <690,180,850,220>
  var Application::DetailsPage detailsPage;

  $rect <850,180,1020,220>
  slot onInfoContact
  {
    detailsPage         = new Application::DetailsPage;
    detailsPage.Contact = (( Application::FavContactItem ) sender ).Contact;
    detailsPage.OnBack  = onCloseDetailsPage;

    SwitchToDialog( detailsPage, Res::SlideLeftCentered, null, null, null, null, null, null, null, null, false );


  }

  $rect <850,140,1020,180>
  slot onDeleteContact
  {
    Contact = (( Application::FavContactItem ) sender ).Contact;
    var Device::Contact contact = Device::Device.Contacts.FindMatchingIDContact( Contact );

    if ( contact != null)
      contact.IsFavorite = false;

    Device::Device.Favorites.Remove( Contact );

    VerticalList.InvalidateItems( 0, VerticalList.NoOfItems - 1 );

    Contact = null;
  }

  $rect <870,220,1020,260>
  slot onCloseDetailsPage
  {
    DismissDialog( detailsPage, Res::SlideRightCentered, null, null, null, null, false );

    detailsPage = null;
    Contact = null;
  }

  // Vertical list
  note group Note2
  {
    attr Bounds = <680,0,1030,390>;
  }

  // Initialization
  note group Note3
  {
    attr Bounds = <280,0,670,170>;
  }

  $rect <480,210,660,250>
  property bool EditMode = false;

  $rect <290,210,480,250>
  slot onEdit
  {
    EditMode = !EditMode;

    EditButton.Text = EditMode == false ?  Strings::EditTxt : Strings::DoneTxt;

    postsignal onListItemsUpdated;
  }

  $rect <490,340,660,380>
  slot onAdd
  {
    Device::Device.Favorites.AddLast ( addFav.Contact );
    postsignal onListItemsUpdated;

    DismissDialog ( addFav, Res::SlideDownCentered, null, null, null, null, false );
                               
    addFav = null;

  }

  $rect <20,20,160,60>
  object Core::Outline Outline
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Bounds = <41,15,261,45>;
    preset Formation = Core::Formation.RightToLeft;
  }

  // Directives to adapt the order of the above members according to how these members 
  // where arranged when the project content was stored. In this manner the storage 
  // and the expected order of the members don't depend. Merging of changes in the 
  // project files is simplified.
  $member Init
  $member Bounds
  $member onAddPress
  $member addFav
  $member OnLoadItem
  $member onPressedContact
  $member onClose
  $member onListItemsUpdated
  $member Contact
  $member OnSetContact
  $member Note
  $member Background
  $member VerticalList
  $member SlideTouchHandler
  $member TitleTxt1
  $member PlusButton
  $member detailsPage
  $member onInfoContact
  $member onDeleteContact
  $member onCloseDetailsPage
  $member Note2
  $member Note3
  $member EditMode
  $member onEdit
  $member onAdd
  $member Outline
  $member EditButton
}

$rect <40,550,220,590>
$output false
$multilingual true
class RecentPage : Core::Group
{
  $rect <290,40,480,80>
  inherited method Init()
  {
    attachobserver onListItemsUpdated, ^Device::Device.History.NoOfItems;
    postsignal onListItemsUpdated;
  }

  $rect <0,460,190,500>
  inherited property Bounds = <0,0,272,440>;

  $rect <0,570,200,610>
  inherited method UpdateLayout()
  {
    // Always invoke the inherited method.
    super( aSize );

    /*

      HINT:

      This method exists for sophisticated layout calculation. Please note, that in 
      most cases it is completely sufficient to use the views property 'Layout' to
      determine how the view should behave when the component is resized.

    */

    /*

      TO DO:

      Put here the code to calculate new position and size of enclosed views. The
      current (new) size of the component itself is passed in the parameter aSize.
      For example:

        SomeView.Bounds = rect( 10, 10, aSize.x - 20, aSize.y - 20 );

    */
  }

  $rect <0,530,200,570>
  inherited method UpdateViewState()
  {
    // Always invoke the inherited method.
    super( aState );

    /*

      HINT 1:

      This method is invoked automatically when the state set of the component has
      been changed. The new state set can be found in the parameter aState.
      Following are the important states:

        Enabled   --> The component can react to user inputs.

        Selected  --> The component is selected in context of its owner.

        Focused   --> The component is selected in context of its owner and 
                      the owner can react to keyboard events. In this manner the
                      component is also able to react to keyboard events.

        Modal     --> The component is modal. All events are redirected to this
                      component.

      To determine whether a state is currently active or not you have to test
      the aState parameter. For example to test the 'Selected' state:

        if ( aState.contains( Core::ViewState[ Selected ]))
        {
          ... yes, this component is currently selected.
        }

    */

    /*

      HINT 2:

      Alternatively you can request this method invocation by executing explicitly
      following code:


        InvalidateViewState();

    */
      
    /*

      TO DO 1:

      Put here the code to ensure that the visual aspect of the component does
      reflect its current state. For example, depending on its 'Enabled' state
      a component may appear with full colors or pale if it is disabled:

        if ( aState.contains( Core::ViewState[ Enabled ]))
        {
          SomeBackgroundView.Opacity = 255;
          SomeTextView.Color         = #000000FF;
        }
        else
        {
          SomeBackgroundView.Opacity = 128;
          SomeTextView.Color         = #00000080;
        }


      TO DO 2:

      You can evaluate here also the state of any other member in your component.
      For example in a push-button component, the button should appear highlighted
      as long as the user holds the finger within a touch area of the button:

        if ( SomeTouchHandler.Down && SomeTouchHandler.Inside )
          HighlightedBackground.Visible = true;
        else
          HighlightedBackground.Visible = false;

      The touch handler itself only requests the update method to be called. Use
      for this purpose 'InvalidateViewState()' method.


      TO DO 3:

      You can calculate here also the position/size of views accordingly to the
      state of any other member in your component. For example in a slider you
      can calculate the position of the slider knob from some properties like
      'SliderValue' and 'SliderRange':

        SliderKnob.Bounds.origin.x = ( SliderValue * Bounds.w ) / SliderRange;

      Changing the 'SliderValue' or 'SliderRange' property should only request
      the update method to be called. Use for this purpose 'InvalidateViewState()'
      method.

    */
  }

  $rect <20,20,160,60>
  object Views::Rectangle Background
  {
    preset Layout = Core::Layout[AlignToBottom, AlignToLeft, AlignToRight, AlignToTop, ResizeHorz, ResizeVert];
    preset Bounds = <0,0,272,440>;
    preset Color = Res::WhiteComponents;
  }

  $rect <20,20,160,60>
  object Views::Text TitleTxt1
  {
    preset Bounds = <11,42,261,76>;
    preset Alignment = Views::TextAlignment[AlignHorzLeft, AlignVertCenter];
    preset String = Strings::RecentTxt;
    preset Font = Res::TitileFont32;
    preset Color = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Components::TextButton TextButton
  {
    preset Bounds = <225,15,261,38>;
    preset Embedded = true;
    preset Text = Strings::EditTxt;
    preset OnActivate = onEdit;
  }

  $rect <20,20,160,60>
  object Core::VerticalList VerticalList
  {
    preset Bounds = <11,95,261,408>;
    preset OnLoadItem = OnLoadItem;
    preset SlideHandler = SlideTouchHandler;
    preset ItemHeight = 50;
    preset ItemClass = Application::RecentItm;
  }

  $rect <20,20,160,60>
  object Core::SlideTouchHandler SlideTouchHandler
  {
    preset StackingPriority = -1;
    preset Bounds = <11,95,261,408>;
    preset SlideHorz = false;
  }

  // This method is called by 'VerticalList' every time the list loads or updates \
  // an item.
  $rect <690,40,890,80>
  slot OnLoadItem
  {
    var int32 itemNo = VerticalList.Item;

    var Device::HistoryContact contactHistory = (Device::HistoryContact )Device::Device.History.GetContactAtIndex( itemNo );

    var Application::RecentItm itemView = (Application::RecentItm)VerticalList.View;
                                                  
    if ( itemView == null )
      return;

    if ( contactHistory != null )
    {
      itemView.ContactHistory = contactHistory;  
      itemView.EditMode = EditMode;
      itemView.OnActivate = onPressedContact;
      itemView.OnDelete = onDeleteContact;
      itemView.OnInfo = onInfoContact;
      
    }

    itemView.Bounds.size = point( VerticalList.Bounds.w, VerticalList.ItemHeight );


  }

  $rect <490,40,660,80>
  property Device::HistoryContact SelectedContact = null;

  $rect <490,80,660,120>
  onset SelectedContact
  {
    if ( pure SelectedContact == value )
      return;

    pure SelectedContact = value;

    notifyobservers ^SelectedContact; 
  }

  $rect <290,230,470,270>
  property bool EditMode = false;

  $rect <470,230,650,270>
  slot onEdit
  {
    EditMode = !EditMode;

    TextButton.Text = EditMode == false ?  Strings::EditTxt : Strings::DoneTxt;

    postsignal onListItemsUpdated;
  }

  // Touch screen events
  note group Note
  {
    attr Bounds = <280,180,670,280>;
  }

  // Vertical list
  note group Note2
  {
    attr Bounds = <680,0,1100,280>;
  }

  // Initialization
  note group Note3
  {
    attr Bounds = <280,0,670,170>;
  }

  $rect <720,80,890,120>
  slot onPressedContact
  {
    var Application::RecentItm itemView = (Application::RecentItm)sender;
    SelectedContact = itemView.ContactHistory;

    Device::Device.SendCallFromContact( SelectedContact );

    SelectedContact = null;

  }

  $rect <900,160,1060,200>
  var Application::RecentDetailsPage detailsPage;

  $rect <720,160,890,200>
  slot onInfoContact
  {
    var Application::RecentItm itemView = (Application::RecentItm)sender;

    if ( itemView != null )
    {
      detailsPage = new Application::RecentDetailsPage;
      
      detailsPage.Contact = itemView.ContactHistory;
      detailsPage.OnBack = onCloseDetailsPage;
      detailsPage.OnDelete = onCloseDetailsPage;

      detailsPage.HistoryContact = itemView.ContactHistory;
      SwitchToDialog( detailsPage, Res::SlideLeftCentered, null, null, null, null, null,
                               null, null, null, false );
    }
  }

  $rect <720,120,890,160>
  slot onDeleteContact
  {
    var Application::RecentItm itemView = (Application::RecentItm)sender;
    SelectedContact = itemView.ContactHistory;

    Device::Device.History.Remove( SelectedContact );

    postsignal onListItemsUpdated;
    SelectedContact = null;
  }

  $rect <740,200,890,240>
  slot onCloseDetailsPage
  {
    postsignal onListItemsUpdated;
    DismissDialog( detailsPage, Res::SlideRightCentered, null, null, null, null, false);

    SelectedContact = null;
  }

  $rect <890,40,1060,80>
  slot onListItemsUpdated
  {
    VerticalList.NoOfItems = Device::Device.History.NoOfItems;

    VerticalList.InvalidateItems ( 0, VerticalList.NoOfItems -1 );

  }

  $rect <20,20,160,60>
  object Core::Outline Outline
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Bounds = <52,15,261,42>;
    preset Formation = Core::Formation.RightToLeft;
  }

  // Directives to adapt the order of the above members according to how these members 
  // where arranged when the project content was stored. In this manner the storage 
  // and the expected order of the members don't depend. Merging of changes in the 
  // project files is simplified.
  $member Init
  $member Bounds
  $member UpdateLayout
  $member UpdateViewState
  $member OnLoadItem
  $member SelectedContact
  $member OnSetSelectedContact
  $member EditMode
  $member onEdit
  $member Note
  $member Note2
  $member Note3
  $member onPressedContact
  $member detailsPage
  $member onInfoContact
  $member onDeleteContact
  $member onCloseDetailsPage
  $member onListItemsUpdated
  $member Background
  $member TitleTxt1
  $member VerticalList
  $member SlideTouchHandler
  $member Outline
  $member TextButton
}

$rect <239,380,409,420>
$output false
$multilingual true
class ContactsList : Application::ContactsInsideCall
{
  $rect <20,20,160,60>
  inherited object PlusButton
  {
    preset Visible = false;
  }

  $rect <20,20,160,60>
  inherited object TextButton
  {
    preset Bounds = <202,24,268,49>;
  }

  $rect <20,20,160,60>
  object Views::Text Text
  {
    preset Bounds = <12,0,261,30>;
    preset String = Strings::AddToFavTxt;
    preset Font = Res::ContactFont12;
    preset Color = Res::BlackComponents;
  }

  $rect <310,240,510,280>
  property slot OnAddFav;

  $rect <310,50,510,90>
  property Device::Contact Contact = null;

  $rect <310,90,510,130>
  onset Contact
  {
    if ( pure Contact == value )
      return;

    pure Contact = value;

    notifyobservers ^Contact; 
  }

  // Contact data
  note group Note4
  {
    attr Bounds = <290,0,520,190>;
  }

  // Touch screen events
  note group Note8
  {
    attr Bounds = <290,190,740,310>;
  }

  $rect <20,20,160,60>
  inherited object ContactsInsideSearch
  {
    preset OnSelectedContact = onFilteredContactPressed;
  }

  $rect <520,240,720,280>
  inherited slot onContactPressed
  {
    Contact =  ((Application::ContactItem ) sender ).Contact;

    if ( Contact.IsFavorite == false )
    {
      Contact.IsFavorite = true;
      postsignal OnAddFav; 
    }
    else
    {
      trace "ERROR: Contact already in the list";
      postsignal OnCancel;
    }



  }

  $rect <520,290,720,330>
  inherited slot onFilteredContactPressed
  {
    Contact =  ContactsInsideSearch.Contact;

    if ( Contact.IsFavorite == false )
    {
      Contact.IsFavorite = true;
      postsignal OnAddFav; 
    }
    else
    {
      trace "ERROR: Contact already in the list";
      postsignal OnCancel;
    }


  }

  // Directives to adapt the order of the above members according to how these members 
  // where arranged when the project content was stored. In this manner the storage 
  // and the expected order of the members don't depend. Merging of changes in the 
  // project files is simplified.
  $member PlusButton
  $member onContactPressed
  $member TextButton
  $member Text
  $member OnAddFav
  $member Contact
  $member OnSetContact
  $member Note4
  $member Note8
  $member ContactsInsideSearch
  $member onFilteredContactPressed

  // Directives to adapt the order of members belonging to this class so they appear 
  // correctly arranged relative to the members inherited from the ancestor (super) 
  // classes. The numbers indicate the order-displacement to apply on the respective 
  // member once all members have been loaded and combined with members from the 
  // ancestor classes.
  $reorder TextButton 3
  $reorder OnCancel 3
  $reorder onCancel 3
  $reorder Text 3
  $reorder OnAddFav 3
  $reorder Contact 3
  $reorder OnSetContact 3
  $reorder Note4 3
  $reorder Note8 3
}

$rect <239,340,408,380>
$output false
$multilingual true
class FavContactItem : Application::ContactItem
{
  $rect <360,0,560,40>
  inherited property Bounds = <0,0,250,32>;

  $rect <10,230,170,270>
  object Effects::Int32Effect EditEffect
  {
    preset OnAnimate = onAnimate;
    preset NoOfCycles = 1;
    preset CycleDuration = 250;
    preset Value2 = 25;
    preset Value1 = 0;
  }

  $rect <170,250,320,290>
  slot onAnimate
  {
    RemoveButton.Bounds.x    = EditEffect.Value - 25  - DeleteEffect.Value;
    PrfofilButton.Bounds.x   = EditEffect.Value + 6   - DeleteEffect.Value;
    LastNameTxt.Bounds.x     = EditEffect.Value + 55  - DeleteEffect.Value;
    FirstNameTxt.Bounds.x    = EditEffect.Value + 146 - DeleteEffect.Value;
    InfoButton.Bounds.x      = EditEffect.Value + 217  - DeleteEffect.Value;
    TouchHandler.Point1.x    = RemoveButton.Bounds.x2;
    TouchHandler.Point4.x    = RemoveButton.Bounds.x2;
    DeleteButton.Bounds.x    = EditEffect.Value + 273 - DeleteEffect.Value;
  }

  $rect <10,100,210,140>
  property bool EditMode = false;

  $rect <10,140,210,180>
  onset EditMode
  {
    if ( pure EditMode == value )
      return;

    pure EditMode = value;

    EditEffect.Reversed = !EditMode;

    if ( EditMode )
    {
      InfoButton.Icon = Res::MenuIcon;
      InfoButton.IconColor = Res::Grey; 
    }
    else
    {
      InfoButton.Icon = Res::InfoIcon;
      InfoButton.IconColor = Res::Blue;
      
      if ( DeleteEffect.Enabled || DeleteEffect.Value == DeleteEffect.Value2 )
      {
        DeleteEffect.Reversed = true;
        signal DeleteEffect.StartEffect;
      }
    }

    signal EditEffect.StartEffect;



  }

  $rect <10,270,170,310>
  object Effects::Int32Effect DeleteEffect
  {
    preset OnAnimate = onAnimate;
    preset NoOfCycles = 1;
    preset CycleDuration = 250;
    preset Value2 = 110;
    preset Value1 = 0;
  }

  $rect <350,150,550,190>
  slot onDelete
  {
    DeleteEffect.Reversed = true;
    signal DeleteEffect.StartEffect;
    postsignal OnDelete;
  }

  $rect <350,110,550,150>
  slot onShowDelete
  {
    DeleteEffect.Reversed = false;

    signal DeleteEffect.StartEffect;

  }

  $rect <550,150,750,190>
  property slot OnDelete;

  $rect <350,190,550,230>
  slot onInfo
  {
    signal OnInfo;
  }

  $rect <550,190,750,230>
  property slot OnInfo;

  $rect <20,20,160,60>
  inherited object TouchHandler
  {
    preset StackingPriority = -1;
    preset Point3 = <217,32>;
    preset Point2 = <217,0>;
  }

  $rect <20,20,160,60>
  inherited object Background
  {
    preset Layout = Core::Layout[ResizeHorz, ResizeVert];
    preset Bounds = <0,0,250,32>;
    preset Color = Res::WhiteComponents;
  }

  $rect <20,20,160,60>
  inherited object LastNameTxt
  {
    preset Layout = Core::Layout[ResizeHorz, ResizeVert];
    preset Bounds = <44,8,113,26>;
    preset AutoSize = true;
  }

  $rect <20,20,160,60>
  object Components::TextButton DeleteButton
  {
    preset Bounds = <250,0,305,32>;
    preset Text = Strings::deleteTxt;
    preset OnActivate = onDelete;
    preset TextColor = Res::White;
    preset TextColorPress = Res::WhiteSemiTransparent;
    preset BackgoundColor = Res::Red;
  }

  $rect <20,20,160,60>
  object Components::SButton25x25 InfoButton
  {
    preset Layout = Core::Layout[ResizeHorz, ResizeVert];
    preset Bounds = <217,5,242,30>;
    preset Icon = Res::InfoIcon;
    preset OnActivate = onInfo;
    preset IconColor = Res::Blue;
    preset BackgoundColor = Res::Transparent;
    preset BackgoundColorPressed = Res::WhiteSemiTransparent;
    preset IconFont = Res::IconsFont20;
    preset Backgound = Res::ButtonRoundSmall;
  }

  $rect <20,20,160,60>
  inherited object FirstNameTxt
  {
    preset Layout = Core::Layout[ResizeHorz, ResizeVert];
    preset Bounds = <131,8,201,26>;
    preset AutoSize = true;
    preset String = "FirstName";
  }

  $rect <20,20,160,60>
  inherited object Line
  {
    preset Point2 = <250,32>;
    preset Width = 2;
    preset Color = Res::GreyLight;
  }

  $rect <20,20,160,60>
  inherited object PrfofilButton
  {
    preset Layout = Core::Layout[ResizeHorz, ResizeVert];
    preset Bounds = <6,4,31,29>;
    preset Backgound = Res::ButtonRoundSmall;
  }

  $rect <20,20,160,60>
  inherited object Line1
  {
    preset Point2 = <250,0>;
  }

  // Moving effect
  note group Note
  {
    attr Bounds = <0,190,330,330>;
  }

  // Initialization
  note group Note7
  {
    attr Bounds = <0,60,330,190>;
  }

  // Touch screen events
  note group Note8
  {
    attr Bounds = <340,60,800,320>;
  }

  $rect <20,20,160,60>
  object Components::SButton25x25 RemoveButton
  {
    preset Bounds = <-25,5,0,30>;
    preset Icon = Res::RemoveIcon;
    preset OnActivate = onShowDelete;
    preset IconColor = Res::White;
    preset BackgoundColor = Res::Red;
    preset BackgoundColorPressed = Res::Transparent;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::ButtonRoundSmall;
  }

  // Directives to adapt the order of members belonging to this class so they appear 
  // correctly arranged relative to the members inherited from the ancestor (super) 
  // classes. The numbers indicate the order-displacement to apply on the respective 
  // member once all members have been loaded and combined with members from the 
  // ancestor classes.
  $reorder EditEffect 11
  $reorder onAnimate 11
  $reorder EditMode 11
  $reorder OnSetEditMode 11
  $reorder DeleteEffect 11
  $reorder onDelete 11
  $reorder onShowDelete 11
  $reorder OnDelete 11
  $reorder onInfo 11
  $reorder OnInfo 11
  $reorder DeleteButton 5
  $reorder InfoButton 5
}

$rect <50,590,219,630>
$output false
$multilingual true
class RecentItm : Core::Group
{
  $rect <30,450,230,490>
  inherited property Bounds = <0,0,250,50>;

  $rect <580,110,780,150>
  inherited method UpdateViewState()
  {
    super( aState );
    var bool isEnabled  = aState.contains( Core::ViewState[ Enabled  ]);
    var bool isSelected = aState.contains( Core::ViewState[ Selected ]);
    var bool isPressed  = ( TouchHandler.Down && TouchHandler.Inside ) || 
                            FlashTimer.Enabled;

    if (LastNameTxt != null )
    {
      var color clr = ColorText1;
      var Resources::Font font = Res::ContactFontBold15; 
      LastNameTxt.Font  = font;
      LastNameTxt.Color     = clr;
     }
    if (FirstNameTxt!= null)
    {
      var color clr = ColorText1;
      var Resources::Font font = Res::ContactFont15; 
      FirstNameTxt.Font = font;
      FirstNameTxt.Color = clr;
     }

    if (CallTypeTxt != null)
    {
      CallTypeTxt.Font = Res::ContactFont12;
      CallTypeTxt.Color = ColorText2; 
     }

    if (TimeTxt != null)
    {
      TimeTxt.Font = Res::ContactFont12;
      TimeTxt.Color = ColorText2; 
     }



    if ( !isEnabled )
    {
      Background.Color = ButtonColor;
    }

    else if ( isPressed )
    {
      Background.Color = Res::PressColor;
    }

    else if ( isSelected )
    {
      Background.Color =  Res::GreyLight;
    }
    else
    {
      Background.Color = ButtonColor;
    }



    enabled  = isEnabled;
    selected = isSelected;
    pressed  = isPressed;


  }

  // Contact data
  note group Note4
  {
    attr Bounds = <570,330,790,520>;
  }

  // State management
  note group Note5
  {
    attr Bounds = <570,70,790,320>;
  }

  $rect <580,270,780,310>
  var Views::Text textView;

  // This variable stores the current state of the button.
  $rect <580,230,780,270>
  var bool pressed;

  // This variable stores the current state of the button.
  $rect <580,190,780,230>
  var bool selected;

  // This variable stores the current state of the button.
  $rect <580,150,780,190>
  var bool enabled;

  // The property 'Label' specifies the text to display as label in this push button \
  // widget. The desired font as well as the colors for all individual button states \
  // have to be specified in the configuration object assigned to the property @Appearance. \
  // If there is no configuration object associated to this push button widget (the \
  // property @Appearance is 'null'), no label is displayed.
  // Per default, the label is displayed centered within the push button area. You \
  // can modify the alignment of the label as well as its margins by specifying them \
  // in the configuration object.
  $rect <10,108,159,148>
  property string Icon = Res::OutgoingCallIcon;

  $rect <170,110,320,150>
  property string Text = "";

  $rect <170,150,320,190>
  onset Text
  {
    // The value doesn't change - nothing to do.
    if ( pure Text == value )
      return;

    // Remember the property's new value.
    pure Text = value;

    // ... and trigger the component to update its actual state.
    InvalidateViewState();
  }

  $rect <10,270,159,310>
  property color ButtonColor = Res::WhiteComponents;

  $rect <10,310,159,350>
  onset ButtonColor
  {
    // The value doesn't change - nothing to do.
    if ( pure ButtonColor == value )
      return;

    // Remember the property's new value.
    pure ButtonColor = value;

    // ... and trigger the component to update its actual state.
    InvalidateViewState();
  }

  $rect <10,188,159,228>
  property color IconColor = Res::WhiteComponents;

  $rect <10,228,159,268>
  onset IconColor
  {
    // The value doesn't change - nothing to do.
    if ( pure IconColor == value )
      return;

    // Remember the property's new value.
    pure IconColor = value;

    // ... and trigger the component to update its actual state.
    InvalidateViewState();

  }

  // Feedback flash effect
  note group Note3
  {
    attr Bounds = <340,390,560,520>;
  }

  // Keyboard events
  note group Note2
  {
    attr Bounds = <340,250,560,380>;
  }

  // Touch screen events
  note group Note1
  {
    attr Bounds = <340,70,560,240>;
  }

  // This timer object is used to flash the button when the user has tapped it very \
  // quickly or the button has been activated with the keyboard. This is just a visual \
  // feedback effect.
  $rect <350,430,550,470>
  object Core::Timer FlashTimer
  {
    preset OnTrigger = onFlashTimer;
    preset Period = 0;
    preset Begin = 50;
  }

  // This key handler reacts to key press events. When the user presses the key specified \
  // in the property 'Filter' of the key handler, the handler is activated and the \
  // method '@onPressKey' is called.
  $rect <350,290,550,330>
  object Core::KeyPressHandler KeyHandler
  {
    preset OnPress = onPressKey;
    preset Filter = Core::KeyCode.Enter;
  }

  // This internal slot method is called when the '@FlashTimer' is expired. It ends \
  // the short flash feedback effect.
  $rect <350,470,550,510>
  slot onFlashTimer
  {
    // The feedback flash timer is finished. Request the button to update its
    // appearance. The update will occur in the UpdateViewState() method.
    InvalidateViewState();

    // With the end of the feedback flash effect the button is activated.
    postsignal OnActivate;
  }

  // This internal slot method is called when the '@KeyHandler' is activated (when \
  // the user has pressed the key specified in the property 'Filter' of the key handler).
  $rect <350,330,550,370>
  slot onPressKey
  {
    // Ignore keyboard events when the user is interacting with the button via the
    // touch screen.
    if ( TouchHandler.Down )
      return;

    // Ignore repetitions of key events (e.g. when the user holds the key pressed)
    if ( KeyHandler.Repetition )
      return;

    // Pressing the key flashes the button for a short period. This is a kind of 
    // feedback effect. Request the button to update its appearance accordingly.
    // The update will occur in the UpdateViewState() method.
    InvalidateViewState();

    // The button is still performing the feedback flash effect from the preceding
    // tap/key event. This can occur when the user taps the button or presses the
    // key in a very rapid succession. Thus complete this preceding tap (simulate
    // the timer expiration) before starting a new button interaction.
    if ( FlashTimer.Enabled )
    {
      postsignal OnActivate;
      FlashTimer.Enabled = false;
    }

    // Start the feedback flash effect.
    FlashTimer.Enabled = true;
  }

  $rect <10,148,159,188>
  onset Icon
  {
    // The value doesn't change - nothing to do.
    if ( pure Icon == value )
      return;

    // Remember the property's new value.
    pure Icon = value;

    // ... and trigger the component to update its actual state.
    InvalidateViewState();
  }

  // This internal slot method is called when the user drags the finger while pressing \
  // the button. This only updates the button to appear pressed or released.
  $rect <350,190,550,230>
  slot onEnterLeaveTouch
  {
    // Every time the user touches the button or drags the finger inside/outside
    // the button's area request the button update its appearance. The update will
    // occur in the UpdateViewState() method.
    InvalidateViewState();
  }

  // This internal slot method is called when the user releases the touch screen \
  // after touching the button's area. This activates the button.
  $rect <350,150,550,190>
  slot onReleaseTouch
  {
    // Did the user moved the finger outside the button's area? In such case
    // the button is not activated.
    if ( !TouchHandler.Inside )
      return;

    // The user interaction has been passed over to the another touch handler
    if ( TouchHandler.AutoDeflected )
      return;

    // The user has pressed and held the button for longer time. This was enough
    // long to give a visual 'press' feedback to the user. The button can be
    // activated immediately.
    if ( TouchHandler.HoldPeriod >= FlashTimer.Begin )
      postsignal OnActivate;

    // The user has tapped the button very quickly. Defer the button activation
    // to give the user first a short visual feedback that the button has been
    // pressed.
    else
      FlashTimer.Enabled = true;
  }

  // The property 'OnActivate' can refer to a slot method, which will receive a signal \
  // as soon as the user has activated the button. Thereupon the method's logic will \
  // be executed.
  $rect <10,378,159,418>
  property slot OnActivate = null;

  // This internal slot method is called when the user touches the button's area.
  $rect <350,110,550,150>
  slot onPressTouch
  {
    // The button is still performing the feedback flash effect from the preceding
    // tap. This can occur when the user taps the button in a very rapid succession. 
    // Thus complete this preceding tap (simulate the timer expiration) before 
    // starting a new button interaction.
    if ( FlashTimer.Enabled )
    {
      postsignal OnActivate;
      FlashTimer.Enabled = false;
    }
  }

  $rect <20,20,160,60>
  object Views::Rectangle Background
  {
    preset Bounds = <0,0,250,52>;
    preset ColorBL = #FDFDFDC8;
    preset ColorBR = #FDFDFDC8;
    preset Color = Res::WhiteComponents;
  }

  $rect <20,20,160,60>
  object Core::SimpleTouchHandler TouchHandler
  {
    preset Layout = Core::Layout[AlignToBottom, AlignToLeft, AlignToRight, AlignToTop, ResizeHorz, ResizeVert];
    preset Point4 = <25,52>;
    preset Point3 = <205,52>;
    preset Point2 = <205,0>;
    preset Point1 = <25,0>;
    preset OnLeave = onEnterLeaveTouch;
    preset OnEnter = onEnterLeaveTouch;
    preset OnRelease = onReleaseTouch;
    preset OnPress = onPressTouch;
    preset RetargetCondition = Core::RetargetReason[WipeDown, WipeLeft, WipeRight, WipeUp];
    preset MaxStrikeCount = 100;
  }

  $rect <20,20,160,60>
  object Views::Line Line
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Point2 = <250,50>;
    preset Point1 = <0,50>;
    preset Width = 2;
    preset Color = Res::GreyLight;
  }

  $rect <20,20,160,60>
  object Views::Text LastNameTxt
  {
    preset Bounds = <32,4,114,22>;
    preset AutoSize = true;
    preset Alignment = Views::TextAlignment[AlignHorzLeft, AlignVertCenter];
    preset String = "LastName";
    preset Font = Res::ContactFontBold15;
    preset Color = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Views::Text FirstNameTxt
  {
    preset StackingPriority = 0;
    preset Layout = Core::Layout[AlignToLeft, ResizeHorz];
    preset Bounds = <114,4,220,22>;
    preset AutoSize = true;
    preset Alignment = Views::TextAlignment[AlignHorzLeft, AlignVertCenter];
    preset String = "FirstName";
    preset Font = Res::ContactFont15;
    preset Color = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Views::Text CallTypeTxt
  {
    preset Bounds = <32,33,101,47>;
    preset AutoSize = true;
    preset Alignment = Views::TextAlignment[AlignHorzLeft, AlignVertCenter];
    preset String = "Call type";
    preset Font = Resources::DefaultFont;
  }

  $rect <20,20,160,60>
  object Views::Text TimeTxt
  {
    preset Bounds = <162,22,220,36>;
    preset AutoSize = true;
    preset Alignment = Views::TextAlignment[AlignHorzRight, AlignVertCenter];
    preset String = "Time ";
    preset Font = Resources::DefaultFont;
  }

  $rect <170,190,320,230>
  property color ColorText1 = Res::BlackComponents;

  $rect <170,230,320,270>
  onset ColorText1
  {
    // The value doesn't change - nothing to do.
    if ( pure ColorText1 == value )
      return;

    // Remember the property's new value.
    pure ColorText1 = value;

    // ... and trigger the component to update its actual state.
    InvalidateViewState();
  }

  $rect <170,270,320,310>
  property color ColorText2 = Res::Grey;

  $rect <170,310,320,350>
  onset ColorText2
  {
    // The value doesn't change - nothing to do.
    if ( pure ColorText2 == value )
      return;

    // Remember the property's new value.
    pure ColorText2 = value;

    // ... and trigger the component to update its actual state.
    InvalidateViewState();
  }

  $rect <20,20,160,60>
  object Components::SButton25x25 InfoButton
  {
    preset Layout = Core::Layout[ResizeHorz, ResizeVert];
    preset Bounds = <225,2,250,27>;
    preset Icon = Res::InfoIcon;
    preset OnActivate = onInfo;
    preset IconColor = Res::Blue;
    preset BackgoundColor = Res::Transparent;
    preset BackgoundColorPressed = Res::Transparent;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::ButtonRoundSmall;
  }

  $rect <20,20,160,60>
  object Components::SButton25x25 IconBtn
  {
    preset Bounds = <0,17,25,42>;
    preset AlphaBlended = true;
    preset Icon = "";
    preset IconColor = Res::Grey;
    preset BackgoundColor = Res::WhiteTransparent;
    preset BackgoundColorPressed = Res::WhiteTransparent;
    preset IconFont = Res::IconsFont20;
    preset Backgound = Res::ButtonRoundSmall;
    preset BackgroundColorEnabled = Res::WhiteTransparent;
  }

  // Design
  note group Note6
  {
    attr Bounds = <0,70,330,520>;
  }

  $rect <20,20,160,60>
  object Components::SButton25x25 RemoveButton
  {
    preset Bounds = <-25,11,0,36>;
    preset Icon = Res::RemoveIcon;
    preset OnActivate = onShowDelete;
    preset IconColor = Res::White;
    preset BackgoundColor = Res::Red;
    preset BackgoundColorPressed = Res::Transparent;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::ButtonRoundSmall;
    preset IconColorPressed = Res::White;
  }

  $rect <20,20,160,60>
  object Components::TextButton DeleteButton
  {
    preset Bounds = <250,1,316,51>;
    preset Text = Strings::deleteTxt;
    preset OnActivate = onDelete;
    preset TextColor = Res::White;
    preset TextColorPress = Res::WhiteSemiTransparent;
    preset BackgoundColor = Res::Red;
  }

  $rect <20,20,160,60>
  object Views::Line Line1
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Point2 = <250,0>;
    preset Point1 = <0,0>;
    preset Width = 2;
    preset Color = Res::GreyLight;
  }

  $rect <10,720,170,760>
  object Effects::Int32Effect EditEffect
  {
    preset OnAnimate = onAnimate;
    preset NoOfCycles = 1;
    preset CycleDuration = 250;
    preset Value2 = 25;
    preset Value1 = 0;
  }

  $rect <180,740,320,780>
  slot onAnimate
  {
    RemoveButton.Bounds.x    = EditEffect.Value - 25  - DeleteEffect.Value;
    IconBtn.Bounds.x = EditEffect.Value + 0   - DeleteEffect.Value;
    LastNameTxt.Bounds.x     = EditEffect.Value + 32  - DeleteEffect.Value;
    FirstNameTxt.Bounds.x    = EditEffect.Value + 114 - DeleteEffect.Value;
    CallTypeTxt.Bounds.x        = EditEffect.Value + 32 - DeleteEffect.Value;
    InfoButton.Bounds.x      = EditEffect.Value + 225  - DeleteEffect.Value;
    TimeTxt.Bounds.x            = EditEffect.Value + 162  - DeleteEffect.Value;
    TouchHandler.Point1.x    = RemoveButton.Bounds.x2;
    TouchHandler.Point4.x    = RemoveButton.Bounds.x2;
    DeleteButton.Bounds.x    = EditEffect.Value + 273 - DeleteEffect.Value;
  }

  $rect <10,570,210,610>
  property bool EditMode = false;

  $rect <10,610,210,650>
  onset EditMode
  {
    // The value doesn't change - nothing to do.
    if ( pure EditMode == value )
      return;

    // Remember the property's new value.
    pure EditMode = value;

    EditEffect.Reversed = !EditMode;

    if ( EditMode )
    {
      InfoButton.Visible = false;
    }
    else
    {
      InfoButton.Visible = true;
      
      if ( DeleteEffect.Enabled || DeleteEffect.Value == DeleteEffect.Value2 )
      {
        DeleteEffect.Reversed = true;
        signal DeleteEffect.StartEffect;
      }
    }

    signal EditEffect.StartEffect;



  }

  $rect <10,760,170,800>
  object Effects::Int32Effect DeleteEffect
  {
    preset OnAnimate = onAnimate;
    preset NoOfCycles = 1;
    preset CycleDuration = 250;
    preset Value2 = 110;
    preset Value1 = 0;
  }

  // Moving effect
  note group Note
  {
    attr Bounds = <0,670,330,810>;
  }

  // Initialization
  note group Note7
  {
    attr Bounds = <0,530,330,660>;
  }

  $rect <350,620,520,660>
  slot onDelete
  {
    DeleteEffect.Reversed = true;
    signal DeleteEffect.StartEffect;
    postsignal OnDelete;
  }

  $rect <350,580,520,620>
  slot onShowDelete
  {
    DeleteEffect.Reversed = false;
    signal DeleteEffect.StartEffect;

  }

  $rect <520,620,690,660>
  property slot OnDelete;

  $rect <350,660,520,700>
  slot onInfo
  {
    postsignal OnInfo;
  }

  $rect <520,660,690,700>
  property slot OnInfo;

  // Touch screen events
  note group Note8
  {
    attr Bounds = <340,530,700,790>;
  }

  $rect <590,410,780,450>
  onset ContactHistory
  {
    // The value doesn't change - nothing to do.
    if ( pure ContactHistory == value )
      return;

    if ( pure ContactHistory != null )
    {
       detachobserver onContactRistoryUpdate, pure ContactHistory;
    }

    // Remember the property's new value.
    pure ContactHistory = value;

    if ( pure ContactHistory != null )
    {
      attachobserver onContactRistoryUpdate, pure ContactHistory;
      postsignal onContactRistoryUpdate;
    }

  }

  $rect <590,450,780,490>
  slot onContactRistoryUpdate
  {
    if ( pure ContactHistory != null )
    {
      LastNameTxt.String  =  pure ContactHistory.LastName;
      FirstNameTxt.String = pure ContactHistory.FirstName;
      
      if ( pure ContactHistory.CallDirection == Device::CallDirection.Incoming )
        IconBtn.Icon = Res::IncomingCallIcon;
      else
        IconBtn.Icon = Res::OutgoingCallIcon;
      
      CallTypeTxt.String  = pure ContactHistory.GetCallDirection();
      TimeTxt.String      = pure ContactHistory.GetTimeOfCall();
      
      if ( pure ContactHistory.CallState == Device::CallState.Missed )
      {
        ColorText1 = Res::Red;
       }
      else
        ColorText1 = Res::BlackComponents;
    }

  }

  $rect <590,370,780,410>
  property Device::HistoryContact ContactHistory = null;
}

$rect <50,630,220,670>
$output false
$multilingual true
class RecentDetailsPage : Application::DetailsPage
{
  $rect <320,130,520,170>
  inherited slot onContactUpdated
  {
    if ( pure HistoryContact != null )
    {
      UserInitialsBtn.Icon =  pure HistoryContact.NameInitials;
      ContactName.String   = pure HistoryContact.LastName + " " + pure HistoryContact.FirstName;
      NumberTxt.String     = pure HistoryContact.PhoneNumber; 
      
      DateTxt.String = pure HistoryContact.TimeOfCall.Format( "%d %m %Y" );
      TimeTxt.String = pure HistoryContact.TimeOfCall.Format( "%H:%M %p" );

      if (( HistoryContact.CallState == Device::CallState.EndCall ) &&
          (( HistoryContact.CallDirection == Device::CallDirection.Incoming) ||
           ( HistoryContact.CallDirection == Device::CallDirection.Outgoing )))
      {
        TypeTxt.String     = HistoryContact.GetCallDirection();
        DurationTxt.String = HistoryContact.GetDuration();
      }
      else
      {
        TypeTxt.String     = HistoryContact.GetCallState();
        DurationTxt.String = HistoryContact.GetDuration();
      } 
    }

  }

  $rect <20,20,160,60>
  inherited object Line2
  {
    preset Point2 = <265,371>;
    preset Point1 = <7,371>;
  }

  $rect <20,20,160,60>
  inherited object NumberTxt
  {
    preset Bounds = <19,342,263,371>;
  }

  $rect <20,20,160,60>
  inherited object MobileTxt
  {
    preset Bounds = <7,316,265,349>;
  }

  $rect <20,20,160,60>
  inherited object Line1
  {
    preset Point2 = <265,316>;
    preset Point1 = <7,316>;
  }

  $rect <20,20,160,60>
  object Views::Line Line4
  {
    preset Point2 = <265,237>;
    preset Point1 = <7,237>;
    preset Color = #E2E2E2FD;
  }

  $rect <20,20,160,60>
  object Views::Text DateTxt
  {
    preset Bounds = <8,246,263,267>;
    preset Alignment = Views::TextAlignment[AlignHorzLeft, AlignVertCenter];
    preset String = "30 nov 2022";
    preset Font = Res::ContactFont15;
    preset Color = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Views::Text TypeTxt
  {
    preset Bounds = <67,267,263,289>;
    preset Alignment = Views::TextAlignment[AlignHorzLeft, AlignVertCenter];
    preset String = "Outgoing Call";
    preset Font = Res::ContactFontBold15;
    preset Color = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Views::Text TimeTxt
  {
    preset Bounds = <7,267,67,289>;
    preset Alignment = Views::TextAlignment[AlignHorzLeft, AlignVertCenter];
    preset String = "5:37 PM";
    preset Font = Res::ContactFont12;
    preset Color = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Views::Text DurationTxt
  {
    preset Bounds = <67,289,263,311>;
    preset Alignment = Views::TextAlignment[AlignHorzLeft, AlignVertCenter];
    preset String = "22 seconds";
    preset Font = Res::ContactFont12;
    preset Color = Res::Grey;
  }

  $rect <330,90,520,130>
  onset HistoryContact
  {
    // The value doesn't change - nothing to do.
    if ( pure HistoryContact == value )
      return;

    if ( pure HistoryContact != null )
    {
       detachobserver onContactUpdated, pure HistoryContact;
    }

    // Remember the property's new value.
    pure HistoryContact = value;

    if ( pure HistoryContact != null )
    {
      attachobserver onContactUpdated, pure HistoryContact;
      postsignal onContactUpdated;
    }

  }

  $rect <330,50,520,90>
  property Device::HistoryContact HistoryContact;

  // Contact data
  note group Note8
  {
    attr Bounds = <290,0,580,260>;
  }
}

$rect <230,480,410,520>
$output false
$multilingual true
class CallBase : Core::Group
{
  $rect <0,500,200,540>
  inherited property Bounds = <0,0,272,480>;

  $rect <310,120,510,160>
  slot onContactUpdated
  {
    //if the calling number is in the contact list display info
    if ( pure Contact != null )
    {
      ContactNameTxt.String  = pure Contact.LastName + " "  + pure Contact.FirstName;
      UserInitials.Icon = pure Contact.NameInitials; 
    }
    //if not display number and hide UserInitials
    else
    {
       ContactNameTxt.String = Device::Device.OngoingCalls.GetContactAtIndex( 0 ).PhoneNumber;
       UserInitials.Visible = false;
    }

  }

  // Displayed contact info
  note group Note1
  {
    attr Bounds = <290,-10,700,190>;
  }

  $rect <310,240,510,280>
  slot onDesclineCall
  {
    if ( Contact.CallDirection ==  Device::CallDirection.Outgoing)
    {
      Device::Device.SendEndCall( Contact.PhoneNumber );
    }
    else if ( Contact.CallDirection ==  Device::CallDirection.Incoming)
    {
      Device::Device.SendEndCall( Contact.PhoneNumber );
    }

  }

  // Touch screen events
  note group Note
  {
    attr Bounds = <290,200,700,360>;
  }

  $rect <20,20,160,60>
  object Views::Rectangle Background
  {
    preset Bounds = <0,0,272,480>;
    preset ColorBL = #838383FA;
    preset ColorBR = #4F4F4FFF;
    preset ColorTR = #898989FF;
    preset ColorTL = #898989FF;
    preset Color = #3C3C3CFF;
  }

  $rect <20,20,160,60>
  object Components::Button65x90 DesclineButton
  {
    preset Bounds = <36,340,101,432>;
    preset Icon = Res::EndCallIcon;
    preset OnActivate = onDesclineCall;
    preset Descript = Strings::declineTxt;
    preset DescriptColor = Res::White;
    preset IconColor = Res::White;
    preset BackgoundColor = Res::Red;
    preset BackgoundColorPressed = Res::RedLight;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::ButtonRoundMedium1;
    preset DescriptColorPressed = Res::White;
    preset IconColorPressed = Res::White;
  }

  $rect <20,20,160,60>
  object Views::Text TimeTxt
  {
    preset Bounds = <18,73,99,103>;
    preset Padding = 5;
    preset Alignment = Views::TextAlignment[AlignHorzLeft, AlignVertCenter];
    preset String = Strings::CallingTxt;
    preset Font = Res::ContactFont12;
    preset Color = Res::White;
  }

  $rect <20,20,160,60>
  object Views::Text ContactNameTxt
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Bounds = <18,42,180,72>;
    preset EnableBidiText = false;
    preset Ellipsis = true;
    preset AutoSize = false;
    preset Alignment = Views::TextAlignment[AlignHorzLeft, AlignVertCenter];
    preset String = "Contact name";
    preset Font = Res::TitileFont25;
    preset Color = Res::White;
  }

  $rect <20,20,160,60>
  object Components::ButtonBase70x90 UserInitials
  {
    preset Bounds = <184,28,254,119>;
    preset Enabled = false;
    preset Descript = "";
    preset IconColor = Res::Black;
    preset IconColorEnabled = Res::Black;
    preset IconColorPressed = Res::Grey;
  }

  $rect <310,40,510,80>
  property Device::HistoryContact Contact = null;

  $rect <310,80,510,120>
  onset Contact
  {
    // The value doesn't change - nothing to do.
    if ( pure Contact == value )
      return;

    if ( pure Contact != null )
    {
       detachobserver onContactUpdated, pure Contact;
    }

    // Remember the property's new value.
    pure Contact = value;

    if ( pure Contact != null )
    {
      attachobserver onContactUpdated, pure Contact;
      postsignal onContactUpdated;
    }

  }
}

$rect <240,720,410,760>
$output false
$multilingual true
class ContactsAppInsideCall : Application::PhoneApp
{
  $rect <290,-10,490,30>
  inherited property Bounds = <0,0,272,440>;

  $rect <20,20,160,60>
  inherited object Rectangle
  {
    preset Bounds = <0,400,272,440>;
  }

  $rect <20,20,160,60>
  inherited object NavBarButtons
  {
    preset Bounds = <0,400,68,440>;
  }

  $rect <20,20,160,60>
  inherited object NavBarButtons1
  {
    preset Bounds = <68,400,136,440>;
  }

  $rect <20,20,160,60>
  inherited object NavBarButtons2
  {
    preset Bounds = <136,400,204,440>;
  }

  $rect <20,20,160,60>
  inherited object NavBarButtons3
  {
    preset Bounds = <204,400,272,440>;
  }

  $rect <20,20,160,60>
  object Components::TextButton TextButton
  {
    preset Bounds = <182,16,238,41>;
    preset Embedded = true;
    preset Text = Strings::CancelTxt;
    preset OnActivate = onCancel;
  }

  $rect <290,40,490,80>
  property slot OnCancel;

  $rect <490,40,690,80>
  slot onCancel
  {
    postsignal OnCancel;
  }

  $rect <20,20,160,60>
  object Core::Outline Outline1
  {
    preset Bounds = <67,14,237,45>;
    preset Formation = Core::Formation.RightToLeft;
  }

  // Directives to adapt the order of the above members according to how these members 
  // where arranged when the project content was stored. In this manner the storage 
  // and the expected order of the members don't depend. Merging of changes in the 
  // project files is simplified.
  $member Bounds
  $member Rectangle
  $member NavBarButtons
  $member NavBarButtons1
  $member NavBarButtons2
  $member NavBarButtons3
  $member OnCancel
  $member onCancel
  $member Outline1
  $member TextButton
}

$rect <70,380,219,420>
$output false
$multilingual true
class MyCardItem : Core::Group
{
  $rect <230,100,430,140>
  inherited method Init()
  {
    attachobserver onContactUpdated, ^Device::Device.MyContact;
    postsignal onContactUpdated; 

  }

  $rect <240,460,440,500>
  inherited property Bounds = <0,0,260,45>;

  $rect <10,100,210,140>
  inherited method UpdateViewState()
  {
    super( aState );

    var bool isEnabled  = aState.contains( Core::ViewState[ Enabled  ]);
    var bool isSelected = aState.contains( Core::ViewState[ Selected ]);
    var bool isPressed  = ( TouchHandler.Down && TouchHandler.Inside ) || 
                            FlashTimer.Enabled;


    if ( !isEnabled )
    {
      Background.Color = ButtonColor;
      NameTxt.Color = TextColor;
      PushButtonSmall1.IconColor = IconColor;
    }

    else if ( isPressed )
    {
      Background.Color = Res::PressColor;
      NameTxt.Color = TextColor;
      PushButtonSmall1.IconColor = IconColor;
    }

    else if ( isSelected )
    {
      Background.Color =  ButtonColor;
      NameTxt.Color = TextColor;
      PushButtonSmall1.IconColor = IconColor;
      }

    else
    {
      Background.Color = ButtonColor;
      NameTxt.Color = TextColor;
      PushButtonSmall1.IconColor = IconColor;
    }

    enabled  = isEnabled;
    selected = isSelected;
    pressed  = isPressed;


  }

  // The property 'Label' specifies the text to display as label in this push button \
  // widget. The desired font as well as the colors for all individual button states \
  // have to be specified in the configuration object assigned to the property @Appearance. \
  // If there is no configuration object associated to this push button widget (the \
  // property @Appearance is 'null'), no label is displayed.
  // Per default, the label is displayed centered within the push button area. You \
  // can modify the alignment of the label as well as its margins by specifying them \
  // in the configuration object.
  $rect <580,0,780,40>
  property string Icon;

  $rect <790,0,990,40>
  property string Text = Strings::MyCardTxt;

  $rect <790,40,990,80>
  onset Text
  {
    // The value doesn't change - nothing to do.
    if ( pure Text == value )
      return;

    // Remember the property's new value.
    pure Text = value;

    // ... and trigger the component to update its actual state.
    InvalidateViewState();
  }

  $rect <990,0,1190,40>
  property color ButtonColor = Res::WhiteComponents;

  $rect <990,40,1190,80>
  onset ButtonColor
  {
    // The value doesn't change - nothing to do.
    if ( pure ButtonColor == value )
      return;

    // Remember the property's new value.
    pure ButtonColor = value;

    // ... and trigger the component to update its actual state.
    InvalidateViewState();
  }

  $rect <1190,0,1390,40>
  property color IconColor = Res::WhiteComponents;

  $rect <1190,40,1390,80>
  onset IconColor
  {
    // The value doesn't change - nothing to do.
    if ( pure IconColor == value )
      return;

    // Remember the property's new value.
    pure IconColor = value;

    // ... and trigger the component to update its actual state.
    InvalidateViewState();

  }

  $rect <580,40,780,80>
  onset Icon
  {
    // The value doesn't change - nothing to do.
    if ( pure Icon == value )
      return;

    // Remember the property's new value.
    pure Icon = value;

    // ... and trigger the component to update its actual state.
    InvalidateViewState();
  }

  // The property 'OnActivate' can refer to a slot method, which will receive a signal \
  // as soon as the user has activated the button. Thereupon the method's logic will \
  // be executed.
  $rect <370,0,570,40>
  property slot OnActivate = null;

  $rect <1390,0,1590,40>
  property color TextColor = Res::BlackComponents;

  // State management
  note group Note5
  {
    attr Bounds = <0,60,220,310>;
  }

  $rect <10,260,210,300>
  var Views::Text textView;

  // This variable stores the current state of the button.
  $rect <10,220,210,260>
  var bool pressed;

  // This variable stores the current state of the button.
  $rect <10,180,210,220>
  var bool selected;

  // This variable stores the current state of the button.
  $rect <10,140,210,180>
  var bool enabled;

  // Feedback flash effect
  note group Note3
  {
    attr Bounds = <460,320,680,450>;
  }

  // Keyboard events
  note group Note2
  {
    attr Bounds = <230,320,450,450>;
  }

  // Touch screen events
  note group Note1
  {
    attr Bounds = <0,320,220,540>;
  }

  // This timer object is used to flash the button when the user has tapped it very \
  // quickly or the button has been activated with the keyboard. This is just a visual \
  // feedback effect.
  $rect <470,360,670,400>
  object Core::Timer FlashTimer
  {
    preset OnTrigger = onFlashTimer;
    preset Period = 0;
    preset Begin = 50;
  }

  // This key handler reacts to key press events. When the user presses the key specified \
  // in the property 'Filter' of the key handler, the handler is activated and the \
  // method '@onPressKey' is called.
  $rect <240,360,440,400>
  object Core::KeyPressHandler KeyHandler
  {
    preset OnPress = onPressKey;
    preset Filter = Core::KeyCode.Enter;
  }

  // This internal slot method is called when the '@FlashTimer' is expired. It ends \
  // the short flash feedback effect.
  $rect <470,400,670,440>
  slot onFlashTimer
  {
    // The feedback flash timer is finished. Request the button to update its
    // appearance. The update will occur in the UpdateViewState() method.
    InvalidateViewState();

    // With the end of the feedback flash effect the button is activated.
    postsignal OnActivate;
  }

  // This internal slot method is called when the '@KeyHandler' is activated (when \
  // the user has pressed the key specified in the property 'Filter' of the key handler).
  $rect <240,400,440,440>
  slot onPressKey
  {
    // Ignore keyboard events when the user is interacting with the button via the
    // touch screen.
    if ( TouchHandler.Down )
      return;

    // Ignore repetitions of key events (e.g. when the user holds the key pressed)
    if ( KeyHandler.Repetition )
      return;

    // Pressing the key flashes the button for a short period. This is a kind of 
    // feedback effect. Request the button to update its appearance accordingly.
    // The update will occur in the UpdateViewState() method.
    InvalidateViewState();

    // The button is still performing the feedback flash effect from the preceding
    // tap/key event. This can occur when the user taps the button or presses the
    // key in a very rapid succession. Thus complete this preceding tap (simulate
    // the timer expiration) before starting a new button interaction.
    if ( FlashTimer.Enabled )
    {
      postsignal OnActivate;
      FlashTimer.Enabled = false;
    }

    // Start the feedback flash effect.
    FlashTimer.Enabled = true;
  }

  // This internal slot method is called when the user drags the finger while pressing \
  // the button. This only updates the button to appear pressed or released.
  $rect <10,440,210,480>
  slot onEnterLeaveTouch
  {
    // Every time the user touches the button or drags the finger inside/outside
    // the button's area request the button update its appearance. The update will
    // occur in the UpdateViewState() method.
    InvalidateViewState();
  }

  // This internal slot method is called when the user releases the touch screen \
  // after touching the button's area. This activates the button.
  $rect <10,400,210,440>
  slot onReleaseTouch
  {
    // Did the user moved the finger outside the button's area? In such case
    // the button is not activated.
    if ( !TouchHandler.Inside )
      return;

    // The user interaction has been passed over to the another touch handler
    if ( TouchHandler.AutoDeflected )
      return;

    // The user has pressed and held the button for longer time. This was enough
    // long to give a visual 'press' feedback to the user. The button can be
    // activated immediately.
    if ( TouchHandler.HoldPeriod >= FlashTimer.Begin )
      postsignal OnActivate;

    // The user has tapped the button very quickly. Defer the button activation
    // to give the user first a short visual feedback that the button has been
    // pressed.
    else
      FlashTimer.Enabled = true;
  }

  // This internal slot method is called when the user touches the button's area.
  $rect <10,360,210,400>
  slot onPressTouch
  {
    // The button is still performing the feedback flash effect from the preceding
    // tap. This can occur when the user taps the button in a very rapid succession. 
    // Thus complete this preceding tap (simulate the timer expiration) before 
    // starting a new button interaction.
    if ( FlashTimer.Enabled )
    {
      postsignal OnActivate;
      FlashTimer.Enabled = false;
    }
  }

  $rect <230,140,430,180>
  slot onContactUpdated
  {
    if ( Device::Device.MyContact != null )
    {
      NameTxt.String  = Device::Device.MyContact.LastName + " " +  Device::Device.MyContact.FirstName;
      PushButtonSmall1.Icon  =  Device::Device.MyContact.NameInitials;
    }
    else
    {
      NameTxt.String  = Text;
      PushButtonSmall1.Icon  =  "";
    }
  }

  $rect <20,20,160,60>
  object Core::SimpleTouchHandler TouchHandler
  {
    preset Layout = Core::Layout[AlignToBottom, AlignToLeft, AlignToRight, AlignToTop, ResizeHorz, ResizeVert];
    preset Point4 = <0,41>;
    preset Point3 = <260,41>;
    preset Point2 = <260,0>;
    preset Point1 = <0,0>;
    preset OnLeave = onEnterLeaveTouch;
    preset OnEnter = onEnterLeaveTouch;
    preset OnRelease = onReleaseTouch;
    preset OnPress = onPressTouch;
    preset RetargetCondition = Core::RetargetReason[WipeDown, WipeLeft, WipeRight, WipeUp];
    preset MaxStrikeCount = 100;
  }

  $rect <20,20,160,60>
  object Views::Rectangle Background
  {
    preset Bounds = <0,0,260,45>;
    preset Color = Res::WhiteComponents;
  }

  $rect <20,20,160,60>
  object Views::Text NameTxt
  {
    preset Bounds = <59,2,255,32>;
    preset Alignment = Views::TextAlignment[AlignHorzLeft, AlignVertCenter];
    preset Font = Res::ContactFontBold15;
    preset Color = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Views::Text MyCardTxt
  {
    preset Bounds = <59,24,156,44>;
    preset Alignment = Views::TextAlignment[AlignHorzLeft, AlignVertCenter];
    preset String = Strings::MyCardTxt;
    preset Font = Res::ContactFont12;
    preset Color = Res::Grey;
  }

  $rect <20,20,160,60>
  object Components::SButton50x50 PushButtonSmall1
  {
    preset Bounds = <6,0,56,48>;
    preset Backgound = Res::ButtonRoundMedium;
  }

  // Card data
  note group Note4
  {
    attr Bounds = <220,60,440,270>;
  }
}

// Messages
note group Note1
{
  attr Bounds = <439,220,910,559>;
}

$rect <460,260,660,300>
$output false
$multilingual true
class MessagesApp : Core::Group
{
  $rect <310,30,520,70>
  inherited method Init()
  {
    attachobserver onUpdateList, ^Device::Device.MessageHistory.NoOfItems;
    postsignal onUpdateList;

  }

  $rect <309,89,509,129>
  inherited property Bounds = <0,0,273,480>;

  // This method is called by 'VerticalList' every time the list loads or updates \
  // an item.
  $rect <300,290,500,330>
  slot OnLoadItem
  {
    // Get the number of the item to load.
    var int32 itemNo = VerticalList.Item;

    var Device::Contact          contact     = Device::Device.MessageHistory.GetContactAtIndex( itemNo );
    var Application::MessegeItem messageItem = (Application::MessegeItem)VerticalList.View;
                                                  
    if ( messageItem == null )
      return;

    messageItem.Contact    = contact;
    messageItem.OnActivate = onOpenChat;
    messageItem.EditMode   = EditMode;
    messageItem.OnCheck    = onSelectedChats;

    messageItem.Bounds.size = point( VerticalList.Bounds.w, VerticalList.ItemHeight );


  }

  $rect <740,169,920,209>
  property bool EditMode = false;

  $rect <920,169,1130,209>
  slot onEdit
  {
    EditMode = !EditMode;

    editBtn.Text      = !EditMode ? Strings::EditTxt : Strings::CancelTxt;
    deleteBtn.Visible = !EditMode ? false : true;

    VerticalList.InvalidateItems( 0, VerticalList.NoOfItems -1 );
  }

  $rect <920,40,1130,80>
  slot onAddChat
  {
    addNewChat = new Application::ContactsListInsideMessages;

    addNewChat.OnCancel = onCloseAdd;
    addNewChat.OnAddFav = onAdd;
    addNewChat.Contact  = new Device::Contact;

    SwitchToDialog( addNewChat, Res::SlideUpCenteredLimit, null, null, null, null, null, null, null, null, false );
  }

  $rect <740,40,920,80>
  var Application::ContactsListInsideMessages addNewChat = null;

  $rect <940,120,1130,160>
  slot onCloseAdd
  {
    DismissDialog( addNewChat, Res::SlideDownCentered, null, null, null, null, false );
    addNewChat = null;
  }

  $rect <940,80,1130,120>
  slot onAdd
  {
    Device::Device.MessageHistory.AddFirst( addNewChat.Contact );

    postsignal onUpdateList;
    postsignal onCloseAdd;
  }

  // Touch screen events
  note group Note
  {
    attr Bounds = <720,-10,1149,289>;
  }

  // Initialization
  note group Note2
  {
    attr Bounds = <289,-10,709,180>;
  }

  $rect <520,370,700,410>
  var Application::ChatPage chat = null;

  $rect <330,410,520,450>
  slot onBack
  {
    signal onUpdateList;

    DismissDialog( chat, Res::SlideDownCentered, null, null, null, null, false );   
    chat = null;
  }

  $rect <929,220,1129,260>
  slot onDelete
  {
    if ( SelectedContacts != null )
    {
      var Device::ContactListElement contact = SelectedContacts.head;

      while ( contact != null )
      {
        var Device::Contact mCont = Device::Device.MessageHistory.FindByPhoneNumber( contact.Data.PhoneNumber );
      
        if ( mCont != null )
        {
           Device::Device.MessageHistory.Remove( mCont );
           mCont.MessagesList.RemoveAll( );
         }
           
        contact = contact.next;
      } 
    }

    postsignal onEdit;
    postsignal onUpdateList;
  }

  $rect <509,240,709,280>
  slot onUpdateList
  {
    VerticalList.NoOfItems = Device::Device.MessageHistory.NoOfItems;

    VerticalList.InvalidateItems( 0, Device::Device.MessageHistory.NoOfItems -1 );
  }

  $rect <310,370,520,410>
  slot onOpenChat
  {
    var Application::MessegeItem itemView = (Application::MessegeItem)sender;

    if ( itemView != null )
    {
      chat = new Application::ChatPage; 
      chat.Contact = itemView.Contact;
      chat.OnBack  = onBack;
      
      SwitchToDialog( chat, Res::SlideUpCentered, null, null, null, null, null, null, null, null, false );
    }
  }

  $rect <20,20,160,60>
  object Views::Rectangle Rectangle
  {
    preset Bounds = <0,0,272,480>;
    preset Color = Res::WhiteComponents;
  }

  $rect <20,20,160,60>
  object Core::VerticalList VerticalList
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Bounds = <0,122,272,466>;
    preset OnLoadItem = OnLoadItem;
    preset SlideHandler = SlideTouchHandler;
    preset ItemHeight = 45;
    preset ItemClass = Application::MessegeItem;
  }

  $rect <20,20,160,60>
  object Components::InputBtnEtxt SearchExt
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToRight, AlignToTop, ResizeHorz];
    preset Bounds = <3,80,269,112>;
    preset OnChange = onSearch;
    preset String = "";
    preset Color = Res::Grey;
    preset Placeholder = Strings::SearchTxt;
    preset OnIcon = onCancelSearch;
  }

  $rect <20,20,160,60>
  object Views::Text TitleTxt
  {
    preset Bounds = <11,40,264,80>;
    preset Alignment = Views::TextAlignment[AlignHorzLeft, AlignVertCenter];
    preset String = Strings::MessagesTxt;
    preset Font = Res::TitileFont32;
    preset Color = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Components::SButton25x25 createBtn
  {
    preset Bounds = <239,15,264,40>;
    preset Icon = Res::WriteIcon;
    preset OnActivate = onAddChat;
    preset IconColor = Res::Blue;
    preset BackgoundColor = Res::Transparent;
    preset BackgoundColorPressed = Res::Transparent;
    preset IconFont = Res::IconsFont20;
    preset BackgroundColorEnabled = Res::Transparent;
  }

  $rect <20,20,160,60>
  object Components::TextButton editBtn
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Bounds = <11,8,47,28>;
    preset Embedded = true;
    preset Text = Strings::EditTxt;
    preset OnActivate = onEdit;
  }

  $rect <20,20,160,60>
  object Components::TextButton deleteBtn
  {
    preset Bounds = <47,8,104,28>;
    preset Embedded = true;
    preset Visible = false;
    preset Text = Strings::deleteTxt;
    preset OnActivate = onDelete;
  }

  $rect <310,330,520,370>
  slot onSelectedChats
  {
    var Application::MessegeItem messageItem = (Application::MessegeItem)sender;

    if ( messageItem.Contact )
      SelectedContacts.AddFirst( messageItem.Contact );
      
    else
      SelectedContacts.Remove( messageItem.Contact );

  }

  $rect <520,330,700,370>
  object Device::ContactsList SelectedContacts;

  $rect <20,20,160,60>
  object Core::SlideTouchHandler SlideTouchHandler
  {
    preset StackingPriority = -1;
    preset Bounds = <11,122,272,466>;
    preset SlideHorz = false;
  }

  $rect <740,349,940,389>
  slot onSearch
  {
    if ( SearchExt.String != "" )
    {
      Device::Device.MessageHistory.Search( SearchExt.String );

      ContactsInsideSearch.Bounds.origin = <0,11>;

      SearchExt.Icon = Res::XIcon;
    }
    else
    {
      postsignal onCancelSearch;
    }
  }

  $rect <740,389,940,429>
  slot onCancelSearch
  {
    Device::Device.MessageHistory.CancelSearch();

    ContactsInsideSearch.Bounds.origin.y = Bounds.y2;


    SearchExt.String      = "";
    SearchExt.Placeholder = "Type...";
    SearchExt.Text.String = SearchExt.String + "\n";
    SearchExt.Icon        = Res::SerachIcon;
  }

  // Search
  note group Note3
  {
    attr Bounds = <720,305,1149,489>;
  }

  $rect <20,20,160,60>
  object Application::ContactsInsideSearch ContactsInsideSearch
  {
    preset Bounds = <1,500,273,980>;
    preset OnSelectedContact = onOpenChat;
  }

  // VerticalList
  note group Note4
  {
    attr Bounds = <289,189,709,489>;
  }

  $rect <20,20,160,60>
  object Core::Outline Outline
  {
    preset Bounds = <11,8,227,40>;
    preset Space = 3;
    preset Formation = Core::Formation.LeftToRight;
  }

  // Directives to adapt the order of the above members according to how these members 
  // where arranged when the project content was stored. In this manner the storage 
  // and the expected order of the members don't depend. Merging of changes in the 
  // project files is simplified.
  $member Init
  $member Bounds
  $member OnLoadItem
  $member EditMode
  $member onEdit
  $member onAddChat
  $member addNewChat
  $member onCloseAdd
  $member onAdd
  $member Note
  $member Note2
  $member chat
  $member onBack
  $member onSelectedChats
  $member onDelete
  $member onUpdateList
  $member onSearch
  $member onCancelSearch
  $member Note3
  $member onOpenChat
  $member Note4
  $member Rectangle
  $member VerticalList
  $member SearchExt
  $member TitleTxt
  $member createBtn
  $member SelectedContacts
  $member SlideTouchHandler
  $member ContactsInsideSearch
  $member Outline
  $member editBtn
  $member deleteBtn
}

$rect <480,306,660,346>
$output false
$multilingual true
class MessegeItem : Core::Group
{
  $rect <750,290,950,330>
  inherited property Bounds = <0,0,269,45>;

  $rect <10,100,210,140>
  inherited method UpdateViewState()
  {
    super( aState );

    var bool isEnabled  = aState.contains( Core::ViewState[ Enabled  ]);
    var bool isSelected = aState.contains( Core::ViewState[ Selected ]);
    var bool isPressed  = ( TouchHandler.Down && TouchHandler.Inside ) || 
                            FlashTimer.Enabled;


    if ( !isEnabled )
    {
      Background.Color = ButtonColor;
    }

    else if ( isPressed )
    {
      Background.Color = Res::PressColor;
    }

    else if ( isSelected )
    {
      Background.Color =  Res::GreyLight;
    }
    else
    {
      Background.Color = ButtonColor;
    }

    enabled  = isEnabled;
    selected = isSelected;
    pressed  = isPressed;


  }

  // The property 'Label' specifies the text to display as label in this push button \
  // widget. The desired font as well as the colors for all individual button states \
  // have to be specified in the configuration object assigned to the property @Appearance. \
  // If there is no configuration object associated to this push button widget (the \
  // property @Appearance is 'null'), no label is displayed.
  // Per default, the label is displayed centered within the push button area. You \
  // can modify the alignment of the label as well as its margins by specifying them \
  // in the configuration object.
  $rect <580,0,780,40>
  property string Icon;

  $rect <790,0,990,40>
  property string Text = "";

  $rect <790,40,990,80>
  onset Text
  {
    // The value doesn't change - nothing to do.
    if ( pure Text == value )
      return;

    // Remember the property's new value.
    pure Text = value;

    // ... and trigger the component to update its actual state.
    InvalidateViewState();
  }

  $rect <990,0,1190,40>
  property color ButtonColor = Res::WhiteComponents;

  $rect <990,40,1190,80>
  onset ButtonColor
  {
    // The value doesn't change - nothing to do.
    if ( pure ButtonColor == value )
      return;

    // Remember the property's new value.
    pure ButtonColor = value;

    // ... and trigger the component to update its actual state.
    InvalidateViewState();
  }

  $rect <580,80,780,120>
  property color IconColor = Res::WhiteComponents;

  $rect <580,120,780,160>
  onset IconColor
  {
    // The value doesn't change - nothing to do.
    if ( pure IconColor == value )
      return;

    // Remember the property's new value.
    pure IconColor = value;

    // ... and trigger the component to update its actual state.
    InvalidateViewState();

  }

  $rect <580,40,780,80>
  onset Icon
  {
    // The value doesn't change - nothing to do.
    if ( pure Icon == value )
      return;

    // Remember the property's new value.
    pure Icon = value;

    // ... and trigger the component to update its actual state.
    InvalidateViewState();
  }

  // The property 'OnActivate' can refer to a slot method, which will receive a signal \
  // as soon as the user has activated the button. Thereupon the method's logic will \
  // be executed.
  $rect <370,0,570,40>
  property slot OnActivate = null;

  $rect <790,90,990,130>
  property color TextColor = Res::BlackComponents;

  // State management
  note group Note5
  {
    attr Bounds = <0,60,220,310>;
  }

  $rect <10,260,210,300>
  var Views::Text textView;

  // This variable stores the current state of the button.
  $rect <10,220,210,260>
  var bool pressed;

  // This variable stores the current state of the button.
  $rect <10,180,210,220>
  var bool selected;

  // This variable stores the current state of the button.
  $rect <10,140,210,180>
  var bool enabled;

  // Feedback flash effect
  note group Note3
  {
    attr Bounds = <460,320,680,480>;
  }

  // Keyboard events
  note group Note2
  {
    attr Bounds = <230,320,450,490>;
  }

  // Touch screen events
  note group Note1
  {
    attr Bounds = <0,320,220,490>;
  }

  // This timer object is used to flash the button when the user has tapped it very \
  // quickly or the button has been activated with the keyboard. This is just a visual \
  // feedback effect.
  $rect <470,360,670,400>
  object Core::Timer FlashTimer
  {
    preset OnTrigger = onFlashTimer;
    preset Period = 0;
    preset Begin = 50;
  }

  // This key handler reacts to key press events. When the user presses the key specified \
  // in the property 'Filter' of the key handler, the handler is activated and the \
  // method '@onPressKey' is called.
  $rect <240,360,440,400>
  object Core::KeyPressHandler KeyHandler
  {
    preset OnPress = onPressKey;
    preset Filter = Core::KeyCode.Enter;
  }

  // This internal slot method is called when the '@FlashTimer' is expired. It ends \
  // the short flash feedback effect.
  $rect <470,400,670,440>
  slot onFlashTimer
  {
    // The feedback flash timer is finished. Request the button to update its
    // appearance. The update will occur in the UpdateViewState() method.
    InvalidateViewState();

    // With the end of the feedback flash effect the button is activated.
    postsignal OnActivate;
  }

  // This internal slot method is called when the '@KeyHandler' is activated (when \
  // the user has pressed the key specified in the property 'Filter' of the key handler).
  $rect <240,400,440,440>
  slot onPressKey
  {
    // Ignore keyboard events when the user is interacting with the button via the
    // touch screen.
    if ( TouchHandler.Down )
      return;

    // Ignore repetitions of key events (e.g. when the user holds the key pressed)
    if ( KeyHandler.Repetition )
      return;

    // Pressing the key flashes the button for a short period. This is a kind of 
    // feedback effect. Request the button to update its appearance accordingly.
    // The update will occur in the UpdateViewState() method.
    InvalidateViewState();

    // The button is still performing the feedback flash effect from the preceding
    // tap/key event. This can occur when the user taps the button or presses the
    // key in a very rapid succession. Thus complete this preceding tap (simulate
    // the timer expiration) before starting a new button interaction.
    if ( FlashTimer.Enabled )
    {
      postsignal OnActivate;
      FlashTimer.Enabled = false;
    }

    // Start the feedback flash effect.
    FlashTimer.Enabled = true;
  }

  // This internal slot method is called when the user drags the finger while pressing \
  // the button. This only updates the button to appear pressed or released.
  $rect <10,440,210,480>
  slot onEnterLeaveTouch
  {
    // Every time the user touches the button or drags the finger inside/outside
    // the button's area request the button update its appearance. The update will
    // occur in the UpdateViewState() method.
    InvalidateViewState();
  }

  // This internal slot method is called when the user releases the touch screen \
  // after touching the button's area. This activates the button.
  $rect <10,400,210,440>
  slot onReleaseTouch
  {
    // Did the user moved the finger outside the button's area? In such case
    // the button is not activated.
    if ( !TouchHandler.Inside )
      return;

    // The user interaction has been passed over to the another touch handler
    if ( TouchHandler.AutoDeflected )
      return;

    // The user has pressed and held the button for longer time. This was enough
    // long to give a visual 'press' feedback to the user. The button can be
    // activated immediately.
    if ( TouchHandler.HoldPeriod >= FlashTimer.Begin )
      postsignal OnActivate;

    // The user has tapped the button very quickly. Defer the button activation
    // to give the user first a short visual feedback that the button has been
    // pressed.
    else
      FlashTimer.Enabled = true;
  }

  // This internal slot method is called when the user touches the button's area.
  $rect <10,360,210,400>
  slot onPressTouch
  {
    // The button is still performing the feedback flash effect from the preceding
    // tap. This can occur when the user taps the button in a very rapid succession. 
    // Thus complete this preceding tap (simulate the timer expiration) before 
    // starting a new button interaction.
    if ( FlashTimer.Enabled )
    {
      postsignal OnActivate;
      FlashTimer.Enabled = false;
    }
  }

  $rect <230,190,430,230>
  slot onContactUpdated
  {
    if ( Contact != null )
    {
      NameTxt.String     = pure Contact.LastName + " "  + pure Contact.FirstName;
      UserIcon.Icon      = pure Contact.NameInitials;  
      CheckButton.Active = false;
      if ( Contact.MessagesList.head != null )
      {
        MessageTxt.String = pure Contact.MessagesList.GetLastMessage().MessageContent;//"last message";    
        TimeTxt.String    = pure Contact.MessagesList.GetLastMessage().GetTimeOfCall();//"l.m. time";
        ArrowBtn.Visible  = true;
        
        NotificationButton.Descript = pure Contact.UnreadMessagesNr;
        NotificationButton.Visible  = pure Contact.UnreadMessagesNr > 0;
      } 
      else 
      {
        MessageTxt.String = "";    
        TimeTxt.String    = "";
        ArrowBtn.Visible  = false;  
      }
    }
  }

  // Card data
  note group Note4
  {
    attr Bounds = <220,60,440,310>;
  }

  $rect <790,130,990,170>
  onset TextColor
  {
    // The value doesn't change - nothing to do.
    if ( pure TextColor == value )
      return;

    // Remember the property's new value.
    pure TextColor = value;

    // ... and trigger the component to update its actual state.
    InvalidateViewState();
  }

  $rect <10,690,170,730>
  object Effects::Int32Effect EditEffect
  {
    preset OnAnimate = onAnimate;
    preset NoOfCycles = 1;
    preset CycleDuration = 250;
    preset Value2 = 30;
    preset Value1 = 0;
  }

  $rect <180,690,320,730>
  slot onAnimate
  {
    CheckButton.Bounds.x = EditEffect.Value - 30 ;
    UserIcon.Bounds.x    = EditEffect.Value;
    NameTxt.Bounds.x     = EditEffect.Value + 56;
    MessageTxt.Bounds.x  = EditEffect.Value + 56;
    TimeTxt.Bounds.x     = EditEffect.Value + 145 ;
    ArrowBtn.Bounds.x    = EditEffect.Value + 251;

  }

  $rect <10,540,210,580>
  property bool EditMode = false;

  $rect <10,580,210,620>
  onset EditMode
  {
    // The value doesn't change - nothing to do.
    if ( pure EditMode == value )
      return;

    // Remember the property's new value.
    pure EditMode = value;

    EditEffect.Reversed = !EditMode;

    signal EditEffect.StartEffect;



  }

  // Moving effect
  note group Note
  {
    attr Bounds = <0,640,330,800>;
  }

  // Initialization
  note group Note7
  {
    attr Bounds = <0,500,330,630>;
  }

  $rect <230,110,430,150>
  property Device::Contact Contact = null;

  $rect <230,150,430,190>
  onset Contact
  {
    if ( pure Contact == value )
      return;

    if ( pure Contact != null )
    {
       detachobserver onContactUpdated, pure Contact;
    }

    pure Contact = value;

    if ( pure Contact != null )
    {
      attachobserver onContactUpdated, pure Contact;
    }
    postsignal onContactUpdated;

  }

  $rect <10,730,170,770>
  slot onCheck
  {
    if ( CheckButton.Active == true )
      postsignal OnCheck;  

  }

  $rect <180,730,320,770>
  property slot OnCheck;

  $rect <20,20,160,60>
  object Views::Rectangle Background
  {
    preset Bounds = <0,0,269,45>;
    preset ColorBL = #FDFDFDC8;
    preset ColorBR = #FDFDFDC8;
    preset Color = Res::WhiteComponents;
  }

  $rect <20,20,160,60>
  object Core::SimpleTouchHandler TouchHandler
  {
    preset Layout = Core::Layout[AlignToBottom, AlignToLeft, AlignToRight, AlignToTop, ResizeHorz, ResizeVert];
    preset Point4 = <0,44>;
    preset Point3 = <269,44>;
    preset Point2 = <269,0>;
    preset Point1 = <0,0>;
    preset OnLeave = onEnterLeaveTouch;
    preset OnEnter = onEnterLeaveTouch;
    preset OnRelease = onReleaseTouch;
    preset OnPress = onPressTouch;
    preset RetargetCondition = Core::RetargetReason[WipeDown, WipeLeft, WipeRight, WipeUp];
    preset MaxStrikeCount = 100;
  }

  $rect <20,20,160,60>
  object Components::SButton25x25 ArrowBtn
  {
    preset Bounds = <251,-3,276,22>;
    preset Visible = false;
    preset Icon = Res::ForwardIcon;
    preset IconColor = Res::Grey;
    preset BackgoundColor = Res::Transparent;
    preset BackgoundColorPressed = Res::Transparent;
    preset IconFont = Res::IconsFont12;
    preset Backgound = Res::ButtonRoundSmall;
    preset BackgroundColorEnabled = Res::Transparent;
    preset IconColorEnabled = Res::GreyLight;
    preset IconColorPressed = Res::Grey;
  }

  $rect <20,20,160,60>
  object Views::Text TimeTxt
  {
    preset Bounds = <145,3,258,15>;
    preset Alignment = Views::TextAlignment[AlignHorzRight];
    preset String = "Time ";
    preset Font = Resources::DefaultFont;
    preset Color = Res::Grey;
  }

  $rect <20,20,160,60>
  object Views::Line Line2
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Point2 = <269,45>;
    preset Point1 = <50,44>;
    preset Width = 2;
    preset Color = Res::GreyLight;
  }

  $rect <20,20,160,60>
  object Views::Text MessageTxt
  {
    preset Bounds = <56,24,257,44>;
    preset Ellipsis = true;
    preset Alignment = Views::TextAlignment[AlignHorzLeft, AlignVertCenter];
    preset String = Strings::messageTxt;
    preset Font = Res::ContactFont12;
    preset Color = Res::Grey;
  }

  $rect <20,20,160,60>
  object Views::Text NameTxt
  {
    preset Bounds = <56,2,232,24>;
    preset Alignment = Views::TextAlignment[AlignHorzLeft, AlignVertCenter];
    preset String = "name";
    preset Font = Res::ContactFontBold15;
    preset Color = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Components::SButton50x50 UserIcon
  {
    preset Bounds = <0,0,50,48>;
    preset Backgound = Res::ButtonRoundMedium;
  }

  $rect <20,20,160,60>
  object Components::ToggleButton CheckButton
  {
    preset StackingPriority = 1;
    preset Bounds = <-35,7,0,42>;
    preset OnToggle = onCheck;
    preset BackgroundColor = Res::GreyLight;
    preset IconSelectedColor = Res::White;
  }

  $rect <20,20,160,60>
  object Views::Line Line1
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Point2 = <269,0>;
    preset Point1 = <50,0>;
    preset Width = 2;
    preset Color = Res::GreyLight;
  }

  $rect <20,20,160,60>
  object Components::SButton25x25 NotificationButton
  {
    preset StackingPriority = 0;
    preset Bounds = <0,-3,50,47>;
    preset Visible = false;
    preset Icon = Res::CircleFillIcon;
    preset DescriptColor = Res::WhiteComponents;
    preset IconColor = Res::Blue;
    preset BackgoundColor = Res::Transparent;
    preset BackgoundColorPressed = Res::Transparent;
    preset DescriptFont = Res::ContactFont12;
    preset IconFont = Res::IconsFont20;
    preset BackgroundColorEnabled = Res::Transparent;
    preset DescriptColorEnabled = Res::Transparent;
    preset IconColorEnabled = Res::Transparent;
    preset DescriptColorPressed = Res::WhiteComponents;
    preset IconColorPressed = Res::BlueLight;
  }
}

$rect <480,346,660,386>
$output false
$multilingual true
class ContactsListInsideMessages : Application::ContactsList
{
  $rect <20,20,160,60>
  inherited object TitleTxt
  {
    preset String = Strings::NewMessage;
  }

  $rect <20,20,160,60>
  inherited object Text
  {
    preset Visible = false;
  }

  $rect <20,20,160,60>
  inherited object ContactsInsideSearch
  {
    preset OnSelectedContact = Slot2;
  }

  $rect <481,302,681,342>
  slot Slot2
  {
    //add contact to favorites
    Contact =  ContactsInsideSearch.Contact;

    postsignal OnAddFav; 
  }

  $rect <290,0,490,40>
  inherited slot onContactPressed
  {
    Contact =  ((Application::ContactItem ) sender ).Contact;

    postsignal OnAddFav; 
  }

  $rect <20,20,160,60>
  inherited object SearchExt
  {
    preset Placeholder = Strings::SearchTxt;
  }

  // Directives to adapt the order of the above members according to how these members 
  // where arranged when the project content was stored. In this manner the storage 
  // and the expected order of the members don't depend. Merging of changes in the 
  // project files is simplified.
  $member SearchExt
  $member TitleTxt
  $member onContactPressed
  $member Text
  $member ContactsInsideSearch
  $member Slot2
}

$rect <480,386,660,426>
$output false
$multilingual true
class ChatPage : Core::Group
{
  $rect <300,40,500,80>
  inherited method Init()
  {
  }

  $rect <10,500,210,540>
  inherited property Bounds = <0,0,272,480>;

  $rect <500,250,700,290>
  slot onBack
  {
    postsignal OnBack;

  }

  $rect <500,300,700,340>
  slot onUser
  {
    detailsPage = new Application::DetailsPage;

    detailsPage.OnBack  = onCloseUser;
    detailsPage.Contact = Contact;

    SwitchToDialog( detailsPage, Res::SlideUpCenteredLimit, null, null, null, null, null,
                               null, null, null, false );

  }

  $rect <500,390,700,430>
  slot onCall
  {
    Device::Device.SendCallFromContact( Contact );
  }

  $rect <300,250,500,290>
  var slot OnBack;

  $rect <300,300,500,340>
  var Application::DetailsPage detailsPage = null;

  $rect <530,340,700,380>
  slot onCloseUser
  {
    DismissDialog( detailsPage, Res::SlideDownCentered, null, null, null, null, false );
    detailsPage = null;
  }

  // Displayed contact info
  note group Note1
  {
    attr Bounds = <680,0,950,200>;
  }

  $rect <700,90,890,130>
  onset Contact
  {
    // The value doesn't change - nothing to do.
    if ( pure Contact == value )
      return;

    if ( pure Contact != null )
    {
       detachobserver onContactUpdated, pure Contact;
    }

    // Remember the property's new value.
    pure Contact = value;

    if ( pure Contact != null )
    {
      attachobserver onContactUpdated, pure Contact;
      postsignal onContactUpdated;
    }

  }

  $rect <700,130,890,170>
  slot onContactUpdated
  {
    if ( pure Contact != null )
    {
      Button40x55.Descript = pure Contact.FirstName;  
      Button40x55.Icon     =  pure Contact.NameInitials;
    }

    signal onMessageUpdate;
  }

  $rect <700,50,890,90>
  property Device::Contact Contact = null;

  // Touch screen events
  note group Note
  {
    attr Bounds = <290,210,710,540>;
  }

  $rect <500,440,700,480>
  slot onSend
  {
    if ( SearchEtxt.String != "")
    {
      Device::Device.SendMessage( Contact, SearchEtxt.String );
      SearchEtxt.Text.String = " ";
    }


  }

  $rect <20,20,160,60>
  object Views::Rectangle Background
  {
    preset Bounds = <0,0,272,480>;
    preset Color = Res::WhiteComponents;
  }

  $rect <20,20,160,60>
  object Core::Outline Outline
  {
    preset Bounds = <0,69,272,435>;
    preset SlideHandler = SlideTouchHandler;
    preset Space = 1;
    preset Formation = Core::Formation.BottomToTop;
  }

  $rect <20,20,160,60>
  object Core::SlideTouchHandler SlideTouchHandler
  {
    preset Bounds = <0,69,272,435>;
    preset SlideHorz = false;
  }

  $rect <20,20,160,60>
  object Views::Rectangle Header
  {
    preset Bounds = <0,0,272,60>;
    preset Color = Res::PressColor;
  }

  $rect <20,20,160,60>
  object Views::Line Line
  {
    preset Point2 = <272,60>;
    preset Point1 = <0,60>;
    preset Color = Res::Grey;
  }

  $rect <20,20,160,60>
  object Components::SButton25x25 BackBtn
  {
    preset Bounds = <7,4,32,29>;
    preset Icon = Res::BackIcon;
    preset OnActivate = onBack;
    preset IconColor = Res::Blue;
    preset BackgoundColor = Res::Transparent;
    preset BackgoundColorPressed = Res::Transparent;
    preset IconFont = Res::IconsFont20;
    preset BackgroundColorEnabled = Res::Transparent;
  }

  $rect <20,20,160,60>
  object Components::InputBtnEtxt SearchEtxt
  {
    preset Bounds = <3,441,269,473>;
    preset String = "";
    preset Color = Res::BlackComponents;
    preset Placeholder = Strings::TypeTxt;
    preset Icon = Res::SendIcon;
    preset OnIcon = onSend;
  }

  $rect <20,20,160,60>
  object Components::SButton25x25 BackBtn1
  {
    preset Bounds = <241,4,266,29>;
    preset Icon = Res::CallIcon;
    preset OnActivate = onCall;
    preset IconColor = Res::Blue;
    preset BackgoundColor = Res::Transparent;
    preset BackgoundColorPressed = Res::Transparent;
    preset IconFont = Res::IconsFont20;
    preset BackgroundColorEnabled = Res::Transparent;
  }

  $rect <20,20,160,60>
  object Components::Button40x55 Button40x55
  {
    preset Bounds = <90,5,182,60>;
    preset OnActivate = onUser;
    preset Descript = "name";
    preset DescriptColor = Res::BlackComponents;
    preset IconColor = Res::WhiteComponents;
    preset Backgound = Res::ButtonRoundMedium;
    preset DescriptColorPressed = Res::Grey;
    preset IconColorPressed = Res::Grey;
  }

  $rect <300,90,500,130>
  slot onMessageUpdate
  {
    RemoveMessages();

    if ( pure Contact != null && pure Contact.MessagesList.head != null)
    {
      var Components::TextButton unreadText = new Components::TextButton;
      unreadText.Text = "Unread";
      unreadText.TextTxt.Alignment = Views::TextAlignment[AlignHorzCenter, AlignVertCenter];
      unreadText.TextTxt.Font = Res::ContactFontBold15;
      unreadText.TextColor = Res::Grey;  
      unreadText.BackgoundColor = Res::PressColor;
      unreadText.Bounds.h = 20;
      unreadText.Bounds.w = 272;
      
      lastItem = null;
      
      var bool isAdded = false;
      var int32 order = -1; 
      var Device::Message message = pure Contact.MessagesList.head;  
        
      while ( message != null)
      {
        var Application::ChatItem chatItem = new Application::ChatItem;
        
        chatItem.OnDelete = onDeleteMessage;
        
        if ( !message.IsSeen )
        {    
          if ( !isAdded )
          {
            unreadText.Embedded = true;
            Add( unreadText, order-- );
                  
            isAdded = true;
          }
          message.IsSeen = true;
        }
            
        if ( message.Sender == Device::Device.MyContact )
        {
          chatItem.LeftAligned  = false;
          chatItem.BubbleColor  = Res::Blue;
          chatItem.Message      = message;
          chatItem.MessageColor = Res::WhiteComponents; 
         }
        else if ( message.Receiver == Device::Device.MyContact )
        {
          chatItem.LeftAligned  = true;
          chatItem.BubbleColor  = Res::GreyLight;
          chatItem.Message      = message;
          chatItem.MessageColor = Res::BlackComponents; 
         }
        
        chatItem.Embedded = true;                            
        Add( chatItem, order-- );
        
        if ( lastItem == null )
          lastItem = chatItem;
        
        message = message.next;
      }
      
      Contact.UnreadMessagesNr = 0;

      Outline.ScrollOffset = <0,0>;
    }
    Device::Device.MessageHistory.FindUnreadMessagesNr();
  }

  $rect <300,130,500,170>
  method void RemoveMessages()
  {
    var Core::View view = Outline.FindNextView( null, Core::ViewState[ Embedded ] );
    while ( view != null )
    {
     // if ((Application::ChatItem)view != null )
       if ( view != null )
         Remove( view );

      view = Outline.FindNextView( null, Core::ViewState[ Embedded ] );
    }

  }

  $rect <510,90,660,130>
  var Application::ChatItem lastItem = null;

  // Initialization
  note group Note2
  {
    attr Bounds = <290,0,670,200>;
  }

  $rect <500,490,700,530>
  slot onDeleteMessage
  {
    var Application::ChatItem chatitm = (Application::ChatItem)sender;

    Contact.MessagesList.Remove( chatitm.Message );

    trace Contact.MessagesList.TraceMessages();

    postsignal onMessageUpdate;
  }
}

// Application
note group Note2
{
  attr Bounds = <0,0,430,210>;
}

$rect <500,426,660,466>
$output false
$multilingual true
class ChatItem : Core::Group
{
  $rect <90,120,290,160>
  inherited property Bounds = <0,0,272,55>;

  $rect <300,110,500,150>
  inherited method UpdateViewState()
  {
    // Always invoke the inherited method.
    super( aState );

    if ( LeftAligned == false )
    {
      ChatOutline.Bitmap = Res::ChatRight;  
      ChatOutline.Layout = Core::Layout[AlignToRight, AlignToTop];
      
      Text.Layout = Core::Layout[AlignToRight, AlignToTop];
      Text.Bounds.x= 272 - Text.GetContentArea().w - 20;
      Text.Bounds.y = 10;
    }
    else if ( LeftAligned == true )
    {
      ChatOutline.Bitmap = Res::ChatLeft;
      
      Text.Bounds.x = 15;
      Text.Bounds.y = 10;
    }

    ChatOutline.Color = BubbleColor;

    Text.Color  = MessageColor;
    Text.Alignment = Views::TextAlignment[AlignHorzLeft];

    Backgound.Color = Res::Transparent;
  }

  $rect <300,0,500,40>
  property bool LeftAligned = false;

  $rect <300,40,500,80>
  onset LeftAligned
  {
    // The value doesn't change - nothing to do.
    if ( pure LeftAligned == value )
      return;

    // Remember the property's new value.
    pure LeftAligned = value;

    InvalidateViewState();
  }

  $rect <510,110,710,150>
  property Device::Message Message = null;

  $rect <510,150,710,190>
  onset Message
  {
    if ( pure Message == value )
      return;

    pure Message = value;

    postsignal onUpdateMessage;
  }

  $rect <710,0,910,40>
  property color BubbleColor = Res::GreyLight;

  $rect <710,40,910,80>
  onset BubbleColor
  {
    // The value doesn't change - nothing to do.
    if ( pure BubbleColor == value )
      return;

    // Remember the property's new value.
    pure BubbleColor = value;

    InvalidateViewState();
  }

  $rect <510,0,710,40>
  property color MessageColor = Res::BlackComponents;

  $rect <730,100,930,140>
  var slot OnDelete;

  $rect <930,100,1130,140>
  slot onPress
  {
    DeleteBtn.Enabled = DeleteBtn.Enabled == true ? false : true;
    DeleteBtn.Visible = DeleteBtn.Visible == true ?  false : true;
     
    Backgound.Color = Backgound.Color == Res::BlueLight1 ? Res::Transparent : Res::BlueLight1;
  }

  $rect <510,190,710,230>
  slot onUpdateMessage
  {
    if ( Message != null) 
    {
      Text.String = Message.MessageContent;
    }
  }

  $rect <930,150,1130,190>
  slot onDelete
  {
    postsignal OnDelete;
  }

  $rect <10,200,210,240>
  slot onUpdateText
  {
    if ( LeftAligned == false )
    {
      ChatOutline.Bounds    = Text.GetContentArea() * <10,10>;
      ChatOutline.Bounds.h += 10;
        
      DeleteBtn.Bounds.x    = 5;
    }
    else if ( LeftAligned == true )
    {
      ChatOutline.Bounds    = Text.GetContentArea() * <10,10>;
      ChatOutline.Bounds.h += 10;
      ChatOutline.Layout    = Core::Layout[AlignToRight, AlignToTop];
    }

    Bounds.h = ChatOutline.Bounds.y2;

    Backgound.Bounds.h = Bounds.h;
  }

  $rect <510,40,710,80>
  onset MessageColor
  {
    // The value doesn't change - nothing to do.
    if ( pure MessageColor == value )
      return;

    // Remember the property's new value.
    pure MessageColor = value;

    InvalidateViewState();
  }

  $rect <20,20,160,60>
  object Views::Rectangle Backgound
  {
    preset Bounds = <-2,0,272,50>;
  }

  $rect <20,20,160,60>
  object Core::SimpleTouchHandler SimpleTouchHandler
  {
    preset Point4 = <0,0>;
    preset Point3 = <272,0>;
    preset Point2 = <272,48>;
    preset Point1 = <0,48>;
    preset OnPress = onPress;
  }

  $rect <20,20,160,60>
  object Views::Frame ChatOutline
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Bounds = <34,60,239,150>;
    preset Bitmap = Res::ChatLeft;
    preset NoEdgesLimit = <220,0>;
  }

  $rect <20,20,160,60>
  object Views::Text Text
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Bounds = <186,9,202,21>;
    preset Padding = 2;
    preset Ellipsis = true;
    preset OnUpdate = onUpdateText;
    preset AutoSize = true;
    preset WrapWidth = 195;
    preset WrapText = true;
    preset Alignment = Views::TextAlignment[AlignHorzLeft];
    preset String = "text";
    preset Font = Res::ContactFont15;
  }

  $rect <20,20,160,60>
  object Components::TextButton DeleteBtn
  {
    preset Bounds = <221,10,268,35>;
    preset Enabled = false;
    preset Visible = false;
    preset Text = Strings::deleteTxt;
    preset OnActivate = onDelete;
    preset TextColor = Res::White;
    preset TextColorPress = Res::GreyLight;
  }
}

$rect <30,720,210,760>
$output false
$multilingual true
class ContactsInsideSearch : Core::Group
{
  $rect <280,0,480,40>
  inherited method Init()
  {
    attachobserver onNoOfContactsChanged, ^Device::Device.FilteredContacts.NoOfItems;
    postsignal onNoOfContactsChanged;


  }

  $rect <280,40,480,80>
  inherited property Bounds = <0,0,272,480>;

  // This method is called by 'VerticalList' every time the list loads or updates \
  // an item.
  $rect <280,110,480,150>
  slot OnLoadItem
  {
    var int32 itemNo = VerticalList.Item;

    var Device::Contact contact = Device::Device.FilteredContacts.GetContactAtIndex( itemNo );

    var Application::ContactItem itemView = (Application::ContactItem)VerticalList.View;
                                                  
    if ( itemView == null )
      return;

    itemView.Contact    = contact;
    itemView.OnActivate = onSelectedContact;

    itemView.Bounds.size = point( VerticalList.Bounds.w, VerticalList.ItemHeight );
  }

  $rect <480,0,690,40>
  slot onNoOfContactsChanged
  {
    VerticalList.NoOfItems = Device::Device.FilteredContacts.NoOfItems;

    VerticalList.InvalidateItems( 0, VerticalList.NoOfItems - 1 );

  }

  $rect <20,20,160,60>
  object Views::Rectangle Background
  {
    preset Layout = Core::Layout[AlignToBottom, AlignToLeft, AlignToRight, AlignToTop, ResizeHorz, ResizeVert];
    preset Bounds = <0,100,272,481>;
    preset Color = Res::WhiteComponents;
  }

  $rect <20,20,160,60>
  object Core::VerticalList VerticalList
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Bounds = <11,111,261,435>;
    preset OnLoadItem = OnLoadItem;
    preset SlideHandler = SlideTouchHandler;
    preset ItemHeight = 32;
    preset ItemClass = Application::ContactItem;
  }

  $rect <20,20,160,60>
  object Core::SlideTouchHandler SlideTouchHandler
  {
    preset StackingPriority = -1;
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Bounds = <12,100,261,435>;
    preset SnapNext = <0,35>;
    preset SlideHorz = false;
  }

  $rect <510,410,710,450>
  slot onSelectedContact
  {
    Contact =  ((Application::ContactItem ) sender ).Contact;

    signal OnSelectedContact; 
  }

  $rect <300,410,500,450>
  property slot OnSelectedContact;

  $rect <300,220,500,260>
  property Device::Contact Contact = null;

  $rect <300,260,500,300>
  onset Contact
  {
    if ( pure Contact == value )
      return;

    pure Contact = value;

    notifyobservers ^Contact; 
  }

  // Contact data
  note group Note4
  {
    attr Bounds = <280,170,510,360>;
  }

  // Touch screen events
  note group Note8
  {
    attr Bounds = <280,360,730,480>;
  }
}

$rect <10,40,210,80>
$output false
$multilingual true
class Application : Core::Root
{
  $rect <310,40,510,80>
  inherited method Init()
  {
    postsignal onPresentSplash;

    attachobserver onCallState, ^Device::Device.OngoingCalls.NoOfItems;

    postsignal onCallState;

    //SetMyNumber( 2 );

  }

  $rect <0,500,200,540>
  inherited property Bounds = <0,0,272,480>;

  $rect <530,60,730,100>
  slot onCallState
  {
    if ( Contact != null)
      detachobserver onCallState, Contact;

    Contact = (Device::HistoryContact)Device::Device.OngoingCalls.GetContactAtIndex( 0 );

    if ( ongoingPage != null )
    {
      DismissDialog( ongoingPage, Res::FadeInOutCentered, null, null, null, null, false );

      ongoingPage = null;
    }  

    if ( Contact != null )
    {
      if ( Contact.CallState == Device::CallState.Cancelled || 
           Contact.CallState == Device::CallState.EndCall ||
           Contact.CallState == Device::CallState.Rejected || 
           Contact.CallState == Device::CallState.Missed )
      {
        DismissDialog( ongoingPage, Res::FadeInOutCentered, null, null, null, null, false );
      }
      if ( Contact.CallDirection == Device::CallDirection.Incoming )
      {
        if ( Contact.CallState == Device::CallState.Speaking )
        {
          ongoingPage          = new Application::OngoingCall;
          ongoingPage.Contact = Contact;
        }
        else
        {
          ongoingPage = new Application::IncomingCall;
          ongoingPage.Contact = Contact;
        }
        
        PresentDialog( ongoingPage, Res::FadeInOutCentered, null, null, null, null, null, null, null, false );
      }
      else if ( Contact.CallDirection == Device::CallDirection.Outgoing )
      {
        ongoingPage = new Application::OngoingCall;
        ongoingPage.Contact = Contact;
        PresentDialog( ongoingPage, Res::FadeInOutCentered, null, null, null, null, null, null, null, false );
      }
      attachobserver onCallState, Contact;
      
    }

  }

  $rect <580,10,780,50>
  var Device::DeviceClass deviceInstance = Device::Device;

  $rect <540,100,710,140>
  var Application::CallBase ongoingPage = null;

  $rect <540,140,710,180>
  var Device::HistoryContact Contact = null;

  $rect <300,320,530,360>
  slot onPhoneAppPressed
  {
    phoneApp = new Application::PhoneApp;

    PresentDialog( phoneApp, null, null, null, null, null, null, null, null, false );
  }

  $rect <300,280,530,320>
  slot onMessagesAppPressed
  {
    messageApp = new Application::MessagesApp;

    PresentDialog( messageApp, null, null, null, null, null, null, null, null, false );
  }

  $rect <530,320,740,360>
  var Application::PhoneApp phoneApp;

  $rect <530,280,740,320>
  var Application::MessagesApp messageApp;

  $rect <300,360,530,400>
  slot onPresentSplash
  {
    splashScreen = new Application::SplashScreen;

    splashScreen.OnStart = onDismissSplash;

    PresentDialog( splashScreen, null, null, null, null, null, null, null, null, false );
  }

  $rect <320,400,530,440>
  slot onDismissSplash
  {
    DismissDialog( splashScreen, null, null, null, null, null, false );

    postsignal onHomeBtnPressed;
  }

  $rect <530,360,740,400>
  var Application::SplashScreen splashScreen;

  $rect <300,440,530,480>
  slot onHomeBtnPressed
  {
    var Application::HomePage page = new Application::HomePage;

    PresentDialog( page, null, null, null, null, null, null, null, null, false );
  }

  $rect <310,125,510,165>
  $output true
  method void SetMyNumber( arg int32 aMyNumber )
  {
    myID = aMyNumber;

    idlesignal onSetMyContact;

  }

  $rect <310,165,510,205>
  slot onSetMyContact
  {
    Device::Device.MyContact = Device::Device.Contacts.FindContactByID( myID );


  }

  $rect <310,80,510,120>
  var int32 myID;

  // Initialization
  note group Note
  {
    attr Bounds = <290,0,780,220>;
  }

  // Touchscreen events
  note group Note1
  {
    attr Bounds = <290,230,770,490>;
  }
}

$rect <31,121,231,161>
$output false
$multilingual true
class HomePage : Core::Group
{
  $rect <320,30,530,70>
  inherited method Init()
  {
    attachobserver ShowUnreadMessages, ^Device::Device.MessageHistory.UnreadMessagesNr;
    postsignal ShowUnreadMessages;

  }

  $rect <0,500,200,540>
  inherited property Bounds = <0,0,272,480>;

  $rect <300,300,500,340>
  slot onPhoneAppPressed
  {
    phoneApp = new Application::PhoneApp;

    PresentDialog( phoneApp, null, null, null, null, null, null, null, null, false );
  }

  $rect <300,348,500,388>
  slot onMessagesAppPressed
  {
    messageApp = new Application::MessagesApp;

    PresentDialog( messageApp, null, null, null, null, null, null, null, null, false );
  }

  $rect <500,300,700,340>
  var Application::PhoneApp phoneApp;

  $rect <500,348,700,388>
  var Application::MessagesApp messageApp;

  $rect <300,250,500,290>
  slot onSettingsAppPressed
  {
    settingsApp = new Application::SettingsApp;

    PresentDialog( settingsApp, null, null, null, null, null, null, null, null, false );
  }

  $rect <500,250,700,290>
  var Application::SettingsApp settingsApp = null;

  $rect <20,20,160,60>
  object Views::Image Image
  {
    preset Bounds = <0,0,272,480>;
    preset Color = #FFFFFFFF;
    preset Bitmap = Res::background;
  }

  $rect <20,20,160,60>
  object Components::Button50x75 Button50x77
  {
    preset Bounds = <3,4,53,79>;
    preset Icon = Res::SettingsIcon;
    preset OnActivate = onSettingsAppPressed;
    preset Descript = Strings::SettingsTxt;
    preset DescriptColor = Res::White;
    preset IconColor = Res::White;
    preset BackgoundColorPressed = #AAAAAAFF;
    preset DescriptFont = Res::ContactFont12;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::SuqareButton;
    preset DescriptColorPressed = Res::White;
    preset IconColorPressed = Res::White;
  }

  $rect <20,20,160,60>
  object Views::Rectangle Footer
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Bounds = <0,420,272,480>;
    preset ColorBL = #94949496;
    preset ColorBR = #B9B9B9AD;
    preset ColorTR = #C3C3C3B0;
    preset ColorTL = #CDCDCDDA;
    preset Color = #79797986;
  }

  $rect <20,20,160,60>
  object Components::SButton50x50 Contacts
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Bounds = <53,425,103,475>;
    preset Icon = Res::CallIcon;
    preset OnActivate = onPhoneAppPressed;
    preset DescriptColor = Res::White;
    preset IconColor = Res::White;
    preset BackgoundColor = Res::GreenDark;
    preset BackgoundColorPressed = Res::Green;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::SuqareButton;
    preset IconColorPressed = Res::White;
  }

  $rect <20,20,160,60>
  object Components::SButton50x50 Messeges
  {
    preset Layout = Core::Layout[AlignToLeft, AlignToTop];
    preset Bounds = <170,425,220,475>;
    preset Icon = Res::MessageIcon;
    preset OnActivate = onMessagesAppPressed;
    preset DescriptColor = Res::White;
    preset IconColor = Res::White;
    preset BackgoundColor = Res::GreenDark;
    preset BackgoundColorPressed = Res::Green;
    preset IconFont = Res::IconsFont25;
    preset Backgound = Res::SuqareButton;
    preset IconColorPressed = Res::White;
  }

  $rect <320,80,530,120>
  slot ShowUnreadMessages
  {
    if ( Device::Device.MessageHistory.UnreadMessagesNr != 0 )
    {
      NotificationBtn.Visible  = true;
      NotificationBtn.Descript = (int32)Device::Device.MessageHistory.UnreadMessagesNr;
    }
    else
      NotificationBtn.Visible = false;
      

  }

  $rect <20,20,160,60>
  object Components::SButton50x50 NotificationBtn
  {
    preset StackingPriority = 0;
    preset Bounds = <195,400,245,450>;
    preset Icon = Res::CircleFillIcon;
    preset DescriptColor = Res::White;
    preset IconColor = Res::Blue;
    preset BackgoundColor = Res::Transparent;
    preset BackgoundColorPressed = Res::Transparent;
    preset DescriptFont = Res::ContactFont12;
    preset IconFont = Res::IconsFont25;
    preset BackgroundColorEnabled = Res::Transparent;
    preset DescriptColorEnabled = Res::Transparent;
    preset IconColorEnabled = Res::Transparent;
    preset DescriptColorPressed = Res::WhiteComponents;
    preset IconColorPressed = Res::BlueLight;
  }

  // Initialization
  note group Note
  {
    attr Bounds = <290,-10,590,190>;
  }

  // Touchscreen events
  note group Note1
  {
    attr Bounds = <290,200,720,480>;
  }
}

$rect <31,81,231,121>
$output false
$multilingual true
class SplashScreen : Core::Group
{
  $rect <320,460,520,500>
  inherited property Bounds = <0,0,272,480>;

  // To do:
  // 
  // - Adjust the visible size of your component (the thick blue border).
  // 
  // - The simplest way to compose the appearance of the component is to use the \
  // 'Views' and 'Widget Sets' from the Gallery.
  // 
  // - To react to touch or keyboard events use the templates from the Gallery folder \
  // 'Event Handlers'.
  // 
  // - To perform transitions (animations) use the templates from the Gallery folder \
  // 'Effects'.
  // 
  // - To implement the interface of the component use the 'Property' template from \
  // the Gallery folder 'Chora'.
  // 
  // - To store values use the 'Variable' and 'Array' templates available in the \
  // Gallery folder 'Chora'.
  // 
  // - To implement behavior use the 'Method' and 'Slot Method' templates available \
  // in the Gallery folder 'Chora'.
  // 
  // - In the method 'UpdateViewState()' you can put code to update the state of \
  // views enclosed in your component.
  // 
  // - In the method 'UpdateLayout()' you can put code to perform sophisticated layout \
  // calculation for enclosed views.
  note legend Note1
  {
    attr Bounds = <580,620,1360,940>;
  }

  $rect <20,20,160,60>
  object Views::Rectangle Rectangle
  {
    preset Bounds = <0,0,272,480>;
    preset Color = #000000FF;
  }

  $rect <290,10,490,50>
  slot onScreenTouched
  {
    postsignal OnStart;
  }

  $rect <490,10,690,50>
  var slot OnStart;

  $rect <20,20,160,60>
  object Core::SimpleTouchHandler SimpleTouchHandler
  {
    preset Point4 = <0,0>;
    preset Point3 = <272,0>;
    preset Point2 = <272,480>;
    preset Point1 = <0,480>;
    preset OnPress = onScreenTouched;
  }

  $rect <20,20,160,60>
  object Views::Image Image
  {
    preset Bounds = <45,198,227,283>;
    preset Bitmap = Res::Logo;
  }
}

$rect <470,610,670,650>
$output false
$multilingual true
class SettingsApp : Core::Group
{
  $rect <0,500,200,540>
  inherited property Bounds = <0,0,272,480>;

  $rect <20,20,160,60>
  object Views::Rectangle Rectangle
  {
    preset Bounds = <0,0,272,480>;
    preset Color = Res::WhiteBackgound;
  }

  $rect <20,20,160,60>
  object Views::Text TitleTxt
  {
    preset Bounds = <11,40,264,80>;
    preset Alignment = Views::TextAlignment[AlignHorzLeft, AlignVertCenter];
    preset String = Strings::SettingsTxt;
    preset Font = Res::TitileFont32;
    preset Color = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Application::ComboBox Language
  {
    preset Bounds = <6,182,266,217>;
    preset OnSelect = onSelectLanguage;
    preset OnLoadItem = onLoadLanguage;
    preset SelectedItem = -1;
    preset NoOfItems = 2;
  }

  $rect <290,180,490,220>
  slot onLoadLanguage
  {
    var string name;

    // Which item should be loaded?
    switch ( Language.View.Item )
    {
      case  0 : name = Strings::EnglishTxt;
      case  1 : name = Strings::HungarianTxt;
      default : name = Strings::LanguageTxt;
    }

    // Initialize the item
    Language.View.String = name;
  }

  $rect <280,230,480,270>
  slot onSelectLanguage
  {
    switch ( Language.SelectedItem )
    {
      case  0 : language = Default;
      case  1 : language = Magyar;
      default : language = Default;
    }

    Language.InvalidateItems( 0, Language.NoOfItems );
  }

  $rect <280,60,480,100>
  slot onSettingsAppPressed
  {
    settingsApp = new Application::EditPage;

    settingsApp.Bounds.h = 480;
    settingsApp.DeleteBtn.Enabled = false;

    if ( Device::Device.MyContact )
      settingsApp.Contact = Device::Device.MyContact;
    else
      settingsApp.Contact = new Device::Contact;
      
    settingsApp.OnClose = onClose;
    settingsApp.OnSave  = onSave;

    PresentDialog( settingsApp, null, null, null, null, null, null, null, null, false );
  }

  $rect <480,60,680,100>
  var Application::EditPage settingsApp = null;

  $rect <300,100,480,140>
  slot onClose
  {
    DismissDialog( settingsApp, null, null, null, null, null, false );

    settingsApp = null;
  }

  $rect <300,140,480,180>
  slot onSave
  {
    Device::Device.MyContact = settingsApp.Contact;
    Device::Device.Contacts.AddLast( settingsApp.Contact );

    postsignal onClose;
  }

  $rect <20,20,160,60>
  object Application::ComboBox Style
  {
    preset Bounds = <7,223,267,258>;
    preset OnSelect = onSelectStyle;
    preset OnLoadItem = onLoadStyle;
    preset NoOfItems = 2;
  }

  $rect <280,290,480,330>
  slot onLoadStyle
  {
    var string name;

    // Which item should be loaded?
    switch ( Style.View.Item )
    {
      case  0 : name = Strings::DarkModeTxt;
      case  1 : name = Strings::LightModeTxt;
      default : name = Strings::StylesTxt;
    }

    // Initialize the item
     Style.View.String = name;
  }

  $rect <280,330,480,370>
  slot onSelectStyle
  {
    var styles tmp = styles;

    if ( tmp.contains([ DarkMode ]))
      tmp = tmp - [ DarkMode ];

    else
      tmp = tmp + [ DarkMode ];

    //styles = tmp;
    GetRoot().Styles = tmp;
  }

  $rect <620,300,820,340>
  inherited method HandleEvent()
  {
    var Core::StylesEvent stylesEvent = (Core::StylesEvent)aEvent;

    if ( stylesEvent != null )
    {
      Rectangle.Color = Res::WhiteBackgound;
      TitleTxt.Color = Res::BlackComponents;

      MyCardItem.ButtonColor = Res::WhiteComponents;
      MyCardItem.TextColor = Res::BlackComponents;
      MyCardItem.IconColor = Res::WhiteComponents;

      Language.ButtonColor = Res::WhiteComponents;
      Style.ButtonColor = Res::WhiteComponents;
    }

    return super( aEvent );
  }

  $rect <20,20,160,60>
  object Application::MyCardItem MyCardItem
  {
    preset Bounds = <6,99,266,144>;
    preset Text = "";
    preset OnActivate = onSettingsAppPressed;
  }

  // Directives to adapt the order of the above members according to how these members 
  // where arranged when the project content was stored. In this manner the storage 
  // and the expected order of the members don't depend. Merging of changes in the 
  // project files is simplified.
  $member HandleEvent
  $member Bounds
  $member Rectangle
  $member TitleTxt
  $member Language
  $member onLoadLanguage
  $member onSelectLanguage
  $member onSettingsAppPressed
  $member settingsApp
  $member onClose
  $member onSave
  $member Style
  $member onLoadStyle
  $member onSelectStyle
  $member MyCardItem
}

// This class implements the item component for the Application::ComboBox widget. \
// This class is used internally within Application::ComboBox widget and the associated \
// Application::ComboBoxList component. You will probably never need to directly \
// instantiate and control this item component.
$rect <470,740,670,780>
$output false
class ComboBoxItem : Templates::ListItem
{
  $rect <250,270,450,310>
  inherited property Bounds = <0,0,200,40>;

  $rect <710,160,910,200>
  inherited method UpdateViewState()
  {
    // Always invoke the inherited method.
    super( aState );

    // Determine the new state of the Item
    //
    // isMarked  --> the item is selected within the corresponding list.
    // isFocused --> the user has navigated to the item. The item can
    //               receive keyboard events.
    // isPressed --> the user presses the item actively.
    //
    //
    var bool isMarked  = Marked;
    var bool isFocused = aState.contains( Core::ViewState[ Focused ]);
    var bool isPressed = TouchHandler.Down || FlashTimer.Enabled;


    if ( isPressed )
    {
      Background.Color = Res::GreyLight;
      Text.Color       = Res::Grey;
      Border.Visible   = true;
      Border.Width     = 1;
    }

    else if ( isFocused && isMarked )
    {
      Background.Color = Res::PressColor;
      Text.Color       = Res::Grey;
      Border.Visible   = true;
      Border.Width     = 1;
    }

    else if ( isFocused )
    {
      Background.Color = Res::PressColor;
      Text.Color       = Res::Grey;
      Border.Visible   = true;
      Border.Width     = 1;
    }

    else if ( isMarked )
    {
      Background.Color = Res::WhiteComponents;
      Text.Color       = Res::BlackComponents;
      Border.Visible   = false;
    }

    // Not marked nor selected.
    else
    {
      Background.Color = Res::WhiteComponents;
      Text.Color       = Res::BlackComponents;
      Border.Visible   = false;
    }

    // Remember the current state. Next time when the UpdateViewState() is called
    // you can compare the 'old' state with the 'new' state and perform more
    // sophisticated update, e.g. you can start an animation effect for the
    // pressed <<-->> not pressed transition.
    focused = isFocused;
    marked  = isMarked;
    pressed = isPressed;
  }

  // To do:
  // 
  // - Adjust the visible size of your item (the thick blue border). This will be \
  // the item's default size.
  // - Resize the member 'TouchHandler' so it still fills the items's new area.
  // - Remove the 'Background' and 'Border' members if you want other views to be \
  // shown instead these in your item.
  // - Remove the 'Text' view, 'String' property and the associated onset method \
  // if you don't want to display text.
  // - According to your desired item design add and configure new views (e.g. an \
  // image view to show an icon or a further text view to show additional text, etc.).
  // - Adapt the implementation of the 'UpdateViewState()' method. This method should \
  // update your views so they reflect the item's current state.
  // - You can also add and configure animation effects to your item. See 'UpdateViewState()' \
  // implementation for hint how to start the effects.
  // - Arrange and resize the views so they appear correctly within the visible area \
  // of your item.
  // - Configure the property 'Layout' of the views. In this manner you can determine \
  // for every view how it should move/resize when the item itself is resized.
  // - Configure the property 'Filter' of the 'KeyHandler' member if you want the \
  // item to be activated with key other than the 'Enter' key.
  // - Configure the property 'Begin' of the 'FlashTimer' member to change the duration \
  // of the feedback flash effect. The default duration is 50 millisec.
  // - From the Gallery folder 'Chora' add properties to your item. One property \
  // for every item specific setting (e.g. 'Icon', 'Color', 'Font', ...).
  // - Rename the properties accordingly their usage and remove their 'OnGet...' \
  // methods.
  // - For every newly added property adapt their 'OnSet...' method implementation. \
  // Ensure in the method that the assigned value is correctly passed to the corresponding \
  // view (e.g. a property 'Icon' should update the image view in your item where \
  // the icon is shown).
  // - Feel free to modify any other member in this component accordingly your needs. \
  // Please note the member description and inline comments within methods.
  note legend Note5
  {
    attr Bounds = <10,340,1010,710>;
  }

  // State management
  note group Note4
  {
    attr Bounds = <700,120,920,330>;
  }

  // Feedback flash effect
  note group Note3
  {
    attr Bounds = <470,120,690,250>;
  }

  // Keyboard events
  note group Note2
  {
    attr Bounds = <240,120,460,250>;
  }

  // Touch screen events
  note group Note1
  {
    attr Bounds = <10,120,230,250>;
  }

  // This variable stores the current state of the item.
  $rect <710,280,910,320>
  var bool pressed;

  // This variable stores the current state of the item.
  $rect <710,240,910,280>
  var bool focused;

  // This variable stores the current state of the item.
  $rect <710,200,910,240>
  var bool marked;

  // This timer object is used to flash the item when the user has tapped it very \
  // quickly or the item has been activated with the keyboard. This is just a visual \
  // feedback effect.
  $rect <480,160,680,200>
  object Core::Timer FlashTimer
  {
    preset OnTrigger = onFlashTimer;
    preset Period = 0;
    preset Begin = 50;
  }

  // This key handler reacts to key press events. When the user presses the key specified \
  // in the property 'Filter' of the key handler, the handler is activated and the \
  // method '@onPressKey' is called.
  $rect <250,160,450,200>
  object Core::KeyPressHandler KeyHandler
  {
    preset OnPress = onPressKey;
    preset Filter = Core::KeyCode.Enter;
  }

  // This internal slot method is called when the '@FlashTimer' is expired. It ends \
  // the short flash feedback effect.
  $rect <480,200,680,240>
  slot onFlashTimer
  {
    // The feedback flash timer is finished. Request the item to update its
    // appearance. The update will occur in the UpdateViewState() method.
    InvalidateViewState();

    // With the end of the feedback flash effect the item is activated.
    postsignal OnSelect;
  }

  // This internal slot method is called when the '@KeyHandler' is activated (when \
  // the user has pressed the key specified in the property 'Filter' of the key handler).
  $rect <250,200,450,240>
  slot onPressKey
  {
    // Ignore keyboard events when the user is interacting with the item via the
    // touch screen.
    if ( TouchHandler.Down )
      return;

    // Ignore repetitions of key events (e.g. when the user holds the key pressed)
    if ( KeyHandler.Repetition )
      return;

    // Pressing the key flashes the item for a short period. This is a kind of 
    // feedback effect. Request the item to update its appearance accordingly.
    // The update will occur in the UpdateViewState() method.
    InvalidateViewState();

    // Start the feedback flash effect.
    FlashTimer.Enabled = true;
  }

  // This internal slot method is called when the user drags the finger while pressing \
  // the item. This only updates the item to appear pressed or released.
  $rect <20,200,220,240>
  slot onEnterLeaveTouch
  {
    // Every time the user touches the item or drags the finger inside/outside
    // the item's area request the item update its appearance. The update will
    // occur in the UpdateViewState() method.
    InvalidateViewState();
  }

  // This internal slot method is called when the user releases the touch screen \
  // after touching the item's area. This activates the item.
  $rect <20,160,220,200>
  slot onReleaseTouch
  {
    // Every time the user releases the item, request an update. The update will
    // occur in the UpdateViewState() method.
    InvalidateViewState();

    // The user interaction has been passed over to the another touch handler
    if ( TouchHandler.AutoDeflected )
      return;

    // The user has pressed and held the item for longer time. This was enough
    // long to give a visual 'press' feedback to the user. The item can be
    // activated immediately.
    if ( TouchHandler.HoldPeriod >= FlashTimer.Begin )
      postsignal OnSelect;

    // The user has tapped the item very quickly. Defer the item activation
    // to give the user first a short visual feedback that the item has been
    // pressed.
    else
      FlashTimer.Enabled = true;
  }

  $rect <240,50,440,90>
  onset String
  {
    // The value doesn't change - nothing to do.
    if ( pure String == value )
      return;

    // Remember the property's new value.
    pure String = value;

    // ... and update the Text view.
    Text.String = value;
  }

  $rect <440,50,640,90>
  onset Marked
  {
    // The value doesn't change - nothing to do.
    if ( pure Marked == value )
      return;

    // Remember the property's new value.
    pure Marked = value;

    // Request the view to update its state
    InvalidateViewState();
  }

  $rect <20,20,160,60>
  object Views::Rectangle Background
  {
    preset Layout = Core::Layout[AlignToBottom, AlignToLeft, AlignToRight, AlignToTop, ResizeHorz, ResizeVert];
    preset Bounds = <0,0,200,40>;
    preset Color = Res::Transparent;
    preset Visible = false;
  }

  $rect <20,20,160,60>
  object Views::Border Border
  {
    preset Layout = Core::Layout[AlignToBottom, AlignToLeft, AlignToRight, AlignToTop, ResizeHorz, ResizeVert];
    preset Bounds = <0,0,200,40>;
    preset Color = Res::PressColor;
    preset Visible = false;
  }

  $rect <20,20,160,60>
  object Views::Text Text
  {
    preset Layout = Core::Layout[AlignToBottom, AlignToLeft, AlignToRight, AlignToTop, ResizeHorz, ResizeVert];
    preset Bounds = <5,5,195,35>;
    preset Ellipsis = true;
    preset Alignment = Views::TextAlignment[AlignHorzAuto, AlignVertCenter];
    preset String = "Text";
    preset Font = Res::ContactFont15;
    preset Color = Res::BlackComponents;
  }

  $rect <20,20,160,60>
  object Core::SimpleTouchHandler TouchHandler
  {
    preset Layout = Core::Layout[AlignToBottom, AlignToLeft, AlignToRight, AlignToTop, ResizeHorz, ResizeVert];
    preset Point4 = <0,40>;
    preset Point3 = <200,40>;
    preset Point2 = <200,0>;
    preset Point1 = <0,0>;
    preset OnLeave = onEnterLeaveTouch;
    preset OnEnter = onEnterLeaveTouch;
    preset OnRelease = onReleaseTouch;
    preset RetargetCondition = Core::RetargetReason[WipeDown, WipeLeft, WipeRight, WipeUp];
    preset MaxStrikeCount = 100;
  }

  // The property 'OnSelect' can refer to a slot method, which will receive a signal \
  // as soon as the user has activated the item (selected the item). Thereupon the \
  // method's logic will be executed.
  $rect <640,50,840,90>
  property slot OnSelect = null;

  // The property 'Item' stores the number of the item within the ComboBox. The first \
  // item has the number 0. The second 1, and so far.
  $rect <640,10,840,50>
  property int32 Item = -1;

  // The property 'Marked' stores the state of the item. If this property is 'true', \
  // the item appears as selected.
  $rect <440,10,640,50>
  property bool Marked = false;

  // The property 'String' stores the text to display in the item.
  $rect <240,10,440,50>
  property string String = "Text";
}

// This class implements the list component for the Application::ComboBox widget. \
// When the user activates the ComboBox, the list component is shown displaying all \
// available options and permitting the user to select the desired option.
// The class Application::ComboBoxList is used internally within Application::ComboBox \
// widget. You will probably never need to directly instantiate and control this \
// list component.
$rect <470,700,670,740>
$output false
class ComboBoxList : Templates::List
{
  $rect <700,220,900,260>
  inherited method CursorHitTest()
  {
    // First perform the cursor-hit test as usual.
    var Core::CursorHit hit = super( aArea, aFinger, aStrikeCount, aDedicatedView, aStartView,
                                     aRetargetReason );

    // Now, has the user tapped outside the list component? This can cause the list to disappear.
    // Inform the ComboBox in such case.
    if ( !hit && !aDedicatedView && ( aArea & Bounds ).isempty )
      postsignal onCloseList;

    return hit;
  }

  $rect <10,270,210,310>
  inherited property Bounds = <0,0,200,200>;

  $rect <240,280,440,320>
  inherited method UpdateLayout()
  {
    super( aSize );

    // Just in the moment when the List appears or its size changes, 
    // ensure that there is no empty space in the list.
    VerticalList.AdjustList( null, null );

    // Then eventually scroll the list so the actually selected item
    // is fully visible.
    VerticalList.EnsureVisible( selectedItem, true, null, null );

    // The following operation additionally adjusts the scrolling so
    // the list snaps at the edge of the first visible item.
    var int32 firstVisibleItem = VerticalList.GetItemAtPosition( VerticalList.Bounds.origin );
    VerticalList.EnsureVisible( firstVisibleItem, true, null, null );
  }

  // Touch Handling
  note group Note4
  {
    attr Bounds = <690,170,910,280>;
  }

  // List functionality
  note group Note3
  {
    attr Bounds = <460,170,680,280>;
  }

  // Keyboard events
  note group Note2
  {
    attr Bounds = <460,20,1080,160>;
  }

  // Initialization
  note group Note1
  {
    attr Bounds = <230,20,450,330>;
  }

  // This variable refers to a slot method in the ComboBox to invoke when the user \
  // has decided to close the List without making any selection.
  $rect <240,230,440,270>
  var slot onCloseList;

  // This variable refers to a slot method in the ComboBox to invoke when the user \
  // has made a selection within the List.
  $rect <240,190,440,230>
  var slot onSelectItem;

  // This variable refers to a slot method in the ComboBox the List component will \
  // invoke in order to load an item with its appropriate content. In such case the \
  // sender of the signal will refer the item in question.
  $rect <240,150,440,190>
  var slot onLoadItem;

  // This variable stores which item was selected just in the moment when the user \
  // has activated the ComboBox List. This item will consequently appear as selected \
  // within the List.
  $rect <240,110,440,150>
  var int32 selectedItem;

  // This internal slot method is called by the embedded 'VerticalList' in order \
  // to load a list item with its appropriate content. The invocation is relayed \
  // to the ComboBox.
  $rect <470,220,670,260>
  slot onLoadItemSlot
  {
    // Access the item view intended to be loaded now.
    var Application::ComboBoxItem view = (Application::ComboBoxItem)VerticalList.View;

    // Ensure, the item view is correctly connected with the ComboBox.
    view.OnSelect = onSelectItem;

    // Which number has the item and is the item the originally 'selected' one?
    view.Item   = VerticalList.Item;
    view.Marked = view.Item == selectedItem;

    // Also ensure that the item fills the list horizontally.
    view.Bounds.size = VerticalList.ViewSize;

    // Forward the signal to the ComboBox's OnLoadItem slot method. This method is then
    // responsible for the proper initialization of the item's content. Use the item 
    // view as 'sender' of the signal.
    signal onLoadItem, view;
  }

  // This internal slot method is called when the '@KeyEscapeHandler' is activated \
  // (when the user has pressed the key specified in the property 'Filter' of the \
  // key handler).
  $rect <870,100,1070,140>
  slot onKeyEscape
  {
    // The user has pressed the ESCAPE key. Inform the ComboBox about the close operation.
    postsignal onCloseList;
  }

  // This internal slot method is called when the '@KeyDownHandler' is activated \
  // (when the user has pressed the key specified in the property 'Filter' of the \
  // key handler).
  $rect <670,100,870,140>
  slot onKeyDown
  {
    // No more following items?
    if ( VerticalList.SelectedItem >= ( VerticalList.NoOfItems - 1 ))
      return;

    // Select the next following item and ensure it is visible.
    VerticalList.SelectedItem++;
    VerticalList.EnsureVisible( VerticalList.SelectedItem, true, null, null );
  }

  // This internal slot method is called when the '@KeyUpHandler' is activated (when \
  // the user has pressed the key specified in the property 'Filter' of the key handler).
  $rect <470,100,670,140>
  slot onKeyUp
  {
    // No more preceding items
    if ( VerticalList.SelectedItem <= 0 )
      return;

    // Select the preceding item and ensure it is visible.
    VerticalList.SelectedItem--;
    VerticalList.EnsureVisible( VerticalList.SelectedItem, true, null, null );
  }

  // This key handler reacts to key ESCAPE events. When the user presses the key \
  // ESCAPE (specified in the property 'Filter' of the key handler), the handler \
  // is activated and the method '@onKeyEscape' is called.
  $rect <870,60,1070,100>
  object Core::KeyPressHandler KeyEscapeHandler
  {
    preset OnPress = onKeyEscape;
    preset Filter = Core::KeyCode.Escape;
  }

  // This key handler reacts to key DOWN events. When the user presses the key DOWN \
  // (specified in the property 'Filter' of the key handler), the handler is activated \
  // and the method '@onKeyDown' is called.
  $rect <670,60,870,100>
  object Core::KeyPressHandler KeyDownHandler
  {
    preset OnPress = onKeyDown;
    preset Filter = Core::KeyCode.Down;
    preset OnHold = onKeyDown;
  }

  // This key handler reacts to key UP events. When the user presses the key UP (specified \
  // in the property 'Filter' of the key handler), the handler is activated and the \
  // method '@onKeyUp' is called.
  $rect <470,60,670,100>
  object Core::KeyPressHandler KeyUpHandler
  {
    preset OnPress = onKeyUp;
    preset Filter = Core::KeyCode.Up;
    preset OnHold = onKeyUp;
  }

  $rect <20,20,160,60>
  object Views::Rectangle Background
  {
    preset Layout = Core::Layout[AlignToBottom, AlignToLeft, AlignToRight, AlignToTop, ResizeHorz, ResizeVert];
    preset Bounds = <0,0,200,200>;
    preset Color = Res::WhiteComponents;
  }

  $rect <20,20,160,60>
  object Views::Border Border
  {
    preset Layout = Core::Layout[AlignToBottom, AlignToLeft, AlignToRight, AlignToTop, ResizeHorz, ResizeVert];
    preset Bounds = <0,0,200,200>;
    preset Width = 2;
    preset Color = Res::PressColor;
    preset Visible = false;
  }

  $rect <20,20,160,60>
  object Core::SlideTouchHandler SlideTouchHandler
  {
    preset Layout = Core::Layout[AlignToBottom, AlignToLeft, AlignToRight, AlignToTop, ResizeHorz, ResizeVert];
    preset Bounds = <5,5,195,195>;
  }

  $rect <20,20,160,60>
  object Core::VerticalList VerticalList
  {
    preset Layout = Core::Layout[AlignToBottom, AlignToLeft, AlignToRight, AlignToTop, ResizeHorz, ResizeVert];
    preset Bounds = <5,5,195,195>;
    preset OnLoadItem = onLoadItemSlot;
    preset SlideHandler = SlideTouchHandler;
    preset ItemClass = Application::ComboBoxItem;
  }

  // This method is called just in the moment when the user activates the ComboBox. \
  // Its task is to initialize the List component according to the parameters found \
  // in the ComboBox. It also calculates the optimal size/position for the list and \
  // connects the List to the ComboBox.
  $rect <240,60,440,100>
  method void Initialize( arg rect aComboBoxArea, arg point aScreenSize, arg int32 aNoOfItems, arg int32 aSelectedItem, arg slot aOnLoadItem, arg slot aOnSelectItem, arg slot aOnCloseList )
  {
    // Remember 'callbacks' the list should use to communicate with the ComboBox.
    onLoadItem   = aOnLoadItem;
    onSelectItem = aOnSelectItem;
    onCloseList  = aOnCloseList;

    // Initialize the list according to the passed parameters.
    VerticalList.NoOfItems    = aNoOfItems;
    VerticalList.SelectedItem = aSelectedItem;

    // Also remember which item was originally selected.
    selectedItem = aSelectedItem;

    // To get the item height, create temporarily a new instance of the associated 
    // item class and query its default size.
    VerticalList.ItemHeight = ((Core::RectView)new VerticalList.ItemClass ).Bounds.h;

    // Also the Slide Touch Handler should be configure to snap at item edges.
    SlideTouchHandler.SnapNext.y = VerticalList.ItemHeight;

    // Now estimate the width of the list. Usually, the width of the list should 
    // correspond to the width of the ComboBox. The list should also be aligned at
    // the left edge of the ComboBox.
    var int32 w = aComboBoxArea.w;
    var int32 x = aComboBoxArea.x1;

    // Now estimate the height of the list. Let's assume, the list is large enough
    // to display all items at once. The list should also appear just below the
    // ComboBox.
    var int32 h = VerticalList.NoOfItems * VerticalList.ItemHeight;
    var int32 y = aComboBoxArea.y2;

    // Ensure the list is not too large. Here, we limit the list to 1/3 of the entire
    // screen height.
    h = math_min( h, aScreenSize.y / 3 );

    // Adjust the height so that it is a multiple of the height of a single item.
    h -= h % VerticalList.ItemHeight;

    // Take in account the evtl. existing decorations or borders around the list, etc.
    h += Bounds.h - VerticalList.Bounds.h;

    // Now verify, whether there is sufficient space below the ComboBox to display
    // the list. If not, the list will appear above the ComboBox.
    if (( aScreenSize.y - aComboBoxArea.y2 ) < h )
      y = aComboBoxArea.y1 - h;

    // Adjust the size and position of the list.
    Bounds = rect( x, y, x + w, y + h );
  }
}

// This class implements a 'combo box' widget. When the user activates the box, an \
// associated Application::ComboBoxList component is shown displaying all available \
// options and permitting the user to select the desired option. Selecting the option \
// sends a signal to the slot method stored in the property @OnSelect.
// Alternatively the property @Outlet can refer to any other 'int32' property the \
// widget should remain synchronized with. When the user selects an option, the affected \
// property is automatically updated to reflect the number of the selected option. \
// On the other hand, when the referred property is modified by another one, the \
// ComboBox is automatically notified to remain in sync with the property.
// The total number of available ComboBox items (the number of options) is determined \
// by the property @NoOfItems. Which option is actually selected is controlled by \
// the property @SelectedItem.
// The items are loaded dynamically at the runtime. For this purpose a slot method \
// has to be implemented and assigned to the @OnLoadItem property. The ComboBox will \
// invoke the slot method automatically each time it needs an item to be loaded. \
// Within the slot method the implementation can access and initialize the affected \
// item by using the variable @View.
// In order to trigger the combo box to reload one or more items, invoke the method \
// @InvalidateItems(). The box will thereupon schedule the necessary loading steps \
// automatically.
$rect <470,660,670,700>
$output false
class ComboBox : Templates::ComboBox
{
  $rect <20,370,220,410>
  inherited property Bounds = <0,0,260,35>;

  $rect <710,230,910,270>
  inherited method UpdateViewState()
  {
    super( aState );

    if ( !previewItem )
    {
      // Create a new item view
      previewItem = new Application::ComboBoxItem;

      previewItem.Enabled = false;
      previewItem.Item    = SelectedItem;
      previewItem.Layout  = Core::Layout[ AlignToLeft, AlignToRight, AlignToTop,
                                          AlignToBottom, ResizeHorz ]; 


      // Load the item view with data corresponding to the actually selected
      // item.
      View = previewItem;
      signal OnLoadItem;
      View = null;

      // Query the default size of an item
      var point size = previewItem.Bounds.size;

      // Arrange the item view so that it fills the ComboBox area excepting
      // the arrow image on the right of the ComboBox. The height of the item
      // should not change.
      previewItem.Bounds = rect( 3, Bounds.h / 2 - size.y / 2, Image.Bounds.x1,
                                 Bounds.h / 2 + size.y / 2 );

      // Finally adding the view to the ComboBox makes it visible
      Add( previewItem, 0 );

      // Avoid that the view appears selected as selected views do within the
      // list.
      Focus = null;
    }

    var bool isEnabled  = aState.contains( Core::ViewState[ Enabled  ]);
    var bool isSelected = aState.contains( Core::ViewState[ Selected ]);
    var bool isPressed  = ( TouchHandler.Down && TouchHandler.Inside ) || 
                            FlashTimer.Enabled;
    var bool isOpened   = list != null;

    if ( !isEnabled )
    {
      Background1.Color   = ButtonColor;
      Image.FrameNumber   = 1;
      Image.Color         = Res::Grey;
      previewItem.Opacity = 128;
      previewItem.Text.Color = Res::BlackComponents;
    }

    else if ( isOpened )
    {
      Background1.Color   = ButtonColor;
      Image.FrameNumber   = 0;
      Image.Color         = Res::Grey;
      previewItem.Opacity = 255;
      previewItem.Text.Color = Res::BlackComponents;
    }

    else if ( isPressed )
    {
      Background1.Color   = ButtonColor;
      Image.FrameNumber   = 1;
      Image.Color         = Res::PressColor;
      previewItem.Opacity = 255;
      previewItem.Text.Color = Res::BlackComponents;
    }

    else if ( isSelected )
    {
      Background1.Color   = ButtonColor;
      Image.FrameNumber   = 1;
      Image.Color         = Res::Grey;
      previewItem.Opacity = 255;
      previewItem.Text.Color = Res::BlackComponents;
    }

    // Enabled but not pressed nor selected.
    else
    {
      Background1.Color   =ButtonColor;
      Image.FrameNumber   = 1;
      Image.Color         = Res::Grey;
      previewItem.Opacity = 255;
      previewItem.Text.Color = Res::BlackComponents;
    }

    enabled  = isEnabled;
    selected = isSelected;
    pressed  = isPressed;
    opened   = isOpened;
  }

  // To do:
  // 
  // - Adjust the visible size of your ComboBox (the thick blue border). This will \
  // be the widget's default size.
  // - Resize the member 'TouchHandler' so it still fills the widget's new area.
  // - Remove the 'Background1', 'Background2' and/or 'Border' members if you want \
  // other views to be shown instead these in your ComboBox.
  // - According to your desired ComboBox design add and configure new views (e.g. \
  // an image view to show the icon or a text view to show a caption, etc.).
  // - Adapt the implementation of the 'UpdateViewState()' method. This method should \
  // update your views so they reflect the widget's current state.
  // - You can also add and configure animation effects to your ComboBox. See 'UpdateViewState()' \
  // implementation for hint how to start the effects.
  // - Arrange and resize the views so they appear correctly within the visible area \
  // of your ComboBox.
  // - Configure the property 'Layout' of the views. In this manner you can determine \
  // for every view how it should move/resize when the widget itself is resized.
  // - Configure the property 'Filter' of the 'KeyHandler' member if you want the \
  // ComboBox to be activated with key other than the 'Enter' key.
  // - Alternatively remove the members 'KeyHandler' and 'onPressKey' if you don't \
  // want any keyboard handling.
  // - Configure the property 'Begin' of the 'FlashTimer' member to change the duration \
  // of the feedback flash effect. The default duration is 50 millisec.
  // - From the Gallery folder 'Chora' add properties to your ComboBox. One property \
  // for every specific setting (e.g. 'Caption', 'Icon', 'Color', 'Font', ...)
  // - Rename the properties accordingly their usage and remove their 'OnGet...' \
  // methods.
  // - For every newly added property adapt their 'OnSet...' method implementation. \
  // Ensure in the method that the assigned value is correctly passed to the corresponding \
  // view (e.g. a property 'Icon' should update the image view in your ComboBox where \
  // the icon is shown).
  // - Feel free to modify any other member in this component accordingly your needs. \
  // Please note the member description and inline comments within methods.
  note legend Note7
  {
    attr Bounds = <10,570,990,950>;
  }

  // List Functionality
  note group Note6
  {
    attr Bounds = <930,190,1150,560>;
  }

  // Controller events
  note group Note5
  {
    attr Bounds = <240,330,460,420>;
  }

  // State management
  note group Note4
  {
    attr Bounds = <700,190,920,560>;
  }

  // Feedback flash effect
  note group Note3
  {
    attr Bounds = <470,190,690,320>;
  }

  // Keyboard events
  note group Note2
  {
    attr Bounds = <240,190,460,320>;
  }

  // Touch screen events
  note group Note1
  {
    attr Bounds = <10,190,230,320>;
  }

  // This variable stores an animation effect used to show/hide the list.
  $rect <940,510,1140,550>
  var Effects::Effect effect;

  // This variable stores the List component if its is visible actually.
  $rect <940,470,1140,510>
  var Application::ComboBoxList list;

  // This variable stores an item instance used in the ComboBox to show the actual \
  // selection.
  $rect <710,430,910,470>
  var Application::ComboBoxItem previewItem;

  // This variable stores the current state of the ComboBox.
  $rect <710,390,910,430>
  var bool opened;

  // This variable stores the current state of the ComboBox.
  $rect <710,350,910,390>
  var bool pressed;

  // This variable stores the current state of the ComboBox.
  $rect <710,310,910,350>
  var bool selected;

  // This variable stores the current state of the ComboBox.
  $rect <710,270,910,310>
  var bool enabled;

  // This timer object is used to flash the ComboBox when the user has tapped it \
  // very quickly or the ComboBox has been activated with the keyboard. This is just \
  // a visual feedback effect.
  $rect <480,230,680,270>
  object Core::Timer FlashTimer
  {
    preset OnTrigger = onFlashTimer;
    preset Period = 0;
    preset Begin = 50;
  }

  // This key handler reacts to key press events. When the user presses the key specified \
  // in the property 'Filter' of the key handler, the handler is activated and the \
  // method '@onPressKey' is called.
  $rect <250,230,450,270>
  object Core::KeyPressHandler KeyHandler
  {
    preset OnPress = onPressKey;
    preset Filter = Core::KeyCode.Enter;
  }

  // This internal slot method is called when the list has finished its fade-in/out \
  // animation.
  $rect <940,430,1140,470>
  slot onEndFadeOutEffect
  {
    var Core::Root root = (Core::Root)list.Owner;

    // End the modal state of the list and remove it from the application.
    root.Remove( list );
    root.EndModal( list );
    list = null;

    // Release the effect object
    effect = null;

    // Trigger an update in the ComboBox to reflect the new state.
    InvalidateViewState();
  }

  // This internal slot method is called when the list has finished its fade-in/out \
  // animation.
  $rect <940,390,1140,430>
  slot onEndFadeInEffect
  {
    // Release the effect object
    effect = null;
  }

  // This internal slot method is called when the user has made a selection in the \
  // List or decided to close the list without any selection. Thereupon the list \
  // disappears.
  $rect <940,350,1140,390>
  slot onCloseList
  {
    // The list is already closed.
    if ( !list )
      return;

    /*

      HINT :

      Following code uses an animation effect to fade-out the list when it closed.
      If you don't want such animation, you can remove the code till the end of
      the method and replace it by following code:

      var Core::Root root = GetRoot();

      root.Remove( list );
      root.EndModal( list );
      list = null;

      InvalidateViewState();

    */

    // If there is already an effect running, stop it first.
    if ( effect )
      effect.Enabled = false;

    // Create a new effect object to animate the list when it is hidden. In this
    // template the animation modulates the opacity of the list.
    var Effects::Int32Effect int32Effect = new Effects::Int32Effect;

    // Configure the animation and start it
    int32Effect.Value1        = list.Opacity;
    int32Effect.Value2        = 0;
    int32Effect.CycleDuration = 150;
    int32Effect.NoOfCycles    = 1;
    int32Effect.Outlet        = ^list.Opacity;
    int32Effect.OnFinished    = onEndFadeOutEffect;
    int32Effect.Enabled       = true;
    effect                    = int32Effect;
  }

  // This internal slot method is called when the user has made a selection within \
  // the List component. Thereupon the ComboBox is updated and the List is hidden.
  $rect <940,310,1140,350>
  slot onSelectItem
  {
    // The list is already closed.
    if ( !list )
      return;

    // Making a selection within the ComboBox closes the list.
    postsignal onCloseList;

    // Obtain access to the just selected item
    var Application::ComboBoxItem item = (Application::ComboBoxItem)sender;

    // If the selection did not change?
    if ( SelectedItem == item.Item )
      return;

    // Update the ComboBox to reflect the new selection
    SelectedItem = item.Item;

    // Inform the owner of the ComboBox about the made selection.
    postsignal OnSelect;

    // ... and if there is an associated Outlet, update it too
    if ( Outlet )
      Outlet^ = item.Item;
  }

  // This internal slot method is called when the actually displayed List component \
  // needs to update an item. The invocation is relayed to the slot method stored \
  // in the property @OnLoadItem.
  $rect <940,270,1140,310>
  slot onLoadItem
  {
    // Obtain access to the item for which the load operation is performed
    var Application::ComboBoxItem item = (Application::ComboBoxItem)sender;

    // ...and forward the signal to the OnLoadItem slot method. This method is then
    // responsible for the proper initialization of the item.
    View = item;
    signal OnLoadItem;
    View = null;
  }

  // This internal slot method is called when the user has activated the ComboBox. \
  // It creates a new instance of the respective List component and displays it.
  $rect <940,230,1140,270>
  slot onShowList
  {
    // Avoid race conditions caused by the delay of 'FlashTimer'. Due to the delay
    // the method 'onShowList' may become invoked twice. Thus ignore the second
    // invocation if there is already a list visible.
    if ( list )
      return;

    var Core::Root root   = GetRoot();
    var rect       bounds = Bounds;

    // Calculate the screen global position of the ComboBox
    bounds.origin = Owner.GlobalPosition( bounds.origin );

    // Create a new instance of the ComboBox List component and ...
    list = new Application::ComboBoxList;

    // ... initialize it, calculate its optimal size and position, etc.
    list.Initialize( bounds, root.Bounds.size, NoOfItems, SelectedItem, onLoadItem, 
                     onSelectItem, onCloseList );

    /*

      HINT :

      Following code uses an animation effect to fade-in the list when it shown.
      If you don't want such animation, you can remove the code till the end of
      the method and replace it by following code:

      root.Add( list, 0 );
      root.BeginModal( list );

      InvalidateViewState();

    */

    // If there is already an effect running, stop it first.
    if ( effect )
      effect.Enabled = false;

    // Create a new effect object to animate the list when it is shown. In this
    // template the animation changes the size of the list.
    var Effects::RectEffect rectEffect = new Effects::RectEffect;

    // Configure the animation. 
    rectEffect.Value1        = list.Bounds;
    rectEffect.Value2        = list.Bounds;
    rectEffect.CycleDuration = 150;
    rectEffect.Timing        = Effects::Timing.FastIn_EaseOut;
    rectEffect.NoOfCycles    = 1;
    rectEffect.Outlet        = ^list.Bounds;
    rectEffect.OnFinished    = onEndFadeInEffect;

    // Adjust the animation for the case, when the list should appear below the
    // combo box
    if ( list.Bounds.y1 > bounds.y1 )
      rectEffect.Value1.y2 = rectEffect.Value1.y1;

    // ... or above the combo box
    else
      rectEffect.Value1.y1 = rectEffect.Value1.y2;

    // ... and start the animation
    rectEffect.Enabled = true;
    effect             = rectEffect;

    // Make the list visible and modal
    root.Add( list, 0 );
    root.BeginModal( list );

    // Trigger the ComboBox to eventually adapt its appearance after the list is shown.
    InvalidateViewState();
  }

  // This slot method will receive a signal, if the value of the property assigned \
  // to @Outlet has been changed by another widget or by the application logic. In \
  // response to this notification, the widget will update itself.
  $rect <250,370,450,410>
  slot onOutlet
  {
    // Read the current value of the associated property and update accordingly
    // the state of the ComboBox.
    if ( Outlet != null )
      SelectedItem = Outlet^;
  }

  // This internal slot method is called when the '@FlashTimer' is expired. It ends \
  // the short flash feedback effect.
  $rect <480,270,680,310>
  slot onFlashTimer
  {
    // The feedback flash timer is finished. Request the ComboBox to update
    // its appearance. The update will occur in the UpdateViewState() method.
    InvalidateViewState();

    // With the end of the feedback flash effect the associated list is shown
    postsignal onShowList;
  }

  // This internal slot method is called when the '@KeyHandler' is activated (when \
  // the user has pressed the key specified in the property 'Filter' of the key handler).
  $rect <250,270,450,310>
  slot onPressKey
  {
    // Ignore keyboard events when the user is interacting with the ComboBox via
    // the touch screen.
    if ( TouchHandler.Down )
      return;

    // Ignore repetitions of key events (e.g. when the user holds the key pressed)
    if ( KeyHandler.Repetition )
      return;

    // Pressing the key flashes the ComboBox for a short period. This is a kind
    // of feedback effect. Request the ComboBox to update its appearance accordingly.
    // The update will occur in the UpdateViewState() method.
    InvalidateViewState();

    // The ComboBox is still performing the feedback flash effect from the preceding
    // tap/key event. This can occur when the user taps the box or presses the key in
    // a very rapid succession. Thus ignore this new interaction.
    if ( FlashTimer.Enabled )
      return;

    // Start the feedback flash effect.
    FlashTimer.Enabled = true;
  }

  // This internal slot method is called when the user drags the finger while pressing \
  // the ComboBox. This only updates the box to appear pressed or released.
  $rect <20,270,220,310>
  slot onEnterLeaveTouch
  {
    // Every time the user touches the ComboBox or drags the finger inside/outside
    // the box's area request the ComboBox update its appearance. The update will
    // occur in the UpdateViewState() method.
    InvalidateViewState();
  }

  // This internal slot method is called when the user releases the touch screen \
  // after touching the ComboBox's area. This activates the ComboBox.
  $rect <20,230,220,270>
  slot onReleaseTouch
  {
    // Did the user moved the finger outside the ComboBox area? In such case
    // the ComboBox is not activated.
    if ( !TouchHandler.Inside )
      return;

    // The user interaction has been passed over to the another touch handler
    if ( TouchHandler.AutoDeflected )
      return;

    // The user has pressed and held the ComboBox for longer time. This was 
    // enough long to give a visual 'press' feedback to the user. The box can
    // be activated immediately.
    if ( TouchHandler.HoldPeriod >= FlashTimer.Begin )
      postsignal onShowList;

    // The user has tapped the ComboBox very quickly. Defer the box activation
    // to give the user first a short visual feedback that the ComboBox has been
    // pressed.
    else
      FlashTimer.Enabled = true;
  }

  $rect <20,20,160,60>
  object Views::Rectangle Background1
  {
    preset Layout = Core::Layout[AlignToBottom, AlignToLeft, AlignToRight, AlignToTop, ResizeHorz, ResizeVert];
    preset Bounds = <0,0,260,35>;
    preset Color = Res::WhiteComponents;
  }

  $rect <20,20,160,60>
  object Core::SimpleTouchHandler TouchHandler
  {
    preset Layout = Core::Layout[AlignToBottom, AlignToLeft, AlignToRight, AlignToTop, ResizeHorz, ResizeVert];
    preset Point4 = <0,35>;
    preset Point3 = <260,35>;
    preset Point2 = <260,0>;
    preset Point1 = <0,0>;
    preset OnLeave = onEnterLeaveTouch;
    preset OnEnter = onEnterLeaveTouch;
    preset OnRelease = onReleaseTouch;
    preset RetargetCondition = Core::RetargetReason[WipeDown, WipeLeft, WipeRight, WipeUp];
    preset MaxStrikeCount = 100;
  }

  $rect <20,20,160,60>
  object Views::Image Image
  {
    preset Layout = Core::Layout[AlignToBottom, AlignToRight, AlignToTop, ResizeVert];
    preset Bounds = <210,0,260,35>;
    preset Color = Res::Grey;
    preset FrameNumber = 1;
    preset Bitmap = Resources::NavigationIconsSmall;
  }

  $rect <690,50,890,90>
  onset Outlet
  {
    // Check if the new outlet differs from the currently used outlet
    if ( pure Outlet == value )
      return;

    // Detach from the previous outlet
    if ( pure Outlet != null )
      detachobserver onOutlet, pure Outlet;

    // Store the new outlet ...
    pure Outlet = value;

    // ... and attach to the new one
    if ( value != null )
      attachobserver onOutlet, value;

    // Finally, retrieve the current state of the property associated via 'Outlet'.
    if ( value != null )
      postsignal onOutlet;
  }

  $rect <490,50,690,90>
  onset SelectedItem
  {
    // Ensure the index of the selected item is valid
    if ( value < 0 )
      value = -1;

    // No changes - nothing to do
    if ( value == pure SelectedItem )
      return;

    // Remember the new item
    pure SelectedItem = value;

    // Changing the selection at the runtime forces the ComboBox to recreate
    // its preview item.
    if ( previewItem )
    {
      Remove( previewItem );
      previewItem = null;
    }

    // Request an update
    InvalidateViewState();
  }

  $rect <290,50,490,90>
  onset NoOfItems
  {
    // Ensure the given number of items is valid
    if ( value < 0 )
      value = 0;

    // No changes - nothing to do
    if ( value == pure NoOfItems )
      return;

    // Remember the new number of items
    pure NoOfItems = value;

    // Changing the number of items may affect the actually selected item.
    // Therefore recreate the preview item of the ComboBox.
    if ( previewItem )
    {
      Remove( previewItem );
      previewItem = null;
    }

    // Request an update
    InvalidateViewState();
  }

  // The method InvalidateItems() forces the combo box to reload one or more items. \
  // The index of the item to start the reload operation is specified in the parameter \
  // aFirstItem. The parameter aLastItem specifies the index of the last affected \
  // item. The first item has the index 0, the second 1, and so far. The operation \
  // can cause the combo box to invoke the external @OnLoadItem slot method for each \
  // affected item.
  $rect <490,100,690,140>
  method void InvalidateItems( arg int32 aFirstItem, arg int32 aLastItem )
  {
    // If there is actually a list box displayed, forward the request to its
    // embedded vertical list.
    if ( list )
      list.VerticalList.InvalidateItems( aFirstItem, aLastItem );

    // The request also forces the ComboBox to recreate its preview item if the
    // invalidated items affect the actually selected item.
    if ( previewItem && ( SelectedItem >= aFirstItem ) && ( SelectedItem <= aLastItem ))
    {
      Remove( previewItem );
      previewItem = null;

      // Request an update
      InvalidateViewState();
    }
  }

  // The variable 'View' refers to the item which is about to be loaded by the external \
  // slot method @OnLoadItem. In this manner the slot method can directly access \
  // and modify the item's properties.
  $rect <290,140,490,180>
  var Application::ComboBoxItem View;

  // The property 'OnSelect' can refer to a slot method, which will receive a signal \
  // each time the user has selected an item within the ComboBox. Thereupon the method's \
  // logic will be executed. In the associated slot method you can evaluate @SelectedItem \
  // to process the selection.
  $rect <690,100,890,140>
  property slot OnSelect = null;

  // The property 'OnLoadItem' should refer to a slot method, which will be invoked \
  // by the ComboBox in order to load an item with its corresponding content. Within \
  // the slot method the affected item can be accessed via variable @View.
  $rect <290,100,490,140>
  property slot OnLoadItem = null;

  // The property 'Outlet' can refer to any other 'int32' property the widget should \
  // remain synchronized with. When the user selects an item, the affected property \
  // is automatically updated to reflect the item's number. On the other hand, when \
  // the referred property is modified by another one, the ComboBox is automatically \
  // notified to remain in sync with the property.
  // This approach follows the Model-View-Controller (MVC) programming paradigm. \
  // Here the ComboBox represents the 'View' and 'Controller' and the property referred \
  // via 'Outlet' can be seen as a part of the 'Model'.
  $rect <690,10,890,50>
  property ^int32 Outlet = null;

  // The property 'SelectedItem' stores the index of the currently selected item \
  // or -1 if no item is selected. The first item has the index 0, the second 1, \
  // and so far.
  $rect <490,10,690,50>
  property int32 SelectedItem = -1;

  // The property 'NoOfItems' stores how many items are currently managed within \
  // the ComboBox. This value should correspond to the number of options the ComboBox \
  // offers to the user.
  $rect <290,10,490,50>
  property int32 NoOfItems = 0;

  $rect <710,490,910,530>
  inherited method HandleEvent()
  {
    var Core::StylesEvent stylesEvent = (Core::StylesEvent)aEvent;

    if ( stylesEvent != null )
    {
      Background1.Color = Res::WhiteBackgound;
    }

    return super( aEvent );
  }

  $rect <890,10,1090,50>
  property color ButtonColor = Res::WhiteComponents;

  $rect <890,50,1090,90>
  onset ButtonColor
  {
    // The value doesn't change - nothing to do.
    if ( pure ButtonColor == value )
      return;

    // Remember the property's new value.
    pure ButtonColor = value;

    // ... and trigger the component to update its actual state.
    InvalidateViewState();
  }

  // Directives to adapt the order of the above members according to how these members 
  // where arranged when the project content was stored. In this manner the storage 
  // and the expected order of the members don't depend. Merging of changes in the 
  // project files is simplified.
  $member HandleEvent
  $member Bounds
  $member UpdateViewState
  $member Note7
  $member Note6
  $member Note5
  $member Note4
  $member Note3
  $member Note2
  $member Note1
  $member effect
  $member list
  $member previewItem
  $member opened
  $member pressed
  $member selected
  $member enabled
  $member FlashTimer
  $member KeyHandler
  $member onEndFadeOutEffect
  $member onEndFadeInEffect
  $member onCloseList
  $member onSelectItem
  $member onLoadItem
  $member onShowList
  $member onOutlet
  $member onFlashTimer
  $member onPressKey
  $member onEnterLeaveTouch
  $member onReleaseTouch
  $member OnSetOutlet
  $member OnSetSelectedItem
  $member OnSetNoOfItems
  $member InvalidateItems
  $member View
  $member OnSelect
  $member OnLoadItem
  $member Outlet
  $member SelectedItem
  $member NoOfItems
  $member Background1
  $member TouchHandler
  $member Image
  $member ButtonColor
  $member OnSetButtonColor
}

// Settings
note group Note3
{
  attr Bounds = <440,570,920,910>;
}