Ubuntu Community Website

Merge lp:~ian-weisser/ubuntu-community-website/asknot-php into lp:ubuntu-community-website

  1. asknot-php
  2. Merge into trunk
Proposed by Ian Weisser on 2015-01-04
Status: Rejected
Rejected by: Michael Hall on 2015-01-13
Proposed branch: lp:~ian-weisser/ubuntu-community-website/asknot-php
Merge into: lp:ubuntu-community-website
Diff against target: 654 lines (+595/-1)
6 files modified
guidance_wizard.php (+190/-0)
guidance_wizard_header.php (+14/-0)
header.php (+10/-0)
library/css/guidance_wizard.css (+160/-0)
library/js/guidance_wizard.js (+213/-0)
page.php (+8/-1)
To merge this branch: bzr merge lp:~ian-weisser/ubuntu-community-website/asknot-php
Reviewer Review Type Date Requested Status
Michael Hall (community) 2015-01-05 Disapprove on 2015-01-13
Ubuntu Community Website Admins 2015-01-04 Pending
Review via email: mp+245516@code.launchpad.net

Description of the Change

Added a version of the Mozilla AskNot volunteer tool. Work item from the Ubuntu Community Team.
- Content changed to match many Ubuntu community roles.
- Format modified to conform with Ubuntu website design guidelines.
- HTML uses standard tags (<p>, <li>, etc) to inherit Ubuntu website CSS.
- HTML and CSS use non-conflicting class names and id names.

Sources: https://github.com/jdm/asknot, https://github.com/ian-weisser/asknot
License: Mozilla Public License - https://www.mozilla.org/MPL/

This version has data as a php template (guidance_wizard.php) instead of a Wordpress <article> (MySQL content). To put the data in MySQL instead:
1) Remove the template hook from the bottom of page.php
2) Copy the content of guidance_wizard.php into the content of the page.
3) Fix the nine image links in the content. May need to upload the images instead of storing them in library/images/pictograms
(Obviously I can't do steps 2 and 3 in this branch since it doesn't include the database)

Data in PHP Template vs in MySQL Content:
The branch has been tested both ways, and works equally well.
When teams want to change the volunteer roles they advertise:
- If you want bug reports, and you change the HTML manually, use content in MySQL.
- If you want teams to edit the HTML themselves, and push merge requests to you, use PHP Template.
I recommend staying with the PHP Template. In my testing, I found it simpler to maintain.

Testing:
- This branch will, of course, try to replace any 'Ubuntu' Wordpress theme you already have installed.
- Create a sample page titled 'Contribute'. The hooks in header.php and page.php look for that page name.
- jQuery.js is required for AskNot to work, and is included in Wordpress, but is not loaded by trunk nor this branch (apparently it's loaded by something else outside this branch). A jQuery loader for testing is in for testing is in guidance_wizard_header.php: Uncomment the loader for testing if needed.
- Once you have a 'Contribute' page and enabled jQuery, the tool should automatically show up on that page.
- For troubleshooting, a non-wordpress version of the same HTML/CSS/JS is at https://github.com/ian-weisser/asknot with a very detailed README.

How to change the content without breaking the tool:
See the bottom of the README at https://github.com/ian-weisser/asknot

To post a comment you must log in.
Nicholas Skaggs (nskaggs) wrote :

Awesome! I'll have a play with this and send you some comments. Thanks Ian!

Ian Weisser (ian-weisser) wrote :

FYI: mhall119 has already touched this, and apparently gone live with a
version: http://community.ubuntu.com/contribute/find-a-task

On Tue, 2015-01-13 at 15:19 +0000, Nicholas Skaggs wrote:
> Awesome! I'll have a play with this and send you some comments. Thanks Ian!

Michael Hall (mhall119) wrote :

Rejecting this from the branch because I've added it through Wordpress already: http://community.ubuntu.com/contribute/find-a-task/

review: Disapprove

Unmerged revisions

10. By Ian Weisser on 2015-01-04

Add AskNot job board tool as a php snippet.

Preview Diff

[H/L] Next/Prev Comment, [J/K] Next/Prev File, [N/P] Next/Prev Hunk
1=== added file 'guidance_wizard.php'
2--- guidance_wizard.php 1970-01-01 00:00:00 +0000
3+++ guidance_wizard.php 2015-01-04 17:46:44 +0000
4@@ -0,0 +1,190 @@
5+ <hr>
6+ <a name="guidance_wizard"></a>
7+ <br />
8+ <br />
9+
10+
11+ <div id="volunteer_wizard_intro">
12+ <h2>Volunteers Wanted</h2>
13+ <p>Browse some of the volunteer roles available. Explore using the buttons below.
14+ </div>
15+
16+
17+
18+ <div id="volunteer_wizard">
19+
20+ <div class="group" id="toplevel">
21+ <p class="question"><img src="<?php echo get_stylesheet_directory_uri(); ?>/library/images/pictograms/pictogram-community-50x50.png">I am interested in...</p>
22+ <ul class="choices">
23+ <li next-group="advocate"><h3>Advocacy</h3></li>
24+ <li next-group="communicate"><h3>Writing and editing</h3></li>
25+ <li next-group="develop"><h3>Coding and development</h3></li>
26+ <li next-group="quality"><h3>Quality and design</h3></li>
27+ <li next-group="support"><h3>Support</h3></li>
28+ </ul>
29+ </div>
30+
31+
32+
33+ <div class="group" id="advocate">
34+ <p class="question"><img src="<?php echo get_stylesheet_directory_uri(); ?>/library/images/pictograms/pictogram-quote-50x50.png">Do you want to tell the world about Ubuntu? You could help:</p>
35+ <ul class="choices">
36+ <li target="http://www.spreadubuntu.org/en/spreadubuntu-our-project"><h3>Create</h3>
37+ <p class="extra">Create materials for the Spreadubuntu project</p>
38+ </li>
39+ <li target="http://www.spreadubuntu.org/"><h3>Persuade</h3>
40+ <p class="extra">Evangelize with the Spreadubuntu project</p>
41+ </li>
42+ <li target="https://wiki.ubuntu.com/StartUbuntu#HOWTO_Help.3F"><h3>Convert WinXP users</h3>
43+ <p class="extra">Evangelize with the Startubuntu project</p>
44+ </li>
45+ </ul>
46+ </div>
47+
48+
49+
50+ <div class="group" id="communicate">
51+ <p class="question"><img src="<?php echo get_stylesheet_directory_uri(); ?>/library/images/pictograms/pictogram-camera-50x50.png">Do you have a mighty pen? You could help:</p>
52+ <ul class="choices">
53+ <li target="https://wiki.ubuntu.com/UbuntuWeeklyNewsletter/Join"><h3>Interview</h3>
54+ <p class="extra">Get the message across in the Ubuntu Weekly News</p>
55+ </li>
56+ <li target="https://wiki.ubuntu.com/Classroom"><h3>Teach</h3>
57+ <p class="extra">Share your knowledge and skills in Ubuntu Classroom</p>
58+ </li>
59+ <li target="http://community.ubuntu.com/contribute/translations/"><h3>Translate</h3>
60+ <p class="extra">Help make Ubuntu accessible to everyone</p>
61+ </li>
62+ <li target="https://wiki.ubuntu.com/DocumentationTeam"><h3>Edit and update documentation</h3>
63+ <p class="extra">with the Ubuntu Documentation Team</p>
64+ </li>
65+ <li target="https://wiki.ubuntu.com/UbuntuWeeklyNewsletter/Join"><h3>Write/edit news copy</h3>
66+ <p class="extra">for the Ubuntu Weekly News</p>
67+ </li>
68+ <li target="http://ubuntuforums.org/forumdisplay.php?f=100"><h3>Compile tutorials</h3>
69+ <p class="extra">for the Ubuntu Forums</p>
70+ </li>
71+ <li target="http://askubuntu.com/"><h3>Edit</h3>
72+ <p class="extra">questions and answers at AskUbuntu</p>
73+ </li>
74+ </ul>
75+ </div>
76+
77+
78+
79+ <div class="group" id="develop">
80+ <p class="question"><img src="<?php echo get_stylesheet_directory_uri(); ?>/library/images/pictograms/pictogram-developer-50x50.png">Do you want to change the world with great software? You could help:</p>
81+ <ul class="choices">
82+ <li target="https://wiki.ubuntu.com/QATeam/Roles/BugTriager"><h3>Triage bugs</h3>
83+ <p class="extra">with the Ubuntu QA Team</p>
84+ </li>
85+ <li target="https://wiki.ubuntu.com/One%20Hundred%20Papercuts"><h3>Patch simple bugs</h3>
86+ <p class="extra">with the One Hundred Papercuts Project</p>
87+ </li>
88+ <li target="http://developer.ubuntu.com/"><h3>Develop applications</h3>
89+ <p class="extra">for Cloud, Server, Desktop, Tablet, and/or Phone</p>
90+ </li>
91+ <li target="https://wiki.ubuntu.com/FoundationsTeam"><h3>Improve the core OS</h3>
92+ <p class="extra">with the Ubuntu Foundations Team</p>
93+ </li>
94+ <li target="https://wiki.ubuntu.com/QATeam/Roles/Developer"><h3>Create infrastructure tools</h3>
95+ <p class="extra">with the Ubuntu QA Team</p>
96+ </li>
97+ <li target="http://packaging.ubuntu.com/"><h3>Package software</h3>
98+ <p class="extra">to add to Ubuntu</p>
99+ </li>
100+ <li target="https://wiki.ubuntu.com/SecurityTeam/GettingInvolved"><h3>Protect millions</h3>
101+ <p class="extra">with the Ubuntu Security Team</p>
102+ </li>
103+ <li target="https://wiki.ubuntu.com/QATeam/Roles/TestWriter"><h3>Write automated tests</h3>
104+ <p class="extra">with the Ubuntu QA Team</p>
105+ </li>
106+ <li target="https://wiki.ubuntu.com/QATeam/Roles/Tester"><h3>Test the development release</h3>
107+ <p class="extra">with the Ubuntu QA Team</p>
108+ </li>
109+ <li target="http://community.ubuntu.com/contribute/design/"><h3>Visual experience</h3>
110+ <p class="extra">Wallpapers, art, and user experience design</p>
111+ </li>
112+ </ul>
113+ </div>
114+
115+
116+
117+ <div class="group" id="quality">
118+ <p class="question"><img src="<?php echo get_stylesheet_directory_uri(); ?>/library/images/pictograms/pictogram-dashboard-50x50.png">Do you enjoy finding mistakes and fixing problems? You could help:</p>
119+ <ul class="choices">
120+ <li target="https://wiki.ubuntu.com/FoundationsTeam"><h3>Improve the core OS</h3>
121+ <p class="extra">with the Ubuntu Foundations Team</p>
122+ </li>
123+ <li target="http://community.ubuntu.com/contribute/design/"><h3>User experience</h3>
124+ <p class="extra">Designing for the Desktop, Tablet, and Phone</p>
125+ </li>
126+ <li target="https://wiki.ubuntu.com/QATeam/Roles/Developer"><h3>Create infrastructure tools</h3>
127+ <p class="extra">with the Ubuntu QA Team</p>
128+ </li>
129+ <li target="https://wiki.ubuntu.com/SecurityTeam/GettingInvolved"><h3>Protect millions</h3>
130+ <p class="extra">with the Ubuntu Security Team</p>
131+ </li>
132+ <li target="https://wiki.ubuntu.com/QATeam/Roles/TestWriter"><h3>Write automated tests</h3>
133+ <p class="extra">with the Ubuntu QA Team</p>
134+ </li>
135+ <li target="https://wiki.ubuntu.com/QATeam/Roles/Tester"><h3>Test the development release</h3>
136+ <p class="extra">with the Ubuntu QA Team</p>
137+ </li>
138+ <li target="https://wiki.ubuntu.com/QATeam/Roles/BugTriager"><h3>Triage bugs</h3>
139+ <p class="extra">with the Ubuntu QA Team</p>
140+ </li>
141+ </ul>
142+ </div>
143+
144+
145+
146+ <div class="group" id="support">
147+ <p class="question"><img src="<?php echo get_stylesheet_directory_uri(); ?>/library/images/pictograms/pictogram-help-50x50.png">Do you like helping people? You could help:</p>
148+ <ul class="choices">
149+ <li target="http://ubuntuforums.org/forumdisplay.php?f=100"><h3>Compile tutorials</h3>
150+ <p class="extra">for the Ubuntu Forums</p>
151+ </li>
152+ <li target="http://ubuntuforums.org/"><h3>Provide one-on-one support</h3>
153+ <p class="extra">for the Ubuntu Forums</p>
154+ </li>
155+ <li target="http://askubuntu.com/"><h3>Answer questions</h3>
156+ <p class="extra">at AskUbuntu</p>
157+ </li>
158+ <li target="http://askubuntu.com/"><h3>Edit and refine answers</h3>
159+ <p class="extra">at AskUbuntu</p>
160+ </li>
161+ <li target="http://ubuntuforums.org/forumdisplay.php?f=100"><h3>Compile tutorials</h3>
162+ <p class="extra">for the Ubuntu Forums</p>
163+ </li>
164+ <li target="http://answers.launchpad.net/"><h3>Compile FAQs</h3>
165+ <p class="extra">at Launchpad Answers</p>
166+ </li>
167+ <li target="http://community.ubuntu.com/contribute/documentation/"><h3>Improve documentation</h3>
168+ <p class="extra">with the Ubuntu Documentation Team</p>
169+ </li>
170+ <li target="https://wiki.ubuntu.com/Classroom"><h3>Teach</h3>
171+ <p class="extra">Share your knowledge and skills in Ubuntu Classroom</p>
172+ </li>
173+ </ul>
174+ </div>
175+
176+
177+ <div id="responses">
178+ <div id="ok"><a href="javascript:"><img src="<?php echo get_stylesheet_directory_uri(); ?>/library/images/pictograms/pictogram-projects-we-love-25x25.png"><span class="textbutton">Tell me more</span></a></div>
179+
180+ <div id="next">
181+ <a href="javascript:"><img src="<?php echo get_stylesheet_directory_uri(); ?>/library/images/pictograms/pictogram-locations-25x25.png"><span class="textbutton negative">No thanks, try another</span><span class="textbutton negative">Show me something else</span><span class="textbutton negative">Too dull, keep going</span><span class="textbutton negative">Not interested, keep looking</span><span class="textbutton negative">Not a good fit, next please</span><span class="textbutton negative">Next please</span></a>
182+ </div>
183+
184+ <div id="back"><a href="javascript:"><img src="<?php echo get_stylesheet_directory_uri(); ?>/library/images/pictograms/pictogram-delete-25x25.png"><span class="textbutton">I was wrong, take me back</span></a></div>
185+
186+ <!-- message showing only if javascript disabled -->
187+ <noscript>
188+ <span>Please enable JavaScript in your browser!</span>
189+ </noscript>
190+ <!-- end of noscript message -->
191+
192+ </div> <!-- responses -->
193+
194+ </div> <!-- volunteer_wizard -->
195
196=== added file 'guidance_wizard_header.php'
197--- guidance_wizard_header.php 1970-01-01 00:00:00 +0000
198+++ guidance_wizard_header.php 2015-01-04 17:46:44 +0000
199@@ -0,0 +1,14 @@
200+<?php
201+ // Testing only - the Ubuntu style doesn't include jQuery, but the live website does.
202+ //echo "<script type='text/javascript' src='http://community.ubuntu.com/wp-includes/js/jquery/jquery.js?ver=1.11.0'></script>" . "\n";
203+
204+ // css header
205+ $guidance_wizard_css_uri = get_template_directory_uri() . '/library/css/guidance_wizard.css';
206+ $guidance_wizard_css_line = sprintf("<link rel='stylesheet' id='guidance-wizard-css' href='%s' type='text/css' />", $guidance_wizard_css_uri );
207+ echo $guidance_wizard_css_line . "\n";
208+
209+ // js header
210+ $guidance_wizard_js_uri = get_template_directory_uri() . '/library/js/guidance_wizard.js';
211+ $guidance_wizard_js_line = sprintf("<script type='text/javascript' src='%s'></script>", $guidance_wizard_js_uri );
212+ echo $guidance_wizard_js_line . "\n";
213+?>
214
215=== modified file 'header.php'
216--- header.php 2013-06-01 00:18:16 +0000
217+++ header.php 2015-01-04 17:46:44 +0000
218@@ -44,6 +44,16 @@
219 <!-- wordpress head functions -->
220 <?php wp_head(); ?>
221 <!-- end of wordpress head -->
222+
223+<!-- guidance wizard head -->
224+<?php
225+if (is_page( 'contribute' )) {
226+ echo "<!-- guidance wizard is only on the 'contribute' page -->\n";
227+ get_template_part( 'guidance_wizard_header' );
228+}
229+?>
230+<!-- end of guidance wizard head -->
231+
232
233 </head>
234
235
236=== added file 'library/css/guidance_wizard.css'
237--- library/css/guidance_wizard.css 1970-01-01 00:00:00 +0000
238+++ library/css/guidance_wizard.css 2015-01-04 17:46:44 +0000
239@@ -0,0 +1,160 @@
240+.negative {
241+ /* Used by guidance_wizard.js*/
242+ display: none;
243+}
244+
245+.visible {
246+ /* Used by guidance_wizard.js*/
247+ display: inline;
248+}
249+
250+
251+/* All data below here is identified with id="volunteer_wizard" to
252+ * prevent name conflicts with other styles and services.
253+ */
254+
255+#volunteer_wizard_intro {
256+ position: relative;
257+ left: 40px; /* Matches rest of the page content */
258+}
259+
260+#volunteer_wizard { /* div contains all data and js activity */
261+ position: relative;
262+ left: 40px; /* Matches the rest of page content */
263+ min-height: 250px; /* Prevent bottom of page from jumping around */
264+}
265+
266+
267+/* The question line is indented 40px (#volunteer_wizard),
268+ * then has a 50x50 icon at 40px
269+ * then has the text .question at 95px
270+ */
271+
272+#volunteer_wizard .question img {
273+ height: 50px;
274+ width: 50px;
275+ vertical-align: middle;
276+ position: relative;
277+ right: 5px;
278+}
279+
280+#volunteer_wizard .question { /* "How would you like to help?" */
281+ position: relative;
282+ left: 10px;
283+ display: none;
284+}
285+
286+
287+
288+#volunteer_wizard .choices li { /* "Create..." */
289+ /* includes .extra below */
290+ list-style-type: none; /* No bullets */
291+ display: none;
292+}
293+
294+#volunteer_wizard .extra { /* "...with the Ubuntu Security Team" */
295+ /* .extra is part of .choices li above */
296+}
297+
298+
299+/* Three possible reposnses (Tell me more, Next, Back)
300+ *
301+ * Each response includes a link, which in turn contains an icon
302+ * (img) at 60px and a colored button with text (.textbutton) at 90px
303+ *
304+ * Textbuttons also have events for mouseover and click.
305+ *
306+ * Button colors are from http://design.ubuntu.com/brand/colour-palette
307+ */
308+
309+
310+#volunteer_wizard #responses div {
311+ /* Generic div-wide behavior */
312+ margin-bottom: 0.75em; /* Vert spacing between buttons */
313+ display:none; /* In case JS is disabled */
314+}
315+
316+#volunteer_wizard #responses a {
317+ text-decoration: none; /* Hide the link underline in all buttons */
318+}
319+
320+#volunteer_wizard #responses img {
321+ /* Generic for all icons */
322+ position: relative;
323+ left: 60px;
324+ height: 25px;
325+ width: 25px;
326+ vertical-align:middle;
327+}
328+
329+#volunteer_wizard #responses .textbutton {
330+ /* Generic for all buttons */
331+ color: #fff;
332+ text-shadow: 0 1px 0 rgba(0,0,0,0.5);
333+ padding: 2px 10px 4px 5px;
334+ border-radius: 6px;
335+ border: 0 none;
336+}
337+
338+#volunteer_wizard #responses .textbutton:hover {
339+ /* Mouseover event all buttons */
340+ cursor: pointer;
341+ box-shadow: 0 3px rgba(0, 0, 0, 0.1), 0 -4px rgba(0, 0, 0, 0.1) inset, 0px 3px 48px rgba(255,255,255,0.2) inset;
342+}
343+
344+#volunteer_wizard #responses .textbutton:active {
345+ /* Click event all buttons */
346+ cursor: pointer;
347+ box-shadow: 0 3px rgba(0, 0, 0, 0.1) inset, 0 1px rgb(255, 255, 255, 0.1), 0px 3px 48px rgba(0,0,0,0.2) inset;
348+}
349+
350+
351+#volunteer_wizard #ok .textbutton {
352+ /* "Tell me more..." button
353+ * #DD4814 Ubuntu Orange 100%
354+ * #E77E5A Ubuntu Orange 70%
355+ */
356+ position: relative;
357+ left: 65px;
358+ background-color: #E77E5A;
359+ background: -moz-linear-gradient(#E77E5A, #DD4814) repeat scroll 0 0 #E77E5A;
360+ background: -webkit-linear-gradient(#E77E5A, #DD4814) repeat scroll 0 0 #E77E5A;
361+ background: -o-linear-gradient(#E77E5A, #DD4814) repeat scroll 0 0 #E77E5A;
362+ background: linear-gradient(#E77E5A, #DD4814) repeat scroll 0 0 #E77E5A;
363+ box-shadow: 0 2px rgba(0, 0, 0, 0.1), 0 -4px rgba(0, 0, 0, 0.1) inset;
364+}
365+
366+
367+#volunteer_wizard #next .textbutton {
368+ /* "No thanks, next..." button
369+ * #77216F Light Aubergine 100%
370+ * #9F639A Light Augergine 70%
371+ */
372+ position: relative;
373+ left: 65px;
374+ background-color: #9F639A;
375+ background: -moz-linear-gradient(#9F639A, #77216F) repeat scroll 0 0 #9F639A;
376+ background: -webkit-linear-gradient(#9F639A, #77216F) repeat scroll 0 0 #9F639A;
377+ background: -o-linear-gradient(#9F639A, #77216F) repeat scroll 0 0 #9F639A;
378+ background: linear-gradient(#9F639A, #77216F) repeat scroll 0 0 #9F639A;
379+ box-shadow: 0 2px rgba(0, 0, 0, 0.1), 0 -4px rgba(0, 0, 0, 0.1) inset;
380+}
381+
382+
383+#volunteer_wizard #back .textbutton {
384+ /* "I was wrong, take me back..." button
385+ * #AEA79F Warm Grey 100%
386+ * #C6C1BB Warm Grey 70%
387+ */
388+ position: relative;
389+ left: 65px;
390+ background-color: #C6C1BB;
391+ background: -moz-linear-gradient(#C6C1BB, #AEA79F) repeat scroll 0 0 #C6C1BB;
392+ background: -webkit-linear-gradient(#C6C1BB, #AEA79F) repeat scroll 0 0 #C6C1BB;
393+ background: -o-linear-gradient(#C6C1BB, #AEA79F) repeat scroll 0 0 #C6C1BB;
394+ background: linear-gradient(#C6C1BB, #AEA79F) repeat scroll 0 0 #C6C1BB;
395+ box-shadow: 0 2px rgba(0, 0, 0, 0.1), 0 -4px rgba(0, 0, 0, 0.1) inset;
396+}
397+
398+
399+
400
401=== added file 'library/images/pictograms/pictogram-camera-50x50.png'
402Binary files library/images/pictograms/pictogram-camera-50x50.png 1970-01-01 00:00:00 +0000 and library/images/pictograms/pictogram-camera-50x50.png 2015-01-04 17:46:44 +0000 differ
403=== added file 'library/images/pictograms/pictogram-community-50x50.png'
404Binary files library/images/pictograms/pictogram-community-50x50.png 1970-01-01 00:00:00 +0000 and library/images/pictograms/pictogram-community-50x50.png 2015-01-04 17:46:44 +0000 differ
405=== added file 'library/images/pictograms/pictogram-dashboard-50x50.png'
406Binary files library/images/pictograms/pictogram-dashboard-50x50.png 1970-01-01 00:00:00 +0000 and library/images/pictograms/pictogram-dashboard-50x50.png 2015-01-04 17:46:44 +0000 differ
407=== added file 'library/images/pictograms/pictogram-delete-25x25.png'
408Binary files library/images/pictograms/pictogram-delete-25x25.png 1970-01-01 00:00:00 +0000 and library/images/pictograms/pictogram-delete-25x25.png 2015-01-04 17:46:44 +0000 differ
409=== added file 'library/images/pictograms/pictogram-developer-50x50.png'
410Binary files library/images/pictograms/pictogram-developer-50x50.png 1970-01-01 00:00:00 +0000 and library/images/pictograms/pictogram-developer-50x50.png 2015-01-04 17:46:44 +0000 differ
411=== added file 'library/images/pictograms/pictogram-help-50x50.png'
412Binary files library/images/pictograms/pictogram-help-50x50.png 1970-01-01 00:00:00 +0000 and library/images/pictograms/pictogram-help-50x50.png 2015-01-04 17:46:44 +0000 differ
413=== added file 'library/images/pictograms/pictogram-locations-25x25.png'
414Binary files library/images/pictograms/pictogram-locations-25x25.png 1970-01-01 00:00:00 +0000 and library/images/pictograms/pictogram-locations-25x25.png 2015-01-04 17:46:44 +0000 differ
415=== added file 'library/images/pictograms/pictogram-projects-we-love-25x25.png'
416Binary files library/images/pictograms/pictogram-projects-we-love-25x25.png 1970-01-01 00:00:00 +0000 and library/images/pictograms/pictogram-projects-we-love-25x25.png 2015-01-04 17:46:44 +0000 differ
417=== added file 'library/images/pictograms/pictogram-quote-50x50.png'
418Binary files library/images/pictograms/pictogram-quote-50x50.png 1970-01-01 00:00:00 +0000 and library/images/pictograms/pictogram-quote-50x50.png 2015-01-04 17:46:44 +0000 differ
419=== added file 'library/js/guidance_wizard.js'
420--- library/js/guidance_wizard.js 1970-01-01 00:00:00 +0000
421+++ library/js/guidance_wizard.js 2015-01-04 17:46:44 +0000
422@@ -0,0 +1,213 @@
423+(function(jQuery) {
424+ var groupNode;
425+ var choiceIndex = [];
426+ var choices = [];
427+ var stack = [];
428+
429+ function chooseNegativeResponse() {
430+ var responses = jQuery('.negative').not('.visible');
431+
432+ return responses[Math.floor(Math.random() * responses.length)];
433+ }
434+
435+ function updateNegativeResponse() {
436+ var negative = chooseNegativeResponse();
437+
438+ jQuery(jQuery('.negative.visible')[0]).removeClass('visible');
439+ jQuery(negative).addClass('visible');
440+ }
441+
442+ function incrementAndWrap(curr, max) {
443+ if(max === undefined) {
444+ max = jQuery('.choices li', groupNode).length;
445+ }
446+ curr++;
447+ if (curr === max) {
448+ curr = 0;
449+ }
450+ return curr;
451+ }
452+
453+ function updateCurrentChoice(lastIndex) {
454+ var lastChoice = jQuery('.choices li', groupNode)[choices[choices.length - 1][lastIndex]];
455+ var choice = jQuery('.choices li', groupNode)[choices[choices.length - 1][choiceIndex[choiceIndex.length - 1]]];
456+ var nextChoice = jQuery('.choices li', groupNode)[choices[choices.length - 1][incrementAndWrap(choiceIndex[choiceIndex.length - 1])]];
457+
458+ updateNegativeResponse();
459+ lastChoice.style.display = 'none';
460+ choice.style.display = 'inline';
461+ var button = jQuery('#ok')[0];
462+ var isExternal = choice.hasAttribute('target');
463+ button.firstChild.href = !isExternal ?
464+ '#!/' + stack.join('/') + '/' + getUIDAttribute(choice) + '/' : choice.getAttribute('target');
465+
466+ jQuery('#next a:first').attr('href', '#!/' + stack.join('/') + '/' + getUIDAttribute(nextChoice));
467+ jQuery('#back a:first').attr('href', '#!/' + stack.join('/', stack.slice(stack.length - 1, 1)));
468+
469+ setLocationHashSuffix(getUIDAttribute(choice));
470+ }
471+
472+ function nextChoice(ev) {
473+ if(ev.which === 2) {
474+ return;
475+ }
476+ ev.preventDefault();
477+ var lastIndex = choiceIndex[choiceIndex.length - 1];
478+
479+ choiceIndex[choiceIndex.length - 1] = incrementAndWrap(lastIndex);
480+ updateCurrentChoice(lastIndex);
481+ }
482+
483+ function switchGroup(group, choiceId) {
484+ groupNode = document.getElementById(group);
485+
486+ if (!stack.length || stack[stack.length - 1] !== group || choiceId) {
487+ if ( jQuery.inArray(group, stack) < 0 ) {
488+ stack.push(group);
489+ }
490+
491+ if ( ! choiceId ) {
492+ choiceIndex.push(0);
493+ }
494+
495+ setGroupChoices(group, choiceId);
496+ }
497+
498+ var firstChoice = jQuery('#volunteer_wizard > div')[0].id;
499+ jQuery('#back')[0].style.display = group === firstChoice ? 'none' : 'block';
500+ jQuery('#next')[0].style.display = group !== firstChoice && choices[choices.length - 1].length == 1 ? 'none' : 'block';
501+ jQuery('.question', groupNode)[0].style.display = 'block';
502+ updateCurrentChoice(choiceIndex[choiceIndex.length - 1]);
503+ }
504+
505+ function cleanUpCurrent() {
506+ if (!groupNode) {
507+ return;
508+ }
509+ jQuery('.question', groupNode)[0].style.display = 'none';
510+ var lastChoice = jQuery('.choices li', groupNode)[choices[choices.length - 1][choiceIndex[choiceIndex.length - 1]]];
511+ lastChoice.style.display = 'none';
512+ }
513+
514+ function investigate(ev) {
515+ if(ev.which === 2) {
516+ return;
517+ }
518+ ev.preventDefault();
519+ var choice = jQuery('.choices li', groupNode)[choices[choices.length - 1][choiceIndex[choiceIndex.length - 1]]];
520+ if (choice.hasAttribute('next-group')) {
521+ cleanUpCurrent();
522+ switchGroup(choice.getAttribute('next-group'));
523+ } else {
524+ window.open(choice.getAttribute('target'));
525+ }
526+ }
527+
528+ function takeBack(ev) {
529+ if(ev.which === 2) {
530+ return;
531+ }
532+ cleanUpCurrent();
533+ setLocationHashSuffix("");
534+ stack.splice(stack.length - 1, 1);
535+ choiceIndex.splice(choiceIndex.length - 1, 1);
536+ choices.splice(choices.length - 1, 1);
537+ switchGroup(stack[stack.length - 1]);
538+ }
539+
540+
541+ function setLocationHashSuffix(value) {
542+ var midValue = stack.join("/");
543+
544+ window.location.hash = "#!/" + midValue + "/" + value;
545+ }
546+
547+
548+ function setGroupChoices(group, choiceId) {
549+
550+ //+ Jonas Raoni Soares Silva
551+ //@ http://jsfromhell.com/array/shuffle [rev. #1]
552+ function shuffle(v) {
553+ for (var j, x, i = v.length; i; j = parseInt(Math.random() * i, 10), x = v[--i], v[i] = v[j], v[j] = x){}
554+ return v;
555+ }
556+
557+ var collector = [],
558+ elements = jQuery('.choices li', groupNode),
559+ memo = 0;
560+
561+ for (var i = 0; i < elements.length; i++) {
562+ if (choiceId && getUIDAttribute(elements[i]) == choiceId) {
563+ memo = i;
564+ }
565+
566+ collector.push(i);
567+ }
568+
569+ collector = shuffle(collector)
570+
571+ if (choiceId) {
572+ choiceIndex.push( jQuery.inArray(memo, collector) );
573+ }
574+
575+ choices.push(collector);
576+ }
577+
578+ function getUIDAttribute(choice) {
579+ return choice.getAttribute("next-group") || choice.getAttribute("data-choice-id");
580+ }
581+
582+ function supportsPushState() {
583+ return !! (window.history && history.pushState);
584+ }
585+
586+ /* End supporting functions */
587+
588+
589+ /* Begin JQuery and Window functions */
590+
591+ jQuery(document).ready(function() {
592+ jQuery('#responses div').show();
593+ })
594+
595+ window.onpopstate = function(event) {
596+ }
597+
598+ jQuery(window).load(function() {
599+ jQuery('#ok a:first').on('click', investigate);
600+ jQuery('#next a:first').on('click', nextChoice);
601+ jQuery('#back a:first').on('click', takeBack);
602+
603+ var defaultGroup = "toplevel";
604+
605+
606+ // Check for permalink
607+ if (window.location.hash.length > 1) {
608+ var query = window.location.hash,
609+ queryParts = query.split("/");
610+
611+ queryParts.shift(); // Dropping '#!'
612+
613+ var savedGroup = defaultGroup,
614+ savedChoice = queryParts.pop();
615+
616+ cleanUpCurrent();
617+
618+ stack = queryParts.length ? [defaultGroup] : [];
619+ if (queryParts.length) {
620+ stack = stack.concat(queryParts.slice(1, queryParts.length - 1));
621+
622+ jQuery.each(queryParts.slice(0, queryParts.length - 1), function(i, v) {
623+ groupNode = document.getElementById(v);
624+ setGroupChoices(v, queryParts[i + 1]);
625+ });
626+
627+ savedGroup = queryParts.pop();
628+ }
629+
630+ switchGroup(savedGroup, savedChoice);
631+ } else {
632+ switchGroup(defaultGroup);
633+ }
634+ });
635+})(window.jQuery);
636
637=== modified file 'page.php'
638--- page.php 2013-05-31 08:50:32 +0000
639+++ page.php 2015-01-04 17:46:44 +0000
640@@ -47,5 +47,12 @@
641 <?php endif; ?>
642
643
644+<?php
645+if (is_page( 'contribute' )) {
646+ get_template_part( 'guidance_wizard' );
647+}
648+?>
649+
650+
651 <?php get_sidebar(); ?>
652-<?php get_footer(); ?>
653\ No newline at end of file
654+<?php get_footer(); ?>

Subscribers

People subscribed via source and target branches