Changes

Jump to navigation Jump to search
1,685 bytes added ,  01:31, 19 December 2016
Line 1: Line 1: −
<noinclude>{{GoogleTrans-en}}{{TOCleft}}</noinclude>
+
<noinclude>{{GoogleTrans-en}}{{TOCleft}}
 +
[[Category:GSoC]]
 +
[[Category:Project]]</noinclude>
 
[[Image:Karma.png|right]]
 
[[Image:Karma.png|right]]
    
== The Karma Project ==
 
== The Karma Project ==
 +
 +
Karma is a framework for creating educational software using JavaScript, html5, and SVG. The Karma team is primarily focused on developing Sugar activities but you can also Karma to create lessons that run in any web browser that supports html5. The best ways to get involved are to join the [http://groups.google.com/group/karmajs mailing list] and [http://git.olenepal.org/karma/karma get the code]
    
=== Rationale ===
 
=== Rationale ===
Line 10: Line 14:  
=== Status ===
 
=== Status ===
   −
Karma is a sub-project of Sugar Labs that is under active development as a part of a [[Karma#GSoC_Project| Google Summer of Code project]]. The latest examples can be seen at [http://karma.sugarlabs.org http://karma.sugarlabs.org]. You can also check out the [http://karmaproject.wordpress.com Karma Project blog] for updates.
+
Karma is a sub-project of Sugar Labs that is under active development. The latest examples can be seen at [http://karma.sugarlabs.org http://karma.sugarlabs.org]. You can also check out the [http://karmaproject.wordpress.com Karma Project blog] for updates.
   −
To try out the karma examples you need to have an html5-capable browser. The Browse activity within Sugar does not currently support html5. To try out karma within Sugar you need to install [http://dev.laptop.org/~bobbyp/surf/Surf-106.xo Surf] and its webkit dependencies or run Firefox 3.5 from the command-line.
+
To try out the karma examples you need to have an html5-capable browser. The Browse activity within Sugar does not currently support html5. To try out karma within Sugar you need to install [http://dev.laptop.org/~bobbyp/surf/Surf-106.xo Surf] and its webkit dependencies or run Firefox 3.5 from the command-line (yum install pywebkitgtk WebKit-gtk gnome-python2-gconf).
    +
The current focus of development is to convert Nepal's set of lessons coded in Squeak smalltalk. You can find the list of lessons to be converted [http://spreadsheets.google.com/pub?key=tweUJyn1BkEciHqVtSvCYDA&output=html here]. This is a good place for new contributors to get started
    
=== What Karma Is ===
 
=== What Karma Is ===
Line 29: Line 34:  
=== What Karma Isn't ===
 
=== What Karma Isn't ===
    +
* Karma is not compatible with Internet Explorer because Internet Explorer does not support html5 apis such as canvas, svg, localStorage, etc.
 
* Karma is not meant to replace pyGTK as the dominant toolset for creating Sugar activities
 
* Karma is not meant to replace pyGTK as the dominant toolset for creating Sugar activities
 
* Karma is not a tool for creating activities with complex 3D graphics. Karma is a tool for creating activities with simple 2D graphics
 
* Karma is not a tool for creating activities with complex 3D graphics. Karma is a tool for creating activities with simple 2D graphics
Line 42: Line 48:  
* Unobtrusive JavaScript
 
* Unobtrusive JavaScript
 
* No globals
 
* No globals
* No native objects extension
+
* No extension of native objects
    
=== Technical Architecture ===
 
=== Technical Architecture ===
   −
* Run-time - Karma will work with basic functionality on any W3C standards-compliant browser that supports HTML5 tags canvas and audio. This notably excludes Microsoft's Internet Explorer. Karma will be particularly tailored to work within Sugar's [[Browse]] activity. Longer-term we hope to extend Karma to take advantage of Sugar's collaboration features.
+
* Run-time - Karma will work with basic functionality on any W3C standards-compliant browser that supports HTML5 tags canvas, audio, and svg. This notably excludes Microsoft's Internet Explorer. Karma will be particularly tailored to work with Sugar's Journal and collaboration through Telepathy. Longer-term we hope to extend Karma to take advantage of Sugar's collaboration features.
* Primary Programming language - Javascript ([https://developer.mozilla.org/En/JavaScript 1.8.1]) Karma depends heavily the javascript library jQuery, version 1.3.
+
* Primary Programming language - [https://developer.mozilla.org/en/New_in_JavaScript_1.6 Javascript 1.6]  
 
* [[Karma/i18n|i18n]] -- Pervasive internationalization is a critical part of Karma
 
* [[Karma/i18n|i18n]] -- Pervasive internationalization is a critical part of Karma
** Supported types of i18n
+
** Supported types of i18n -- ToDo
 
*** Output of Native Digits
 
*** Output of Native Digits
 
*** Image switching per locale
 
*** Image switching per locale
Line 59: Line 65:  
* Moodle Integration -- method to be determined
 
* Moodle Integration -- method to be determined
 
* [[Karma/Bundle_layout|Repo and Bundle layout]]
 
* [[Karma/Bundle_layout|Repo and Bundle layout]]
 +
* UI Widgets
 +
** [[Scoreboard]]
 +
** Dialog -- use standard jQuery UI one?
    
=== Conventions ===
 
=== Conventions ===
Line 65: Line 74:  
* The [[Karma/Dictionary|Karma Dictionary]]
 
* The [[Karma/Dictionary|Karma Dictionary]]
 
* [[Karma/Specifications|Karma Specifications]] (early draft)
 
* [[Karma/Specifications|Karma Specifications]] (early draft)
* Source Code stored in http://git.sugarlabs.org/projects/karma
+
* [[Karma/Anti-conventions|Anti-Conventions]] -- coding no-nos
* Working demos at http://karma.sugarlabs.org
+
* [[Karma/Layout_Converted_Squeak_Lessons|Layout for converted Squeak Lessons]]
 +
* Source Code stored in http://git.olenepal.org/karma/karma
 +
* Each lesson must be in a folder named according to the schema "karma_Grade_Maths_title_WeekNo" where the week number is optional
 +
  The following are valid names
 +
  karma_3_Maths_LargestNumber_15
 +
  karma_2_English_MatchingPuzzle
 +
  karma_6_Maths_AddingUpTo10_4
 +
* Version Control and repository management see the [[Karma#Version_Control|Version Control]] section of this page
 +
* Unit testing is required for the karma.js library but not for individual lessons http://karma.sugarlabs.org/tests/
 
* Project Documentation kept in the Sugar Labs wiki
 
* Project Documentation kept in the Sugar Labs wiki
* Coding conventions: Based in [http://www.gnu.org/prep/standards/standards.html GNU standards]  
+
* Coding conventions: Based on [http://www.dojotoolkit.org/developer/StyleGuide Dojo Style Guide]  
** Use camel-case for function names and variables
+
** Use sadCamelCase for function names and variables
 
** Exception to above -- object constructors should start with a capital letter
 
** Exception to above -- object constructors should start with a capital letter
** Set column-width to 79 characters (from Python standard practice)
+
** boolean variables should be prefixed with "is", "has", "can", or "should"
** Whenever possible, use jslint and then teach the rest of us how
+
** counters should be prefixed with "num" or "count"
** Anything Doug Crockford advises in "JavaScript: The Good Parts"
+
** Whenever possible, use [http://www.jslint.com/ jslint]
 
* File naming conventions: lowercase letters, underscore instead of spaces  (need to write more about it)
 
* File naming conventions: lowercase letters, underscore instead of spaces  (need to write more about it)
 +
* Coding Pattern - We generally try to follow this coding pattern as it makes it easier to browse your code
 +
Put code in following order
 +
1) variable declarations
 +
2) method declarations
 +
3) method calls
 +
 +
== Version Control ==
 +
Currently all lessons are stored in the examples/ folder of [http://git.olenepal.org/karma/karma main karma repository]
 +
 +
 +
<strike>
 +
Here is how you can use the karma_lesson template to create a new repository from scratch
 +
 +
  $ git clone git://git.sugarlabs.org/karma_lesson/mainline.git
 +
  $ mkdir ../karma_3_English_3  # create a new lesson directory following our naming convention
 +
  $ cp -r * ../karma_3_English_3 
 +
  $ cd ../karma_3_English_3
 +
  $ rm -r .git    # make sure you get rid of the old git directory
 +
  $ git init
 +
  $ git add .
 +
  $ git commit -a -m "first commit"
   −
== GSoC Project ==
+
Now go to the http://git.sugarlabs.org/projects/new, make sure you are logged in
 +
Create a new project, use the same name as you did for your lesson's main folder
 +
then,
 +
  $ git remote add origin git://...  # the pubic push url
   −
=== Team ===
+
Then on to coding your lesson ;)
   −
Felipe Lopez Toledo "SubZero" is creating a prototype for Karma as a Google Summer of Code project. [[USER:BryanWB| Bryan Berry]] is serving as his mentor. [[User:ChristophD| Christoph Derndorfer]] is working on the draft specification.
+
From then on  
 +
$ git push origin master  # will sync your local tree w/ the server
   −
=== [[Karma/To-Do|To-Do]] ===
+
'''Tagging''' -- a karma lesson can be in only one of two states, stable or unstable. Any commit tagged 'stable' is the stable version of your code. Every other version of your code is unstable. We will not use numeric versioning such as 0.1, 1.0, 1.2, etc. for the foreseeable future.
 +
</strike>
   −
=== Project Requirements ===
+
== Meetings ==
 +
[[Karma:Meeting 21 December 2009]]
   −
* Create a single prototype activity which could be used as a template for sugarizing AJAX activities. The GSoC participant should not create her own activity but  recreate an existing activity such as one of [http://www.pustakalaya.org/external-content/static/epaath/E-Paath-2.activity/activity/Activity/MenuStage.html OLE Nepal's flash activities].
+
== GSoC Project ==
* This prototype should have the following features:
  −
** Simple interactive animation and audio using html5 tags like <canvas> and <audio>
  −
** An [[Karma/Assessment| assessment]] section that stores results of student's progress and gives them suggestions on improvement. Assessment info should be persistent.
  −
** Uses simple html for the activity lesson plan and teacher notes.
  −
** Integrates with the Journal
  −
** Navigation and Help elements, ideally reusing widgets from [http://www.jquery.com jQuery]
  −
** Some element of collaboration using Telepathy (This could be really hard, depending on the state of javascript bindings to dbus)
     −
=== Meetings ===
+
Karma started as a GSoC project with Felipe Lopez Toledo "SubZero" as the student participant and [[USER:BryanWB| Bryan Berry]] as mentor.
   −
# Regular meeting between Felpe and Bryan every Tuesday 0215 UTC  at #sugar on irc.freenode.net
+
=== GSoC Meetings ===
# General GSOC meeting for participants from Sugar every Tuesday 1400 UTC  #sugar-meeting
     −
Meeting Notes
+
Notes from GSoC meetings - kept for archival purposes
 
* [[Karma:Meeting 12 May 2009]]
 
* [[Karma:Meeting 12 May 2009]]
 
* [[Karma:Meeting 02 Jun 2009]]
 
* [[Karma:Meeting 02 Jun 2009]]
Line 111: Line 147:  
* [[Karma:Meeting 18 Aug 2009]]
 
* [[Karma:Meeting 18 Aug 2009]]
 
* [[Karma:Meeting 24 Aug 2009]]
 
* [[Karma:Meeting 24 Aug 2009]]
 +
* [[Karma:Meeting 08 Sep 2009]]
 +
* [[Karma:Meeting 14 Sep 2009]]
 +
* [[Karma:Meeting 21 Sep 2009]]
 +
* [[Karma:Meeting 21 December 2009]]
   −
=== Project Plan ===
+
== Project Roadmap ==
 
  −
==== GSoC ====
  −
There are roughly 4 parts to this project plan: first get  create a very simple learning activity with javascript and html5, second get that activity running on the XO, third extend the activity to take advantage of Sugar-specific features such as the Journal and Collaboration.
  −
 
  −
Before GSoc - June 1:
  −
* get familiar with Sugar
  −
* get familiar with html5
  −
* Felipe to acquire XO
  −
* learn more about JavaScript
  −
* select the appropriate js framework -- jQuery
  −
 
  −
June 2 - June 12:
  −
# “Karming” the "Quadrilaterals" activity using a non-elegant approach
  −
# Post blog entry detailing challenges encountered and ideas on how to simplify the animation methods
  −
# Post message to jquery-en and jquery-dev mailing lists asking for feedback
  −
 
     −
June 13 - July 12:
+
==== 0.1 "Osito" ====
* Developing the first Karma widget (easy animation tool, boost animation tool from the selected js framework)
  −
* Getting familiar with Sugar/Browse code
  −
* Providing Karma + audio
  −
* Providing Karma + client-side i18n
  −
* Developing an activity template for Karma
  −
* Changing the original activity to include above features
     −
July 13:
+
Was completed September 11, 2009
Publish blog post that showcases updated activity. Explain problems encountered, what works, what still doesn’t.
     −
July 15 - July 25:
+
* 1 Working example in "adding_up_to_10"
* Fixing bugs
+
* cleaned up documentation with jsdocs api documentation and cleaned up README.txt
* Work on gears+karma support
+
* integrate chakra and "adding_up_to_10" and knavbar
 +
* adding_up_to_10 works on the XO
 +
** Surf
 +
** Browse
   −
July 26 - July 31:
+
==== 0.2 "Gatito" ====
* Documenting examples
  −
* Improving documentation
     −
August 1 - August 9: time for any eventual emergencies
+
Completed mid-December 2009
   −
==== KCD's remaining time in Nepal ====
+
* unit testing added to karma.js using QUnit
 +
* API documented w/ jsdoc-toolkit
 +
* support for SVG and canvas animation
 +
* 3 working examples
 +
** Adding_Up_to_10 using both SVG and canvas
 +
** Quadrilaterals
 +
** "Conozco A Uruguay" done with karma  -- 50% done
   −
from August 21 - Sept 10th
     −
# Work on basic layout
  −
#* html versions of chakra, lesson_nav
  −
#* Examples of lesson_text, lesson_plan, teacher's note for "adding_up_to_10"
  −
# The Karma specification
  −
#* put it in separate page
  −
#* document what needs to be done and post various ideas and problems
      +
==== 0.3 "niño" ====
   −
==== Subzero's University Thesis ====
+
Due 31 March 2010
   −
Deadline: December 30th
+
* Full i18n support
 +
* All Squeak lessons converted to Karma
 +
* Integrate all of the existing E-Paath lesson into chakra
 +
* narwhal build script to build one giant karma bundle w/ all the E-Paath lessons inside it and chakra
 +
* At least 6 lessons ready that have been translated into 3 languages each
 +
* Version 0.1 draft of karma specification done
   −
Goals:  i18n mechanism, animation support, several good examples
+
==== Future Direction of Karma ====
* i18n mechanism: i18n on Karma Objects, inline html i18n, html2po tool
     −
==== Roadmap to 0.1 ====
+
No schedule yet.
   −
TBD
+
[[Karma/Future Direction|This page]] has more information.
    
=== Library ===
 
=== Library ===
Line 181: Line 203:  
* Iphone Human Interface Guide http://developer.apple.com/iphone/library/documentation/userexperience/conceptual/mobilehig/MobileHIG.pdf
 
* Iphone Human Interface Guide http://developer.apple.com/iphone/library/documentation/userexperience/conceptual/mobilehig/MobileHIG.pdf
 
* Palm Pre interface guide http://developer.palm.com/images/palm/pdf/palm_webos_hi_guidelines.pdf
 
* Palm Pre interface guide http://developer.palm.com/images/palm/pdf/palm_webos_hi_guidelines.pdf
* Apple "Web Page Development: Best Practices" http://developer.apple.com/internet/webcontent/bestwebdev.html
+
* 30 Usability Issues To Be Aware Of http://www.smashingmagazine.com/2007/10/09/30-usability-issues-to-be-aware-of/
 +
* 10 Usability Nightmares You Should Be Aware Of http://www.smashingmagazine.com/2007/09/27/10-usability-nightmares-you-should-be-aware-of/
 
* "The Design of Everyday Things" book by Don Norman
 
* "The Design of Everyday Things" book by Don Norman
 
* "Don't Make me think" by Steve Krug, guide to usability for web apps
 
* "Don't Make me think" by Steve Krug, guide to usability for web apps
Line 188: Line 211:  
* http://www.smashingmagazine.com/2009/07/16/html5-and-the-future-of-the-web/
 
* http://www.smashingmagazine.com/2009/07/16/html5-and-the-future-of-the-web/
 
* http://www.w3.org/TR/html5-diff/  Differences between html4 and html5
 
* http://www.w3.org/TR/html5-diff/  Differences between html4 and html5
 +
* [http://diveintohtml5.org/ Dive Into HTML5]
    
General Web Design
 
General Web Design
 
* "Web Design in a Nutshell" from O'Reilly
 
* "Web Design in a Nutshell" from O'Reilly
 +
* Apple "Web Page Development: Best Practices" http://developer.apple.com/internet/webcontent/bestwebdev.html
    
Canvas
 
Canvas
Line 200: Line 225:  
* http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html
 
* http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html
    +
SVG
 +
* The [http://www.w3.org/Graphics/SVG/IG/resources/svgprimer.html SVG Primer] a very detailed and in-depth resource
 +
* [http://raphaeljs.com/reference.html Raphaeljs documentation]
 +
* https://developer.mozilla.org/en/svg
    
Javascript
 
Javascript
 +
* [http://eloquentjavascript.net Eloquent Javascript] best beginning javascript resource
 
* "Javascript: The Good Parts" book by Doug Crockford
 
* "Javascript: The Good Parts" book by Doug Crockford
 
* "jQuery in Action" book
 
* "jQuery in Action" book
Line 210: Line 240:     
Coding Tools and Conventions
 
Coding Tools and Conventions
* Venkman -- javascript debugger http://www.svendtofte.com/code/learning_venkman/
   
* Firebug  --- http://www.getfirebug.com
 
* Firebug  --- http://www.getfirebug.com
 +
* Web-Inspector --- webkit's answer to firebug
 +
* Browsers --- We primarily work with Chromium and Firefox > 3.5
 
* For emacs users -- nxhtml mode and magit.el for working w/ git
 
* For emacs users -- nxhtml mode and magit.el for working w/ git
 +
* [http://www.jslint.com/ jslint]
 +
* [http://www.inkscape.org inkscape]
 +
* [http://narwhaljs.org narwhal]
    
== Subpages ==
 
== Subpages ==
    
{{Special:PrefixIndex/{{PAGENAMEE}}/}}
 
{{Special:PrefixIndex/{{PAGENAMEE}}/}}
  −
[[Category:GSoC]]
 
132

edits

Navigation menu