Commit graph

52 commits

Author SHA1 Message Date
bsitu 67bcecff5d Notification overlay is partially hidden in RTL language
bug: 55629
Change-Id: I820386379fbea64fb88cfc1a1966ee08680f5c59
2013-10-11 19:06:58 +00:00
jenkins-bot 7591f85e43 Merge "Make items on notifications flyout behave like links" 2013-09-05 17:22:37 +00:00
bsitu 37812cd058 Long text content should wrap in overlay footer links
Bug: 53111
Change-Id: I15865a9808b342e52d2d03e9a3ec8bd2bc8312d0
2013-08-23 12:59:56 -07:00
MatmaRex 6cade7eba3 Make items on notifications flyout behave like links
We want the notifications in the flyout to behave just like links,
including standard middle-click and Ctrl-click behavior. The simplest
way to do that would be to actually make them links - but the area can
contain a few other links, so we can't do that and have to resort to
ugly hacks.

Or do we?

Turns out that while browsers won't accept HTML containing nested <a>
tags[1], such a structure is valid XHTML, and it's possible to create
such structure in HTML mode using DOM manipulation. It works like one
would expect: the entire thing is clickable, but inner <a> tags' hrefs
override outer ones.

Firefox even had a request to make that work[2] which was happily
fulfilled.

Tested the basic case [see below] on Firefox 22, Opera 12, Opera 15
(which uses the Blink engine like Chrome), IE 8 and IE 6 and it works
the same on all of them. Tested the XHTML variant [see below] on all
of the above except for the IEs which don't grok XHTML and it exhibits
the same behavior.

[1] Simple test: $('<div>1<a>2<a>3</a>4</a>5</div>').html() is
    "1<a>2</a><a>3</a>45", not actually "1<a>2<a>3</a>4</a>5" like one
    might expect.
[2] https://bugzilla.mozilla.org/show_bug.cgi?id=331959

----

The test cases used are below. When trying out the XHTML one make sure
that the browser uses application/xhtml+xml MIME type; saving the file
with .xhtml extension should be enough.

XHTML:
  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  <html xmlns="http://www.w3.org/1999/xhtml">
  <body>
  <div>1<a href="http://google.com/">2<a href="http://example.com/">3</a>4</a>5</div>
  </body>
  </html>

HTML:
  <!DOCTYPE html>
  <html>
  <body>
  <script type="text/javascript">
  var div = document.createElement('div');
  var a1 = document.createElement('a');
  a1.href = "http://google.com/";
  var a2 = document.createElement('a');
  a2.href = "http://example.com/";

  div.appendChild( document.createTextNode('1') );
  div.appendChild( a1 );
  a1.appendChild( document.createTextNode('2') );
  a1.appendChild( a2 );
  a2.appendChild( document.createTextNode('3') );
  a1.appendChild( document.createTextNode('4') );
  div.appendChild( document.createTextNode('5') );

  document.body.appendChild(div);
  </script>
  </body>
  </html>

----

Bug: 52319
Change-Id: I311eca70f025ce92129c828cd88f96686b7cff72
2013-08-06 13:23:33 +00:00
bsitu 372b5f2f28 (bug 52225) Some javascript and css fix for IE7
1. clone() breaks the flyout layout in IE7
2. inline-block needs some adjustment for IE7

Change-Id: I014318aacb15000f132c4e4af74f5ea40a064712
2013-07-29 12:52:29 -07:00
Timo Tijhof 467cb69645 Remove override of skin behaviour for inline anchor's text-decoration
Bug: 51617
Change-Id: Iea2d960e5d41420611e6eb8f6e1a9e9d58d6dce0
2013-07-18 15:42:08 +00:00
kaldari 972e14672f New primary and secondary link behavior for Echo
See https://www.mediawiki.org/wiki/Echo/Feature_requirements#Flyout
and https://www.mediawiki.org/wiki/Echo/Feature_requirements#HTML_single_email_notifications

Also includes some related style changes per Vibha

Also removing feedback link from overlay since it's no longer needed

Change-Id: I94aed697e87126ed8ad6d1d416c99bafaa53ac53
2013-06-27 16:12:16 -07:00
Derk-Jan Hartman c638d44190 Echo: Better support for non-default skins, as well as no Javascript
This provides some rudimentary styling support to make Echo usable
with the Modern skin.
It also fixes the Notifications special page so it is styled
correctly in Modern, CologneBlue, or with Javascript turned off.
Also some more tweaks for Monobook skin.
Retiring the 'feedback' link from the special page, per PM.

Bug: 47932
Change-Id: I633a93a78f5a78d0642a3a059fa6f7208f99cec4
2013-06-07 11:36:19 -07:00
kaldari f9481040d5 Switch to using our own badge instead of jQuery.badge
With this change we will no longer be relying on JS for the badge
functionality. This will prevent the flash of unstyled content,
and allow wikis to locally override the styling (since the unread
class is now applied immediately).

I also went ahead and made the badge styling more closely match the
talk page message alert styling per Vibha.

Also removed the old full link optional behavior since we weren't
using it, and it would have been a pain to maintain.

Bug: 48165
Bug: 48001
Change-Id: Ie85d66afd5181d487d0bb2776ae14b121ea50d88
2013-05-23 10:34:47 -07:00
bsitu 97e5e0a92b (bug 48304) Add 'Feedback' link to the Notifications flyout
Change-Id: I86e7b5e6762557743752e433a6e2a007596b1891
2013-05-09 16:13:38 -07:00
kaldari 509f7bccc3 Merge "Make sure footer links don't break in Chrome when zooming" 2013-04-30 22:30:39 +00:00
kaldari 4d03af1d9a Merge "Making sure Echo flyout appears above CentralNotice content" 2013-04-30 22:29:22 +00:00
kaldari a61592465e Make sure footer links don't break in Chrome when zooming
Bug: 47897
Change-Id: I05041231b69035c12b0898176eb37d311186043d
2013-04-30 14:21:18 -07:00
kaldari 888d2c1239 Making sure Echo flyout appears above CentralNotice content
Bug: 47896
Change-Id: Ife534c013fc2a643043fb495cdaafd57fee7b7de
2013-04-30 13:51:16 -07:00
kaldari cd7ef2a52d Making sure moreinfo id is unique on archive page
Also adjusting position by 1 pixel!

Bug: 47889
Change-Id: I6e3dee7b5ce16c5de8ee564383d353a032623d25
2013-04-30 12:33:59 -07:00
kaldari 5ad9f2a96e More fixes for Monobook and adding a missing message key
Bug: 47652
Change-Id: I3199af6aef0ceab2380fb1de7b74cc21541e2886
2013-04-26 16:58:03 -07:00
kaldari 35797064c4 Hedging my bets
Making monobook's text-transform not apply to notification flyout.
Unfortunately, 2 overrides are needed since the monobook selector
is applied weakly to the overlay in general (as an inherited style)
and strongly to the notifications themselves (since they're in a ul)

Bug: 47652
Change-Id: I2600b5836ea7bca59d9089d8bb7e69a6aaeca6a4
2013-04-26 14:52:44 -07:00
jenkins-bot 9a6a74208c Merge "Override text color for monobook skin." 2013-04-26 21:19:38 +00:00
kaldari c52cc48aed Override text color for monobook skin.
Bug: 47652
Change-Id: I29562fa75ec4af1128f69865d0500fc13a92eec8
2013-04-26 14:00:59 -07:00
kaldari b3391e42ff Only the 'Notifications' part of the header should be bold
When there are more new notifications than can fit in the overly
it shows a message in the header alerting the user. This message
should be in regular text, while 'Notifications' should stay bold.

Changed per Fabrice.

Change-Id: I21dc0ed516e5656c6d1965970d7a5f313e317aa9
2013-04-24 21:51:27 -07:00
kaldari 24b00328b6 Adding help button to flyout. Fixing ID name per conventions.
Change-Id: Id7243ba8e8599e1413203f951e96b73e2a6ceb9c
2013-04-24 21:36:03 -07:00
kaldari 9448c6cab0 Add 'Mark all as read' button to overlay
Button is only shown if there are more unread notifications than
fit in the overlay.

To avoid performance issues, this version only works for cases where
the number of unread notifications is less than the maximum count
(99 currently). Otherwise the button to mark all as read isn't
displayed (it's also limited on the server-side for good measure).

Bug: 47092
Change-Id: Ifcb0a436e2b31062741c441cca239d35ddefa0e1
2013-04-18 00:29:36 -07:00
kaldari d6fa2b4851 Lots of UI changes per Vibha
Changing highlighting behavior for archive. Now unread notifications
are highlighted with bold text in the archive rather than with a
background color.

Bug: 47149
Change-Id: I03b2a2968db6d067041c2618c5b4f878d8dc548f
2013-04-15 16:39:01 -07:00
nischayn22 f7c0a803ac RTL tweak for "All notifications" and "Preferences"
Some thanks to the following blog post
http://snook.ca/archives/html_and_css/background-position-x-y

Tested on Chrome and FF latest. Please test on more browsers!

Bug: 46215
Change-Id: I0b92b04f3a48dbd85c7e871a75a6973ea9760367
2013-04-11 10:27:31 +05:30
jenkins-bot ed6950d854 Merge "Making some changes to the flyout links per Vibha" 2013-04-03 11:33:47 +00:00
kaldari 47f720b81b Making some changes to the flyout links per Vibha
Entire link areas should be clickable

No longer a need for conditional link to archive

Change-Id: If4954f7da91ed823e7714cccb541e4f2e64b16b1
2013-04-02 17:47:40 -07:00
jenkins-bot 7fcaf9b57e Merge "A bunch of Echo style tweaks per Vibha" 2013-03-28 17:20:50 +00:00
kaldari 5b10fdf14b A bunch of Echo style tweaks per Vibha
Change-Id: I1317b1dd670c8f7a33b62bb7d86a6d25d841c6a1
2013-03-26 18:03:46 -07:00
kaldari da331a5bbc Fixing text alignment of Echo flyout in Monobook skin
Change-Id: I43a0560dcc6550ac01445755cf0f000018fc2e34
2013-03-26 14:34:14 -07:00
Kaldari 98f4b2cc06 CSS tweak to line everything up.
Change-Id: I63af4e9106082d77f7cd6fa42fc0be95843f1214
2013-03-19 17:27:59 -07:00
Kaldari 28fa282a65 Fixing issue with RTL display of badge and pokey
Change-Id: I49ab97ef062fd9a58da80ff0f5fbd21a72770855
2013-03-14 10:41:59 -07:00
Kaldari 1f88af134b Echo style tweaks per Vibha
Change-Id: I4111092e32213b50ccb0e8dee849a2edfb645827
2013-03-07 10:40:54 -08:00
Kaldari 16331eab92 Adding dismiss functionality to flyout overlay.
Change-Id: Ibfbdb2a9f170e1d9b30b50e8639aee25101e71d6
2013-02-14 11:01:03 -08:00
Kaldari d0ddc2a3eb Fixing unread state for flyout - CSS tweak
Change-Id: I08bae800758247bc01abeeb59cb4a2873f37b964
2013-02-11 12:05:55 -08:00
Kaldari 17cbe366c1 Docking overley to notifications link rather than side of window
Also adding okie dokie pokey

Change-Id: I7d37c2bfa622746d7f153653988c1eb800d0c261
2013-01-10 16:33:11 -08:00
Kaldari 486813026d (bug 43432) Dock links bar at bottom of Echo flyout
Change-Id: I79d76929746b6ee7a788e1b4e363425781d5687e
2013-01-03 19:04:15 +00:00
Kaldari 69e4d5f9a2 More formatting tweaks per Vibha
Change-Id: Id8c536fabe2151031eeafba697c16e0141710741
2013-01-01 01:28:11 +00:00
Krenair da58d50b5b (bug 43431) Link the flyout title
Change-Id: I7bad541ee1f05f9135fd1ba23aecab7e864d8652
2012-12-27 16:50:00 +00:00
Kaldari d42b1db8cc Reworking overlay for edge cases - no notifications, or too many to show at once.
Change-Id: I6af535bf35c5594ed0c4dfad92defffff8b0e02e
2012-12-17 18:40:07 -08:00
Kaldari 65255f7c6b Formatting for Special:Notifications
Change-Id: I891542bf8b6a883e7ff9f78d2b33ddd61c345aa7
2012-12-13 14:08:20 -08:00
Kaldari f519bca628 More formatting work on the overlay and base files
Change-Id: I8512c317d6c0a3db9e3fd0aa2b58a87f8f276b45
2012-12-10 18:02:19 -08:00
Kaldari ae7d11c40f Formatting work on overlay
Change-Id: I84a8d8e8259da65b922170b9a63150d0039dfb20
2012-12-07 12:04:19 -08:00
Kaldari f07d3f6e7a Redoing the notification icons and changing some formatting
Change-Id: Ida189fc267554f52d3da32d71ea6faf0d9b457f5
2012-11-26 13:23:03 -08:00
Kaldari baec4f2aaf A couple CSS tweaks to eliminate overlap and make sure all link is visible
Change-Id: I83542304d6b10d6cdd67d42bd3abd226ca3d687d
2012-11-06 17:38:01 -08:00
bsitu 15e4719105 Add max-height to notification overlay
patch set 2: change the notification overlay height from 0.5 to 0.75 of window height

Change-Id: I3ad4192085bf77009fb2c3ab5d27223e0bee0c32
2012-11-02 15:11:21 -07:00
Siebrand Mazeland 69d91fa1b6 Update documentation and deprecated methods.
Basically having fun with the code analyzer.

Also:
* remove unused local variable assignments
* missing return values
* CSS optimizations.
* Initialize possible unset variables.

Change-Id: I77aa08ecb48eeda08f14dc38d7f35d57ea9fa110
2012-09-02 11:30:38 +02:00
Siebrand Mazeland 950f74eba8 Follow-up I2c10cb69: Auto-formatted using IDE.
Change-Id: Iedeaca3c31195a5cf7df8dd38d6332cfabffcc67
2012-08-31 23:50:46 +02:00
Andrew Garrett 2378a39950 Echo: A few adjustments based on feedback from Ryan Kaldari and Benny Situ.
Change-Id: If430c02793a1843253ccc18512075befc99a3eb6
2012-08-01 15:08:58 -07:00
Andrew Garrett 0699d8f402 Formatting updates for Echo.
First implementation of "two line" formatting.
Messages have a title and optional content.

Distinguishing writing on "your talk page" from another talk page in messages.

Change-Id: I9051e4bfb66d1c25c1bf68ec092b52fd90544336
2012-08-01 10:37:17 -07:00
Andrew Garrett 4f2d7b933e Echo: Use red badges instead of putting the number of new notifications in text.
Depends on refactoring from efb463c

Change-Id: Iba09f46abaf337ea2578ace9d22592a71970c64b
2012-07-31 14:27:51 -07:00