Merge lp:~zematynnad/ubuntu-webcatalog/fix_no_enlarger_845911 into lp:ubuntu-webcatalog

Proposed by Danny Tamez
Status: Merged
Approved by: Łukasz Czyżykowski
Approved revision: 126
Merged at revision: 130
Proposed branch: lp:~zematynnad/ubuntu-webcatalog/fix_no_enlarger_845911
Merge into: lp:ubuntu-webcatalog
Diff against target: 148 lines (+53/-61)
2 files modified
src/webcatalog/static/js/screenshots.js (+53/-60)
src/webcatalog/templates/webcatalog/screenshot_widget.html (+0/-1)
To merge this branch: bzr merge lp:~zematynnad/ubuntu-webcatalog/fix_no_enlarger_845911
Reviewer Review Type Date Requested Status
Canonical Consumer Applications Hackers Pending
Review via email: mp+107848@code.launchpad.net

Commit message

Fix for javascript errors after ajax returns more screenshots for app.

Description of the change

Overview
========
This branch fixes a condition where the screenshot enlarger was not being displayed when screenshots were obtained via ajax.

Details
========
Because the number of screenshots was critical to much of the logic in the screenshots.js page the ajax portion of it was causing some issues when it changed the number of screenshots. For example the setup_carouse function was only defined if there was originally more than one screenshot. So, when via ajax we now had more screenshots the function to set up the carousel was not defined.
So now what the script does is settle at the outset the number of screenshots (via ajax or not) so that the number change happens before any logic that depends on that number.
I also removed a small line of debug code in the html page.

To Run the Tests
=========
$fab bootstrap test

To View the Different Scenarios in the Browser
===============================================
0 screenshots: http://localhost:8000/cat/applications/gstreamer0.10-fluendo-plugins-wmv/
1 screenshot: http://localhost:8000/cat/applications/ubuntu-user-de-issue-201202/
1 screenshot after ajax: http://localhost:8000/cat/applications/skype/
2 or more screenshots: http://localhost:8000/cat/applications/precise/defcon/

To post a comment you must log in.

Preview Diff

[H/L] Next/Prev Comment, [J/K] Next/Prev File, [N/P] Next/Prev Hunk
=== modified file 'src/webcatalog/static/js/screenshots.js'
--- src/webcatalog/static/js/screenshots.js 2012-05-18 20:40:15 +0000
+++ src/webcatalog/static/js/screenshots.js 2012-05-29 18:49:22 +0000
@@ -1,64 +1,11 @@
1var setup_screenshots = function(num_screenshots, appName, combo_path, ajax_uri) {1var setup_screenshots = function(num_screenshots, appName, combo_path, ajax_uri) {
2 YUI({combine: true, comboBase: combo_path, root: 'yui/3.4.0/build/'}).use('io-base','uwc-carousel', function(Y) {2 YUI({combine: true, comboBase: combo_path, root: 'yui/3.4.0/build/'}).use('io-base','uwc-carousel', function(Y) {
3
4 Y.on('domready', setupViewerPanel, false);
5 // viewer needs to be setup even if there is only one screenshot and no carousel is used
6 function setupViewerPanel(addedMoreViaAjax) {
7 // don't set up if there are no screenshots
8 if (num_screenshots == 0) {
9 // but do set up if we get called a second time when adding screenshots via ajax
10 if (!addedMoreViaAjax) {
11 return;
12 }
13 }
14 var panel = new Y.Panel({
15 width: 860,
16 centered: true,
17 zIndex: 50,
18 modal: true,
19 visible: false,
20 render: false,
21 buttons: [
22 {
23 value: 'Close',
24 section: 'footer',
25 action: function(e) {
26 e.preventDefault();
27 panel.hide();
28 }
29 }
30 ]
31 });
32 var bb = panel.get('boundingBox');
33 var slides = Y.all('.slide img');
34 slides.on("click", function(e){
35 var slide = e.currentTarget;
36 var url = slide.getAttribute('src');
37 heading = appName + ' - screeshot ';
38 panel.setStdModContent(Y.WidgetStdMod.HEADER, heading);
39 panel.setStdModContent(Y.WidgetStdMod.BODY, '<img width="800" src="' + url +'"/>');
40 panel.render('#viewerPanel');
41 panel.show();
42 }, this);
43 }
44
45 if (num_screenshots > 1) {
46 function setup_carousel() {
47 var caro = new Y.uwc.Carousel({
48 nodeContainer: "#screenshots-carousel",
49 controlsContainer: "#nocontrols",
50 autoPlay: false,
51 slideAnimDuration: 0.6
52 });
53 Y.all('.slide').removeClass('disabled');
54 }
55 }
56
57 if (num_screenshots == 0) {3 if (num_screenshots == 0) {
58 var uri = ajax_uri;4 var uri = ajax_uri;
59 function complete(id, obj) {5 function complete(id, obj) {
60 var json = JSON.parse(obj.responseText);6 var json = JSON.parse(obj.responseText);
61 if (json.length > 1) {7 num_screenshots = json.length;
8 if (num_screenshots > 0) {
62 var content_div = document.createElement('div');9 var content_div = document.createElement('div');
63 content_div.className = 'carousel-wrapper';10 content_div.className = 'carousel-wrapper';
64 var carousel_div = document.createElement('div');11 var carousel_div = document.createElement('div');
@@ -81,16 +28,62 @@
81 screenshots_div.get('childNodes').remove();28 screenshots_div.get('childNodes').remove();
82 screenshots_div.appendChild(content_div);29 screenshots_div.appendChild(content_div);
83 setup_carousel();30 setup_carousel();
84 setupViewerPanel(true);31 setupViewerPanel();
85 } else if (json.lenth == 1) {32 };
86 // in case we only got back 1 from ajax - still need the viewer
87 setupViewerPanel(true);
88 }
89 };33 };
90 Y.on('io:complete', complete, Y);34 Y.on('io:complete', complete, Y);
91 var request = Y.io(uri);35 var request = Y.io(uri);
92 } else {36 } else {
93 setup_carousel();37 setup_carousel();
38 setupViewerPanel();
39 }
40
41 function setupViewerPanel() {
42 if (num_screenshots == 0) {
43 return;
44 }
45 var panel = new Y.Panel({
46 width: 860,
47 centered: true,
48 zIndex: 50,
49 modal: true,
50 visible: false,
51 render: false,
52 buttons: [
53 {
54 value: 'Close',
55 section: 'footer',
56 action: function(e) {
57 e.preventDefault();
58 panel.hide();
59 }
60 }
61 ]
62 });
63 var bb = panel.get('boundingBox');
64 var slides = Y.all('.slide img');
65 slides.on("click", function(e){
66 var slide = e.currentTarget;
67 var url = slide.getAttribute('src');
68 heading = appName + ' - screeshot ';
69 panel.setStdModContent(Y.WidgetStdMod.HEADER, heading);
70 panel.setStdModContent(Y.WidgetStdMod.BODY, '<img width="800" src="' + url +'"/>');
71 panel.render('#viewerPanel');
72 panel.show();
73 }, this);
74 }
75
76 function setup_carousel() {
77 if (num_screenshots < 2) {
78 return;
79 }
80 var caro = new Y.uwc.Carousel({
81 nodeContainer: "#screenshots-carousel",
82 controlsContainer: "#nocontrols",
83 autoPlay: false,
84 slideAnimDuration: 0.6
85 });
86 Y.all('.slide').removeClass('disabled');
94 }87 }
95 });88 });
96}89}
9790
=== modified file 'src/webcatalog/templates/webcatalog/screenshot_widget.html'
--- src/webcatalog/templates/webcatalog/screenshot_widget.html 2012-05-08 17:03:43 +0000
+++ src/webcatalog/templates/webcatalog/screenshot_widget.html 2012-05-29 18:49:22 +0000
@@ -1,5 +1,4 @@
1{% load url from future %}1{% load url from future %}
2<div id='console'></div>
3<div id="screenshots_placeholder">2<div id="screenshots_placeholder">
4{% if application.screenshots|length_is:0 %}3{% if application.screenshots|length_is:0 %}
5 <img src="http://screenshots.ubuntu.com/thumbnail-with-version/{{ application.package_name }}/ignored" />4 <img src="http://screenshots.ubuntu.com/thumbnail-with-version/{{ application.package_name }}/ignored" />

Subscribers

People subscribed via source and target branches