Wiki source code of Notifications (9.x)

Last modified by Ecaterina Moraru (Valica) on 2019/03/27 09:03

version	line-number	content
3.3	1	{{toc start="2"/}}
	2
3.4	3	== Overview ==
3.3	4
3.7	5	(% class="row" %)
	6	(((
3.2	7	(% class="col-xs-12 col-md-6" %)
1.3	8	(((
	9	Before
3.2	10	[[[[image:before.png\|\|style="border:1px solid #E8E8E8" width="100%"]]>>attach:before.png]]
1.3	11	)))
	12
3.2	13	(% class="col-xs-12 col-md-6" %)
1.3	14	(((
	15	After
3.2	16	[[[[image:after.png\|\|style="border:1px solid #E8E8E8" width="100%"]]>>attach:after.png]]
1.3	17	)))
3.7	18	)))
3.5	19
	20	== RSS Feed ==
	21
3.7	22	(% class="row" %)
	23	(((
7.8	24	(% class="col-xs-12 col-md-3" %)
3.5	25	(((
7.7	26	* Moving "RSS feed" to Profile Settings
	27	* Having "Clear All" on the same line as "Settings"
8.2	28	* Smaller switches
12.2	29	* Naming: Fixing "Watchlist" label name
7.2	30	)))
	31
	32	(% class="col-xs-6 col-md-3" %)
	33	(((
3.5	34	Before
5.3	35	[[[[image:beforeRSS.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:beforeRSS.png]]
3.5	36	)))
	37
7.2	38	(% class="col-xs-6 col-md-3" %)
3.5	39	(((
	40	After
7.9	41	[[[[image:afterMenu.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:afterMenu.png]]
3.5	42	)))
7.8	43
	44	(% class="col-xs-6 col-md-3" %)
	45	(((
	46	After
	47	[[[[image:afterRSS.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:afterRSS.png]]
3.7	48	)))
7.8	49	)))
8.3	50
	51	== Settings ==
	52
	53	(% class="row" %)
	54	(((
10.2	55	(% class="col-xs-12 col-md-3" %)
8.3	56	(((
12.2	57	* Naming: Using "Settings" over "Preferences"
10.3	58	* Headings consistent with other Profile sections
	59	* Email preferences aligned with Applications email activator
8.3	60	)))
	61
	62	(% class="col-xs-6 col-md-3" %)
	63	(((
	64	Before
8.4	65	[[[[image:beforeSettings.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:beforeSettings.png]]
8.3	66	)))
	67
	68	(% class="col-xs-6 col-md-3" %)
	69	(((
	70	After
8.4	71	[[[[image:afterSettings.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:afterSettings.png]]
8.3	72	)))
	73	)))
10.5	74
10.7	75	=== Applications ===
10.5	76
	77	(% class="row" %)
	78	(((
	79	(% class="col-xs-12 col-md-3" %)
	80	(((
12.2	81	* Naming: Using "Alert" instead of "Notifications menu" in order to be consistent with Filters + shorter
	82	* Shorter, equal length descriptions
	83	* Improved styling for table, having a master-secondary styling instead of odd/even backgrounds
	84	* Better table widths
10.5	85	)))
	86
	87	(% class="col-xs-6 col-md-3" %)
	88	(((
	89	Before
10.8	90	[[[[image:beforeApplications.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:beforeApplications.png]]
10.5	91	)))
	92
	93	(% class="col-xs-6 col-md-3" %)
	94	(((
	95	After
10.8	96	[[[[image:afterApplications.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:afterApplications.png]]
10.5	97	)))
	98	)))
	99
10.7	100	=== Filters ===
10.6	101
10.5	102	(% class="row" %)
	103	(((
	104	(% class="col-xs-12 col-md-3" %)
	105	(((
16.2	106	* Naming: using "Add" instead of "Create"
14.2	107	* Buttons grouped together
	108	* Better styling for the table: removing white borders + using the xform label styling for table headings
10.5	109	)))
	110
	111	(% class="col-xs-6 col-md-3" %)
	112	(((
	113	Before
12.3	114	[[[[image:beforeFilters.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:beforeFilters.png]]
10.5	115	)))
	116
	117	(% class="col-xs-6 col-md-3" %)
	118	(((
	119	After
12.3	120	[[[[image:afterFilters.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:afterFilters.png]]
10.5	121	)))
	122	)))
	123
	124	(% class="row" %)
	125	(((
	126	(% class="col-xs-12 col-md-3" %)
	127	(((
16.2	128	* Naming: shorter buttons labels for "Advanced"
	129	* Naming: "Cancel" instead of "Close"
	130	* Hint put inside the Title
26.5	131	* Fixed select width for livetable
	132	* For "Add" modal, the button label should be "Add" instead of "Save"
10.5	133	)))
	134
	135	(% class="col-xs-6 col-md-3" %)
	136	(((
	137	Before
14.4	138	[[[[image:beforeAdvanced.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:beforeAdvanced.png]]
10.5	139	)))
	140
	141	(% class="col-xs-6 col-md-3" %)
	142	(((
	143	After
14.4	144	[[[[image:afterAdvanced.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:afterAdvanced.png]]
10.5	145	)))
	146	)))
14.3	147
14.4	148	== Events ==
	149
14.3	150	(% class="row" %)
	151	(((
	152	(% class="col-xs-12 col-md-3" %)
	153	(((
25.2	154	* Focus on User, not on App type
25.3	155	* Moved "details" activator to the event actions area
19.2	156	* Replaced App icon with Event icon
25.4	157	* Using ##jodatime## to display relative times
26.6	158	* "See more" now load another 5 items, but in the future we might want to create a special area to display and filter all the launched notifications (that could replace "Activity Stream")
14.3	159	)))
	160
	161	(% class="col-xs-6 col-md-3" %)
	162	(((
	163	Before
17.2	164	[[[[image:beforeEvents.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:beforeEvents.png]]
	165	)))
	166
	167	(% class="col-xs-6 col-md-3" %)
	168	(((
	169	After
	170	[[[[image:afterEvents.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:afterEvents.png]]
	171	)))
	172	)))
	173
	174	(% class="row" %)
	175	(((
	176	(% class="col-xs-12 col-md-3" %)
	177	(((
26.7	178	* Event Unread + Details
19.3	179	)))
	180
	181	(% class="col-xs-6 col-md-3" %)
	182	(((
	183	Before
26.7	184	[[[[image:beforeEventDetails.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:beforeEventDetails.png]]
19.3	185	)))
	186
	187	(% class="col-xs-6 col-md-3" %)
	188	(((
	189	After
26.7	190	[[[[image:afterEventDetails.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:afterEventDetails.png]]
19.3	191	)))
	192	)))
	193
	194	(% class="row" %)
	195	(((
	196	(% class="col-xs-12 col-md-3" %)
	197	(((
26.7	198	* Event Read
17.2	199	)))
	200
	201	(% class="col-xs-6 col-md-3" %)
	202	(((
	203	Before
26.7	204	[[[[image:beforeEventRead.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:beforeEventRead.png]]
14.3	205	)))
	206
	207	(% class="col-xs-6 col-md-3" %)
	208	(((
	209	After
26.7	210	[[[[image:afterEventRead.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:afterEventRead.png]]
14.3	211	)))
	212	)))
17.2	213
	214	(% class="row" %)
	215	(((
26.2	216	(% class="col-xs-12 col-md-3" %)
19.3	217	(((
26.4	218	* Event buttons titles
19.3	219	)))
	220
	221	(% class="col-xs-6 col-md-3" %)
	222	(((
26.2	223	Before
26.3	224	[[[[image:beforeEventTitle.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:beforeEventTitle.png]]
26.2	225	)))
	226
	227	(% class="col-xs-6 col-md-3" %)
	228	(((
19.3	229	After
	230	[[[[image:afterReadTitle.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:afterReadTitle.png]]
	231	)))
	232
	233	(% class="col-xs-6 col-md-3" %)
	234	(((
	235	After
	236	[[[[image:afterDetailsTitle.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:afterDetailsTitle.png]]
	237	)))
	238	)))
	239
43.1	240	=== Event Types ===
	241
19.3	242	(% class="row" %)
	243	(((
17.2	244	(% class="col-xs-12 col-md-3" %)
	245	(((
26.9	246	* Event Type: create
17.2	247	)))
	248
	249	(% class="col-xs-6 col-md-3" %)
	250	(((
	251	Before
26.10	252	[[[[image:beforeCreate.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:beforeCreate.png]]
17.2	253	)))
	254
	255	(% class="col-xs-6 col-md-3" %)
	256	(((
	257	After
26.10	258	[[[[image:afterCreate.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:afterCreate.png]]
17.2	259	)))
	260	)))
	261
	262	(% class="row" %)
	263	(((
	264	(% class="col-xs-12 col-md-3" %)
	265	(((
26.9	266	* Event Type: update
17.2	267	)))
	268
	269	(% class="col-xs-6 col-md-3" %)
	270	(((
	271	Before
26.10	272	[[[[image:beforeUpdate.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:beforeUpdate.png]]
17.2	273	)))
	274
	275	(% class="col-xs-6 col-md-3" %)
	276	(((
	277	After
26.10	278	[[[[image:afterUpdate.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:afterUpdate.png]]
17.2	279	)))
	280	)))
26.8	281
	282	(% class="row" %)
	283	(((
	284	(% class="col-xs-12 col-md-3" %)
	285	(((
26.9	286	* Event Type: delete
26.8	287	)))
	288
	289	(% class="col-xs-6 col-md-3" %)
	290	(((
	291	Before
26.10	292	[[[[image:beforeDelete.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:beforeDelete.png]]
26.8	293	)))
	294
	295	(% class="col-xs-6 col-md-3" %)
	296	(((
	297	After
26.10	298	[[[[image:afterDelete.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:afterDelete.png]]
26.8	299	)))
	300	)))
	301
	302	(% class="row" %)
	303	(((
	304	(% class="col-xs-12 col-md-3" %)
	305	(((
26.9	306	* Event Type: addComment
26.8	307	)))
	308
	309	(% class="col-xs-6 col-md-3" %)
	310	(((
	311	Before
26.10	312	[[[[image:beforeComment.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:beforeComment.png]]
26.8	313	)))
	314
	315	(% class="col-xs-6 col-md-3" %)
	316	(((
	317	After
26.10	318	[[[[image:afterComment.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:afterComment.png]]
26.8	319	)))
	320	)))
	321
	322	(% class="row" %)
	323	(((
	324	(% class="col-xs-12 col-md-3" %)
	325	(((
26.9	326	* Event Type: BlogPostPublishedEvent
26.8	327	)))
	328
	329	(% class="col-xs-6 col-md-3" %)
	330	(((
	331	Before
26.10	332	[[[[image:beforeBlogPublish.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:beforeBlogPublish.png]]
26.8	333	)))
	334
	335	(% class="col-xs-6 col-md-3" %)
	336	(((
	337	After
26.10	338	[[[[image:afterBlogPublish.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:afterBlogPublish.png]]
26.8	339	)))
	340	)))
36.2	341
52.2	342	(% class="row" %)
	343	(((
	344	(% class="col-xs-12 col-md-6" %)
	345	(((
	346	* Composed events
	347	)))
	348
	349	(% class="col-xs-6 col-md-3" %)
	350	(((
52.5	351	After ([[variations>>attach:variations.png]])
52.2	352	[[[[image:var2_dif.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:var2_dif.png]]
	353	)))
52.3	354
	355	(% class="col-xs-6 col-md-3" %)
	356	(((
52.4	357	{{html}} {{/html}}
52.3	358	[[[[image:var2.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:var2.png]]
53.2	359	[[[[image:var2_title.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:var2_title.png]]
52.3	360	)))
53.2	361	)))
52.2	362
41.3	363	=== Examples ===
36.2	364
	365	(% class="row" %)
	366	(((
	367	(% class="col-xs-6 col-md-3" %)
	368	(((
	369	[[[[image:events1.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:events1.png]]
	370	)))
	371
	372	(% class="col-xs-6 col-md-3" %)
	373	(((
41.2	374	[[[[image:events3.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:events3.png]]
36.2	375	)))
	376
	377	(% class="col-xs-6 col-md-3" %)
	378	(((
41.2	379	[[[[image:events4.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:events4.png]]
36.2	380	)))
	381
	382	(% class="col-xs-6 col-md-3" %)
	383	(((
41.2	384	[[[[image:events2.png\|\|style="border:1px solid #E8E8E8" width="auto"]]>>attach:events2.png]]
36.2	385	)))
	386	)))

Wiki source code of Notifications (9.x)

About

About

Support

Platform

User Guide

Admin Guide

Developer Guide

Projects

XWiki

Extensions

Other

Contribute

Status

Practices

Under the Hood

Get Involved

Get Connected