sample_rating.html 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <link rel="stylesheet" href="../../../themes/themeroller/default-theme/ui.all.css" type="text/css" media="screen" />
  5. <script src="../../../lib/jquery/jquery.js" type="text/javascript" charset="utf-8"></script>
  6. <script src="../../../src/defaults.js" type="text/javascript" charset="utf-8"></script>
  7. <script src="../../../src/core.js" type="text/javascript" charset="utf-8"></script>
  8. <style type="text/css" media="screen">
  9. body {
  10. font-size: 14px;
  11. padding: 15px;
  12. font-family: "Trebuchet MS", "Helvetica", "Arial", "Verdana", "sans-serif";
  13. }
  14. p {
  15. margin: 30px 10px;
  16. }
  17. </style>
  18. </head>
  19. <body>
  20. <div id="rating01"></div>
  21. <br style="clear: both;" />
  22. <br style="clear: both;" />
  23. <button onclick="window.rating1.setValue(0);">clear</button>
  24. <button onclick="window.rating1.setValue(3);">set value to 3</button>
  25. <button onclick="window.rating1.setValue(5);">set value to 5</button>
  26. <br /><br />
  27. <button onclick="alert(window.rating1.getValue());">get value</button>
  28. <br /><br />
  29. <span>Readonly Rating</span>
  30. <div id="rating02"></div>
  31. <br style="clear: both;" />
  32. <br style="clear: both;" />
  33. <button onclick="window.rating2.setValue(0);">clear</button>
  34. <button onclick="window.rating2.setValue(3);">set value to 3</button>
  35. <button onclick="window.rating2.setValue(5);">set value to 5</button>
  36. <br /><br />
  37. <button onclick="alert(window.rating2.getValue());">get value</button>
  38. <script type="text/javascript" charset="utf-8">
  39. if (window.widget) {
  40. widget.setNavigationEnabled(false);
  41. }
  42. var init = function() {
  43. window.rating1 = new Nokia.Rating({
  44. element: '#rating01',
  45. value: 2,
  46. create: function() {
  47. console.log("Rating: Create.");
  48. },
  49. change: function(event, value) {
  50. console.log("Rating: Change - " + value);
  51. }
  52. });
  53. window.rating2 = new Nokia.Rating({
  54. element: '#rating02',
  55. value: 3,
  56. readonly: true
  57. });
  58. /*
  59. * Hide splash when its all done.
  60. */
  61. Nokia.hideSplash();
  62. };
  63. /*
  64. * Show splash while loading components.
  65. */
  66. Nokia.showSplash('<span>loading</span>');
  67. Nokia.use('rating', init);
  68. </script>
  69. </body>
  70. </html>