1
00:00:00,570 --> 00:00:01,750
Bon retour.

2
00:00:01,980 --> 00:00:12,020
Donc, dans cette vidéo, nous continuons à utiliser et à mettre en œuvre le flash dans la dernière vidéo que nous avons installée, nous avons parlé un peu de la façon dont il fonctionne que nous utilisons Kinect flash le paquet pour nous aider ici.

3
00:00:12,180 --> 00:00:20,000
L'idée est de nouveau que nous pouvons envoyer un message à travers à l'itinéraire suivant à la demande suivante afin que nous puissions alors l'afficher à l'utilisateur.

4
00:00:20,430 --> 00:00:34,020
Et ce que nous voulons faire maintenant est plutôt que de l'afficher individuellement sur chaque modèle que je n'ai fait qu'une seule fois, mais plutôt que de le faire sur chaque page que nous voulions à vous potentiellement un message d'erreur ou un message de réussite.

5
00:00:34,020 --> 00:00:38,150
Nous allons déplacer ce type de code vers l'en-tête qui est un endroit naturel pour cela.

6
00:00:38,190 --> 00:00:40,710
Je vais donc ouvrir l'en-tête pour commencer.

7
00:00:40,710 --> 00:00:43,450
Ainsi Parshall's E.J ..

8
00:00:44,220 --> 00:00:55,320
Et ce que nous pouvons faire est juste en bas après la barre de navigation, nous pouvons simplement ajouter en H1 et nous pouvons ajouter quelque chose comme message.

9
00:00:55,490 --> 00:00:57,640
Nous allons garder le même nom.

10
00:00:57,660 --> 00:01:07,200
Maintenant, le problème est que le message va fonctionner sur notre excuse me log dans le forum ici où nous passons dans le message.

11
00:01:07,260 --> 00:01:11,740
Mais sur tout autre message d'itinéraire sera indéfini qui va être problématique.

12
00:01:11,900 --> 00:01:13,040
Comme vous pouvez le voir ici.

13
00:01:13,260 --> 00:01:18,170
Donc, si je rafraîchir la page, il fonctionne très bien, mais si j'essaie et aller pour vous inscrire, nous avons un problème.

14
00:01:18,210 --> 00:01:19,550
Le message n'est pas défini.

15
00:01:19,720 --> 00:01:25,290
C'est parce que Sign-Up a le même fichier d'en-tête et message n'a pas été fourni.

16
00:01:25,290 --> 00:01:33,790
Donc, pour résoudre ce problème, lorsque nous nous débarrasserons de cette ligne, nous allons la couper et ne pas la transmettre pour vous connecter individuellement.

17
00:01:33,930 --> 00:01:35,130
Ensuite, je vais aller à l'application.

18
00:01:35,160 --> 00:01:36,230
Oui.

19
00:01:37,110 --> 00:01:45,660
Et juste où nous avons le même code où nous faisons l'utilisateur actuel où nous avons passé l'utilisateur actuel à chaque modèle unique, nous pouvons faire la même chose.

20
00:01:45,900 --> 00:01:56,160
Ou nous pouvons dire rez dot locaux le message est égal à demander une erreur de point de flash ou demander une erreur de flash.

21
00:01:56,520 --> 00:02:01,930
Donc, s'il ya quelque chose dans le flash, nous aurons accès à lui dans le modèle sous message.

22
00:02:02,190 --> 00:02:07,440
Donc, je vais vous montrer que maintenant si je redémarre la première fois si je rafraîchir.

23
00:02:07,440 --> 00:02:08,460
Je ne voyais rien.

24
00:02:08,490 --> 00:02:19,120
Je vais m'inscrire maintenant ça fonctionne et il n'y a rien à éclairer mais si j'essaie de le déclencher de nouveau alors je vais à slash terrains de camp essayant un nouveau je reçois mon message.

25
00:02:19,140 --> 00:02:20,910
S'il vous plait Connectez-vous d'abord.

26
00:02:21,420 --> 00:02:26,370
Permettez-moi de vous montrer que cela fonctionne à chaque page, alors disons quand je me déconnecte.

27
00:02:26,370 --> 00:02:36,510
Donc, si nous allons à la route de déconnexion qui est dans notre je l'ai ouvert, mais je vais juste vous montrer à nouveau les itinéraires index j nous où le déconnexion se produit est ici.

28
00:02:36,510 --> 00:02:41,380
Demandez que déconnecter et puis droit avant que nous redirigions nous pourrions faire quelque chose comme la demande.

29
00:02:41,380 --> 00:02:43,050
Fait-il clignoter.

30
00:02:43,320 --> 00:02:51,820
Et pour l'instant je le garde comme une erreur parce que c'est ce que j'ai mis en place et nous allons juste dire vous déconnecter comme ça.

31
00:02:51,840 --> 00:02:54,360
Maintenant si je redémarre.

32
00:02:55,800 --> 00:03:00,430
Permettez-moi de signer ici tout comme n'importe qui juste faire la loi.

33
00:03:01,470 --> 00:03:04,190
Inscrivez-vous parfait.

34
00:03:04,200 --> 00:03:05,010
Génial.

35
00:03:05,010 --> 00:03:11,830
Maintenant, si je clique sur la loi, je suis déconnecté et si je pouvais de la page, il s'en va.

36
00:03:12,150 --> 00:03:18,830
Donc, nous avons cette interface de cette façon d'envoyer un message à un utilisateur ou un message que nous voulons durer.

37
00:03:18,840 --> 00:03:35,640
Essentiellement, une requête et c'est une demande la dernière réponse et si l'utilisateur rafraîchit ou aller ailleurs, nous ne voulons pas que persister et nous avons que l'affichage sur chaque page parce que nous l'avons dans l'en-tête, nous n'avons pas à Manuellement rendre une variable et passer une variable à travers.

38
00:03:35,640 --> 00:03:36,620
Tout ce que nous avons à faire maintenant.

39
00:03:36,630 --> 00:03:53,250
Chaque fois que nous voulons montrer à un utilisateur une sorte de message avant de les rediriger nous ajoutons simplement dans les demandes pas flash maintenant plutôt que de simplement faire l'erreur chaque fois que je vous ai montré dans la première vidéo que nous aurions une alerte verte ou rouge essentiellement.

40
00:03:53,310 --> 00:03:57,780
Donc, un succès et une erreur et qui est intégré dans bootstrap.

41
00:03:57,780 --> 00:04:15,270
Donc, si vous allez obtenir bootstrap dotcom cliquez sur les composants et puis sur la droite de la barre de navigation vous cliquez sur les alertes, vous pouvez voir que ce sont les alertes qui ressemblent à il ya ces petits messages qui ont des couleurs différentes tout comme les boutons.

42
00:04:15,340 --> 00:04:19,210
Les couleurs sont appelées les mêmes ainsi il ya le succès dans l'avertissement juste et le danger.

43
00:04:19,560 --> 00:04:20,990
Et nous allons utiliser le danger.

44
00:04:21,000 --> 00:04:28,330
Donc, s'il ya une erreur comme vous devez être connecté pour le faire ou le mot de passe est incorrect, nous allons avoir une alerte rouge.

45
00:04:28,740 --> 00:04:44,300
Et si quelque chose de bon se passe comme si quelqu'un s'inscrit nous voulons dire des contrats ou si quelqu'un se déconnecte nous dirons que le succès nous avons déconnecté ou nous pourrions faire quelque chose comme créé avec succès le commentaire que nous voulons nous utiliserons le vert ici qui est Succès.

46
00:04:44,310 --> 00:04:47,900
Donc, ce sont les div div classe et commençons par le danger.

47
00:04:47,910 --> 00:05:04,970
Donc, va copier ce réellement et aller à mon fichier d'en-tête et plutôt que d'afficher un H1 et afficher un div et je vais ajouter un message à l'intérieur si ce div à juste comme ça.

48
00:05:05,280 --> 00:05:07,500
Ce sera donc un changement stylistique.

49
00:05:07,530 --> 00:05:13,120
Donc, si je rafraîchir la page de nouveau remarquer qu'il est là tout d'abord.

50
00:05:13,380 --> 00:05:19,800
Et c'est parce que nous venons de l'ajouter de sorte qu'il n'a pas d'importance s'il n'ya pas de message si elle est vide ou non.

51
00:05:19,860 --> 00:05:26,610
Donc, nous allons corriger cela, mais aussi remarquer que va tout le chemin à travers l'écran qui n'est pas idéal.

52
00:05:26,610 --> 00:05:29,270
Permettez-moi d'ajouter un peu de texte pour vous montrer ce que je veux dire.

53
00:05:32,100 --> 00:05:34,470
Ce n'est pas un grand message pour un utilisateur.

54
00:05:34,710 --> 00:05:41,140
Donc ce que nous allons faire pour le corriger à court terme et ce sera en fait un correctif à long terme aussi bien.

55
00:05:41,160 --> 00:05:51,150
Mais avant de résoudre le problème de la toujours y être, même si il n'ya pas de message, nous allons ajouter dans un autre conteneur et mettre notre alerte dans ce conteneur.

56
00:05:51,540 --> 00:06:03,080
Donc, sur le haut de chaque page si je rafraîchir j'ai maintenant un message, il est vide, mais si je fais quelque chose comme essayer et aller pour ajouter un nouveau terrain de camping, je reçois mon message.

57
00:06:03,120 --> 00:06:04,640
S'il vous plait Connectez-vous d'abord.

58
00:06:04,860 --> 00:06:07,370
Et bien sûr, nous devons encore styliser ce formulaire pour que nous y arrivions.

59
00:06:07,410 --> 00:06:10,550
Mais au moins cela semble relativement fini.

60
00:06:11,040 --> 00:06:12,930
Donc, ça marche très bien.

61
00:06:13,080 --> 00:06:21,690
Mais nous n'avons toujours pas un moyen de différencier entre vert et rouge ou le succès et l'erreur et ce sera vraiment facile pour nous de le faire.

62
00:06:21,690 --> 00:06:32,170
Donc, l'idée est que lorsque nous nous débarrasser de cette forme est que lorsque nous clignons, nous pourrions faire quelque chose comme vous vous déconnecter et nous pourrions vouloir que ce soit le succès.

63
00:06:32,430 --> 00:06:44,810
J'ai donc ajouté dans le succès, mais alors nous pourrions avoir quelque chose comme dans notre middleware que nous avons déjà où nous voulons clignoter jamais où nous voulons un danger rouge boîte de dialogue ou d'alerte de danger.

64
00:06:45,210 --> 00:06:50,460
Donc nous avons ces deux façons et nous pourrions ajouter tout ce que nous pourrions faire info que nous pourrions appeler ce blog.

65
00:06:50,520 --> 00:06:52,940
Ce n'est pas lié à bootstrap inutilement.

66
00:06:52,950 --> 00:06:57,130
C'est exactement ce que nous ajoutons dans le flash sous la clé.

67
00:06:57,450 --> 00:07:11,320
Mais je vais le garder comme erreur et succès alors ce que nous devrions faire est au lieu de son application oui où nous passons ces données pendant la rupture ici nous aurons en fait deux variables différentes.

68
00:07:11,340 --> 00:07:23,860
Donc, un pour l'erreur et maintenant appeler cette erreur redstart local points et puis nous aurons un autre pour le succès juste comme ça.

69
00:07:24,510 --> 00:07:27,970
Nous avons maintenant deux données différentes dans notre modèle.

70
00:07:28,050 --> 00:07:30,450
Les deux seront vides la plupart du temps.

71
00:07:30,450 --> 00:07:31,970
Habituellement, il n'y a rien à afficher.

72
00:07:31,980 --> 00:07:38,200
Mais s'il ya une erreur au lieu de la variable d'erreur, nous pourrons y accéder.

73
00:07:38,370 --> 00:07:44,430
Si nous ajoutons quelque chose à un flash sous le succès pourquoi l'accéder à cette variable d'accès à l'intérieur du modèle.

74
00:07:44,820 --> 00:08:00,370
Donc, maintenant allons à notre modèle pour un en-tête et juste dupliquer ce sauf au lieu d'alerter danger fera alerte succès et plutôt que le message qui n'existe pas plus aura erreur ici et le succès.

75
00:08:00,390 --> 00:08:02,140
Ce sont les deux variables redéfinies.

76
00:08:02,370 --> 00:08:09,440
Si je rafraîchis maintenant, nous aurons une bande rouge et verte comme vous pouvez le voir.

77
00:08:09,780 --> 00:08:20,020
Et si j'essaie et que nous allons à slash terrains de camping et d'obtenir une erreur, vous pouvez le voir seulement apparaît dans ce rouge.

78
00:08:20,610 --> 00:08:32,350
Et puis, si je fais quelque chose comme s'inscrire avec quelques jibberish et puis je vais me déconnecter, vous pouvez voir qu'il apparaît dans la section verte.

79
00:08:32,880 --> 00:08:36,920
Donc, ce que nous avons fait là est juste différencié entre deux types différents de messages.

80
00:08:36,930 --> 00:08:40,910
Et nous pourrions ajouter autant que nous voulons, donc il n'y a pas de règles.

81
00:08:41,400 --> 00:08:45,110
Si nous voulons utiliser bootstrap si nous voulons aller avec ces différentes classes.

82
00:08:45,750 --> 00:08:57,570
Mais en ce qui concerne notre propre classification, nous pouvons mettre tout ce que nous voulons pour que nous puissions avoir si nous revenons ici où nous faisons le flash que nous pourrions posséder quelque chose que nous mettons ici plutôt que le succès.

83
00:08:57,750 --> 00:08:59,730
Mais je suis coller avec succès et erreur.

84
00:09:00,090 --> 00:09:06,340
Maintenant, nous allons aborder la question de ces deux boîtes les alertes étant toujours là même si elles sont vides.

85
00:09:06,480 --> 00:09:16,300
Ce que nous devons faire est d'aller dans notre fichier d'en-tête et ajouter une déclaration if avec notre Ejay Oui nous aurons si.

86
00:09:16,480 --> 00:09:25,160
Et laissez-moi juste ajouter dans les crochets pour commencer et nous ferons un pour l'erreur juste comme cela.

87
00:09:25,230 --> 00:09:27,980
Pas dans notre déclaration de SI là-bas.

88
00:09:28,680 --> 00:09:32,910
Dans notre groupe de clôture, nous allons commencer par celui-ci.

89
00:09:32,910 --> 00:09:39,450
Donc, ce que nous allons faire est de vérifier s'il ya une erreur et il doit vraiment ressembler à cela.

90
00:09:39,450 --> 00:09:46,880
Donc, si erreur et longueur d'erreur est supérieure à zéro.

91
00:09:47,700 --> 00:09:57,800
Et la raison pour cela est juste d'avoir l'erreur existent n'est pas assez pour nous de vouloir afficher l'erreur.

92
00:09:57,810 --> 00:10:00,290
Par exemple, l'erreur est vide.

93
00:10:00,300 --> 00:10:06,920
Il n'y a pas de texte là-dedans il n'y a pas de chaîne, mais ce n'est pas indéfini, mais il est toujours visible ici.

94
00:10:07,290 --> 00:10:11,440
Donc, ce que nous voulons faire est de vérifier si la longueur du point d'erreur est supérieure à zéro.

95
00:10:11,760 --> 00:10:17,660
Parce que même lorsque l'erreur est vide quand il n'y a rien là-dedans il est toujours un tableau vide.

96
00:10:18,060 --> 00:10:22,610
Et si nous vérifions s'il y a un tableau vide qui n'est pas falsie.

97
00:10:22,650 --> 00:10:24,160
Encore une fois, je pourrais vous montrer cela ici.

98
00:10:24,330 --> 00:10:26,480
Nous avons fait quelque chose comme ça.

99
00:10:26,610 --> 00:10:34,400
Beaucoup de choses là si le tableau vide.

100
00:10:34,910 --> 00:10:37,700
Ce journal rien.

101
00:10:38,350 --> 00:10:41,510
Si je frappe entrer je obtenir que vient avec ce journal.

102
00:10:41,730 --> 00:10:46,210
Et c'est parce qu'un tableau vide est véridique.

103
00:10:46,260 --> 00:10:53,250
Donc, là où nous vérifions si l'erreur existe à tous, il pourrait toujours être un tableau vide que la plupart du temps, il est.

104
00:10:53,250 --> 00:10:55,490
Donc, c'est vraiment juste vérifier pour s'assurer.

105
00:10:55,560 --> 00:11:00,110
Comme disons que nous n'avions pas ce code du tout dans notre SJS.

106
00:11:01,110 --> 00:11:01,920
Où es-tu.

107
00:11:01,920 --> 00:11:07,030
Ici nous allons si nous n'avions pas cela du tout alors l'erreur et le succès serait indéfini.

108
00:11:07,410 --> 00:11:09,710
Et cette ligne de code permettrait juste d'éviter une erreur.

109
00:11:09,720 --> 00:11:13,920
Mais c'est en fait la partie la plus importante pour vérifier s'il ya quelque chose dans le tableau.

110
00:11:13,950 --> 00:11:26,740
Donc, si il ya quelque chose dans le tableau si la longueur est supérieure à zéro, puis afficher ce et nous allons faire exactement la même chose ici, sauf plutôt que d'erreur.

111
00:11:26,800 --> 00:11:33,140
Vérifiez bien au lieu de succès si nous avons besoin de notre accolade de fermeture ainsi.

112
00:11:34,320 --> 00:11:34,800
D'accord.

113
00:11:34,800 --> 00:11:40,550
Alors essayons ceci ou allumons ceci redémarrez le serveur rafraîchir la page.

114
00:11:40,650 --> 00:11:41,900
Nous ne voyons rien.

115
00:11:42,360 --> 00:11:44,020
Essayons d'ajouter un nouveau terrain de camping.

116
00:11:44,460 --> 00:11:47,720
Je reçois mon message lu Veuillez vous connecter en premier.

117
00:11:47,910 --> 00:11:53,070
Inscrivez-vous maintenant.

118
00:11:53,100 --> 00:11:57,660
Maintenant, si je me déconnecte, je reçois mon message vert vous déconnecter.

119
00:11:57,810 --> 00:11:58,420
Génial.

120
00:11:58,470 --> 00:12:07,040
Donc, tout ce que nous avons laissé vraiment est d'aller maintenant et d'ajouter dans les messages corrects appeler la demande en flash dans les endroits appropriés.
