OutSystems – Exercício 14 – Data Synchronization

Este post demonstra o exercício 14.

Para baixar o material para esse exercício, acesse https://www.outsystems.com/learn/lesson/786/data-synchronization-exercise/

  1. Sincronização Automática
    1. Abra o projeto ToDo
    2. Abra a aba Logic e OfflineDataSyncConfiguration
    3. Mude os parâmetros SyncOnOnline, SyncOnLogin, SyncOnResume e RetryOnError para “Default Value” igual a “True”
    4. Publique a aplicação e rode. Se estiver logado, efetuar logoff e login para visualizar
  2. Habilitando mudanças Offline
    1. Na aba Data (ToDo) criar uma entidade estática SyncStatus
    2. Adicionar registro para None, Added e Updated
    3. Alterar a entidae LocalToDo, adicionando o campo SyncStatusId (relacionado a SyncStatus Identifier)
    4. Modificar a ação SaveOnClick (tela ToDoDetails)
      1. Excluir o If “not GetNetworkStatus()”, pois precisamos gravar localmente, mesmo sem conexão
      2. Criar If para verificação de data de encerramento passada
        1. GetLocalToDoById.List.Current.LocalToDo.DueDate <> NullDate() and GetLocalToDoById.List.Current.LocalToDo.DueDate < CurrDate()
        2. Setar Input_DueDate.Valid = False
        3. Input_DueDate.Message = “Data de encerramento não pode estar no passado”
      3. Criar If de Form1.Valid()
        1. Se Form1.Valid() = False, vá para o nó End
        2. Senão, prosseguir
      4. Criar If Offline (not GetNetworkStatus())
        1. Se verdadeiro, ir para If New To Do?
        2. Se falso
          1. Ir para CreateOrUpdateToDoWrapper (gravação direta no servidor)
          2. Marcar SyncStatus = None
          3. Ir para “CreateOrUpdateLocalToDo
      5. Criar If “New To Do?”
        1. LocalToDoId = NullIdentifier()
        2. Se falso, ir para If “Added SyncStatus?” (verifica se o status do registro está com Added)
        3. Senão
          1. Assign GetLocalToDoById.List.Current.LocalToDo.SyncStatusId = Entities.SyncStatus.Added
          2. Ir para “CreateOrUpdateLocalToDo”
      6. Criar If “Added SyncStatus?”
        1. Condição
          1. GetLocalToDoById.List.Current.LocalToDo.SyncStatusId = Entities.SyncStatus.Added
          2. True, ir para “CreateOrUpdateLocalToDo”
          3. False
            1. assign GetLocalToDoById.List.Current.LocalToDo.SyncStatusId = Entities.SyncStatus.Updated
            2. Ir para “CreateOrUpdateLocalToDo”
      7. Fluxo completo 
    5. Modificar a ação StarOnClick para que fique igual a figura abaixo
    6. Modificar a ação TakePictureOnClick
    7. Modificando ações de sincronização
      1. Na aba Logic, abra “Server Actions” e selecione “ServerDataSync” em “OfflineDataSync”
        1. Adicionar parâmetro “AddedLocalToDos”
        2. Dois cliques em “DataType”
          1. Clique em “Text” e mude para “List”
          2. Clique em tipo “Text” e escolha “Record”
          3. Remova “Text” atributo (ícone de lixeira)
          4. Clique “Add attribute to AddedLocalToDos” e escolha “LocalToDo”
          5. Clique “Add attribute to AddedLocalToDos” e escolha “LocalResource”
          6. Clique em “Close” para fechar a janela
        3. Adicionar outro parâmetro “UpdatedLocalToDos” e repetir o procedimento do item 2
    8. Criando a lógica necessária para ServerDataSync
      1. Abrir o fluxo ServerDataSync (duplo clique)
      2. Tratamento AddedLocalToDos
        1. Adicionar “For Each” entre LogMessage e GetCategories
        2. Adicionar “Run Server Action” e colocar do lado direito do “For Each” e escolher ação de entidade “CreateToDo”
        3. Criar um “Cicle” entre o “For Each” e “CreateToDo”
        4. Selecionar “For Each” e configurar a propriedade “Record List” para “AddedLocalToDos” no parâmetro de entrada
        5. Selecione “CreateToDo” e configure a propriedade Source para “AddedLocalToDos.Current.LocalToDo”
        6. No mapeamento “LocalToDo to ToDo”  configure “Id” para “NullIdentifier()” e “UserId” para “GetUserId()”
        7. Adicionar componente “If” abaixo do “CreateToDo”
          1. Label: “Has Resource?”
          2. Condition: AddedLocalToDos.Current.LocalResource.Id <> NullIdentifier()
        8. Adicione componente “Run Server Action” e colocar à esquerda do “If”
          1. Name: CreateResource
          2. Action: CreateResource
          3. Source: AddedLocalToDos.Current.LocalResource
          4. “Mapping from LocalResource to Resource”
          5. Id: CreateToDo.Id
      3. Tratamento UpdatedLocalToDos
        1. Repetir o procedimento do item 2. / 8. / 2.
        2. Utilizar UpdateLocalToDos no “For Each”
        3. “Run Server Action” “UpdateToDo”
          1. Action: UpdateToDo
          2. Source: UpdateLocalToDos.Current.LocalToDo
          3. “Mapping from LocalToDo to ToDo”
        4. “If” “Has Resource?”
          1. Condition: UpdatedLocalToDos.Current.LocalResource.Id <> NullIdentifier()
        5. “Run Server Action” “CreateOrUpdateResource”
          1. Action: CreateOrUpdateResource
          2. Source: UpdatedLocalToDos.Current.LocalResource
    9. Implementando OfflineDataSync
      1. Em “Client Actions” selecione a ação “OfflineDataSync” (dentro de “OfflineDataSync”)
      2. Adicione um “Aggregate” entre “Start” e “ServerDataSync” e abra (duplo clique)
        1. Arraste a entidade “LocalToDo” para o “Data”
        2. Repita o procedimento acima para a entidade “LocalResource”
        3. Em “Filters” configure: LocalToDo.SyncStatusId = Entities.SyncStatus.Added
        4. Em “Sources” modifique a cláusula entre LocalToDo e LocalResource para “With or Without”
        5. Nomear para “GetAddedLocalToDos”
      3. Repetir o procedimento do item 2, agora para “GetUpdatedLocalToDos”
        1. Em “Filters” configure: LocalToDo.SyncStatusId = Entities.SyncStatus.Updated
      4. Retorne para ação Client “OfflineDataSync”
        1. Configurar o parâmetro AddedLocalToDos para “GetAddedLocalToDos.List”
        2. Configurar o parâmetro UpdatedeLocalToDos para “GetUpdatedLocalToDos.List”
    10. Modificando Offline ícone
      1. Na aba Interface, abra “BottomBar” localizada no fluxo “Common”
      2. Usando “Widget Tree”, localize “BottomBarItem” que contém “Offline” ícone e apague-o
      3. Clique com o botão direito  no “Link” que contém “New To Do” e escolha “Remove Enclosing If”
      4. Arraste um componente “Container” para o mesmo nível do “bottom-bar-ph”
      5. Configure a propriedade “Visible” do “Container como, “not NetworkIsOnline”
      6. Configure no “Container”
        1. Align: Center
        2. Style: “background-light-grey text-italic text-dark-red”
      7. Arraste um componente “Icon” para dentro do “Container” e escolha “Pic an Icon” como “power off”
      8. Configure a propriedade “Size” para “Font Size”
      9. Coloque o cursor ao lado direito do “Icon” e digite: “You are currently offline”
    11. Publique e teste a aplicação