De visualisatie van de HomeServer biedt de mogelijkheid plattegronden en afbeeldingen te integreren en bedieningselementen vrij vorm te geven.

Transcriptie

1 HomeServer/FacilityServer Visualisatie aanmaken en testen Inleiding: De visualisatie van de HomeServer biedt de mogelijkheid plattegronden en afbeeldingen te integreren en bedieningselementen vrij vorm te geven. De visualisatie kan met een internetbrowser worden geopend of in de QuadClient worden geïntegreerd. Meerdere gebruikers kunnen tegelijkertijd toegang hebben tot de visualisatie of de QuadClient. Ga verder met een willekeurige toets. Pagina 1 van

2 HomeServer/FacilityServer Visualisatie aanmaken en testen In onderstaande lesmodule - maakt u een visualisatiedesign aan - maakt u een visualisatie met twee pagina's aan - definieert u sprongen van pagina naar pagina - verleent u toegangsrechten aan de gebruiker - zet u het project over naar Expert - test u de toegang. Ga verder met een willekeurige toets Pagina 2 van 75

3 1 HS Expert [C:\Dokumente und Einstellungen\ks\Eigene Dateien\HS+FS Experte 2.5\Projekte\Training\Training.hs3] Klik op de menuknop Project ( ). Met deze actie opent u het invoervenster voor de projectinstellingen. Pagina 3 van

4 2 Project settings U maakt een visualisatiedesign aan in de rubriek Designs. Het design bepaalt de weergaveafmetingen voor de plattegrondvisualisatie.klik op het tree item Designs ( ). Een design wordt in het project aangemaakt met Toevoegen. Klik op de knop Add ( ) Pagina 4 van 75

5 3 Select Klik op het lijst-item GIRA1024 ( ). Hiermee wordt het gewenste design gemarkeerd. Klik op de knop Select ( ). Pagina 5 van

6 4 Project settings De HTML-visualisatie werd in een oudere versie weergegeven met een navigatiebalk en een titelbalk. In de nu gebruikte, snel verversende AJAX visualisatie (Asynchrone gegevensoverdracht van JavaScript en XML) hebben we deze navigatiebalk niet nodig en wordt deze verborgen. Klik op het lijst-item GIRA1024. Klik op de knop ( ) Pagina 6 van 75

7 5 Bestätigung Omdat de posities van al geplaatste teksten en symbolen bij het verbergen kunnen verschuiven, is het aan te bevelen deze instelling op de visualisatie toe te passen voordat er mee wordt gewerkt. Klik op de knop ( ). Pagina 7 van

8 6 Project settings Klik op het menu-item Close ( ). De gewijzigde instellingen worden automatisch toegepast Pagina 8 van 75

9 7 HS Expert [C:\Dokumente und Einstellungen\ks\Eigene Dateien\HS+FS Experte 2.5\Projekte\Training\Training.hs3] Nadat de definitie van de weergave is voltooid, begint u met het vormgeven van de visualisatie onder de rubriek Interface/Visualisatie. Klik op de tab Interface ( ). Pagina 9 van

10 Klik op de menuknop Visualisation ( ) Pagina 10 van 75

11 8 Visualisation Klik op de knop New ( ). Met deze actie maakt u een nieuwe visualisatiepagina aan met afmetingen 1024x768. Pagina 11 van

12 9 Edit/Add De eerste pagina moet als titel "Startpagina" hebben. Voer Startpage in het veld Designation in. Elke pagina moet verplicht worden voorzien van een achtergrond. Deze wordt op de regel "Achtergrondafbeelding met de toewijzingstoetsen..." gedefinieerd. Klik op de knop Background image ( ) Pagina 12 van 75

13 10 Visualisation background U kunt diverse achtergrondafbeeldingen beheren. U maakt nu met de afbeelding (jpgformaat) van een huis een achtergrondafbeelding aan. Klik op de knop New ( ). Pagina 13 van

14 Klik op het menu-item Insert from file ( ) Pagina 14 van 75

15 11 Creating Voer BI_Startpage in het veld in. Klik op de knop File ( ). Met deze actie wijst u een afbeelding toe. Pagina 15 van

16 12 Öffnen Klik op het lijst-item Home_outside ( ). Klik op de knop Öffnen ( ) Pagina 16 van 75

17 13 Creating Klik op de knop Ok ( ). Hiermee past u de afbeelding toe. Pagina 17 van

18 14 Visualisation background Met de actie Toepassen wijst u de achtergrondafbeelding toe aan de visualisatiepagina van waaruit u het achtergrondafbeeldingbeheer hebt geopend.klik op het menu-item Apply ( ) Pagina 18 van 75

19 15 Klik op de knop Ok ( ). Pagina 19 van

20 16 Visualisation Nadat u uw eerste visualisatiepagina succesvol hebt aangemaakt, maakt u nu een pagina aan voor de begane grond. Klik op de knop New ( ) Pagina 20 van 75

21 17 Edit/Add Voer Ground floor in het veld Designation in. Klik op de knop Background image ( ). Pagina 21 van

22 18 Visualisation background Klik op de knop New ( ) Pagina 22 van 75

23 Klik op het menu-item Insert from file ( ). Pagina 23 van

24 19 Creating Voer BI_GF in het veld in. Klik op de knop File ( ) Pagina 24 van 75

25 20 Öffnen Klik op het lijst-item ground_floor ( ). Klik op de knop Öffnen ( ). Pagina 25 van

26 21 Creating Klik op de knop Ok ( ) Pagina 26 van 75

27 22 Visualisation background Klik op het menu-item Apply ( ). Pagina 27 van

28 23 Edit/Add Klik op de knop Ok ( ) Pagina 28 van 75

29 24 Visualisation Klik op het tree item Startpage ( ). De pagina moet nu worden geopend met een tekstelement. Daarvoor selecteert u de knop Tekst. Klik op het keuzerondje Text ( ). Met een willekeurige toetsdruk simuleert u het openslepen van het tekstveld. Hier worden de afmetingen van het bedieningsveld gedefinieerd. Ga verder met een willekeurige toets. Pagina 29 van

30 25 Visualisation element - Text Voer Ground floor in het veld STAT in. Om het openen van een pagina bij een muisklik door de gebruiker te definiëren, stelt u in het veld Actie Pagina openen in.klik op de knop Action ( ) Pagina 30 van 75

31 Klik op het lijst-item Call page ( ). Pagina 31 van

32 De actie Pagina openen hebt u succesvol geselecteerd. Nu definieert u de te openen pagina op het parametertabblad van de visualisatiepagina. Klik op de tab Visualisation page ( ). Klik op de knop Visualisation page ( ) Pagina 32 van 75

33 26 Select Klik op het tree item Ground floor ( ). Hiermee wordt aan het tekstveld BG het doel BG toegewezen.. Klik op de knop Ok ( ). Pagina 33 van

34 27 Visualisation element - Text Nu definieert u de teksteigenschappen op het parametertabblad Tekst. Lettertype Arial 14 vet, gecentreerd, kleur wit en achtergrond zwart. Klik op de tab Text ( ). Klik op de knop Font ( ). Hiermee definieert u lettertype en grootte Pagina 34 van 75

35 28 Fonts U selecteert Arial 14 vet. Klik op het tree item Arial 14 Bold ( ). Klik op het menu-item Apply ( ). Pagina 35 van

36 29 Visualisation element - Text Klik op de knop Alignment ( ) Pagina 36 van 75

37 Klik op het lijst-item Centred ( ). Pagina 37 van

38 Klik op de knop Font colour ( ) Pagina 38 van 75

39 30 Farbe Klik op white ( ). Klik op de knop OK ( ). Pagina 39 van

40 31 Visualisation element - Text Klik op het aanvinkvakje Background ( ). Klik op de knop Background ( ) Pagina 40 van 75

41 32 Farbe Klik op black ( ). Klik op de knop OK ( ). Pagina 41 van

42 33 Visualisation element - Text Klik op de knop Ok ( ) Pagina 42 van 75

43 34 Visualisation Klik met de rechtermuisknop op Text element GF ( ). om deze naar de pagina BG te kopiëren en te hernoemen. Pagina 43 van

44 Klik op het menu-item ( ). Klik op het tree item Ground floor ( ). Klik met de rechtermuisknop op Visualisation page top left. Met de volgende actie voegt u het tekstveld BG in Pagina 44 van 75

45 Klik op het menu-item ( ). Klik met de rechtermuisknop op Textfield Ground floor ( ). Met deze actie begint u de eigenschappen te bewerken. Pagina 45 van

46 Klik op het menu-item ( ) Pagina 46 van 75

47 35 Visualisation element - Text Wijzig de naam van het tekstelement in Startpage. Voer Startpage in het veld Stat. text in. Pagina 47 van

48 Klik op de tab Visualisation page ( ). Klik op de knop Visualisation page ( ) Pagina 48 van 75

49 36 Select Klik op het tree item Startpage ( ). Pagina 49 van

50 Klik op de knop Ok ( ) Pagina 50 van 75

51 37 Visualisation element - Text Klik op de knop Ok ( ). Hiermee past u de instelling toe en verlaat u het invoervenster. Pagina 51 van

52 38 Visualisation Het aanmaken van de pagina's is nu voltooid. Nu configureert u voor gebruiker admin de rechten om deze visualisatie te gebruiken. Klik op het menu-item Close ( ) Pagina 52 van 75

53 39 HS Expert [C:\Dokumente und Einstellungen\ks\Eigene Dateien\HS+FS Experte 2.5\Projekte\Training\Training.hs3] Klik op de tab Master data ( ). Pagina 53 van

54 Klik op de menuknop User ( ) Pagina 54 van 75

55 40 User Klik op het tree item Admin ( ). Pagina 55 van

56 Klik op de tab User rights ( ). De gebruiker heeft voor de basisvisualisatie wachtwoordbevoegdheden nodig in de rubriek HTML. Om de comfortabele AJAX visualisatie te kunnen gebruiken, moet hij bovendien clientfunctionaliteit hebben. Voor toegang is eveneens een wachtwoord nodig. Klik op de keuzelijst HTML ( ). Klik op het lijst-item Password ( ) Pagina 56 van 75

57 Klik op de keuzelijst Client program ( ). Deze client-functionaliteit met snelle verversing en weergave van transparantie wordt geboden door moderne browsers, zoals b.v. Mozilla Firefox vanaf versie 3.5 of Microsoft Internet Explorer vanaf versie 7. Klik op het lijst-item Password ( ). Pagina 57 van

58 De gebruiker wil met de bediening van de visualisatie beginnen op de startpagina. Dit definieert u onder Starten met.klik op de keuzelijst Start with. Klik op het lijst-item Visualisation Pagina 58 van 75

59 Klik op de knop Visualisation ( ). Pagina 59 van

60 41 Select Klik op het tree item Startpage ( ). Klik op de knop Ok ( ) Pagina 60 van 75

61 42 User U hebt de gebruikersrechten succesvol aangepast. Met Sluiten keert u terug naar het basisoverzicht van het programma Expert. Klik op het menu-item Close ( ). Pagina 61 van

62 43 HS Expert [C:\Dokumente und Einstellungen\ks\Eigene Dateien\HS+FS Experte 2.5\Projekte\Training\Training.hs3] Klik op de knop Save ( ). Klik op de knop Check ( ) Pagina 62 van 75

63 44 Expert 2.5 Klik op de knop OK ( ). Pagina 63 van

64 45 HS Expert [C:\Dokumente und Einstellungen\ks\Eigene Dateien\HS+FS Experte 2.5\Projekte\Training\Training.hs3] Klik op de knop Transfer ( ) Pagina 64 van 75

65 46 Transfer project Klik op de knop Start ( ). Pagina 65 van

66 47 Important Klik op de knop Transfer ( ) Pagina 66 van 75

67 48 Transfer project Klik op de knop Close ( ). Pagina 67 van

68 Klik op het menu-item File ( ). Klik op het menu-item Exit ( ) Pagina 68 van 75

69 49 Electrical installation with Gira: KNX/EIB Instabus, intercom systems, building system technolo - Windows Internet Explorer Voer /opt/hsav-gira/startgast.htm in het veld Adresse in. Met een willekeurige toetsdruk simuleert u het invoeren. Pagina 69 van

70 Klik op de knop ( ) Pagina 70 van 75

71 50 HomeServer AjaxVisu - Windows Internet Explorer In het programma Expert hebt u de gebruikersnaam van de betreffende gebruiker gedefinieerd. Deze gebruiker wordt gebruikt voor de aanmeldprocedure. Voer Admin in het veld User name in. Bij het invoeren van het in het programma Expert toegewezen wachtwoord moet onderscheid worden gemaakt tussen grote en kleine letters. Voer admin in het veld Password in. Pagina 71 van

72 U hebt toegang tot alle in het programma Expert aangemaakt designafmetingen. In ons project dus tot één. De sleutel van het design vindt in het programma Expert onder Stamgegevens/Project/Designs. Ook hier moet onderscheid worden gemaakt tussen grote en kleine letters. Voer GIRA1024 in het veld Design in. De refresh-tijden definiëren de verversingsintervallen in de internetbrowser. In dit voorbeeld in de visualisatie elke 2 seconden. Bij langzamere internettoegang kan refresh-patroon R3 tot R5 worden gebruikt. Omdat dit voorbeeld zich op het intranet bevindt, definieert u R1. Voer R1 in het veld Refresh in Pagina 72 van 75

73 De gegevens gebruikersnaam, design en refresh kunnen worden opgeslagen, zodat nieuwe toegang gemakkelijker is. Klik op het aanvinkvakje Saving information ( ). Klik op de knop ( ). Klik op Ground floor ( ). Hiermee test u de programmering van het openen van uw pagina. Pagina 73 van

74 Klik op Startpage ( ). Met deze klik komt u bij correcte programmering terug op de startpagina. U hebt de visualisatie succesvol geprogrammeerd en getest Pagina 74 van 75

75 Met een willekeurige toets keert u terug naar het cursusoverzicht. Pagina 75 van