Download as
Browse Code »

Commit e63c64d295dfe9aac638654b71747c62a10d3e33

Authored by Valessio Soares de Brito
1 parent 6ccb01f0
Exists in master and in 1 other branch add_vagrant

fix small bugs on box packages

Showing 13 changed files with 548 additions and 232 deletions   Show diff stats
src/web/static/css/apprec.css
  Diff comments   View file @e63c64d
... ... @@ -10,6 +10,7 @@ height: 200px;
10 10 overflow: hidden;
11 11 float: left;
12 12 text-align: center;
  13 +border-radius: 5px;
13 14 }
14 15  
15 16 #result-thumbnail .item:hover {
... ... @@ -22,3 +23,64 @@ padding: 0px;
22 23 color: gray;
23 24 }
24 25  
  26 +
  27 +
  28 +/*
  29 + * Package Box
  30 + */
  31 +
  32 +#title_pkg {
  33 +font-weight: bold;
  34 +}
  35 +
  36 +#title_pkg span {
  37 +color: gray;
  38 +font-style:italic;
  39 +font-weight: normal;
  40 +font-size: 0.8em;
  41 +}
  42 +
  43 +#voting_box {
  44 +margin-top: 20px;
  45 +}
  46 +
  47 +#debtags_box {
  48 +display: block;
  49 +float: right;
  50 +background-color: #dfdfdf;
  51 +border-radius: 5px;
  52 +width: 150px;
  53 +font-size: 0.8em;
  54 +padding: 5px;
  55 +}
  56 +
  57 +#debtags_box h2 {
  58 +font-weight: bold;
  59 +}
  60 +
  61 +#debtags_pkg ul {
  62 +padding: 3px;
  63 +}
  64 +
  65 +#debtags_pkg li {
  66 +font-weight: bold;
  67 +cursor: pointer;
  68 +}
  69 +
  70 +#debtags_pkg li ul li {
  71 +font-weight: normal;
  72 +margin-left: 5px;
  73 +border-left: 1px solid white;
  74 +border-bottom: 1px solid white;
  75 +cursor: pointer;
  76 +}
  77 +
  78 +#debresources_box {
  79 +float: left;
  80 +margin-top: 20px;
  81 +}
  82 +
  83 +#debresources_box li {
  84 +margin-bottom: 4px;
  85 +}
  86 +
... ...
src/web/static/css/debtags.css
  Diff comments   View file @e63c64d
... ... @@ -4,7 +4,7 @@
4 4 #debtags-facets {
5 5 float: left;
6 6 text-align: right;
7   - width: 250px;
  7 + width: 320px;
8 8 }
9 9 #debtags-facets div {
10 10 background-color: #F0F0F0;
... ... @@ -25,8 +25,8 @@ position: absolute;
25 25 background: white;
26 26 display: none;
27 27 overflow: hidden;
28   -width: 250px;
29   -height: 450px;
  28 +width: 320px;
  29 +height: 430px;
30 30 }
31 31  
32 32 #tags-box div {
... ...
src/web/static/css/facebox.css
  Diff comments   View file @e63c64d
... ... @@ -28,6 +28,11 @@
28 28 border-radius:4px;
29 29 }
30 30  
  31 +.feedback #facebox .content {
  32 +width: 670px;
  33 +padding: 20px;
  34 +}
  35 +
31 36 #facebox .content > p:first-child {
32 37 margin-top:0;
33 38 }
... ...
src/web/static/css/screen.css
  Diff comments   View file @e63c64d
1   -form {
2   - background:#fff;
3   - padding:1em;
4   -}
5   -fieldset div {
6   - margin:0.3em 0;
7   - clear:both;
8   -}
9   -form {
10   - margin:1em;
11   - width:33em;
12   -}
13   -label {
14   - float:left;
15   - width:10em;
16   - text-align:right;
17   - margin-right:1em;
18   -}
19 1  
20   -.special {
21   - float:right;
22   - width:19.5em;
23   - text-align:left;
24   - margin-right:1em;
25   -}
26   -legend {
27   - font-size: 120%;
28   - margin: 0.5em 0 0.5em 0;
29   - color: #757575;
30   - font-weight: bolder;
  2 +#page-wrap {
  3 + width: 960px;
  4 + margin: 40px auto;
  5 + overflow: hidden;
31 6 }
32   -legend span {
33   - width:10em;
34   - text-align:right;
  7 +
  8 +.hidden {
  9 + position:absolute;
  10 + left:-999em;
  11 + top:-999em;
  12 + width:1%;
35 13 }
36   -input {
37   - padding:0.15em;
38   -/* width:10em; */
39   - border:1px solid #ddd;
40   - background:#fafafa;
41   -/* font:bold 0.95em arial, sans-serif;
42   - -moz-border-radius:0.4em;
43   - -khtml-border-radius:0.4em;*/
  14 +
  15 +h1 {
  16 + font-size: 48px;
  17 + letter-spacing: -1px;
  18 + color: white;
  19 + margin: 0 0 15px 0;
  20 + }
  21 + h1 span {
  22 + color: #1f8cc5;
44 23 }
45   -input:hover, input:focus {
46   - border-color:#c5c5c5;
47   - background:#f6f6f6;
  24 +
  25 +h3 {
  26 + font-size: 18px;
  27 + letter-spacing: -1px;
  28 + margin: 0 0 5px 0;
48 29 }
  30 +
  31 +p, label {
  32 + font-family: Georgia, serif;
  33 + font-style: italic;
  34 + font-size: 18px;
  35 + margin: 4px 0;
  36 +}
  37 +
  38 +
49 39 fieldset {
50   - border:1px solid #ddd;
51   - padding:0 0.5em 0.5em;
52   -}
  40 + width: 280px;
  41 + padding: 15px;
  42 + float: left;
  43 + border: none;
  44 + margin: 0 10px 0 0;
  45 + }
  46 + fieldset#step_1 {
  47 + background: #b2e7ca;
  48 + }
  49 + fieldset#step_2 {
  50 + background: #b2d9e7;
  51 + }
  52 + fieldset#step_3 {
  53 + background: #e7c7b2;
  54 + }
53 55  
54   -.radio fieldset, .date fieldset {
55   - border:none;
56   - width:auto;
57   - padding:1px 0 0 11em;
58   -}
59   -.radio legend, .date legend {
60   - font-size:1em;
61   - color:#000;
  56 +legend {
  57 + font-weight: bold;
  58 + font-size: 20px;
  59 + background: white;
  60 + -moz-border-radius: 10px;
  61 + -webkit-border-radius: 10px;
  62 + padding: 5px 10px;
  63 + letter-spacing: -1px;
  64 +}
  65 +
  66 +option {
  67 + padding: 0 5px;
62 68 }
63   -.radio legend span, .date legend span {
64   - position:absolute;
65   - left:0;
66   - top:0.3em;
67   - width:10em;
68   - display:block;
  69 +
  70 +.name_wrap {
  71 + margin: 5px 0;
  72 + }
  73 + .name_wrap label {
  74 + font-size: 12px;
  75 + display: block;
  76 + width: 102px;
  77 + float: left;
  78 + }
  79 +
  80 +.push {
  81 + margin: 20px 0 0 0;
69 82 }
70   -.radio label, .radio input {
71   - vertical-align:middle;
72   - display:inline;
73   - float:none;
74   - width:auto;
75   - background:none;
76   - border:none;
  83 +
  84 +#special_accommodations_wrap,
  85 +#company_name_wrap {
  86 + margin: 8px 0 0 0;
77 87 }
78   -.radio div {
79   - float:left;
80   - white-space:nowrap;
81   - clear:none;
  88 +
  89 +#company_name_wrap label,
  90 +#special_accommodations_wrap label {
  91 + font-size: 12px;
82 92 }
83 93  
84   -input.default {
85   - color:#bbb;
  94 +#special_accommodations_wrap textarea {
  95 + width: 100%; height: 100px;
86 96 }
... ...
src/web/static/css/style.css
  Diff comments   View file @e63c64d
... ... @@ -52,7 +52,7 @@ blockquote:before, blockquote:after, q:before, q:after { content: ""; }
52 52 */
53 53  
54 54 body{
55   -font-family: 'Cantarell', Arial, Verdana, sans-serif;
  55 +font-family: Arial, Verdana, sans-serif;
56 56 font-size: 0.9em;
57 57 line-height: 1.1;
58 58 font-weight: normal;
... ... @@ -102,15 +102,22 @@ text-decoration: none;
102 102  
103 103  
104 104 #sidebar {
105   -width: 300px;
106   -min-height: 400px;
107   -margin-bottom: 40px;
  105 +width: 370px;
  106 +min-height: 450px;
108 107 float: right;
109 108 }
110 109  
111 110 #maincontent {
112 111 }
113 112  
  113 +.align-left {
  114 +float: left;
  115 +}
  116 +
  117 +.align-right {
  118 +float: right;
  119 +}
  120 +
114 121 .innertube {
115 122 margin: 15px;
116 123 }
... ... @@ -156,43 +163,35 @@ h1
156 163 , h4
157 164 , h5
158 165 , h6 {
159   -font-family: 'Cherry Cream Soda', Verdana, Arial, sans-serif;
  166 +font-family: Verdana, Arial, sans-serif;
160 167 font-weight: 600;
161 168 color: black;
  169 +margin-bottom: 0.7em;
  170 +margin-top: 0.5em;
162 171 }
163 172 h1 {
164 173 font-weight: normal;
165 174 font-size: 1.8em;
166   -line-height: 0.43333;
167   -margin: 0.83333em 0 0.83333em 0;
168 175 }
169 176 h2 {
170 177 font-size: 1.4em;
171 178 font-weight: normal;
172   -line-height: 0.5714286;
173   -margin: 1.0714286em 0 1.0714286em 0;
174 179 }
175 180 h3 {
176 181 font-size: 1.125em;
177   -line-height: 0.733em;
178   -margin: 1.333em 0 1.333em 0;
179 182 }
180 183 h3 {
181 184 font-size: 1em;
182   -line-height: 0.8;
183   -margin: 1.5em 0 1.5em 0;
184 185 font-weight: bold;
185 186 }
186 187 h4 {
187 188 font-weight: normal;
188 189 font-style: italic;
189   -margin: 1.5em 0 1.5em 0;
190 190 color: #444;
191 191 }
192 192 h5 {
193 193 font-style: italic;
194 194 font-size: 0.75em;
195   -margin: 2em 0 2em 0;
196 195 }
197 196 pre {
198 197 margin: 1.5em 0 1.5em 0;
... ... @@ -218,6 +217,15 @@ margin: 0;
218 217 padding:0;
219 218 }
220 219  
  220 +/* Gray Box */
  221 +
  222 +.graybox {
  223 +background-color: #dfdfdf;
  224 +border-radius: 5px;
  225 +font-size: 0.8;
  226 +padding: 5px;
  227 +}
  228 +
221 229  
222 230 /* Tip */
223 231 div.tip
... ... @@ -254,6 +262,10 @@ div.note
254 262 , div.trans-note {
255 263 background-image: url('../images/admon-note.png');
256 264 }
  265 +
  266 +
  267 +/* Recommender BOX */
  268 +
257 269 #recommender-box {
258 270 margin-top: 0px;
259 271 margin-right: auto;
... ... @@ -263,9 +275,11 @@ width: 560px;
263 275 position: relative;
264 276 vertical-align: top;
265 277 }
  278 +
266 279 #recommender-box label {
267 280 font-size: 1.3em;
268 281 }
  282 +
269 283 #recommender-box #upfile {
270 284 width: 22px;
271 285 height: 22px;
... ... @@ -280,10 +294,12 @@ right: 0px;
280 294 top: 2px;
281 295 z-index: 1;
282 296 }
  297 +
283 298 #pkgs_list, #input-box {
284 299 position: relative;
285 300 width: 410px;
286 301 }
  302 +
287 303 #pkgs_list {
288 304 font-size: 13px;
289 305 font-family: Arial, Verdana, Sans-serif;
... ... @@ -298,6 +314,7 @@ color: black;
298 314 float: right;
299 315 display: block;
300 316 width: 135px;
  317 +text-align: center;
301 318 }
302 319  
303 320 #submit-box input {
... ... @@ -305,5 +322,13 @@ font-size: 14px;
305 322 margin: 5px;
306 323 }
307 324  
  325 +/* Advance Query */
  326 +
  327 +
  328 +#content-form, #colaborative-form { display: none; }
  329 +
  330 +#content-form:target, #colaborative-form:target, #hybrid-form:target { z-index: 1; display: block; }
  331 +
  332 +
308 333  
309 334  
... ...
src/web/static/css/tabs.css
  Diff comments   View file @e63c64d
... ... @@ -48,7 +48,7 @@ min-height: 450px;
48 48 position: absolute;
49 49 top: -1px;
50 50 left: 0;
51   -width: 250px;
  51 +width: 320px;
52 52 background: white;
53 53 }
54 54  
... ...
src/web/static/js/form.js 0 → 100644
  Diff comments   View file @e63c64d
... ... @@ -0,0 +1,143 @@
  1 +
  2 +// When the DOM is ready...
  3 +$(function(){
  4 +
  5 + // Hide stuff with the JavaScript. If JS is disabled, the form will still be useable.
  6 + // NOTE:
  7 + // Sometimes using the .hide(); function isn't as ideal as it uses display: none;
  8 + // which has problems with some screen readers. Applying a CSS class to kick it off the
  9 + // screen is usually prefered, but since we will be UNhiding these as well, this works.
  10 + $(".name_wrap").hide();
  11 + $("#company_name_wrap").hide();
  12 + $("#special_accommodations_wrap").hide();
  13 +
  14 + // Reset form elements back to default values
  15 + $("#submit_button").attr("disabled",true);
  16 + $("#num_attendees").val('Please Choose');
  17 + $("#step_2 input[type=radio]").each(function(){
  18 + this.checked = false;
  19 + });
  20 + $("#rock").each(function(){
  21 + this.checked = false;
  22 + });
  23 +
  24 + // Fade out steps 2 and 3 until ready
  25 + $("#step_2").css({ opacity: 0.3 });
  26 + $("#step_3").css({ opacity: 0.3 });
  27 +
  28 + $.stepTwoComplete_one = "not complete";
  29 + $.stepTwoComplete_two = "not complete";
  30 +
  31 + // When a dropdown selection is made
  32 + $("#num_attendees").change(function() {
  33 +
  34 + $(".name_wrap").slideUp().find("input").removeClass("active_name_field");
  35 +
  36 + switch ($("#num_attendees option:selected").text()) {
  37 + case '1':
  38 + $("#attendee_1_wrap").slideDown().find("input").addClass("active_name_field");
  39 + break;
  40 + case '2':
  41 + $("#attendee_1_wrap").slideDown().find("input").addClass("active_name_field");
  42 + $("#attendee_2_wrap").slideDown().find("input").addClass("active_name_field");
  43 + break;
  44 + case '3':
  45 + $("#attendee_1_wrap").slideDown().find("input").addClass("active_name_field");
  46 + $("#attendee_2_wrap").slideDown().find("input").addClass("active_name_field");
  47 + $("#attendee_3_wrap").slideDown().find("input").addClass("active_name_field");
  48 + break;
  49 + case '4':
  50 + $("#attendee_1_wrap").slideDown().find("input").addClass("active_name_field");
  51 + $("#attendee_2_wrap").slideDown().find("input").addClass("active_name_field");
  52 + $("#attendee_3_wrap").slideDown().find("input").addClass("active_name_field");
  53 + $("#attendee_4_wrap").slideDown().find("input").addClass("active_name_field");
  54 + break;
  55 + case '5':
  56 + $("#attendee_1_wrap").slideDown().find("input").addClass("active_name_field");
  57 + $("#attendee_2_wrap").slideDown().find("input").addClass("active_name_field");
  58 + $("#attendee_3_wrap").slideDown().find("input").addClass("active_name_field");
  59 + $("#attendee_4_wrap").slideDown().find("input").addClass("active_name_field");
  60 + $("#attendee_5_wrap").slideDown().find("input").addClass("active_name_field");
  61 + break;
  62 + }
  63 + });
  64 +
  65 + $(".name_input").blur(function(){
  66 +
  67 + var all_complete = true;
  68 +
  69 + $(".active_name_field").each(function(){
  70 + if ($(this).val() == '' ) {
  71 + all_complete = false;
  72 + };
  73 + });
  74 +
  75 + if (all_complete) {
  76 + $("#step_1")
  77 + .animate({
  78 + paddingBottom: "120px"
  79 + })
  80 + .css({
  81 + "background-image": "url(images/check.png)",
  82 + "background-position": "bottom center",
  83 + "background-repeat": "no-repeat"
  84 + });
  85 + $("#step_2").css({
  86 + opacity: 1.0
  87 + });
  88 + $("#step_2 legend").css({
  89 + opacity: 1.0 // For dumb Internet Explorer
  90 + });
  91 + };
  92 + });
  93 +
  94 + function stepTwoTest() {
  95 + if (($.stepTwoComplete_one == "complete") && ($.stepTwoComplete_two == "complete")) {
  96 + $("#step_2")
  97 + .animate({
  98 + paddingBottom: "120px"
  99 + })
  100 + .css({
  101 + "background-image": "url(images/check.png)",
  102 + "background-position": "bottom center",
  103 + "background-repeat": "no-repeat"
  104 + });
  105 + $("#step_3").css({
  106 + opacity: 1.0
  107 + });
  108 + $("#step_3 legend").css({
  109 + opacity: 1.0 // For dumb Internet Explorer
  110 + });
  111 + }
  112 + };
  113 +
  114 + $("#step_2 input[name=company_name_toggle_group]").click(function(){
  115 + $.stepTwoComplete_one = "complete";
  116 + if ($("#company_name_toggle_on:checked").val() == 'on') {
  117 + $("#company_name_wrap").slideDown();
  118 + } else {
  119 + $("#company_name_wrap").slideUp();
  120 + };
  121 + stepTwoTest();
  122 + });
  123 +
  124 + $("#step_2 input[name=special_accommodations_toggle]").click(function(){
  125 + $.stepTwoComplete_two = "complete";
  126 + if ($("#special_accommodations_toggle_on:checked").val() == 'on') {
  127 + $("#special_accommodations_wrap").slideDown();
  128 + } else {
  129 + $("#special_accommodations_wrap").slideUp();
  130 + };
  131 + stepTwoTest();
  132 + });
  133 +
  134 + $("#rock").click(function(){
  135 + if (this.checked && $("#num_attendees option:selected").text() != 'Please Choose'
  136 + && $.stepTwoComplete_one == 'complete' && $.stepTwoComplete_two == 'complete') {
  137 + $("#submit_button").attr("disabled",false);
  138 + } else {
  139 + $("#submit_button").attr("disabled",true);
  140 + }
  141 + });
  142 +
  143 +});
... ...
src/web/static/js/jquery.simplerss.js 0 → 100644
  Diff comments   View file @e63c64d
... ... @@ -0,0 +1,91 @@
  1 +/**
  2 + * Copyright (c) 2010, Till Klampaeckel
  3 + * All rights reserved.
  4 + *
  5 + * Redistribution and use in source and binary forms, with or without modification,
  6 + * are permitted provided that the following conditions are met:
  7 + *
  8 + * o Redistributions of source code must retain the above copyright notice, this
  9 + * list of conditions and the following disclaimer.
  10 + * o Redistributions in binary form must reproduce the above copyright notice, this
  11 + * list of conditions and the following disclaimer in the documentation and/or
  12 + * other materials provided with the distribution.
  13 + * o Neither the name of the <ORGANIZATION> nor the names of its contributors may be
  14 + * used to endorse or promote products derived from this software without specific
  15 + * prior written permission.
  16 + *
  17 + * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND
  18 + * ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
  19 + * WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED.
  20 + * IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT,
  21 + * INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT
  22 + * NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
  23 + * PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY,
  24 + * WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
  25 + * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
  26 + * POSSIBILITY OF SUCH DAMAGE.
  27 + *
  28 + * @category RSS
  29 + * @package simplerss
  30 + * @author Till Klampaeckel <till@php.net>
  31 + * @license http://www.opensource.org/licenses/bsd-license.php The New BSD License
  32 + * @link http://github.com/till/jquery-simplerss
  33 + */
  34 +(function($){
  35 + jQuery.fn.extend({
  36 +
  37 + /**
  38 + * simplerss
  39 + *
  40 + * @param array options To override the defaults.
  41 + *
  42 + * @return this
  43 + */
  44 + simplerss: function(options) {
  45 +
  46 + var defaults = {
  47 + url: '',
  48 + html: '<em><a href="{link}">{title}</a></em><br />{text}',
  49 + wrapper: 'li',
  50 + dataType: 'xml',
  51 + display: 2
  52 + }
  53 + var options = jQuery.extend(defaults, options);
  54 +
  55 + return this.each(function() {
  56 + var o = options;
  57 + var c = jQuery(this);
  58 +
  59 + if (o.url == '') {
  60 + return; // avoid the request
  61 + }
  62 +
  63 + jQuery.ajax({
  64 + url: o.url,
  65 + type: 'GET',
  66 + dataType: o.dataType,
  67 + error: function (xhr, status, e) {
  68 + console.debug('C: #%s, Error: %s, Feed: %s', $(c).attr('id'), e, o.url);
  69 + },
  70 + success: function(feed){
  71 +
  72 + jQuery(feed).find('item').each(function(i){
  73 +
  74 + var itemHtml = o.html.replace(/{title}/, jQuery(this).find('title').text());
  75 + itemHtml = itemHtml.replace(/{text}/, jQuery(this).find('description').text());
  76 + itemHtml = itemHtml.replace(/{link}/, jQuery(this).find('guid').text());
  77 +
  78 + jQuery(c).append(jQuery('<' + o.wrapper + '>').append(itemHtml));
  79 +
  80 + if (i == o.display) {
  81 + return false;
  82 + }
  83 +
  84 + });
  85 + }
  86 + });
  87 + });
  88 + return this;
  89 + }
  90 + });
  91 +})(jQuery);
0 92 \ No newline at end of file
... ...
src/web/templates/apprec.html
  Diff comments   View file @e63c64d
... ... @@ -2,7 +2,7 @@ $def with (recommends, pkg_summaries, form, request)
2 2 $var title: Feedback
3 3 $var mod = 'feedback';
4 4 $var cssfiles: static/css/apprec.css static/css/facebox.css static/css/voting.css
5   -$var jsfiles: static/js/facebox.js
  5 +$var jsfiles: static/js/facebox.js static/js/jquery.simplerss.js
6 6  
7 7 <script type="application/x-javascript">
8 8 $$(document).ready(function() {
... ... @@ -37,6 +37,7 @@ $$(document).ready(function() {
37 37 $$('.redbar').css("background-color","#DDDDDD");
38 38 $$('.totalstats').fadeOut(200);
39 39 });
  40 +
40 41 });
41 42 </script>
42 43  
... ... @@ -45,7 +46,7 @@ $$(document).ready(function() {
45 46 <div id="sidebar">
46 47 <div class="innertube">
47 48  
48   -<div id="details_box_recomendation" style="float: left;" class="graybox">
  49 +<div id="details_box" class="graybox align-left">
49 50 <h2>Recommendation strategy details</h2>
50 51 <ul class="toc">
51 52 $for key, value in request.get_details().items():
... ... @@ -72,11 +73,11 @@ $for strategy, result in recommends.items():
72 73 $for pkg in result:
73 74 $ count = count + 1
74 75 <div class="item">
75   - <h3><a href="package/$pkg?height=350&width=650" rel="facebox" title="General information for package $pkg">$pkg</a></h3>
  76 + <h3><a href="package/$pkg" rel="facebox" title="General information for package $pkg">$pkg</a></h3>
76 77 <a class="link-thumb" rel="facebox" href="http://screenshots.debian.net/screenshot/$pkg?.jpg" title="Screenshot of package $pkg">
77 78 <img src="http://screenshots.debian.net/thumbnail/$pkg" alt="Screenshot $pkg" />
78 79 </a>
79   - <p class="thumb-caption"> $pkg_summaries[pkg] </p>
  80 + <p class="thumb-caption"><a href="package/$pkg" rel="facebox" title="General information for package $pkg"> $pkg_summaries[pkg] </a></p>
80 81 </div>
81 82 $if count == 5:
82 83 $ count = 0
... ...
src/web/templates/error.html
  Diff comments   View file @e63c64d
1 1 $def with (error_msgs)
2 2 $var title: Error
3 3 $var mod = 'error';
4   -$var cssfiles:
5   -$var jsfiles:
  4 +$var cssfiles: static/css/facebox.css
  5 +$var jsfiles: static/js/facebox.js
6 6  
7 7  
8 8 <div id="maincontent">
... ...
src/web/templates/index.html
  Diff comments   View file @e63c64d
... ... @@ -659,8 +659,8 @@ function showtags(tagid) {
659 659 </div><!-- id="tab-wrap" -->
660 660 </div><!-- id="tab-area" -->
661 661  
  662 +<br style="clear: both" />
662 663 </div><!-- class="innertube" -->
663   -<br style="clear: both">
664 664 </div><!-- id="sidebar" -->
665 665  
666 666 <div id="maincontent">
... ...
src/web/templates/layout.html
  Diff comments   View file @e63c64d
... ... @@ -24,27 +24,28 @@ $ url_base = &quot;http://localhost:8080&quot;
24 24  
25 25 </head>
26 26  
27   -<body class="$content.title">
  27 +<body class="$content.mod">
28 28  
29 29 <div id="wrap">
30 30 <div id="header">
31 31  
32   -<form action="apprec" enctype="multipart/form-data" method="post" name="weboptions">
  32 +<form action="apprec" enctype="multipart/form-data" method="post" name="recommenderbox-form">
33 33 <fieldset>
34 34 <div id="recommender-box">
35 35 <div id="submit-box">
36 36 <input type="submit" value="Recommender!"><br />
37   - <a href="#toggleText" rel="facebox">custom query setup?</a>
  37 + [<a href="#advancedquery" rel="facebox">advanced query</a>]
38 38 </div>
39 39 <div id="input-box">
40 40 <a href="#attachfile" rel="facebox" id="upfile"><span style="display: none;">Upload a file.</span></a>
41 41 <label title="App list"><textarea class="focused" onfocus="this.form.className='focused';
42   - if(this.value=='Write your list App here or send a file list this icon:'){this.value=''}" onblur="this.form.className='';
43   - if(/^\s*$$/.test(this.value)){ this.value='Write your list App here or send a file list this icon:';
44   - this.form.className='clean' }" rows="2" cols="55" name="pkgs_list" id="pkgs_list">Write your list App here or send a file list this icon:</textarea></label>
45   -
  42 + if(this.value=='Write your list App here or send a file list this icon:'){this.value=''}" onblur="this.form.className='';
  43 + if(/^\s*$$/.test(this.value)){ this.value='Write your list App here or send a file list this icon:';
  44 + this.form.className='clean' }" rows="2" cols="55" name="pkgs_list" id="pkgs_list"
  45 + >Write your list App here or send a file list this icon:</textarea></label>
46 46 </div>
47 47 </div>
  48 + <input type="file" name="pkgs_file" size="18" style="display: none;" />
48 49 <input type="hidden" name="weight" value="BM25" checked="checked">
49 50 <input type="hidden" name="strategy" value="content" checked="checked">
50 51 <input type="hidden" name="profile_size" value="10" size="4">
... ... @@ -58,9 +59,9 @@ $ url_base = &quot;http://localhost:8080&quot;
58 59 <!-- BOX ATTACHMENT FILE -->
59 60 <div id="attachfile" style="display: none;">
60 61 <h2>Recommendation with file list</h2>
61   -<form action="apprec" enctype="multipart/form-data" method="post" name="weboptions">
  62 +<form action="apprec" enctype="multipart/form-data" method="post" name="uploadbox-form">
62 63 <fieldset>
63   - <label title="Upload file">Upload file: <input type="file" id="pkgs_file" name="pkgs_file" size="13" /></label>
  64 + <label title="Upload file">Upload file: <input type="file" name="pkgs_file" size="18"/></label>
64 65 <p>
65 66 You can use file <strong>/var/log/popularity-contest</strong> or create a with <strong>dpkg</strong>, use:
66 67 <code>
... ... @@ -80,102 +81,80 @@ You can use file &lt;strong&gt;/var/log/popularity-contest&lt;/strong&gt; or create a with &lt;
80 81 </div><!-- id="attachfile" -->
81 82 <!-- END BOX ATTACHMENT FILE -->
82 83  
83   -<div id="toggleText" style="display: none">
  84 +<!-- Dynamic form -->
  85 +<script type="application/javascript">
  86 +window.onload = function() {
  87 + setupDependencies('weboptions'); //name of form(s). Seperate each with a comma (ie: 'weboptions', 'myotherform' )
  88 + };
  89 +</script>
  90 +
  91 +<div id="advancedquery" style="display: none">
84 92 <form action="apprec" enctype="multipart/form-data" method="post" name="weboptions">
85   - <fieldset>
86   - <legend>Your packages</legend>
87   - <div>
88   - <label>Packages list<textarea rows="2" cols="33" name="pkgs_list" id="pkgs_list"></textarea></label>
89   - <label>Upload file<input type="file" id="pkgs_file" name="pkgs_file" size="18"/></label>
90   - </div>
91   - </fieldset>
  93 +
92 94 <fieldset>
93   - <legend>General</legend>
94   - <div>
  95 + <legend>General</legend>
  96 +<div>
95 97 <label><input type="hidden">Profile size:</label>
96   - </div>
97   - <div>
98 98 <label class="special"><input type="text" name="profile_size" value="10" size="4"></label>
99   - </div>
100   - <div>
101 99 <label><input type="hidden">Recommendations:</label>
102   - </div>
103   - <div>
104 100 <label class="special"><input type="text" name="limit" value="10" size="4"></label>
105   - </div>
106   - <div>
  101 +</div><div>
107 102 <label><input type="hidden">Weighting:</label>
108   - </div>
109   - <div>
110 103 <label class="special"><input type="radio" name="weight" value="BM25" checked="checked"> BM25</label>
111   - </div>
112   - <div>
113 104 <label class="special"><input type="radio" name="weight" value="trad"> Traditional</label>
114   - </div>
115   - <div>
  105 +</div><div>
116 106 <label><input type="hidden">Strategy:</label>
117   - </div>
118   - <div>
119   - <label class="special"><input type="radio" name="strategy" value="content" checked="checked"> Content-based</label>
120   - </div>
121   - <div>
122   - <label class="special"><input type="radio" name="strategy" value="collab"> Collaborative</label>
123   - </div>
124   - <div>
125   - <label class="special"><input type="radio" name="strategy" value="hybrid"> Hybrid</label>
126   - </div>
  107 +<div id="tab-area">
  108 + <ul id="list-tabs">
  109 + <li class="tab-one"><a href="#content-form">
  110 + <label class="special"><input type="radio" name="strategy" value="content" id="strategy-content"> Content-based</label>
  111 + </a></li>
  112 + <li class="tab-two"><a href="#colaborative-form">
  113 + <label class="special"><input type="radio" name="strategy" value="collab" id="strategy-collaborative"> Collaborative</label>
  114 + </a></li>
  115 + <li class="tab-three"><a href="#hybrid-form">
  116 + <label class="special"><input type="radio" name="strategy" value="hybrid" id="strategy-hybrid"> Hybrid</label>
  117 + </a></li>
  118 + </ul>
  119 + </div>
  120 +
  121 +</div>
127 122 </fieldset>
128 123 <fieldset>
129   - <legend>Tuning up</legend>
130   - <div>
131   - <label><input type="hidden" class="DEPENDS ON strategy BEING content OR strategy BEING hybrid">Content representation:</label>
132   - </div>
133   - <div>
134   - <label class="special"><input type="radio" name="content" value="tag" class="DEPENDS ON strategy BEING content OR strategy BEING hybrid"> tag</label>
135   - </div>
136   - <div>
137   - <label class="special"><input type="radio" name="content" value="desc" class="DEPENDS ON strategy BEING content OR strategy BEING hybrid"> description</label>
138   - </div>
139   - <div>
140   - <label class="special"><input type="radio" name="content" value="full" class="DEPENDS ON strategy BEING content OR strategy BEING hybrid"> both</label>
141   - </div>
142   - <div>
143   - <label><input type="hidden" class="DEPENDS ON strategy BEING collab OR strategy BEING hybrid">Clustering:</label>
144   - </div>
145   - <div>
146   - <label class="special"><input type="radio" name="cluster" value="yes" class="DEPENDS ON strategy BEING collab OR strategy BEING hybrid"> yes</label>
147   - </div>
148   - <div>
149   - <label class="special"><input type="radio" name="cluster" value="no" class="DEPENDS ON strategy BEING collab OR strategy BEING hybrid"> no</label>
150   - </div>
151   - <div>
152   - <label><input type="hidden" class="DEPENDS ON strategy BEING hybrid">Neighborhood:</label>
153   - </div>
154   - <div>
155   - <label class="special"><input type="text" name="neighbours" class="DEPENDS ON strategy BEING hybrid" value="50" size="4"></label>
156   - </div>
157   - <div>
158   - <label><input type="hidden" class="DEPENDS ON strategy BEING hybrid">Personal profile:</label>
159   - </div>
160   - <div>
161   - <label class=special><input type="checkbox" name="profile_desktop" class="DEPENDS ON strategy BEING hybrid" > Desktop</label>
162   - </div>
163   - <div>
164   - <label class=special><input type="checkbox" name="profile_admin" class="DEPENDS ON strategy BEING hybrid" > Admin</label>
165   - </div>
166   - <div>
167   - <label class=special><input type="checkbox" name="profile_devel" class="DEPENDS ON strategy BEING hybrid" > Devel</label>
168   - </div>
169   - <div>
170   - <label class=special><input type="checkbox" name="profile_science" class="DEPENDS ON strategy BEING hybrid" > Science</label>
171   - </div>
172   - <div>
173   - <label class=special><input type="checkbox" name="profile_arts" class="DEPENDS ON strategy BEING hybrid" > Arts</label>
174   - </div>
  124 + <legend>Tuning up</legend>
  125 + <div id="content-form" class="group-form group-hybrid">
  126 + <label><input type="hidden" class="DEPENDS ON strategy BEING content OR strategy BEING hybrid">Content representation:</label>
  127 + <label class="special"><input type="radio" name="content" value="tag" class="DEPENDS ON strategy BEING content OR strategy BEING hybrid"> tag</label>
  128 + <label class="special"><input type="radio" name="content" value="desc" class="DEPENDS ON strategy BEING content OR strategy BEING hybrid"> description</label> <label class="special"><input type="radio" name="content" value="full" class="DEPENDS ON strategy BEING content OR strategy BEING hybrid"> both</label>
  129 + </div>
  130 + <div id="colaborative-form" class="group-form group-hybrid">
  131 + <label><input type="hidden">Clustering:</label>
  132 + <label class="special"><input type="radio" name="cluster" value="yes"> yes</label>
  133 + <label class="special"><input type="radio" name="cluster" value="no"> no</label>
  134 + </div>
  135 + <div id="hybrid-form" class="group-form group-hybrid">
  136 + <label><input type="hidden" class="DEPENDS ON strategy BEING hybrid">Neighborhood:</label>
  137 + <label class="special"><input type="text" name="neighbours" class="DEPENDS ON strategy BEING hybrid" value="50" size="4"></label>
  138 + <label><input type="hidden" class="DEPENDS ON strategy BEING hybrid">Personal profile:</label>
  139 + <label class=special><input type="checkbox" name="profile_desktop" class="DEPENDS ON strategy BEING hybrid" > Desktop</label>
  140 + <label class=special><input type="checkbox" name="profile_admin" class="DEPENDS ON strategy BEING hybrid" > Admin</label>
  141 + <label class=special><input type="checkbox" name="profile_devel" class="DEPENDS ON strategy BEING hybrid" > Devel</label>
  142 + <label class=special><input type="checkbox" name="profile_science" class="DEPENDS ON strategy BEING hybrid" > Science</label>
  143 + <label class=special><input type="checkbox" name="profile_arts" class="DEPENDS ON strategy BEING hybrid" > Arts</label>
  144 + </div>
175 145 </fieldset>
  146 + <fieldset>
  147 + <legend>Your packages</legend>
  148 + <div>
  149 + <label>Packages list<textarea rows="2" cols="33" name="pkgs_list" id="pkgs_list"></textarea></label>
  150 + <label>Upload file<input type="file" id="pkgs_file" name="pkgs_file" size="18"/></label>
  151 + </div>
  152 + </fieldset>
176 153 <div style="text-align: right;"><input type="submit"></div>
177 154 </form>
178   -</div>
  155 +
  156 +
  157 +</div><!-- id="advancedquery" -->
179 158  
180 159 <div id="navbar">
181 160 <ul>
... ...
src/web/templates/package.html
  Diff comments   View file @e63c64d
1 1 $def with (pkg)
2   -<img src="http://qa.debian.org/popcon-png.php?packages=$pkg['package']&show_installed=on&want_legend=on&want_ticks=on&date_fmt=%25Y-%25m&beenhere=1');" width="150px;" style="float: right;" >
3   -<br />
4   - <div class="align-right">
5   - <button type="button" class="like_button" onclick=";return false;" id="like" >
6   - <img src="/static/images/pixel-vfl73.gif" alt="">
7   - </button>
8   - &nbsp;
9   - <button type="button" class="dislike_button" onclick=";return false;" id="dislike" >
10   - <img src="/static/images/pixel-vfl73.gif" alt="">
11   - </button>
12   - &nbsp;
13   - <div id="update_count" style="float:left;">
14   - <?php include ('update_box.php')?>
15   - </div>
16   - <br clear="all" />
17   - <div id="voting_result">
18   - </div>
19   - </div>
20   -<br />
21   -<br />
22   -<div class="graybox">
23   -<h1>$pkg['package'] - <i>$pkg['description']</i></h1>
24   -<table><tr><td class="noborder">
  2 +
  3 +<div id="debtags_box" class="graybox">
  4 +<h2>Debtags</h2>
  5 +<ul id="debtags_pkg">
  6 +$for facet, tags in pkg['tag'].items():
  7 + <li> $facet
  8 + <ul>
  9 + $for tag in tags:
  10 + <li>$tag</li>
  11 + </ul>
  12 + </li>
  13 +</ul>
  14 +</div><!-- id="debtags_box" -->
  15 +
  16 +<div class="align-left" id="voting_box">
  17 + <button type="button" class="like_button" onclick=";return false;" id="like" >
  18 + <img src="/static/images/pixel-vfl73.gif" alt="">
  19 + </button>
  20 + &nbsp;
  21 + <button type="button" class="dislike_button" onclick=";return false;" id="dislike" >
  22 + <img src="/static/images/pixel-vfl73.gif" alt="">
  23 + </button>
  24 + &nbsp;
  25 + <div id="update_count" style="float:left;">
  26 + <?php include ('update_box.php')?>
  27 + </div>
  28 + <div id="voting_result">
  29 + </div>
  30 +</div><!-- id="voting_box" -->
  31 +
  32 +<h1 id="title_pkg">$pkg['package'] <br /><span>$pkg['description']</span></h1>
  33 +<p>
25 34 <h2>Details</h2>
26   -<ul>
  35 +
  36 + <ul>
27 37 <li><b>Description</b>: <br />$:pkg['long_description']</li>
28 38 $if pkg['homepage']:
29 39 <li><b>Homepage</b>:<a href="$pkg['homepage']">$pkg['homepage']</a></li>
... ... @@ -37,7 +47,11 @@ $def with (pkg)
37 47 $if pkg['origin']:
38 48 <li><b>Origin</b>: $pkg['origin']</li>
39 49 <li><b>Maintainer</b>: $pkg['maintainer']</li>
40   -</ul>
  50 + </ul>
  51 +
  52 +</p>
  53 +
  54 +<div id="debresources_box" class="graybox">
41 55 <h2>Debian resources:</h2>
42 56 <ul>
43 57 <li><a href="http://packages.debian.org/$pkg['package']">Package page on debian.org</a></li>
... ... @@ -47,21 +61,7 @@ $def with (pkg)
47 61 <li><a href="http://patch-tracker.debian.org/package/$pkg['package']">Debian patch tracking system</a></li>
48 62 <li><a href="http://screenshots.debian.net/package/$pkg['package']">Screenshots</a></li>
49 63 </ul>
50   -</td>
51   -<td class="noborder">
52   -<p>&nbsp;</p>
53   -</td>
54   -<td class="noborder">
55   -<h2>Debtags</h2>
56   -<ul>
57   -$for facet, tags in pkg['tag'].items():
58   - <li><b>$facet: </b></li>
59   - <ul>
60   - $for tag in tags:
61   - <li>$tag</li>
62   - </ul>
63   -</ul>
64   -</td>
65   -</tr></table>
66   -</div>
67   -</div>
  64 +</div><!-- id="debresources_box -->
  65 +
  66 +
  67 +
... ...