r77434 MediaWiki - Code Review archive

Repository:MediaWiki
Revision:r77433‎ | r77434 | r77435 >
Date:20:33, 29 November 2010
Author:tparscal
Status:ok
Tags:
Comment:
Starting from scratch on beta code (removing prototype code)
Modified paths:
  • /trunk/extensions/ArticleFeedback/modules/ext.articleFeedback-beta/ext.articleFeedback-beta.css (modified) (history)
  • /trunk/extensions/ArticleFeedback/modules/ext.articleFeedback-beta/ext.articleFeedback-beta.html (deleted) (history)
  • /trunk/extensions/ArticleFeedback/modules/ext.articleFeedback-beta/ext.articleFeedback-beta.js (modified) (history)

Diff [purge]

Index: trunk/extensions/ArticleFeedback/modules/ext.articleFeedback-beta/ext.articleFeedback-beta.html
@@ -1,152 +0,0 @@
2 -<div class="af-ui">
3 - <div class="af-ui-drawer" rel="form">
4 - <div class="af-ui-drawer-container">
5 - <div class="af-ui-drawer-title">Your Feedback</div>
6 - <div class="af-ui-drawer-form-instructions">Please take a moment to rate this page.</div>
7 - <div class="af-ui-drawer-form-clear"><a href="#">Clear all ratings</a></div>
8 - <div style="clear:both;"></div>
9 - <table class="af-ui-form-ratings" cellspacing="0" cellpadding="0">
10 - <tr>
11 - <td class="af-ui-form-rating-label">
12 - <a href="#" title="Do you feel this page has sufficient citations and that those citations come from trustworthy sources?">Well-sourced</a>:
13 - </td>
14 - <td class="af-ui-form-rating-control" rel="wellsourced" state="current">
15 - <div class="af-ui-form-rating-container">
16 - <input type="radio" name="wellsourced" value="1" id="af-ui-form-wellsourced-1" checked />
17 - <input type="radio" name="wellsourced" value="2" id="af-ui-form-wellsourced-2" />
18 - <input type="radio" name="wellsourced" value="3" id="af-ui-form-wellsourced-3" />
19 - <input type="radio" name="wellsourced" value="4" id="af-ui-form-wellsourced-4" />
20 - <input type="radio" name="wellsourced" value="5" id="af-ui-form-wellsourced-5" />
21 - </div>
22 - <label for="af-ui-form-wellsourced-1" rel="1"></label>
23 - <label for="af-ui-form-wellsourced-2" rel="2"></label>
24 - <label for="af-ui-form-wellsourced-3" rel="3"></label>
25 - <label for="af-ui-form-wellsourced-4" rel="4"></label>
26 - <label for="af-ui-form-wellsourced-5" rel="5"></label>
27 - <div style="clear:both;"></div>
28 - </td>
29 - <td class="af-ui-form-ratings-divider"></td>
30 - <td class="af-ui-form-rating-label">
31 - <a href="#" title="Do you feel that this page covers the essential topic areas that it should?">Complete</a>:
32 - </td>
33 - <td class="af-ui-form-rating-control" rel="complete" state="current">
34 - <div class="af-ui-form-rating-container">
35 - <input type="radio" name="complete" value="1" id="af-ui-form-complete-1" />
36 - <input type="radio" name="complete" value="2" id="af-ui-form-complete-2" />
37 - <input type="radio" name="complete" value="3" id="af-ui-form-complete-3" checked />
38 - <input type="radio" name="complete" value="4" id="af-ui-form-complete-4" />
39 - <input type="radio" name="complete" value="5" id="af-ui-form-complete-5" />
40 - </div>
41 - <label for="af-ui-form-complete-1" rel="1"></label>
42 - <label for="af-ui-form-complete-2" rel="2"></label>
43 - <label for="af-ui-form-complete-3" rel="3"></label>
44 - <label for="af-ui-form-complete-4" rel="4"></label>
45 - <label for="af-ui-form-complete-5" rel="5"></label>
46 - <div style="clear:both;"></div>
47 - </td>
48 - </tr>
49 - <tr>
50 - <td class="af-ui-form-ratings-divider"></td>
51 - <td class="af-ui-form-ratings-divider"></td>
52 - <td class="af-ui-form-ratings-divider"></td>
53 - </tr>
54 - <tr>
55 - <td class="af-ui-form-rating-label">
56 - <a href="#" title="Do you feel that this page shows a fair representation of all perspectives on the issue?">Neutral</a>:
57 - </td>
58 - <td class="af-ui-form-rating-control" rel="neutral" state="current">
59 - <div class="af-ui-form-rating-container">
60 - <input type="radio" name="neutral" value="1" id="af-ui-form-neutral-1" />
61 - <input type="radio" name="neutral" value="2" id="af-ui-form-neutral-2" />
62 - <input type="radio" name="neutral" value="3" id="af-ui-form-neutral-3" />
63 - <input type="radio" name="neutral" value="4" id="af-ui-form-neutral-4" />
64 - <input type="radio" name="neutral" value="5" id="af-ui-form-neutral-5" checked />
65 - </div>
66 - <label for="af-ui-form-neutral-1" rel="1"></label>
67 - <label for="af-ui-form-neutral-2" rel="2"></label>
68 - <label for="af-ui-form-neutral-3" rel="3"></label>
69 - <label for="af-ui-form-neutral-4" rel="4"></label>
70 - <label for="af-ui-form-neutral-5" rel="5"></label>
71 - <div style="clear:both;"></div>
72 - </td>
73 - <td class="af-af-ui-form-ratings-divider"></td>
74 - <td class="af-ui-form-rating-label">
75 - <a href="#" title="Do you feel that this page is well-organized and well written?">Readable</a>:
76 - </td>
77 - <td class="af-ui-form-rating-control" rel="readable" state="current">
78 - <div class="af-ui-form-rating-container">
79 - <input type="radio" name="readable" value="1" id="af-ui-form-readable-1" />
80 - <input type="radio" name="readable" value="2" id="af-ui-form-readable-2" />
81 - <input type="radio" name="readable" value="3" id="af-ui-form-readable-3" />
82 - <input type="radio" name="readable" value="4" id="af-ui-form-readable-4" checked />
83 - <input type="radio" name="readable" value="5" id="af-ui-form-readable-5" />
84 - </div>
85 - <label for="af-ui-form-readable-1" rel="1"></label>
86 - <label for="af-ui-form-readable-2" rel="2"></label>
87 - <label for="af-ui-form-readable-3" rel="3"></label>
88 - <label for="af-ui-form-readable-4" rel="4"></label>
89 - <label for="af-ui-form-readable-5" rel="5"></label>
90 - <div style="clear:both;"></div>
91 - </td>
92 - </tr>
93 - </table>
94 - <hr noshade size="1" />
95 - <div class="af-ui-drawer-form-notice">Your ratings will expire over time. <a href="#">Learn more</a>.</div>
96 - <div class="af-ui-drawer-form-submit"><button type="button">Submit feedback</button></div>
97 - <div class="af-ui-drawer-form-reset"><a href="#">Reset</a></div>
98 - <div style="clear:both;"></div>
99 - </div>
100 - </div>
101 - <div class="af-ui-switch">
102 - <div class="af-ui-handle" rel="form">
103 - <span class="af-ui-handle-container">Provide Feedback</span>
104 - </div>
105 - <div class="af-ui-handle" rel="chart">
106 - <span class="af-ui-handle-container">Show Results</span>
107 - </div>
108 - </div>
109 - <div class="af-ui-drawer" rel="chart">
110 - <div class="af-ui-drawer-container">
111 - <div class="af-ui-drawer-title">Feedback Results</div>
112 - <table class="af-ui-drawer-chart-bars" cellspacing="5" cellpadding="0">
113 - <tr>
114 - <td class="af-ui-drawer-chart-bar-label">
115 - <a href="#" title="Do you feel this page has sufficient citations and that those citations come from trustworthy sources?">Well-sourced</a>:
116 - </td>
117 - <td class="af-ui-drawer-chart-bar-base">
118 - <div class="af-ui-drawer-chart-bar-fill" style="width:120px"></div>
119 - </td>
120 - <td class="af-ui-drawer-chart-bar-count">(798 ratings)</td>
121 - </tr>
122 - <tr>
123 - <td class="af-ui-drawer-chart-bar-label">
124 - <a href="#" title="Do you feel that this page covers the essential topic areas that it should?">Complete</a>:
125 - </td>
126 - <td class="af-ui-drawer-chart-bar-base">
127 - <div class="af-ui-drawer-chart-bar-fill" style="width:165px"></div>
128 - </td>
129 - <td class="af-ui-drawer-chart-bar-count">(791 ratings)</td>
130 - </tr>
131 - <tr>
132 - <td class="af-ui-drawer-chart-bar-label">
133 - <a href="#" title="Do you feel that this page shows a fair representation of all perspectives on the issue?">Neutral</a>:
134 - </td>
135 - <td class="af-ui-drawer-chart-bar-base">
136 - <div class="af-ui-drawer-chart-bar-fill" style="width:210px"></div>
137 - </td>
138 - <td class="af-ui-drawer-chart-bar-count">(798 ratings)</td>
139 - </tr>
140 - <tr>
141 - <td class="af-ui-drawer-chart-bar-label">
142 - <a href="#" title="Do you feel that this page is well-organized and well written?">Readable</a>:
143 - </td>
144 - <td class="af-ui-drawer-chart-bar-base">
145 - <div class="af-ui-drawer-chart-bar-fill" style="width:150px"></div>
146 - </td>
147 - <td class="af-ui-drawer-chart-bar-count">(798 ratings)</td>
148 - </tr>
149 - </table>
150 - </div>
151 - </div>
152 - <div style="clear:both;"></div>
153 -</div>
\ No newline at end of file
Index: trunk/extensions/ArticleFeedback/modules/ext.articleFeedback-beta/ext.articleFeedback-beta.css
@@ -1,228 +1,3 @@
22 /*
33 * Styles for Article Feedback (beta)
44 */
5 -
6 -.af-ui {
7 - border: 1px solid #aaaaaa;
8 - display: inline-block;
9 - height: 13.5em;
10 - width: 44.099em;
11 - overflow: hidden;
12 -}
13 -.af-ui hr {
14 - color: #cccccc;
15 - margin: 0.75em 0;
16 - padding: 0;
17 -}
18 -.af-ui-drawer, .af-ui-switch {
19 - float: left;
20 -}
21 -.af-ui-drawer {
22 -}
23 - .af-ui-drawer-container {
24 - padding: 0.75em 1em;
25 - width: 34em;
26 - }
27 - .af-ui-drawer[rel=form] {
28 - }
29 - .af-ui-drawer[rel=chart] {
30 - display: none;
31 - }
32 - .af-ui-drawer-title {
33 - font-size: 1.4em;
34 - }
35 - .af-ui-drawer-form-instructions {
36 - float: left;
37 - font-weight: bold;
38 - }
39 - .af-ui-drawer-form-clear {
40 - float: right;
41 - }
42 - .af-ui-drawer-form-reset {
43 - float: right;
44 - margin-right: 1em;
45 - }
46 -.af-ui-switch {
47 - height: 13.5em;
48 - overflow: hidden;
49 -}
50 -.af-ui-handle {
51 - display: block;
52 - background-color: #f3f3f3;
53 - background-position: 50% 35%;
54 - background-repeat: no-repeat;
55 - text-align: center;
56 - height: 13.5em;
57 - width: 8em;
58 - cursor: pointer;
59 -}
60 - .af-ui-handle[rel=form] {
61 - display: none;
62 - background-image: url(images/form-icon.png);
63 - border-right: solid 1px #aaaaaa;
64 - }
65 - .af-ui-handle[rel=chart] {
66 - background-image: url(images/chart-icon.png);
67 - border-left: solid 1px #aaaaaa;
68 - }
69 - .af-ui-handle-container {
70 - display: block;
71 - padding-top: 10em;
72 - padding-left: 1em;
73 - padding-right: 1em;
74 - font-size: 0.8em;
75 - line-height: 1.25em;
76 - color: #0645ad;
77 - }
78 - .af-ui-handle-container:hover {
79 - text-decoration: underline;
80 - }
81 -.af-ui-form-ratings {
82 - margin-top: 0.5em;
83 - width: 100%;
84 - line-height: 1px;
85 -}
86 -.af-ui-form-rating-label {
87 - padding-right: 1em;
88 - padding-top: 0.5em;
89 - padding-bottom: 0.5em;
90 -}
91 -.af-ui-form-rating-control {
92 - width: 113px;
93 - height: 21px;
94 - padding: 0;
95 - margin: 0;
96 -}
97 -.af-ui-form-rating-container {
98 - width: 0px;
99 - height: 0px;
100 - overflow: hidden;
101 -}
102 -.af-ui-form-rating-control label {
103 - float: left;
104 - height: 21px;
105 - width: 21px;
106 - margin: 0;
107 - padding: 0;
108 - background-image: url(images/rating.png);
109 - cursor: pointer;
110 -}
111 -.af-ui-form-rating-control label[rel='1'] {
112 - width: 25px;
113 - background-position: 0 0;
114 -}
115 - .af-ui-form-rating-control[state=new] label[rel='1'].af-ui-form-rating-control-selected {
116 - background-position: 0 -21px;
117 - }
118 - .af-ui-form-rating-control[state=current] label[rel='1'].af-ui-form-rating-control-selected {
119 - background-position: 0 -42px;
120 - }
121 - .af-ui-form-rating-control[state=stale] label[rel='1'].af-ui-form-rating-control-selected {
122 - background-position: 0 -63px;
123 - }
124 - .af-ui-form-rating-control[state=expired] label[rel='1'].af-ui-form-rating-control-selected {
125 - background-position: 0 -84px;
126 - }
127 -.af-ui-form-rating-control label[rel='2'] {
128 - width: 21px;
129 - background-position: -25px 0;
130 -}
131 - .af-ui-form-rating-control[state=new] label[rel='2'].af-ui-form-rating-control-selected {
132 - background-position: -25px -21px;
133 - }
134 - .af-ui-form-rating-control[state=current] label[rel='2'].af-ui-form-rating-control-selected {
135 - background-position: -25px -42px;
136 - }
137 - .af-ui-form-rating-control[state=stale] label[rel='2'].af-ui-form-rating-control-selected {
138 - background-position: -25px -63px;
139 - }
140 - .af-ui-form-rating-control[state=expired] label[rel='2'].af-ui-form-rating-control-selected {
141 - background-position: -25px -84px;
142 - }
143 -.af-ui-form-rating-control label[rel='3'] {
144 - width: 21px;
145 - background-position: -46px 0;
146 -}
147 - .af-ui-form-rating-control[state=new] label[rel='3'].af-ui-form-rating-control-selected {
148 - background-position: -46px -21px;
149 - }
150 - .af-ui-form-rating-control[state=current] label[rel='3'].af-ui-form-rating-control-selected {
151 - background-position: -46px -42px;
152 - }
153 - .af-ui-form-rating-control[state=stale] label[rel='3'].af-ui-form-rating-control-selected {
154 - background-position: -46px -63px;
155 - }
156 - .af-ui-form-rating-control[state=expired] label[rel='3'].af-ui-form-rating-control-selected {
157 - background-position: -46px -84px;
158 - }
159 -.af-ui-form-rating-control label[rel='4'] {
160 - width: 21px;
161 - background-position: -67px 0;
162 -}
163 - .af-ui-form-rating-control[state=new] label[rel='4'].af-ui-form-rating-control-selected {
164 - background-position: -67px -21px;
165 - }
166 - .af-ui-form-rating-control[state=current] label[rel='4'].af-ui-form-rating-control-selected {
167 - background-position: -67px -42px;
168 - }
169 - .af-ui-form-rating-control[state=stale] label[rel='4'].af-ui-form-rating-control-selected {
170 - background-position: -67px -63px;
171 - }
172 - .af-ui-form-rating-control[state=expired] label[rel='4'].af-ui-form-rating-control-selected {
173 - background-position: -67px -84px;
174 - }
175 -.af-ui-form-rating-control label[rel='5'] {
176 - width: 25px;
177 - background-position: -88px 0;
178 -}
179 - .af-ui-form-rating-control[state=new] label[rel='5'].af-ui-form-rating-control-selected {
180 - background-position: -88px -21px;
181 - }
182 - .af-ui-form-rating-control[state=current] label[rel='5'].af-ui-form-rating-control-selected {
183 - background-position: -88px -42px;
184 - }
185 - .af-ui-form-rating-control[state=stale] label[rel='5'].af-ui-form-rating-control-selected {
186 - background-position: -88px -63px;
187 - }
188 - .af-ui-form-rating-control[state=expired] label[rel='5'].af-ui-form-rating-control-selected {
189 - background-position: -88px -84px;
190 - }
191 -.af-ui-form-ratings-divider {
192 - width: 2em;
193 - height: 1em;
194 -}
195 -.af-ui-drawer-form-notice {
196 - float: left;
197 - font-size: 0.8em;
198 -}
199 -.af-ui-drawer-form-submit {
200 - float: right;
201 -}
202 -.af-ui-drawer-chart-bars {
203 - margin-top: 1em;
204 -}
205 -.af-ui-drawer-chart-bar-base {
206 - width: 246px;
207 - height: 21px;
208 - background-image: url(images/chart-base.png);
209 - border: solid 1px #cccccc;
210 -}
211 -.af-ui-drawer-chart-bar-fill {
212 - width: 110px;
213 - height: 21px;
214 - background-image: url(images/chart-fill.png);
215 - border-right: solid 1px #b5c8e0;
216 -}
217 -.af-ui-drawer-chart-bar-label {
218 - text-align: right;
219 - padding-right: 1em;
220 -}
221 -.af-ui-drawer-chart-bar-count {
222 - font-size: 0.8em;
223 - text-align: left;
224 - color: #999999;
225 - padding-left: 1em;
226 -}
227 -.af-ui-form-rating-label {
228 - text-align: right;
229 -}
Index: trunk/extensions/ArticleFeedback/modules/ext.articleFeedback-beta/ext.articleFeedback-beta.js
@@ -2,135 +2,42 @@
33 * Script for Article Feedback (beta)
44 */
55
6 -$.fn.articleFeedback = function() {
 6+$.articleFeedback = {
 7+ 'fn': {
 8+ 'buildForm': function() {
 9+
 10+ },
 11+ 'buildReport': function() {
 12+
 13+ },
 14+ 'buildRatingControl': function() {
 15+
 16+ },
 17+ 'buildChart': function() {
 18+
 19+ }
 20+ },
 21+ 'evt': {
 22+
 23+ },
 24+ 'cfg': {
 25+
 26+ }
 27+};
 28+
 29+$.fn.articleFeedback = function( method, data ) {
730 $(this).each( function() {
8 - var context = $(this).data( 'context' );
 31+ var context = $(this).data( 'articleFeedback-context' );
932 if ( !context || typeof context == 'undefined' ) {
1033 context = {
1134 $ui = $(this);
1235 };
1336 // Setup user interface
14 - $ui.append( );
 37+ $ui.append( /* */ );
1538 // Save context
16 - $(this).data( 'wikiEditor-context', context );
 39+ $(this).data( 'articleFeedback-context', context );
1740 }
1841 // Proceed with handling input
1942 } );
2043 return $(this);
2144 }
22 -
23 -$.articleFeedback = {
24 - /*
25 - function updateSubmitButton() {
26 - $( '.af-ui-drawer-form-submit button' )
27 - .attr( 'disabled', !$ui.find( '.af-ui-form-rating-control[state=new]' ).length );
28 - }
29 - function setClassesFromRadios() {
30 - $(this).find( 'input:radio:checked' ).each( function() {
31 - var $label = $ui.find( 'label[for=' + $(this).attr( 'id' ) + ']' );
32 - $label.prevAll( 'label' ).add( $label ).addClass( 'af-ui-form-rating-control-selected' );
33 - $label.nextAll( 'label' ).removeClass( 'af-ui-form-rating-control-selected' );
34 - } );
35 - }
36 -
37 - $ui.find( '.af-ui-drawer[rel=form] label' ).hover(
38 - function() {
39 - $(this).prevAll( 'label' ).add( $(this) ).addClass( 'af-ui-form-rating-control-selected' );
40 - $(this).nextAll( 'label' ).removeClass( 'af-ui-form-rating-control-selected' );
41 - },
42 - function() {
43 - $(this).prevAll( 'label' ).add( $(this) ).removeClass( 'af-ui-form-rating-control-selected' );
44 - }
45 - );
46 - $ui.find( '.af-ui-form-rating-control' )
47 - .each( function() {
48 - var $radio = $(this).find( 'input:radio:checked' );
49 - $(this).data( 'initial', {
50 - 'state': $(this).attr( 'state' ),
51 - 'value': $radio.length ? $radio.val() : 0
52 - } )
53 - setClassesFromRadios.call( $(this) );
54 - } )
55 - .hover(
56 - function() {
57 - $(this).data( 'state', $(this).attr( 'state' ) );
58 - $(this).attr( 'state', 'new' );
59 - },
60 - function() {
61 - $(this).attr( 'state', $(this).data( 'state' ) );
62 - setClassesFromRadios.call( $(this) )
63 - }
64 - );
65 - $ui.find( '.af-ui-form-rating-control input:radio' ).click( function() {
66 - $(this).closest( '.af-ui-form-rating-control' ).data( 'state', 'new' );
67 - updateSubmitButton();
68 - } );
69 - $ui.find( '.af-ui-drawer-form-clear a' )
70 - .click( function( e ) {
71 - $ui.find( '.af-ui-drawer[rel=form] input:radio' ).attr( 'checked', false );
72 - $ui.find( '.af-ui-form-rating-control label' )
73 - .removeClass( 'af-ui-form-rating-control-selected' );
74 - $ui.find( '.af-ui-form-rating-control' ).attr( 'state', 'new' );
75 - updateSubmitButton();
76 - e.preventDefault();
77 - return false;
78 - } )
79 - .mousedown( function( e ) {
80 - e.preventDefault();
81 - return false;
82 - } );
83 - $ui.find( '.af-ui-drawer-form-reset a' )
84 - .click( function( e ) {
85 - $ui.find( '.af-ui-form-rating-control' ).each( function() {
86 - $(this).attr( 'state', $(this).data( 'initial' ).state );
87 - if ( $(this).data( 'initial' ).value ) {
88 - $(this).find( 'input:radio[value=' + $(this).data( 'initial' ).value + ']' )
89 - .attr( 'checked', true );
90 - } else {
91 - $(this).find( 'input:radio' ).attr( 'checked', false );
92 - }
93 - setClassesFromRadios.call( $(this) )
94 - } );
95 - updateSubmitButton();
96 - e.preventDefault();
97 - return false;
98 - } )
99 - .mousedown( function( e ) {
100 - e.preventDefault();
101 - return false;
102 - } );
103 - $ui.find( '.af-ui-handle' ).click( function( e ) {
104 - var drawers = {
105 - 'from': $ui.find( '.af-ui-drawer[rel!=' + $(this).attr( 'rel' ) +']' ),
106 - 'to': $ui.find( '.af-ui-drawer[rel=' + $(this).attr( 'rel' ) +']' )
107 - };
108 - var handles = {
109 - 'from': $ui.find( '.af-ui-handle[rel=' + $(this).attr( 'rel' ) +']' ),
110 - 'to': $ui.find( '.af-ui-handle[rel!=' + $(this).attr( 'rel' ) +']' )
111 - };
112 - for ( d in drawers ) {
113 - drawers[d].css( 'overflow', 'hidden' );
114 - }
115 - drawers.from.animate( { 'width': 'hide' }, 'fast', function() {
116 - $(this).css( 'overflow', 'visible' );
117 - } );
118 - drawers.to.animate( { 'width': 'show' }, 'fast', function() {
119 - $(this).css( 'overflow', 'visible' );
120 - } );
121 - handles.from.hide();
122 - handles.to.show();
123 - e.preventDefault();
124 - return false;
125 - } );
126 - $( '.af-ui-form-rating-label a, .af-ui-drawer-chart-bar-label a' )
127 - .tipsy( { 'gravity': 'sw', 'opacity': 1, 'delayIn': 100, 'delayOut': 200 } )
128 - .bind( 'click mousedown', function( e ) {
129 - e.preventDefault();
130 - return false;
131 - } );
132 - updateSubmitButton();
133 - */
134 -};
135 -
136 -// Activation
137 -$( '#catlinks' ).before( $( '<div></div>' ).articleFeedback() );

Status & tagging log