SamanthaNguyen has uploaded a new change for review. ( 
https://gerrit.wikimedia.org/r/401429 )

Change subject: Move styles for UserProfilePage modules into their own 
ResourceLoader modules
......................................................................

Move styles for UserProfilePage modules into their own ResourceLoader modules

Modules can be enabled conditionally (toggled on or off), so it makes
sense to separate these styles into their own respective ResourceLoader
modules. This allows less overhead, and means styles aren't being unused.

The following ResourceLoader modules have been introduced:
 - ext.socialprofile.userprofile.module.casualgames.css
 - ext.socialprofile.userprofile.module.fanboxes.css
 - ext.socialprofile.userprofile.module.picturegame.css
 - ext.socialprofile.userprofile.module.relationships.css
 - ext.socialprofile.userprofile.module.useractivity.css
 - ext.socialprofile.userprofile.module.userboard.css

Styles are being shared between the gifts + awards module, as well
as styles between custom + personal info modules. For this reason,
separate ResourceLoader modules have *not* been introduced for these
UserProfilePage modules respectively, and will (for now) stay in
UserProfile.css. However, this step is at least better than the current
status quo.

MIGRATION: Styles for the User Articles profile module, SportsTeams modules (
favorite team and latest thought profile modules) have been migrated
to BlogPage and SportsTeams respectively, to keep code more contained.

NOTE: UserProfilePage is a mess, and these custom extension
modules should definitely be in their respective extensions. This will
be taken care of in a future refactoring patch to create a
UserProfileModule class to allow creation of these more object-oriented
and dynamic, similar to how SpecialPage(s) are created.

Change-Id: Ida3e844ff41ce66ed6945dce5dc98381e6c74bd6
---
M UserProfile/UserProfile.css
M UserProfile/UserProfile.php
M UserProfile/UserProfilePage.php
A UserProfile/ext.socialprofile.userprofile.module.casualgames.css
A UserProfile/ext.socialprofile.userprofile.module.fanboxes.css
A UserProfile/ext.socialprofile.userprofile.module.picturegame.css
A UserProfile/ext.socialprofile.userprofile.module.relationships.css
A UserProfile/ext.socialprofile.userprofile.module.useractivity.css
A UserProfile/ext.socialprofile.userprofile.module.userboard.css
9 files changed, 265 insertions(+), 317 deletions(-)


  git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/SocialProfile 
refs/changes/29/401429/1

diff --git a/UserProfile/UserProfile.css b/UserProfile/UserProfile.css
index 94ce95c..cd638d3 100644
--- a/UserProfile/UserProfile.css
+++ b/UserProfile/UserProfile.css
@@ -161,147 +161,7 @@
        margin: 0 6px;
 }
 
-/* User-Relationship */
-.user-relationship-container {
-       padding: 0 0 25px 0;
-}
-
-.user-relationship-container a {
-       text-decoration: none;
-       float: left;
-       margin: 5px 10px 0 0;
-       display: block;
-}
-
-.user-relationship-container img {
-       background-color: #fff;
-       border: 1px solid #dcdcdc;
-       padding: 3px;
-}
-
-/* User Gift / User Awards */
-.user-gift-container {
-       padding: 0 0 25px 0;
-}
-
-.user-gift-container a {
-       text-decoration: none;
-       display: block;
-       float: left;
-       margin: 5px 10px 0 0;
-}
-
-.user-gift-container img {
-       background-color: #fff;
-       border: 1px solid #dcdcdc;
-       padding: 3px;
-}
-
-/* Fanboxes */
-.user-fanbox-container {
-       padding: 0 0 25px 0;
-}
-
-/* User Activity */
-.activity-item {
-       border-bottom: 1px solid #dcdcdc;
-       padding: 7px 0;
-}
-
-.activity-item-bottom {
-       padding: 7px 0 0 0;
-}
-
-.activity-item img, .activity-item-bottom img {
-       vertical-align: middle;
-       margin: 0 5px 0 0;
-}
-
-.activity-item a, .activity-item-bottom a {
-       text-decoration: none;
-}
-
-.item {
-       color: #666;
-       margin: 5px 25px;
-}
-
-.item a {
-       font-weight: 700;
-}
-
-#recent-all {
-       padding: 0 0 25px 0;
-}
-
-/* Message Board */
-#user-page-board {
-       margin: 5px 0 10px 0;
-}
-
-.user-page-message-form {
-       margin: 5px 0 15px 0;
-       font-weight: 700;
-}
-
-.user-board-message {
-       border: 1px solid #e2e2e2;
-       margin: 0 0 15px 0;
-}
-
-.user-board-message-from {
-       background-color: #F8F5F5;
-       padding: 3px 0 5px 5px;
-}
-
-.user-board-message-from a {
-       font-size: 14px;
-       font-weight: 700;
-       text-decoration: none;
-}
-
-.user-board-message-content {
-       padding: 5px;
-}
-
-.user-board-message-time {
-       color: #797979;
-       font-size: 11px;
-       margin: 2px 0 0 5px;
-}
-
-.user-board-message-image {
-       float: left;
-       padding: 0 10px 5px 0;
-}
-
-.user-board-message-image img {
-       border: 1px solid #dcdcdc;
-}
-
-.user-board-message-body {
-       margin: 0 10px 0 0;
-}
-
-.user-board-message-body p {
-       margin: 0 !important;
-}
-
-.user-board-message-links {
-       padding: 0 0 5px 5px;
-}
-
-.user-board-message-links a {
-       font-size: 11px;
-       text-decoration: none;
-       margin: 0 10px 0 0;
-}
-
-.user-board-red a {
-       color: #f00;
-}
-
-/* Profile Data */
+/* Styles for custom + personal info modules */
 .profile-info-container {
        padding: 0 0 17px 0;
 }
@@ -320,189 +180,20 @@
        margin: 0 5px 0 0 !important;
 }
 
-/* Casual Games */
-.casual-game-container {
-       padding: 0 0 18px 0;
+/* Styles for user gifts + awards modules */
+.user-gift-container {
+       padding: 0 0 25px 0;
 }
 
-.casual-game-container p {
-       border-top: 1px solid #dcdcdc;
-       padding: 7px 0 !important;
-       margin: 0 !important;
-}
-
-.casual-game-container .item-top {
-       border: 0;
-}
-
-.casual-game-container a {
-       font-weight: 700;
+.user-gift-container a {
        text-decoration: none;
-}
-
-.casual-game-container .item-type {
-       font-size: 9px;
-       margin: 0 0 0 6px;
-}
-
-.casual-game-container img {
-       border: 1px solid #dcdcdc;
-       padding: 3px;
-       background-color: #fff;
-       vertical-align: middle;
-       margin: 0 3px 0 0;
-}
-
-/* User Articles */
-.user-articles-container {
-       padding: 0 0 23px 0;
-}
-
-.article-item {
-       margin: 0;
-       padding: 7px 0 2px 0;
-       border-top: 1px solid #dcdcdc;
-}
-
-.user-articles-container a {
-       text-decoration: none;
-       font-weight: 700;
-}
-
-.article-item-top {
-       margin: 0;
-       padding: 7px 0 2px 0;
-       border: none;
-}
-
-.number-of-votes {
-       margin: 0 10px 3px 0;
-       text-align: center;
-       float: left;
-       width: 25px;
-}
-
-.vote-number {
-       background-color: #89c46f;
-       color: #fff;
-       font-size: 12px !important;
-       margin: 0 0 2px 0;
-       font-weight: 700;
-       height: 25px;
-       line-height: 25px;
-}
-
-.vote-text {
-       color: #777;
-       font-size: 9px;
-       line-height: 9px;
-       margin: -1px 0 0 0;
-}
-
-/* Pictures */
-.picture-container-spacer {
-       height: 25px;
-       width: 100%;
-}
-
-.picture-container .mini-image {
+       display: block;
        float: left;
        margin: 5px 10px 0 0;
 }
 
-.picture-container img {
+.user-gift-container img {
        background-color: #fff;
        border: 1px solid #dcdcdc;
        padding: 3px;
-}
-
-.picture-container a {
-       text-decoration: none;
-}
-
-.upload-container {
-       clear: left;
-       height: 90px;
-       margin-left: -5px;
-}
-
-.upload-frame-errors {
-       margin: 10px 0 5px 0;
-       color: #f00;
-       font-size: 14px;
-       font-weight: 700;
-}
-
-.no-pictures-container {
-       background-color: #eff3f0;
-       color: #777;
-       padding: 20px;
-       margin: 10px 0 0;
-       text-align: center;
-}
-
-.upload-frame-errors {
-       display: none;
-}
-
-.imageUpload-frame {
-       height: 90px;
-       width: 425px;
-}
-
-/* Sports Networks */
-.network-container {
-       padding: 0 0 22px 0;
-}
-
-.network {
-       margin: 0 0 3px 0;
-}
-
-.network img {
-       margin: 0 5px 0 0;
-       vertical-align: middle;
-}
-
-.network a {
-       text-decoration: none;
-}
-
-.status-message-add a {
-       color: #999;
-       font-size: 10px;
-}
-
-.status-update-box {
-       margin: 10px 0;
-}
-
-#status-text input {
-       font-size: 10px;
-       width: 200px;
-}
-
-/* Status */
-.status-container {
-       padding: 0 0 20px 0;
-}
-
-.status-message img {
-       vertical-align: middle;
-       margin: 0 5px 0 0;
-}
-
-.user-status-date {
-       color: #999;
-       font-size: 9px;
-       margin: 0 6px 0 0;
-}
-
-.user-status-profile-vote {
-       color: #666;
-}
-
-.user-status-profile-vote a {
-       font-size: 9px;
-       text-decoration: none;
-}
+}
\ No newline at end of file
diff --git a/UserProfile/UserProfile.php b/UserProfile/UserProfile.php
index 914a8d2..2ad9968 100644
--- a/UserProfile/UserProfile.php
+++ b/UserProfile/UserProfile.php
@@ -86,6 +86,49 @@
        'remoteExtPath' => 'SocialProfile/UserProfile',
 );
 
+// Styles for UserProfilePage modules
+$wgResourceModules['ext.socialprofile.userprofile.module.casualgames.css'] = 
array(
+       'styles' => 'ext.socialprofile.userprofile.module.casualgames.css',
+       'localBasePath' => __DIR__,
+       'remoteExtPath' => 'SocialProfile/UserProfile',
+       'position' => 'top'
+);
+
+$wgResourceModules['ext.socialprofile.userprofile.module.fanboxes.css'] = 
array(
+       'styles' => 'ext.socialprofile.userprofile.module.fanboxes.css',
+       'localBasePath' => __DIR__,
+       'remoteExtPath' => 'SocialProfile/UserProfile',
+       'position' => 'top'
+);
+
+$wgResourceModules['ext.socialprofile.userprofile.module.picturegame.css'] = 
array(
+       'styles' => 'ext.socialprofile.userprofile.module.picturegame.css',
+       'localBasePath' => __DIR__,
+       'remoteExtPath' => 'SocialProfile/UserProfile',
+       'position' => 'top'
+);
+
+$wgResourceModules['ext.socialprofile.userprofile.module.relationships.css'] = 
array(
+       'styles' => 'ext.socialprofile.userprofile.module.relationships.css',
+       'localBasePath' => __DIR__,
+       'remoteExtPath' => 'SocialProfile/UserProfile',
+       'position' => 'top'
+);
+
+$wgResourceModules['ext.socialprofile.userprofile.module.useractivity.css'] = 
array(
+       'styles' => 'ext.socialprofile.userprofile.module.useractivity.css',
+       'localBasePath' => __DIR__,
+       'remoteExtPath' => 'SocialProfile/UserProfile',
+       'position' => 'top'
+);
+
+$wgResourceModules['ext.socialprofile.userprofile.module.userboard.css'] = 
array(
+       'styles' => 'ext.socialprofile.userprofile.module.userboard.css',
+       'localBasePath' => __DIR__,
+       'remoteExtPath' => 'SocialProfile/UserProfile',
+       'position' => 'top'
+);
+
 // Modules for Special:EditProfile/Special:UpdateProfile
 $wgResourceModules['ext.userProfile.updateProfile'] = array(
        'scripts' => 'UpdateProfile.js',
diff --git a/UserProfile/UserProfilePage.php b/UserProfile/UserProfilePage.php
index 53a5b75..7b268fa 100644
--- a/UserProfile/UserProfilePage.php
+++ b/UserProfile/UserProfilePage.php
@@ -392,11 +392,16 @@
        function getCasualGames( $user_id, $user_name ) {
                global $wgUserProfileDisplay;
 
+               $context = $this->getContext();
+               $out = $context->getOutput();
+
                if ( $wgUserProfileDisplay['games'] == false ) {
                        return '';
                }
 
                $output = '';
+
+               $out->addModuleStyles( 
'ext.socialprofile.userprofile.module.casualgames.css' );                
 
                // Safe titles
                $quiz_title = SpecialPage::getTitleFor( 'QuizGameHome' );
@@ -482,6 +487,7 @@
 
                                if ( $item['type'] == 'Picture Game' ) {
                                        if( $item['img1'] != '' && 
$item['img2'] != '' ) {
+                                               $out->addModuleStyles( 
'ext.socialprofile.userprofile.module.picturegame.css' );
                                                $image_1 = $image_2 = '';
                                                $render_1 = wfFindFile( 
$item['img1'] );
                                                if ( is_object( $render_1 ) ) {
@@ -1116,6 +1122,9 @@
        function getRelationships( $user_name, $rel_type ) {
                global $wgMemc, $wgUserProfileDisplay, $wgLang;
 
+               $context = $this->getContext();
+               $out = $context->getOutput();
+
                // If not enabled in site settings, don't display
                if ( $rel_type == 1 ) {
                        if ( $wgUserProfileDisplay['friends'] == false ) {
@@ -1128,6 +1137,8 @@
                }
 
                $output = ''; // Prevent E_NOTICE
+
+               $out->addModuleStyles( 
'ext.socialprofile.userprofile.module.relationships.css' );
 
                $count = 4;
                $rel = new UserRelationship( $user_name );
@@ -1215,12 +1226,17 @@
        function getActivity( $user_name ) {
                global $wgUserProfileDisplay, $wgExtensionAssetsPath, 
$wgUploadPath;
 
+               $context = $this->getContext();
+               $out = $context->getOutput();
+
                // If not enabled in site settings, don't display
                if ( $wgUserProfileDisplay['activity'] == false ) {
                        return '';
                }
 
                $output = '';
+
+               $out->addModuleStyles( 
'ext.socialprofile.userprofile.module.useractivity.css' );
 
                $limit = 8;
                $rel = new UserActivity( $user_name, 'user', $limit );
@@ -1396,6 +1412,7 @@
                global $wgMemc, $wgUserProfileDisplay, $wgUploadPath;
 
                $context = $this->getContext();
+               $out = $context->getOutput();
                $user = $context->getUser();
 
                // If not enabled in site settings, don't display
@@ -1403,6 +1420,7 @@
                        return '';
                }
 
+               $out->addModuleStyles( 
'ext.socialprofile.userprofile.module.gifts.css' );
                $output = '';
 
                // User to user gifts
@@ -1603,6 +1621,7 @@
                $output = ''; // Prevent E_NOTICE
 
                // Add JS
+               $out->addModuleStyles( 
'ext.socialprofile.userprofile.module.userboard.css' );
                $out->addModules( 'ext.socialprofile.userprofile.js' );
 
                $rel = new UserRelationship( $user_name );
@@ -1707,6 +1726,7 @@
                }
 
                // Add CSS & JS
+               $out->addModuleStyles( 
'ext.socialprofile.userprofile.module.fanboxes.css' );
                $out->addModules( 'ext.fanBoxes' );
 
                $output = '';
diff --git a/UserProfile/ext.socialprofile.userprofile.module.casualgames.css 
b/UserProfile/ext.socialprofile.userprofile.module.casualgames.css
new file mode 100644
index 0000000..e66c849
--- /dev/null
+++ b/UserProfile/ext.socialprofile.userprofile.module.casualgames.css
@@ -0,0 +1,31 @@
+.casual-game-container {
+       padding: 0 0 18px 0;
+}
+
+.casual-game-container p {
+       border-top: 1px solid #dcdcdc;
+       padding: 7px 0 !important;
+       margin: 0 !important;
+}
+
+.casual-game-container .item-top {
+       border: 0;
+}
+
+.casual-game-container a {
+       font-weight: 700;
+       text-decoration: none;
+}
+
+.casual-game-container .item-type {
+       font-size: 9px;
+       margin: 0 0 0 6px;
+}
+
+.casual-game-container img {
+       border: 1px solid #dcdcdc;
+       padding: 3px;
+       background-color: #fff;
+       vertical-align: middle;
+       margin: 0 3px 0 0;
+}
\ No newline at end of file
diff --git a/UserProfile/ext.socialprofile.userprofile.module.fanboxes.css 
b/UserProfile/ext.socialprofile.userprofile.module.fanboxes.css
new file mode 100644
index 0000000..74ce5bf
--- /dev/null
+++ b/UserProfile/ext.socialprofile.userprofile.module.fanboxes.css
@@ -0,0 +1,3 @@
+.user-fanbox-container {
+       padding: 0 0 25px 0;
+}
\ No newline at end of file
diff --git a/UserProfile/ext.socialprofile.userprofile.module.picturegame.css 
b/UserProfile/ext.socialprofile.userprofile.module.picturegame.css
new file mode 100644
index 0000000..ce2b08b
--- /dev/null
+++ b/UserProfile/ext.socialprofile.userprofile.module.picturegame.css
@@ -0,0 +1,49 @@
+.picture-container-spacer {
+       height: 25px;
+       width: 100%;
+}
+
+.picture-container .mini-image {
+       float: left;
+       margin: 5px 10px 0 0;
+}
+
+.picture-container img {
+       background-color: #fff;
+       border: 1px solid #dcdcdc;
+       padding: 3px;
+}
+
+.picture-container a {
+       text-decoration: none;
+}
+
+.upload-container {
+       clear: left;
+       height: 90px;
+       margin-left: -5px;
+}
+
+.upload-frame-errors {
+       margin: 10px 0 5px 0;
+       color: #f00;
+       font-size: 14px;
+       font-weight: 700;
+}
+
+.no-pictures-container {
+       background-color: #eff3f0;
+       color: #777;
+       padding: 20px;
+       margin: 10px 0 0;
+       text-align: center;
+}
+
+.upload-frame-errors {
+       display: none;
+}
+
+.imageUpload-frame {
+       height: 90px;
+       width: 425px;
+}
diff --git a/UserProfile/ext.socialprofile.userprofile.module.relationships.css 
b/UserProfile/ext.socialprofile.userprofile.module.relationships.css
new file mode 100644
index 0000000..6a8a3aa
--- /dev/null
+++ b/UserProfile/ext.socialprofile.userprofile.module.relationships.css
@@ -0,0 +1,16 @@
+.user-relationship-container {
+       padding: 0 0 25px 0;
+}
+
+.user-relationship-container a {
+       text-decoration: none;
+       float: left;
+       margin: 5px 10px 0 0;
+       display: block;
+}
+
+.user-relationship-container img {
+       background-color: #fff;
+       border: 1px solid #dcdcdc;
+       padding: 3px;
+}
\ No newline at end of file
diff --git a/UserProfile/ext.socialprofile.userprofile.module.useractivity.css 
b/UserProfile/ext.socialprofile.userprofile.module.useractivity.css
new file mode 100644
index 0000000..b0fc15e
--- /dev/null
+++ b/UserProfile/ext.socialprofile.userprofile.module.useractivity.css
@@ -0,0 +1,30 @@
+.activity-item {
+       border-bottom: 1px solid #dcdcdc;
+       padding: 7px 0;
+}
+
+.activity-item-bottom {
+       padding: 7px 0 0 0;
+}
+
+.activity-item img, .activity-item-bottom img {
+       vertical-align: middle;
+       margin: 0 5px 0 0;
+}
+
+.activity-item a, .activity-item-bottom a {
+       text-decoration: none;
+}
+
+.item {
+       color: #666;
+       margin: 5px 25px;
+}
+
+.item a {
+       font-weight: 700;
+}
+
+#recent-all {
+       padding: 0 0 25px 0;
+}
\ No newline at end of file
diff --git a/UserProfile/ext.socialprofile.userprofile.module.userboard.css 
b/UserProfile/ext.socialprofile.userprofile.module.userboard.css
new file mode 100644
index 0000000..86827c3
--- /dev/null
+++ b/UserProfile/ext.socialprofile.userprofile.module.userboard.css
@@ -0,0 +1,65 @@
+#user-page-board {
+       margin: 5px 0 10px 0;
+}
+
+.user-page-message-form {
+       margin: 5px 0 15px 0;
+       font-weight: 700;
+}
+
+.user-board-message {
+       border: 1px solid #e2e2e2;
+       margin: 0 0 15px 0;
+}
+
+.user-board-message-from {
+       background-color: #F8F5F5;
+       padding: 3px 0 5px 5px;
+}
+
+.user-board-message-from a {
+       font-size: 14px;
+       font-weight: 700;
+       text-decoration: none;
+}
+
+.user-board-message-content {
+       padding: 5px;
+}
+
+.user-board-message-time {
+       color: #797979;
+       font-size: 11px;
+       margin: 2px 0 0 5px;
+}
+
+.user-board-message-image {
+       float: left;
+       padding: 0 10px 5px 0;
+}
+
+.user-board-message-image img {
+       border: 1px solid #dcdcdc;
+}
+
+.user-board-message-body {
+       margin: 0 10px 0 0;
+}
+
+.user-board-message-body p {
+       margin: 0 !important;
+}
+
+.user-board-message-links {
+       padding: 0 0 5px 5px;
+}
+
+.user-board-message-links a {
+       font-size: 11px;
+       text-decoration: none;
+       margin: 0 10px 0 0;
+}
+
+.user-board-red a {
+       color: #f00;
+}
\ No newline at end of file

-- 
To view, visit https://gerrit.wikimedia.org/r/401429
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings

Gerrit-MessageType: newchange
Gerrit-Change-Id: Ida3e844ff41ce66ed6945dce5dc98381e6c74bd6
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/SocialProfile
Gerrit-Branch: master
Gerrit-Owner: SamanthaNguyen <samanthanguyen1...@gmail.com>

_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits

Reply via email to