Browse files

First beta, includes magic scale

  • Loading branch information...
1 parent bc9bc15 commit 4afd635b45f8b2984af1f8e833aad1dd5b637bae John Einselen committed Jun 26, 2012
Showing with 4,707 additions and 0 deletions.
  1. +135 −0 Imaginist.dcproj/admin.wdgtuser
  2. BIN Imaginist.dcproj/project/widget.wdgt/Default.png
  3. BIN Imaginist.dcproj/project/widget.wdgt/Icon-64.png
  4. BIN Imaginist.dcproj/project/widget.wdgt/Icon.png
  5. +34 −0 Imaginist.dcproj/project/widget.wdgt/Info.plist
  6. +46 −0 Imaginist.dcproj/project/widget.wdgt/Parts/Button.js
  7. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/back.png
  8. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/doneSave_left.png
  9. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/doneSave_left_clicked.png
  10. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/doneSave_middle.png
  11. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/doneSave_middle_clicked.png
  12. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/doneSave_right.png
  13. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/doneSave_right_clicked.png
  14. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/download_left.png
  15. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/download_left_clicked.png
  16. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/download_middle.png
  17. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/download_middle_clicked.png
  18. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/download_right.png
  19. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/download_right_clicked.png
  20. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/failButton_left.png
  21. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/failButton_left_clicked.png
  22. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/failButton_middle.png
  23. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/failButton_middle_clicked.png
  24. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/failButton_right.png
  25. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/failButton_right_clicked.png
  26. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/front.png
  27. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/skip_left.png
  28. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/skip_left_clicked.png
  29. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/skip_middle.png
  30. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/skip_middle_clicked.png
  31. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/skip_right.png
  32. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/skip_right_clicked.png
  33. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/successButton_left.png
  34. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/successButton_left_clicked.png
  35. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/successButton_middle.png
  36. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/successButton_middle_clicked.png
  37. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/successButton_right.png
  38. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/successButton_right_clicked.png
  39. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/type_left.png
  40. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/type_middle.png
  41. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/type_right.png
  42. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/wrongButton_left.png
  43. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/wrongButton_left_clicked.png
  44. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/wrongButton_middle.png
  45. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/wrongButton_middle_clicked.png
  46. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/wrongButton_right.png
  47. BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/wrongButton_right_clicked.png
  48. +28 −0 Imaginist.dcproj/project/widget.wdgt/Parts/InfoButton.js
  49. +162 −0 Imaginist.dcproj/project/widget.wdgt/Parts/PopupButton.js
  50. +328 −0 Imaginist.dcproj/project/widget.wdgt/Parts/StackLayout.js
  51. +310 −0 Imaginist.dcproj/project/widget.wdgt/Parts/Transitions.css
  52. +795 −0 Imaginist.dcproj/project/widget.wdgt/Parts/Transitions.js
  53. +10 −0 Imaginist.dcproj/project/widget.wdgt/Parts/datasources.js
  54. +10 −0 Imaginist.dcproj/project/widget.wdgt/Parts/license.txt
  55. +26 −0 Imaginist.dcproj/project/widget.wdgt/Parts/parts.js
  56. +39 −0 Imaginist.dcproj/project/widget.wdgt/Parts/setup.js
  57. BIN Imaginist.dcproj/project/widget.wdgt/en.lproj/InfoPlist.strings
  58. +45 −0 Imaginist.dcproj/project/widget.wdgt/en.lproj/localizedStrings.js
  59. +536 −0 Imaginist.dcproj/project/widget.wdgt/main.css
  60. +53 −0 Imaginist.dcproj/project/widget.wdgt/main.html
  61. +419 −0 Imaginist.dcproj/project/widget.wdgt/main.js
  62. +115 −0 Imaginist.dcproj/projectInfo.plist
  63. +144 −0 Imaginist.dcproj/vectorform.wdgtuser
  64. BIN Imaginist.wdgt/Default.png
  65. BIN Imaginist.wdgt/Icon-64.png
  66. BIN Imaginist.wdgt/Icon.png
  67. +34 −0 Imaginist.wdgt/Info.plist
  68. BIN Imaginist.wdgt/Parts/Images/back.png
  69. BIN Imaginist.wdgt/Parts/Images/doneSave_left.png
  70. BIN Imaginist.wdgt/Parts/Images/doneSave_left_clicked.png
  71. BIN Imaginist.wdgt/Parts/Images/doneSave_middle.png
  72. BIN Imaginist.wdgt/Parts/Images/doneSave_middle_clicked.png
  73. BIN Imaginist.wdgt/Parts/Images/doneSave_right.png
  74. BIN Imaginist.wdgt/Parts/Images/doneSave_right_clicked.png
  75. BIN Imaginist.wdgt/Parts/Images/download_left.png
  76. BIN Imaginist.wdgt/Parts/Images/download_left_clicked.png
  77. BIN Imaginist.wdgt/Parts/Images/download_middle.png
  78. BIN Imaginist.wdgt/Parts/Images/download_middle_clicked.png
  79. BIN Imaginist.wdgt/Parts/Images/download_right.png
  80. BIN Imaginist.wdgt/Parts/Images/download_right_clicked.png
  81. BIN Imaginist.wdgt/Parts/Images/failButton_left.png
  82. BIN Imaginist.wdgt/Parts/Images/failButton_left_clicked.png
  83. BIN Imaginist.wdgt/Parts/Images/failButton_middle.png
  84. BIN Imaginist.wdgt/Parts/Images/failButton_middle_clicked.png
  85. BIN Imaginist.wdgt/Parts/Images/failButton_right.png
  86. BIN Imaginist.wdgt/Parts/Images/failButton_right_clicked.png
  87. BIN Imaginist.wdgt/Parts/Images/front.png
  88. BIN Imaginist.wdgt/Parts/Images/skip_left.png
  89. BIN Imaginist.wdgt/Parts/Images/skip_left_clicked.png
  90. BIN Imaginist.wdgt/Parts/Images/skip_middle.png
  91. BIN Imaginist.wdgt/Parts/Images/skip_middle_clicked.png
  92. BIN Imaginist.wdgt/Parts/Images/skip_right.png
  93. BIN Imaginist.wdgt/Parts/Images/skip_right_clicked.png
  94. BIN Imaginist.wdgt/Parts/Images/successButton_left.png
  95. BIN Imaginist.wdgt/Parts/Images/successButton_left_clicked.png
  96. BIN Imaginist.wdgt/Parts/Images/successButton_middle.png
  97. BIN Imaginist.wdgt/Parts/Images/successButton_middle_clicked.png
  98. BIN Imaginist.wdgt/Parts/Images/successButton_right.png
  99. BIN Imaginist.wdgt/Parts/Images/successButton_right_clicked.png
  100. BIN Imaginist.wdgt/Parts/Images/type_left.png
  101. BIN Imaginist.wdgt/Parts/Images/type_middle.png
  102. BIN Imaginist.wdgt/Parts/Images/type_right.png
  103. BIN Imaginist.wdgt/Parts/Images/wrongButton_left.png
  104. BIN Imaginist.wdgt/Parts/Images/wrongButton_left_clicked.png
  105. BIN Imaginist.wdgt/Parts/Images/wrongButton_middle.png
  106. BIN Imaginist.wdgt/Parts/Images/wrongButton_middle_clicked.png
  107. BIN Imaginist.wdgt/Parts/Images/wrongButton_right.png
  108. BIN Imaginist.wdgt/Parts/Images/wrongButton_right_clicked.png
  109. +310 −0 Imaginist.wdgt/Parts/Transitions.css
  110. +7 −0 Imaginist.wdgt/Parts/core/external/sizzle_c.js
  111. +10 −0 Imaginist.wdgt/Parts/license.txt
  112. +58 −0 Imaginist.wdgt/Parts/parts.js
  113. BIN Imaginist.wdgt/en.lproj/InfoPlist.strings
  114. +45 −0 Imaginist.wdgt/en.lproj/localizedStrings.js
  115. +536 −0 Imaginist.wdgt/main.css
  116. +53 −0 Imaginist.wdgt/main.html
  117. +419 −0 Imaginist.wdgt/main.js
  118. BIN Imaginist.zip
  119. BIN images/Icon-512.png
  120. BIN images/Icon-64.png
  121. BIN images/Icon-80.png
  122. BIN images/Icon.png
  123. BIN images/Icon.psd
View
135 Imaginist.dcproj/admin.wdgtuser
@@ -0,0 +1,135 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+ <key>CYLastWindowPosition</key>
+ <string>{1192, 260}</string>
+ <key>ContentSplitViewGeometry</key>
+ <dict>
+ <key>ContentSplitViewConfig</key>
+ <integer>8</integer>
+ <key>SplitViewConfig</key>
+ <integer>3</integer>
+ <key>_indexOfCollapsedView</key>
+ <integer>0</integer>
+ <key>sizes</key>
+ <array>
+ <string>{{0, 0}, {1675, 418}}</string>
+ <string>{{0, 428}, {1675, 609}}</string>
+ </array>
+ </dict>
+ <key>ContentViewType</key>
+ <integer>5</integer>
+ <key>DeploymentOptions</key>
+ <dict>
+ <key>Destination</key>
+ <string>aos.default</string>
+ <key>EmailToNotifyAddress</key>
+ <string>jeinselen@vectorform.com</string>
+ <key>SavePath</key>
+ <string>/Volumes/Projects HD/0-Git/Imaginist</string>
+ <key>enableSimulation</key>
+ <true/>
+ <key>simulatedHost</key>
+ <string>web.me.com</string>
+ </dict>
+ <key>Design time language</key>
+ <string>en.lproj</string>
+ <key>MainSplitViewGeometry</key>
+ <dict>
+ <key>_indexOfCollapsedView</key>
+ <integer>0</integer>
+ <key>sizes</key>
+ <array>
+ <string>{{0, 0}, {244, 1058}}</string>
+ <string>{{245, 0}, {1676, 1058}}</string>
+ </array>
+ </dict>
+ <key>MainWindowFrame</key>
+ <string>0 99 1920 1079 0 0 1920 1178 </string>
+ <key>NavigatorSplitViewGeometry</key>
+ <dict>
+ <key>ContentSplitViewConfig</key>
+ <integer>5</integer>
+ <key>SplitViewConfig</key>
+ <integer>3</integer>
+ <key>_indexOfCollapsedView</key>
+ <integer>0</integer>
+ <key>sizes</key>
+ <array>
+ <string>{{0, 0}, {246, 781}}</string>
+ <string>{{0, 791}, {246, 246}}</string>
+ </array>
+ </dict>
+ <key>Widget</key>
+ <dict>
+ <key>Objects view expanded items</key>
+ <array>
+ <array>
+ <integer>0</integer>
+ </array>
+ <array>
+ <integer>0</integer>
+ <integer>1</integer>
+ </array>
+ <array>
+ <integer>0</integer>
+ <integer>0</integer>
+ </array>
+ <array>
+ <integer>0</integer>
+ <integer>0</integer>
+ <integer>1</integer>
+ </array>
+ <array>
+ <integer>0</integer>
+ <integer>0</integer>
+ <integer>1</integer>
+ <integer>4</integer>
+ </array>
+ <array>
+ <integer>0</integer>
+ <integer>0</integer>
+ <integer>1</integer>
+ <integer>3</integer>
+ </array>
+ <array>
+ <integer>0</integer>
+ <integer>0</integer>
+ <integer>1</integer>
+ <integer>2</integer>
+ </array>
+ <array>
+ <integer>0</integer>
+ <integer>0</integer>
+ <integer>1</integer>
+ <integer>1</integer>
+ </array>
+ <array>
+ <integer>0</integer>
+ <integer>0</integer>
+ <integer>1</integer>
+ <integer>0</integer>
+ </array>
+ <array>
+ <integer>0</integer>
+ <integer>0</integer>
+ <integer>1</integer>
+ <integer>0</integer>
+ <integer>0</integer>
+ </array>
+ </array>
+ <key>Objects view last selections</key>
+ <array>
+ <array>
+ <integer>5</integer>
+ </array>
+ </array>
+ <key>Visible StackLayout Views</key>
+ <array>
+ <string>front</string>
+ <string>main</string>
+ </array>
+ </dict>
+</dict>
+</plist>
View
BIN Imaginist.dcproj/project/widget.wdgt/Default.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN Imaginist.dcproj/project/widget.wdgt/Icon-64.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN Imaginist.dcproj/project/widget.wdgt/Icon.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
34 Imaginist.dcproj/project/widget.wdgt/Info.plist
@@ -0,0 +1,34 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+ <key>AllowFileAccessOutsideOfWidget</key>
+ <true/>
+ <key>AllowNetworkAccess</key>
+ <true/>
+ <key>AllowSystem</key>
+ <true/>
+ <key>CFBundleDevelopmentRegion</key>
+ <string>English</string>
+ <key>CFBundleDisplayName</key>
+ <string>Ratio</string>
+ <key>CFBundleIdentifier</key>
+ <string>com.iaian7.imaginist</string>
+ <key>CFBundleName</key>
+ <string>Ratio</string>
+ <key>CFBundleShortVersionString</key>
+ <string>0.1</string>
+ <key>CFBundleVersion</key>
+ <string>0.1</string>
+ <key>CloseBoxInsetX</key>
+ <integer>15</integer>
+ <key>CloseBoxInsetY</key>
+ <integer>15</integer>
+ <key>Height</key>
+ <integer>180</integer>
+ <key>MainHTML</key>
+ <string>main.html</string>
+ <key>Width</key>
+ <integer>300</integer>
+</dict>
+</plist>
View
46 Imaginist.dcproj/project/widget.wdgt/Parts/Button.js
@@ -0,0 +1,46 @@
+/*
+ This file was generated by Dashcode and is covered by the
+ license.txt included in the project. You may edit this file,
+ however it is recommended to first turn off the Dashcode
+ code generator otherwise the changes will be lost.
+ */
+
+function CreateButton(elementOrID, spec)
+{
+ var buttonElement = elementOrID;
+ if (elementOrID.nodeType != Node.ELEMENT_NODE) {
+ buttonElement = document.getElementById(elementOrID);
+ }
+
+ if (!buttonElement.loaded) {
+ buttonElement.loaded = true;
+ while (buttonElement.firstChild) {
+ buttonElement.removeChild(buttonElement.firstChild);
+ }
+
+ var text = spec.text || '';
+ if (window.dashcode && dashcode.getLocalizedString) text = dashcode.getLocalizedString(text);
+
+ var leftImageWidth = spec.leftImageWidth || 0;
+ var rightImageWidth = spec.rightImageWidth || 0;
+ // when cloning template, get size from original
+ var styleElement = buttonElement;
+ if (spec.originalID) {
+ styleElement = document.getElementById(spec.originalID);
+ }
+ var imagePrefix = "Parts/Images/" + styleElement.id + "_";
+ var width = dashcode.getElementWidth(styleElement) || 20;
+ var height = dashcode.getElementHeight(styleElement) || 20;
+
+ var onclick = spec.onclick || null;
+ try { onclick = eval(onclick); } catch (e) { onclick = null; }
+
+ buttonElement.object = new AppleButton(buttonElement, text, height, imagePrefix + "left.png", imagePrefix + "left_clicked.png", leftImageWidth, imagePrefix + "middle.png", imagePrefix + "middle_clicked.png", imagePrefix + "right.png", imagePrefix + "right_clicked.png", rightImageWidth, onclick);
+ buttonElement.object.element = buttonElement;
+ buttonElement.object._container.childNodes[2].style.width = rightImageWidth + "px";
+ buttonElement.object.setEnabled(!spec.disabled);
+ buttonElement.object.textElement.style.width = (width - (leftImageWidth + rightImageWidth)) + "px";
+ }
+
+ return buttonElement.object;
+}
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/back.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/doneSave_left.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/doneSave_left_clicked.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/doneSave_middle.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/doneSave_middle_clicked.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/doneSave_right.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/doneSave_right_clicked.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/download_left.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/download_left_clicked.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/download_middle.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/download_middle_clicked.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/download_right.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/download_right_clicked.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/failButton_left.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/failButton_left_clicked.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/failButton_middle.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/failButton_middle_clicked.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/failButton_right.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/failButton_right_clicked.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/front.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/skip_left.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/skip_left_clicked.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/skip_middle.png
Diff not rendered.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/skip_middle_clicked.png
Diff not rendered.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/skip_right.png
Diff not rendered.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/skip_right_clicked.png
Diff not rendered.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/successButton_left.png
Diff not rendered.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/successButton_left_clicked.png
Diff not rendered.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/successButton_middle.png
Diff not rendered.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/successButton_middle_clicked.png
Diff not rendered.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/successButton_right.png
Diff not rendered.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/successButton_right_clicked.png
Diff not rendered.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/type_left.png
Diff not rendered.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/type_middle.png
Diff not rendered.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/type_right.png
Diff not rendered.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/wrongButton_left.png
Diff not rendered.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/wrongButton_left_clicked.png
Diff not rendered.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/wrongButton_middle.png
Diff not rendered.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/wrongButton_middle_clicked.png
Diff not rendered.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/wrongButton_right.png
Diff not rendered.
View
BIN Imaginist.dcproj/project/widget.wdgt/Parts/Images/wrongButton_right_clicked.png
Diff not rendered.
View
28 Imaginist.dcproj/project/widget.wdgt/Parts/InfoButton.js
@@ -0,0 +1,28 @@
+/*
+ This file was generated by Dashcode and is covered by the
+ license.txt included in the project. You may edit this file,
+ however it is recommended to first turn off the Dashcode
+ code generator otherwise the changes will be lost.
+ */
+
+function CreateInfoButton(elementOrID, spec)
+{
+ var flipElement = elementOrID;
+ if (elementOrID.nodeType != Node.ELEMENT_NODE) {
+ flipElement = document.getElementById(elementOrID);
+ }
+ if (!flipElement.loaded) {
+ flipElement.loaded = true;
+ while (flipElement.firstChild) {
+ flipElement.removeChild(flipElement.firstChild);
+ }
+
+ var onclick = spec.onclick || null;
+ try { onclick = eval(onclick); } catch (e) { onclick = null; }
+
+ flipElement.object = new AppleInfoButton(flipElement, document.getElementById(spec.frontID), spec.foregroundStyle, spec.backgroundStyle, onclick);
+ flipElement.object.element = flipElement;
+ }
+
+ return flipElement.object;
+}
View
162 Imaginist.dcproj/project/widget.wdgt/Parts/PopupButton.js
@@ -0,0 +1,162 @@
+/*
+ This file was generated by Dashcode and is covered by the
+ license.txt included in the project. You may edit this file,
+ however it is recommended to first turn off the Dashcode
+ code generator otherwise the changes will be lost.
+ */
+
+// Note: Properties and methods beginning with underbar ("_") are considered private and subject to change in future Dashcode releases.
+
+function CreatePopupButton(elementOrID, spec)
+{
+ var popupElement = elementOrID;
+ if (elementOrID.nodeType != Node.ELEMENT_NODE) {
+ popupElement = document.getElementById(elementOrID);
+ }
+ if (!popupElement.loaded) {
+ popupElement.loaded = true;
+ popupElement.object = new PopupButton(popupElement, spec);
+ return popupElement.object;
+ }
+}
+
+
+function PopupButton(popupElement, spec)
+{
+ var leftImageWidth = spec.leftImageWidth || 0;
+ var rightImageWidth = spec.rightImageWidth || 0;
+ // when cloning template, get size from original
+ var styleElement = popupElement;
+ if (spec.originalID) {
+ styleElement = document.getElementById(spec.originalID);
+ }
+ var imagePrefix = "Parts/Images/" + styleElement.id + "_";
+ var width = dashcode.getElementWidth(styleElement) || 20;
+ var height = dashcode.getElementHeight(styleElement) || 20;
+ var _self = this;
+
+ this.element = popupElement;
+
+ // setup the button
+ while (popupElement.firstChild) {
+ popupElement.removeChild(popupElement.firstChild);
+ }
+ this.button = new AppleButton(popupElement, '', height, imagePrefix + "left.png", imagePrefix + "left_clicked.png", leftImageWidth, imagePrefix + "middle.png", imagePrefix + "middle_clicked.png", imagePrefix + "right.png", imagePrefix + "right_clicked.png", rightImageWidth, null);
+ this.button._container.childNodes[2].style.width = rightImageWidth + "px";
+ this.button.textElement.style.width = (width - (leftImageWidth + rightImageWidth)) + "px";
+ this.button.textElement.style.textIndent = Math.max(10-leftImageWidth, 0) + "px";
+ var eventsDiv = document.createElement("div");
+ eventsDiv.setAttribute("style", "position: absolute; left: 0; top: 0; width: 100%; height: 100%");
+ popupElement.appendChild(eventsDiv);
+ var clickHandler = function(event) {
+ _self.select.dispatchEvent(event);
+ event.stopPropagation();
+ event.preventDefault();
+ }
+ eventsDiv.addEventListener("mousedown", clickHandler, true);
+
+
+ // setup the select
+ this.select = document.createElement("select");
+ var onchange = spec.onchange || null;
+ try { onchange = eval(onchange); } catch (e) { onchange = null; }
+ this.onchange = onchange;
+ if (spec.name) {
+ this.select.name = spec.name;
+ }
+ this._setOptions(spec.options);
+ this.select.setAttribute("style", "position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0;");
+ popupElement.appendChild(this.select);
+ this.select.style.top = Math.max((height - dashcode.getElementHeight(this.select)) / 2, 0) + "px";
+
+ // onchange event handler
+ this.select.onchange = function (event) {
+ var selectedOption = this.options[this.selectedIndex];
+ if (selectedOption) {
+ _self.button.textElement.innerText = selectedOption.text;
+ // if it is a real event, forward it to the custom handler
+ if (_self.onchange && event) {
+ _self.onchange(event);
+ }
+ }
+ };
+
+ this.setEnabled(!spec.disabled);
+}
+
+PopupButton.prototype.getValue = function()
+{
+ return this.select.value;
+}
+
+PopupButton.prototype.getSelectedIndex = function()
+{
+ return this.select.selectedIndex;
+}
+
+PopupButton.prototype.setSelectedIndex = function(index)
+{
+ this.select.selectedIndex = index;
+ this.select.onchange(null);
+}
+
+PopupButton.prototype.getName = function()
+{
+ return this.select.name;
+}
+
+PopupButton.prototype.setName = function(name)
+{
+ this.select.name = name;
+}
+
+PopupButton.prototype.setEnabled = function(enabled)
+{
+ this.button.setEnabled(enabled);
+ this.select.disabled=!enabled;
+}
+
+PopupButton.prototype.setOptions = function(options, shouldLocalize)
+{
+ if (!options || !(options instanceof Array)) options = [];
+ var text = '';
+
+ this.select.options.length = 0;
+ for (var i = 0; i < options.length; i++) {
+ var defaultSelected = false;
+ var optionLabel = '';
+ var optionValue = null;
+ if ((options[i]) instanceof Array) {
+ if (options[i].length > 0) {
+ optionLabel = options[i][0];
+ if (options[i].length > 1) {
+ optionValue = options[i][1];
+ if (options[i].length > 2 && options[i][2]) {
+ defaultSelected = true;
+ }
+ }
+ }
+ }
+ else {
+ optionLabel = options[i];
+ }
+
+ if (shouldLocalize) {
+ optionLabel = dashcode.getLocalizedString(optionLabel);
+ }
+ if (i==0 || defaultSelected) {
+ text = optionLabel;
+ }
+ if (!optionValue || optionValue.length == 0) {
+ optionValue = optionLabel;
+ }
+
+ this.select.options[this.select.length] = new Option(optionLabel, optionValue, defaultSelected);
+ }
+ this.button.textElement.innerText = text;
+}
+
+PopupButton.prototype._setOptions = function(options)
+{
+ this.setOptions(options, true);
+}
View
328 Imaginist.dcproj/project/widget.wdgt/Parts/StackLayout.js
@@ -0,0 +1,328 @@
+/*jsl:import DashcodePart.js*/
+
+/**
+ * @declare DC.StackLayout
+ * @extends DC.DashcodePart
+ *
+ */
+
+// Public properties:
+// startTransitionCallback: function to call when a transition will start
+// The callback function will receive 3 parameters: (stackLayout, oldView, newView)
+// stackLayout: The stackLayout object that will perform the transition
+// oldView: The current view element before the transition
+// newView: The view element that will be active after the transition
+// endTransitionCallback: function to call when a transition did end
+// The callback function will receive 3 parameters: (stackLayout, oldView, newView)
+// stackLayout: The stackLayout object that performed the transition
+// oldView: The view element that was active before the transition
+// newView: The new current view element
+//
+// Public Methods:
+// getAllViews(): returns an array of all the stack layout view elements.
+// getCurrentView(): returns the currently visible view element.
+// setCurrentView(newView, isReverse, makeTopVisible): make newView the visible view, using the specified transition.
+// newView: the id of the view DOM element or the DOM element itself.
+// isReverse (optional): perform the transition in reverse
+// makeTopVisible (optional): true to scroll to the top of the page before the transition
+// getTransitionForView(view): return the transition object assigned to view.
+//
+// Note: Properties and methods beginning with underbar ("_") are considered private and subject to change in future Dashcode releases.
+
+
+DC.StackLayout= Class.create(DC.DashcodePart, {
+
+ __viewClassName__: "StackLayout",
+
+ exposedBindings: ["currentView"],
+
+ clonedFrom: function(originalView){
+ this.base(originalView);
+
+ // when cloning template, get style from original
+ this._viewsOldOpacity = originalView._viewsOldOpacity;
+ },
+
+ partSetup: function(spec)
+ {
+ this.base(spec);
+
+ var subviewsTransitions = spec.subviewsTransitions || [];
+ var element = this.viewElement();
+
+ var originalID = spec.originalID ? spec.originalID : element.originalID;
+ this._viewsOldOpacity = [];
+
+ this._views = [];
+ this._currentView = null;
+ var kids = element.children;
+ this._inDesign = window.dashcode && window.dashcode.inDesign;
+ var firstElementDone = false;
+ for (var i=0; i<kids.length; i++) {
+ var view = kids[i];
+ this._views.push(view);
+ // Doing this only during runtime since we don't want any of the settings to end up in the files during design time. Also, design time view swapping is done differently.
+ if (!this._inDesign && !originalID) {
+ view.style.display = (firstElementDone) ? 'none' : 'block';
+ // Remember the previous inline opacity because we make use of it for dissolve/fade transitions
+ if (this._viewsOldOpacity.length <= i) {
+ this._viewsOldOpacity.push(view.style.opacity);
+ }
+ view.style.opacity = (firstElementDone) ? 0 : 1;
+ firstElementDone = true;
+ }
+ }
+
+ if (this._views.length > 0) {
+ this._viewsTransition = [];
+ this.setCurrentView(this._views[0]);
+
+ if (this._views.length == subviewsTransitions.length) {
+ for (var i=0; i<this._views.length; i++) {
+ this._viewsTransition[i] = CreateTransitionWithProperties(subviewsTransitions[i]);
+ }
+ }
+ }
+
+ // StackLayout is usually pretty shallow from <body>
+ this._topPosFromBody = 0;
+ var curElement = this.viewElement();
+ do {
+ this._topPosFromBody += curElement.offsetTop;
+ } while (curElement = curElement.offsetParent);
+
+ this._maskContainerElement = element; // default
+ },
+
+ getAllViews: function()
+ {
+ return this._views;
+ },
+
+ getCurrentView: function()
+ {
+ return this._currentView;
+ },
+
+ // The bindings requires the setter to have 1 argument
+ // argument 2 and 3 are optional, so we need to wrap
+ // this up. Existing clients should still work
+ setCurrentView: function(newView)
+ {
+ this.setCurrentViewWrapped(newView,arguments[1],arguments[2]);
+ },
+
+ setCurrentViewWrapped: function(newView, isReverse, makeTopVisible)
+ {
+ // Look up by id if necessary
+ newView = this._getView(newView);
+ var oldView = this.getCurrentView();
+
+ if (!newView || (oldView == newView)) {
+ return;
+ }
+
+ // Make sure the view is ours
+ if (!newView.parentNode == this.viewElement()) {
+ return;
+ }
+
+ var transition = this._viewsTransition[this._indexOfView(newView)];
+ if (!transition) transition = new Transition(Transition.NONE_TYPE);
+
+ if (oldView) {
+ if (isReverse) {
+ transition = this._viewsTransition[this._indexOfView(oldView)];
+ }
+ }
+
+ this._setCurrentViewPrimitive(newView, oldView, transition, isReverse, makeTopVisible);
+ },
+
+ setCurrentViewWithTransition: function(newView, transition, isReverse, makeTopVisible)
+ {
+ // Look up by id if necessary
+ newView = this._getView(newView);
+ if (!newView) {
+ return;
+ }
+
+ // Make sure the view is ours
+ if (!newView.parentNode == this.viewElement()) {
+ return;
+ }
+ var oldView = this.getCurrentView();
+
+ this._setCurrentViewPrimitive(newView, oldView, transition, isReverse, makeTopVisible);
+ },
+
+ getTransitionForView: function(view)
+ {
+ // Look up by id if necessary
+ view = this._getView(view);
+ return this._viewsTransition[this._indexOfView(view)];
+ },
+
+ addView: function(viewElement, transition)
+ {
+ this._views.push(viewElement);
+ this._viewsOldOpacity.push(viewElement.style.opacity);
+ viewElement.style.opacity = (this._views.length == 1 ? 1 : 0);
+ viewElement.style.display = (this._views.length == 1 ? 'none' : 'block');
+ viewElement.style.webkitTransform = 'translate(0px, 0px)';
+ if (!transition) {
+ transition = null;
+ //transition = new Transition(Transition.NONE_TYPE, 0, Transition.EASE_TIMING)
+ }
+ this._viewsTransition[this._views.length - 1] = transition;
+ this.viewElement().appendChild(viewElement);
+
+ if (this._views.length == 1) {
+ this.setCurrentView(viewElement);
+ }
+ },
+
+ removeView: function(viewElement)
+ {
+ var viewIndex = this._indexOfView(viewElement);
+ if ((viewIndex < 0) || (this._views.length == 1)) {
+ return;
+ }
+ if (viewElement == this.getCurrentView()) {
+ this.setCurrentView(this._views[(viewIndex == 0 ? 1 : 0)]);
+ }
+ this._views.splice(viewIndex, 1);
+ this._viewsOldOpacity.splice(viewIndex, 1);
+ this._viewsTransition.splice(viewIndex, 1);
+ this.viewElement().removeChild(viewElement);
+ },
+
+ _indexOfView: function(view)
+ {
+ var index = -1;
+ if (this._views.indexOf) {
+ index = this._views.indexOf(view);
+ }
+ else {
+ // Tiger's Dashboard doesn't have indexOf for array
+ for (var i=0; i<this._views.length; i++) {
+ if (this._views[i] == view) {
+ index = i;
+ break;
+ }
+ }
+ }
+ return index;
+ },
+
+ _getView: function(view)
+ {
+ if (view) {
+ if (view.nodeType == 1/*Node.ELEMENT_NODE*/) {
+ // Already an element
+ return view;
+ }
+ if (view.element) {
+ // It's a part object
+ return view.element;
+ }
+
+ // Check our children views
+ for(var i = 0; i < this._views.length; i++) {
+ var child = this._views[i];
+
+ if ((child.id == view) || (child.originalID == view)){
+ return child;
+ }
+ }
+ }
+ return null;
+ },
+
+ _setRestrictToBrowserTransition: function(restrictFlag)
+ {
+ this._restrictedBrowserTransition = restrictFlag ? CreateTransitionWithProperties( {'type' : Transition.PUSH_TYPE, 'direction' : Transition.RIGHT_TO_LEFT_DIRECTION, 'timing' : Transition.EASE_IN_OUT_TIMING} ) : null;
+ },
+
+ _getRealTransition: function(transition)
+ {
+ var realTransition = transition;
+ if (this._restrictedBrowserTransition) {
+ // Note that we are not making a copy of it, mainly for performance reason on the device.
+ realTransition = this._restrictedBrowserTransition;
+ realTransition.setDuration(transition.getDuration());
+ }
+ return realTransition;
+ },
+
+ _setCurrentViewPrimitive: function(newView, oldView, transition, isReverse, makeTopVisible)
+ {
+ // newView must be the element now and all error checking has been done.
+
+ // View swapping in design time is done in application. Also, we want to be very careful about performing transition during design time because the attributes that get added during the transition into the DOM will get persisted into the HTML during regeneration.
+ if (!this._inDesign) {
+ // call the public start transition callback
+ if (this.startTransitionCallback) {
+ this.startTransitionCallback(this, oldView, newView);
+ }
+
+ if (makeTopVisible) {
+ var scrollY = this._topPosFromBody - window.pageYOffset;
+ if (scrollY < 0) {
+ window.scrollBy(0, scrollY);
+ }
+ }
+
+ if (DC.page.focusedElement){
+ DC.page.focusedElement.blur();
+ }
+
+ if (transition) {
+ this._restoreOldOpacity(oldView);
+ this._restoreOldOpacity(newView);
+
+ var realTransition = this._getRealTransition(transition);
+
+ // register transition end callbacks
+ var self = this;
+ realTransition._privateEndTransitionCallback = function(transition) {
+ self._transitionEnded(transition, oldView, newView);
+ }
+
+ realTransition._maskContainerElement = this._maskContainerElement;
+ realTransition.perform(newView, oldView, isReverse);
+ }
+ else {
+ if (oldView) oldView.style.display = 'none';
+ if (newView) {
+ newView.style.display = 'block';
+ this._restoreOldOpacity(newView);
+ }
+ this._transitionEnded(null, oldView, newView);
+ }
+ }
+
+ this._currentView = newView;
+ },
+
+ _transitionEnded: function(transition, oldView, newView)
+ {
+ // if specified, call the private and public end transition callbacks
+ if (this._privateEndTransitionCallback) {
+ this._privateEndTransitionCallback(this, oldView, newView);
+ }
+ if (this.endTransitionCallback) {
+ this.endTransitionCallback(this, oldView, newView);
+ }
+ },
+
+ // Restore previous inline opacity
+ _restoreOldOpacity: function(view)
+ {
+ if (view) {
+ var oldOpacity = this._viewsOldOpacity[this._indexOfView(view)];
+ view.style.opacity = (oldOpacity !== undefined) ? oldOpacity : null;
+ }
+ }
+
+});
View
310 Imaginist.dcproj/project/widget.wdgt/Parts/Transitions.css
@@ -0,0 +1,310 @@
+/* ========================================================================
+ Flip
+ ======================================================================== */
+
+.dashcode-transition-flip-container {
+ -webkit-perspective: 800; /* subviews should have the same perspective during flip */
+ -webkit-animation-name: "dashcode-transition-flip-container";
+}
+/* This works great for ease-in-out but not for other timing. */
+@-webkit-keyframes dashcode-transition-flip-container {
+ from {
+ -webkit-perspective: 1200;
+ }
+ 50% {
+ -webkit-perspective: 600;
+ }
+ to {
+ -webkit-perspective: 1200;
+ }
+}
+
+.dashcode-transition-flip-container-pushback
+{
+ -webkit-animation-name: dashcode-transition-flip-container-pushback;
+}
+/* This works great for ease-in-out but not for other timing. */
+@-webkit-keyframes dashcode-transition-flip-container-pushback {
+ from {
+ -webkit-transform: translateZ(0px);
+ }
+ 50% {
+ -webkit-transform: translateZ(-160px);
+ }
+ to {
+ -webkit-transform: translateZ(0px);
+ }
+}
+
+.dashcode-transition-flip-left-old-view {
+ -webkit-animation-name: "dashcode-transition-flip-left-old-view";
+ -webkit-backface-visibility: hidden;
+}
+@-webkit-keyframes dashcode-transition-flip-left-old-view {
+ from {
+ -webkit-transform: rotateY(0deg);
+ }
+ to {
+ -webkit-transform: rotateY(-180deg);
+ }
+}
+
+.dashcode-transition-flip-left-new-view {
+ -webkit-animation-name: "dashcode-transition-flip-left-new-view";
+ -webkit-backface-visibility: hidden;
+}
+@-webkit-keyframes dashcode-transition-flip-left-new-view {
+ from {
+ -webkit-transform: rotateY(180deg);
+ }
+ to {
+ -webkit-transform: rotateY(0deg);
+ }
+}
+
+.dashcode-transition-flip-right-old-view {
+ -webkit-animation-name: "dashcode-transition-flip-right-old-view";
+ -webkit-backface-visibility: hidden;
+}
+
+@-webkit-keyframes dashcode-transition-flip-right-old-view {
+ from {
+ -webkit-transform: rotateY(0deg);
+ }
+ to {
+ -webkit-transform: rotateY(180deg);
+ }
+}
+
+.dashcode-transition-flip-right-new-view {
+ -webkit-animation-name: "dashcode-transition-flip-right-new-view";
+ -webkit-backface-visibility: hidden;
+}
+@-webkit-keyframes dashcode-transition-flip-right-new-view {
+ from {
+ -webkit-transform: rotateY(-180deg);
+ }
+ to {
+ -webkit-transform: rotateY(0deg);
+ }
+}
+
+
+/* ========================================================================
+ Swap
+ ======================================================================== */
+
+.dashcode-transition-swap-left-old-view {
+ -webkit-animation-name: "dashcode-transition-swap-left-old-view";
+}
+@-webkit-keyframes dashcode-transition-swap-left-old-view {
+ 0% {
+ -webkit-transform: perspective(800) translate3d(0px, 0px, 0px) rotateY(0deg);
+ -webkit-animation-timing-function: ease-in-out;
+ }
+ 50% {
+ -webkit-transform: perspective(800) translate3d(180px, 0px, -400px) rotateY(-20deg);
+ -webkit-animation-timing-function: ease-in;
+ }
+ 100% {
+ -webkit-transform: perspective(800) translate3d(0px, 0px, -800px) rotateY(-70deg);
+ }
+}
+
+.dashcode-transition-swap-left-new-view {
+ -webkit-animation-name: "dashcode-transition-swap-left-new-view";
+}
+@-webkit-keyframes dashcode-transition-swap-left-new-view {
+ 0% {
+ -webkit-transform: perspective(800) translate3d(0px, 0px, -800px) rotateY(70deg);
+ -webkit-animation-timing-function: ease-out;
+ }
+ 50% {
+ -webkit-transform: perspective(800) translate3d(-180px, 0px, -400px) rotateY(20deg);
+ -webkit-animation-timing-function: ease-in-out;
+ }
+ 100% {
+ -webkit-transform: perspective(800) translate3d(0px, 0px, 0px) rotateY(0deg);
+ }
+}
+
+.dashcode-transition-swap-right-old-view {
+ -webkit-animation-name: "dashcode-transition-swap-right-old-view";
+}
+@-webkit-keyframes dashcode-transition-swap-right-old-view {
+ 0% {
+ -webkit-transform: perspective(800) translate3d(0px, 0px, 0px) rotateY(0deg);
+ -webkit-animation-timing-function: ease-in-out;
+ }
+ 50% {
+ -webkit-transform: perspective(800) translate3d(-180px, 0px, -400px) rotateY(20deg);
+ -webkit-animation-timing-function: ease-in;
+ }
+ 100% {
+ -webkit-transform: perspective(800) translate3d(0px, 0px, -800px) rotateY(70deg);
+ }
+}
+
+.dashcode-transition-swap-right-new-view {
+ -webkit-animation-name: "dashcode-transition-swap-right-new-view";
+}
+
+@-webkit-keyframes dashcode-transition-swap-right-new-view {
+ 0% {
+ -webkit-transform: perspective(800) translate3d(0px, 0px, -800px) rotateY(-70deg);
+ -webkit-animation-timing-function: ease-out;
+ }
+ 50% {
+ -webkit-transform: perspective(800) translate3d(180px, 0px, -400px) rotateY(-20deg);
+ -webkit-animation-timing-function: ease-in-out;
+ }
+ 100% {
+ -webkit-transform: perspective(800) translate3d(0px, 0px, 0px) rotateY(0deg);
+ }
+}
+
+/* ========================================================================
+ Revolve
+ ======================================================================== */
+
+.dashcode-transition-revolve-left-old-view {
+ -webkit-animation-name: "dashcode-transition-revolve-left-old-view";
+ -webkit-transform-origin: 0% 50%;
+}
+@-webkit-keyframes dashcode-transition-revolve-left-old-view {
+ from {
+ -webkit-transform: perspective(800) rotateY(0deg);
+ opacity: 1;
+ }
+ to {
+ -webkit-transform: perspective(800) rotateY(-90deg);
+ opacity: 0;
+ }
+}
+
+.dashcode-transition-revolve-left-new-view {
+ -webkit-animation-name: "dashcode-transition-revolve-left-new-view";
+ -webkit-transform-origin: 0% 50%;
+}
+@-webkit-keyframes dashcode-transition-revolve-left-new-view {
+ from {
+ -webkit-transform: perspective(800) rotateY(90deg);
+ }
+ to {
+ -webkit-transform: perspective(800) rotateY(0deg);
+ }
+}
+
+.dashcode-transition-revolve-left-reverse-old-view {
+ -webkit-animation-name: "dashcode-transition-revolve-left-reverse-old-view";
+ -webkit-transform-origin: 0% 50%;
+}
+@-webkit-keyframes dashcode-transition-revolve-left-reverse-old-view {
+ from {
+ -webkit-transform: perspective(800) rotateY(0deg);
+ }
+ to {
+ -webkit-transform: perspective(800) rotateY(90deg);
+ }
+}
+
+.dashcode-transition-revolve-left-reverse-new-view {
+ -webkit-animation-name: "dashcode-transition-revolve-left-reverse-new-view";
+ -webkit-transform-origin: 0% 50%;
+}
+@-webkit-keyframes dashcode-transition-revolve-left-reverse-new-view {
+ from {
+ -webkit-transform: perspective(800) rotateY(-90deg);
+ opacity: 0;
+ }
+ to {
+ -webkit-transform: perspective(800) rotateY(0deg);
+ opacity: 1;
+ }
+}
+
+.dashcode-transition-revolve-right-old-view {
+ -webkit-animation-name: "dashcode-transition-revolve-right-old-view";
+ -webkit-transform-origin: 100% 50%;
+}
+
+@-webkit-keyframes dashcode-transition-revolve-right-old-view {
+ from {
+ -webkit-transform: perspective(800) rotateY(0deg);
+ opacity: 1;
+ }
+ to {
+ -webkit-transform: perspective(800) rotateY(90deg);
+ opacity: 0;
+ }
+}
+
+.dashcode-transition-revolve-right-new-view {
+ -webkit-animation-name: "dashcode-transition-revolve-right-new-view";
+ -webkit-transform-origin: 100% 50%;
+}
+
+@-webkit-keyframes dashcode-transition-revolve-right-new-view {
+ from {
+ -webkit-transform: perspective(800) rotateY(-90deg);
+ }
+ to {
+ -webkit-transform: perspective(800) rotateY(0deg);
+ }
+}
+
+.dashcode-transition-revolve-right-old-view {
+ -webkit-animation-name: "dashcode-transition-revolve-right-old-view";
+ -webkit-transform-origin: 100% 50%;
+}
+@-webkit-keyframes dashcode-transition-revolve-right-old-view {
+ from {
+ -webkit-transform: perspective(800) rotateY(0deg);
+ opacity: 1;
+ }
+ to {
+ -webkit-transform: perspective(800) rotateY(90deg);
+ opacity: 0;
+ }
+}
+
+.dashcode-transition-revolve-right-new-view {
+ -webkit-animation-name: "dashcode-transition-revolve-right-new-view";
+ -webkit-transform-origin: 100% 50%;
+}
+@-webkit-keyframes dashcode-transition-revolve-right-new-view {
+ from {
+ -webkit-transform: perspective(800) rotateY(-90deg);
+ }
+ to {
+ -webkit-transform: perspective(800) rotateY(0deg);
+ }
+}
+
+.dashcode-transition-revolve-right-reverse-old-view {
+ -webkit-animation-name: "dashcode-transition-revolve-right-reverse-old-view";
+ -webkit-transform-origin: 100% 50%;
+}
+@-webkit-keyframes dashcode-transition-revolve-right-reverse-old-view {
+ from {
+ -webkit-transform: perspective(800) rotateY(0deg);
+ }
+ to {
+ -webkit-transform: perspective(800) rotateY(-90deg);
+ }
+}
+
+.dashcode-transition-revolve-right-reverse-new-view {
+ -webkit-animation-name: "dashcode-transition-revolve-right-reverse-new-view";
+ -webkit-transform-origin: 100% 50%;
+}
+@-webkit-keyframes dashcode-transition-revolve-right-reverse-new-view {
+ from {
+ -webkit-transform: perspective(800) rotateY(90deg);
+ opacity: 0;
+ }
+ to {
+ -webkit-transform: perspective(800) rotateY(0deg);
+ opacity: 1;
+ }
+}
View
795 Imaginist.dcproj/project/widget.wdgt/Parts/Transitions.js
@@ -0,0 +1,795 @@
+/*
+ This file was generated by Dashcode and is covered by the
+ license.txt included in the project. You may edit this file,
+ however it is recommended to first turn off the Dashcode
+ code generator otherwise the changes will be lost.
+ */
+
+// Note: Properties and methods beginning with underbar ("_") are considered private and subject to change in future Dashcode releases.
+
+// Currently supported transition types
+Transition.NONE_TYPE = 'none';
+Transition.PUSH_TYPE = 'push';
+Transition.DISSOLVE_TYPE = 'dissolve';
+Transition.SLIDE_TYPE = 'slide';
+Transition.FADE_TYPE = 'fade';
+Transition.FLIP_TYPE = 'flip';
+Transition.CUBE_TYPE = 'cube';
+Transition.SWAP_TYPE = 'swap';
+Transition.REVOLVE_TYPE = 'revolve';
+
+// Transition timing functions that are defined as part of WebKit CSS animation specification. These are made available for your convenience.
+Transition.EASE_TIMING = 'ease';
+Transition.LINEAR_TIMING = 'linear';
+Transition.EASE_IN_TIMING = 'ease-in';
+Transition.EASE_OUT_TIMING = 'ease-out';
+Transition.EASE_IN_OUT_TIMING = 'ease-in-out';
+
+// Directions are only supported for certain transition types.
+// Push and Slide support all four directions.
+// Flip, Cube, Swap and Revolve support only Right-to-left and Left-to-right
+Transition.RIGHT_TO_LEFT_DIRECTION = 'right-left';
+Transition.LEFT_TO_RIGHT_DIRECTION = 'left-right';
+Transition.TOP_TO_BOTTOM_DIRECTION = 'top-bottom';
+Transition.BOTTOM_TO_TOP_DIRECTION = 'bottom-top';
+
+//
+// Constructor for Transtition object. You can also use the convenience method CreateTransitionWithProperties()
+//
+// type - any of the Transition type constants
+// duration - a float in seconds
+// timing - a valid CSS animation timing function value. For example, 'linear' or 'ease-in-out'
+//
+// After construction, you can also assign one of the direction constants above to the "direction" property to set the transition direction for transition types that support different directions (see comments above.)
+//
+// Public properties
+// startTransitionCallback: function to call when a transition will start
+// The callback function will receive 3 parameters: (transition, startView, endView)
+// transition: The transition object that will perform the transition
+// startView: The start view element for the transition
+// endView: The destination view element for the transition
+// endTransitionCallback: function to call when a transition did end
+// The callback function will receive 3 parameters: (transition, startView, endView)
+// transition: The transition object that performed the transition
+// startView: The start view element for the transition
+// endView: The destination view element for the transition
+
+
+
+function Transition(type, duration, timing)
+{
+ this.type = type;
+ this.setDuration(duration);
+ this.timing = timing;
+
+ this._useTransforms = Transition.areTransformsSupported();
+}
+
+//
+// Create a new Transition object and fill its internal properties from the dictionary parameter
+//
+function CreateTransitionWithProperties(properties)
+{
+ var transition = new Transition();
+ for (var property in properties) {
+ if (property == 'duration') {
+ transition.setDuration(properties[property]);
+ } else {
+ transition[property] = properties[property];
+ }
+ }
+ return transition;
+}
+
+//
+// Both newView and oldView must share the same common parent container element. The transition is
+// constrained by the dimensions of the parent container. In particular, the container has
+// 'overflow: hidden'. This is especially important when the container edges are not lined with the
+// edge of the device viewport.
+//
+// Be careful that this method actually makes use of these inline CSS properties to make sure that
+// all transitions can be performed correctly:
+// - display
+// - zIndex
+// - position
+// - top
+// - width
+// If you also make use of these CSS properties out of this transition method, you have to make
+// copies of them restore them appropriately.
+//
+//
+// newView - the new view to be shown. Nothing will change if newView is null.
+// oldView - the old view to be replaced
+// isReverse - if flag is true, it will perform the transition in reverse. Some transitions, for example, the push transition has a reverse.
+//
+Transition.prototype.perform = function(newView, oldView, isReverse)
+{
+ if (!newView || !newView.parentNode) return;
+ var containerElement = newView.parentNode;
+ if (oldView) {
+ // Got to execute in the same container
+ if (oldView.parentNode != containerElement) return;
+ if (oldView == newView) return;
+
+ containerElement = oldView.parentNode; // In case there is a push container
+ if (containerElement.getAttribute('apple-transition-flip-push-container')) {
+ this._pushContainer = containerElement;
+ containerElement = this._pushContainer.parentNode;
+ }
+ else {
+ // Clear any residue push container for flip
+ this._pushContainer = null;
+ }
+
+ var oldStyle = oldView.style;
+ // Reset some settings
+ oldStyle.zIndex = 0;
+ // Since oldView is just taken out of the document flow, make sure its width still looks good just in case width is 'auto' and its children doesn't make up all the width
+ this._containerWidth = containerElement.offsetWidth + 'px';
+ oldStyle.width = this._containerWidth;
+ // This is especially important for reverse since the original value of 'top' is 'auto', which for a view lower in the document flow means that it will come after the newly restored view. Hence, let's set it to a right value before newView is put to 'relative' again.
+ oldStyle.top = oldView.offsetTop + 'px';
+
+ if (this._useTransforms) {
+ oldStyle.webkitTransitionProperty = 'none'; // disable
+ // This also makes sure that we start with an identity matrix to avoid initial performance problem
+ oldStyle.webkitTransform = this._translateOp(0, 0);
+ oldStyle.webkitBackfaceVisibility = '';
+ }
+
+ if (!this.type || this.type == Transition.NONE_TYPE || !this._useTransforms) {
+ if ((this.type != Transition.FADE_TYPE) && (this.type != Transition.SLIDE_TYPE) || isReverse) {
+ oldStyle.display = 'none';
+ }
+ }
+ }
+
+ // Make sure that container is constraining the transitions for overflow content
+ containerElement.style.overflow = 'hidden';
+ var computedPosition = Element.getStyles(containerElement, 'position');
+ if ((computedPosition != 'absolute') && (computedPosition != 'relative')) {
+ // Assume 'static' since we don't support 'fixed'. 'relative' is less obtrusive then.
+ containerElement.style.position = 'relative';
+ }
+
+ var newStyle = newView.style;
+ if (this._useTransforms) {
+ // Reset
+ newStyle.webkitTransitionProperty = 'none'; // disable
+ // This also makes sure that we start with an identity matrix to avoid initial performance problem
+ newStyle.webkitTransform = this._translateOp(0, 0);
+ newStyle.webkitBackfaceVisibility = '';
+
+ // This overcomes a clipping problem
+ containerElement.parentNode.style.zIndex = 0;
+ }
+
+ // Before the new view comes in, remove any previously hard-coded inline value that would have crept in when it was transited out. Because the transition is happening in a container and we are reinstating the position to be 'relative', the new view will resize itself to react to orientation changes (if any).
+ newStyle.width = null;
+ newStyle.position = 'relative';
+ newStyle.display = 'block';
+
+ // if specified, call the public start transition callback
+ if (this.startTransitionCallback) {
+ this.startTransitionCallback(this, oldView, newView);
+ }
+
+ // Perform the transition
+ if (this.type && this.type != Transition.NONE_TYPE && this._useTransforms) {
+ this._checkedForEnded = false;
+ this._containerElement = containerElement;
+ this._newView = newView;
+ this._oldView = oldView;
+ // Make sure that we make a copy of the newView's inline opacity because we are going to make use of it in various ways, for example, for the fade or revolve transition
+ this._previousNewStyleOpacity = newStyle.opacity;
+ // Normally, the old view disappears as part of transition. Some transitions like slide/fade requires the old view to be there though.
+ this._shouldHideOldView = true;
+
+ if (oldView) {
+ // If the new view is too short to fit the whole view port height, this will even show the Safari toolbar before the transition happens,
+ oldStyle.position = 'absolute';
+
+ this._preventEventsInContainer();
+
+ this._originalContainerElementHeight = containerElement.style.height;
+ containerElement.style.height = Math.max(oldView.offsetHeight, newView.offsetHeight) + 'px';
+ }
+
+ if (this._pushContainer && (this.type != Transition.FLIP_TYPE)) {
+ this._clearPushContainer();
+ }
+
+ if (this.type == Transition.DISSOLVE_TYPE || this.type == Transition.FADE_TYPE) {
+ this._performFadeTransition(isReverse);
+ }
+ else if (this.type == Transition.PUSH_TYPE || this.type == Transition.SLIDE_TYPE) {
+ this._performPushOrSlideTransition(isReverse);
+ }
+ else if (this.type == Transition.FLIP_TYPE) {
+ this._performFlipTransition(isReverse);
+ }
+ else if (this.type == Transition.CUBE_TYPE) {
+ this._performCubeTransition(isReverse);
+ }
+ else if (this.type == Transition.SWAP_TYPE) {
+ this._performSwapTransition(isReverse);
+ }
+ else if (this.type == Transition.REVOLVE_TYPE) {
+ this._performRevolveTransition(isReverse);
+ }
+ } else {
+ // if specified, call the transition ended callbacks directly
+ if (this._privateEndTransitionCallback) {
+ this._privateEndTransitionCallback(this, oldView, newView);
+ }
+ if (this.endTransitionCallback) {
+ this.endTransitionCallback(this, oldView, newView);
+ }
+ }
+}
+
+Transition.areTransformsSupported = function () {
+ if (!Transition._areTransformsSupported) {
+ // Our use of transforms and transitions is only officially supported for mobile Safari and does not work correctly in Safari WebKit.
+ // The commented out test would be more correct if desktop WebKit were also supported.
+ /*
+ var testElem = document.createElement('div');
+ var style = testElem.style;
+ style.setProperty('-webkit-transform', 'inherit');
+ Transition._areTransformsSupported = style.getPropertyValue('-webkit-transform') == 'inherit';
+ */
+
+ // But currently, we are using the following test which succeeds on Mobile Safari but not on Safari.
+ Transition._areTransformsSupported = (window.WebKitCSSMatrix ? true : false);
+ }
+ return Transition._areTransformsSupported;
+}
+
+// Default duration for each transition type, if it is not specified
+Transition._DEFAULT_DURATION = {
+ 'none' : '0.35',
+ 'push' : '0.35',
+ 'dissolve' : '0.35',
+ 'slide' : '0.35',
+ 'fade' : '0.35',
+ 'flip' : '0.65',
+ 'cube' : '0.55',
+ 'swap' : '0.55',
+ 'revolve' : '0.35'
+}
+
+//
+// Returns the duration for the transition.
+//
+Transition.prototype.getDuration = function()
+{
+ var duration = this._duration;
+ if (duration == '') {
+ duration = Transition._DEFAULT_DURATION[this.type];
+ if (!duration) duration = '0.3';
+ }
+ return duration;
+}
+
+//
+// Sets the duration for the transition.
+//
+// value - new duration
+//
+Transition.prototype.setDuration = function(value)
+{
+ this._duration = value;
+}
+
+/////////////////////////////////////////////////////////////////////////////
+//
+// Start Private methods
+//
+/////////////////////////////////////////////////////////////////////////////
+
+Transition.prototype._getDurationString = function()
+{
+ var value = parseFloat(this.getDuration());
+ if (!isNaN(value)) {
+ value += 's';
+ }
+ else {
+ value = '0s';
+ }
+ return value;
+}
+
+Transition.prototype._getDurationStringForFadingEffect = function()
+{
+ var value = parseFloat(this.getDuration());
+ if (!isNaN(value)) {
+ // looks better with slightly longer timing
+ value = value * (1+ ((value < 0.25) ? 0.5 : Math.pow(4, -0.25-value))) + 's';
+ }
+ else {
+ value = '0s';
+ }
+ return value;
+}
+
+Transition.prototype._translateOp = function(xPixels, yPixels)
+{
+ return 'translate(' + xPixels + 'px, ' + yPixels + 'px)';
+}
+
+Transition.prototype._rotateOp = function(axis, degree)
+{
+ return 'rotate' + axis + '(' + degree + 'deg)';
+}
+
+Transition.prototype._setupTransition = function(style, property, duration, timing, propertyString, propertyValue)
+{
+ style.webkitTransitionProperty = property;
+ style.webkitTransitionDuration = duration;
+ style.webkitTransitionTimingFunction = timing;
+ style[propertyString] = propertyValue;
+}
+
+Transition.prototype.handleEvent = function(event)
+{
+ switch (event.type) {
+ case 'webkitTransitionEnd' :
+ this._transitionEnded(event);
+ break;
+ case 'webkitAnimationEnd' :
+ this._animationEnded(event);
+ break;
+ }
+}
+
+// Prevent user events from interfering from happening during transition
+Transition.prototype._preventEventsInContainer = function()
+{
+ if (!this._maskContainerElement) return;
+
+ if (this._mask) this._maskContainerElement.removeChild(this._mask);
+
+ this._mask = document.createElement("div");
+ this._mask.setAttribute('style', 'position: absolute; top: 0; left: 0; z-index: 1000;');
+ this._mask.style.width = this._maskContainerElement.offsetWidth + 'px';
+ this._mask.style.height = this._maskContainerElement.offsetHeight + 'px';
+ this._maskContainerElement.appendChild(this._mask);
+}
+
+// Re-parent children of _pushContainer back to _containerElement whenever the transition is not a flip.
+Transition.prototype._clearPushContainer = function()
+{
+ if (this._pushContainer) {
+ this._containerElement.removeChild(this._pushContainer);
+
+ var children = this._pushContainer.childNodes;
+ for (var i=children.length-1; i>=0; i--) {
+ if (children[i] != this._mask) {
+ this._containerElement.appendChild(children[i]);
+ }
+ }
+
+ delete this._pushContainer;
+ }
+}
+
+Transition.prototype._transitionEndedHelper = function()
+{
+ if (this._shouldHideOldView) {
+ this._oldView.style.display = 'none';
+ }
+ this._newView.style.zIndex = 1;
+ this._newView.style.opacity = this._previousNewStyleOpacity;
+
+ if (this._maskContainerElement && this._mask) {
+ this._maskContainerElement.removeChild(this._mask);
+ this._mask = null;
+ }
+
+ this._containerElement.style.height = this._originalContainerElementHeight;
+
+ // if specified, call the public and private transition end callback
+ if (this._privateEndTransitionCallback) {
+ this._privateEndTransitionCallback(this, this._oldView, this._newView);
+ }
+ if (this.endTransitionCallback) {
+ this.endTransitionCallback(this, this._oldView, this._newView);
+ }
+}
+
+// Callback for end of transition
+Transition.prototype._transitionEnded = function(event)
+{
+ if (!this._checkedForEnded) {
+ this._transitionEndedHelper();
+
+ if (this.type == Transition.CUBE_TYPE) {
+ this._containerElement.style.webkitPerspective = '';
+ this._oldView.style.webkitTransformOrigin = '';
+ this._newView.style.webkitTransformOrigin = '';
+ }
+
+ this._checkedForEnded = true;
+ }
+}
+
+// A handy method to find the style rule of a CSS animation rule (the one that starts with '@');
+Transition._findAnimationRule = function(animationRuleName)
+{
+ var foundRule = null;
+ var styleSheets = document.styleSheets;
+ var re = /Parts\/Transitions.css$/;
+ for (var i=0; i < styleSheets.length; i++) {
+ var styleSheet = styleSheets[i];
+ if (re.test(styleSheet.href)) {
+ for (var j=0; j < styleSheet.cssRules.length; j++) {
+ var rule = styleSheet.cssRules[j];
+ // 7 means the keyframe rule
+ if (rule.type == 7 && rule.name == animationRuleName) {
+ foundRule = rule;
+ break;
+ }
+ }
+ }
+ }
+ return foundRule;
+}
+
+Transition.prototype._animationEndedHelper = function()
+{
+ this._transitionEndedHelper();
+
+ Transition._removeClassName(this._oldView, this._oldViewAnimationName);
+ Transition._removeClassName(this._newView, this._newViewAnimationName);
+}
+
+// Callback for end of animation
+Transition.prototype._animationEnded = function(event)
+{
+ if (!this._checkedForEnded) {
+ this._animationEndedHelper();
+
+ if (this.type == Transition.FLIP_TYPE) {
+ Transition._removeClassName(this._containerElement, 'dashcode-transition-flip-container');
+ Transition._removeClassName(this._pushContainer, 'dashcode-transition-flip-container-pushback');
+ }
+
+ this._checkedForEnded = true;
+ }
+}
+
+Transition.prototype._performFadeTransition = function(isReverse)
+{
+ if (this._oldView) {
+ var _self = this;
+ var newStyle = this._newView.style;
+ var oldStyle = this._oldView.style;
+ var isDissolve = this.type == Transition.DISSOLVE_TYPE;
+ var isSimpleFade = this.type == Transition.FADE_TYPE;
+
+ if (isSimpleFade) {
+ if (!isReverse) newStyle.opacity = 0;
+ }
+ else if (isDissolve) {
+ newStyle.opacity = 0;
+ }
+
+ var durationString = this._getDurationStringForFadingEffect(this.getDuration());
+ Transition._addDelayedTransitionCallback(function() {
+ if (isDissolve || (isSimpleFade && isReverse)) {
+ _self._setupTransition(oldStyle, 'opacity', durationString, _self.timing, 'opacity', 0);
+ }
+ else {
+ _self._shouldHideOldView = false;
+ }
+
+ if (isDissolve || (isSimpleFade && !isReverse)) {
+ // _self._previousNewStyleOpacity - restoring the saved inline opacity, instead of blindly blasting it away
+ _self._setupTransition(newStyle, 'opacity', durationString, _self.timing, 'opacity', _self._previousNewStyleOpacity);
+ }
+ });
+
+ // Register a callback for the end of the animation for clean up and/or resets
+ Event.observe(this._newView, 'webkitTransitionEnd', this);
+ }
+}
+
+Transition.prototype._performPushOrSlideTransition = function(isReverse)
+{
+ if (this._oldView) {
+ var _self = this;
+ var newStyle = this._newView.style;
+ var oldStyle = this._oldView.style;
+ var isPush = this.type == Transition.PUSH_TYPE;
+ var isSlide = this.type == Transition.SLIDE_TYPE;
+ var transformX = true;
+
+ var factor = isReverse ? -1 : 1;
+ var dimension = parseInt(this._containerWidth, 10);
+ if (this.direction == Transition.BOTTOM_TO_TOP_DIRECTION) {
+ transformX = false;
+ dimension = isReverse ? this._newView.offsetHeight : this._oldView.offsetHeight;
+ } else if (this.direction == Transition.TOP_TO_BOTTOM_DIRECTION) {
+ transformX = false;
+ dimension = isReverse ? this._oldView.offsetHeight : this._newView.offsetHeight;
+ }
+ if (this.direction == Transition.LEFT_TO_RIGHT_DIRECTION || this.direction == Transition.TOP_TO_BOTTOM_DIRECTION) factor *= -1;
+
+ if (isPush || (isSlide && !isReverse)) {
+ newStyle.webkitTransitionProperty = 'none'; // disable
+ var transformOp;
+ if (transformX) {
+ transformOp = this._translateOp(factor*dimension, 0);
+ } else {
+ transformOp = this._translateOp(0, factor*dimension);
+ }
+ newStyle.webkitTransform = transformOp;
+ }
+
+ Transition._addDelayedTransitionCallback(function() {
+ var durationString = _self._getDurationString();
+
+ if (isPush || (isSlide && isReverse)) {
+ var transformOp;
+ if (transformX) {
+ transformOp = _self._translateOp(-1*factor*dimension, 0);
+ } else {
+ transformOp = _self._translateOp(0, -1*factor*dimension);
+ }
+ _self._setupTransition(oldStyle, '-webkit-transform', durationString, _self.timing, 'webkitTransform', transformOp);
+ }
+ else {
+ _self._shouldHideOldView = false;
+ }
+
+ if (isPush || (isSlide && !isReverse)) {
+ _self._setupTransition(newStyle, '-webkit-transform', durationString, _self.timing, 'webkitTransform', _self._translateOp(0, 0));
+ }
+ });
+
+ // Register a callback for the end of the animation for clean up and/or resets
+ Event.observe(this._newView, 'webkitTransitionEnd', this);
+ }
+}
+
+Transition.prototype._performFlipTransition = function(isReverse)
+{
+ if (this._oldView) {
+ // Using Animation
+ var newStyle = this._newView.style;
+ var oldStyle = this._oldView.style;
+
+ var dimension = parseInt(this._containerWidth, 10);
+ if (dimension != 320) {
+ if (Transition._containerFlipTranslateZStyle === undefined) {
+ var animationRule = Transition._findAnimationRule('dashcode-transition-flip-container-pushback');
+ try {
+ Transition._containerFlipTranslateZStyle = animationRule.findRule('50%').style;
+ }
+ catch (e) {
+ Transition._containerFlipTranslateZStyle = null;
+ }
+ }
+ }
+ if (Transition._containerFlipTranslateZStyle) {
+ Transition._containerFlipTranslateZStyle.webkitTransform = 'translateZ(' + -1*dimension/2 + 'px)';
+ }
+
+ // Creating a dynamic container to make flip smoother
+ if (!this._pushContainer) {
+ this._pushContainer = document.createElement('div');
+ // Tag it
+ this._pushContainer.setAttribute('apple-transition-flip-push-container', 'true');
+ // Spec says that overflow:hidden and preserve-3d don't mix.
+ this._pushContainer.setAttribute('style', 'position: relative; top: 0; left: 0; overflow: visible; z-index: 0; -webkit-transform-style: preserve-3d;');
+
+ var children = this._containerElement.childNodes;
+ for (var i=children.length-1; i>=0; i--) {
+ if (children[i] != this._mask) {
+ this._pushContainer.appendChild(children[i]);
+ }
+ }
+ this._containerElement.appendChild(this._pushContainer);
+ }
+
+ var durationString = this._getDurationString();
+
+ var direction = this.direction;
+ if (direction != Transition.RIGHT_TO_LEFT_DIRECTION && direction != Transition.LEFT_TO_RIGHT_DIRECTION) direction = Transition.RIGHT_TO_LEFT_DIRECTION;
+ var fromRight = ((direction == Transition.RIGHT_TO_LEFT_DIRECTION) && !isReverse) || ((direction == Transition.LEFT_TO_RIGHT_DIRECTION) && isReverse);
+
+ oldStyle.webkitAnimationDuration = durationString;
+ oldStyle.webkitAnimationTimingFunction = this.timing;
+ var oldViewAnimationName = fromRight ? 'dashcode-transition-flip-right-old-view' : 'dashcode-transition-flip-left-old-view';
+ Transition._addClassName(this._oldView, oldViewAnimationName);
+ newStyle.webkitAnimationDuration = durationString;
+ newStyle.webkitAnimationTimingFunction = this.timing;
+ var newViewAnimationName = fromRight ? 'dashcode-transition-flip-right-new-view' : 'dashcode-transition-flip-left-new-view';
+ Transition._addClassName(this._newView, newViewAnimationName);
+
+ this._pushContainer.style.webkitAnimationDuration = durationString
+ this._pushContainer.style.webkitAnimationTimingFunction = this.timing;
+ Transition._addClassName(this._pushContainer, 'dashcode-transition-flip-container-pushback');
+ this._containerElement.style.webkitAnimationDuration = durationString
+ this._containerElement.style.webkitAnimationTimingFunction = this.timing;
+ Transition._addClassName(this._containerElement, 'dashcode-transition-flip-container');
+
+ // Register a callback for the end of the animation for clean up
+ Event.observe(this._containerElement, 'webkitAnimationEnd', this);
+ this._newViewAnimationName = newViewAnimationName;
+ this._oldViewAnimationName = oldViewAnimationName;
+ }
+}
+
+Transition.prototype._performCubeTransition = function(isReverse)
+{
+ if (this._oldView) {
+ var _self = this;
+ var newStyle = this._newView.style;
+ var oldStyle = this._oldView.style;
+
+ var durationString = this._getDurationString();
+ var direction = this.direction;
+ if (direction != Transition.RIGHT_TO_LEFT_DIRECTION && direction != Transition.LEFT_TO_RIGHT_DIRECTION) direction = Transition.RIGHT_TO_LEFT_DIRECTION;
+ var fromRight = ((direction == Transition.RIGHT_TO_LEFT_DIRECTION) && !isReverse) || ((direction == Transition.LEFT_TO_RIGHT_DIRECTION) && isReverse);
+
+ this._containerElement.style.webkitPerspective = '800';
+ oldStyle.webkitBackfaceVisibility = 'hidden';
+ oldStyle.webkitTransformOrigin = fromRight ? '100% 50%' : '0% 50%';
+ newStyle.webkitBackfaceVisibility = 'hidden';
+ newStyle.webkitTransformOrigin = fromRight ? '0% 50%' : '100% 50%';
+
+ var factor = fromRight ? 1 : -1;
+ var dimension = parseInt(this._containerWidth, 10);
+
+ newStyle.webkitTransitionProperty = 'none'; // disable
+ newStyle.webkitTransform = _self._rotateOp('Y', factor*90) + ' translateZ(' + dimension + 'px)';
+
+ Transition._addDelayedTransitionCallback(function() {
+ var durationString = _self._getDurationString();
+
+ _self._setupTransition(oldStyle, '-webkit-transform', durationString, _self.timing, 'webkitTransform', _self._rotateOp('Y', factor*-90) + ' translateZ(' + dimension + 'px)');
+ _self._setupTransition(newStyle, '-webkit-transform', durationString, _self.timing, 'webkitTransform', 'rotateY(0deg) translateZ(0px)');
+ });
+
+ // Register a callback for the end of the animation for clean up and/or resets
+ Event.observe(this._newView, 'webkitTransitionEnd', this);
+ }
+}
+
+Transition.prototype._performSwapTransition = function(isReverse)
+{
+ if (this._oldView) {
+ // Using Animation
+ var newStyle = this._newView.style;
+ var oldStyle = this._oldView.style;
+
+ var durationString = this._getDurationString();
+
+ var direction = this.direction;
+ if (direction != Transition.RIGHT_TO_LEFT_DIRECTION && direction != Transition.LEFT_TO_RIGHT_DIRECTION) direction = Transition.RIGHT_TO_LEFT_DIRECTION;
+ var fromRight = ((direction == Transition.RIGHT_TO_LEFT_DIRECTION) && !isReverse) || ((direction == Transition.LEFT_TO_RIGHT_DIRECTION) && isReverse);
+
+ oldStyle.webkitAnimationDuration = durationString;
+ oldStyle.webkitAnimationTimingFunction = this.timing;
+ var oldViewAnimationName = fromRight ? 'dashcode-transition-swap-right-old-view' : 'dashcode-transition-swap-left-old-view';
+ Transition._addClassName(this._oldView, oldViewAnimationName);
+ newStyle.webkitAnimationDuration = durationString;
+ newStyle.webkitAnimationTimingFunction = this.timing;
+ var newViewAnimationName = fromRight ? 'dashcode-transition-swap-right-new-view' : 'dashcode-transition-swap-left-new-view';
+ Transition._addClassName(this._newView, newViewAnimationName);
+
+ // Register a callback for the end of the animation for clean up and/or resets
+ Event.observe(this._newView, 'webkitAnimationEnd', this);
+ this._newViewAnimationName = newViewAnimationName;
+ this._oldViewAnimationName = oldViewAnimationName;
+ }
+}
+
+Transition.prototype._performRevolveTransition = function(isReverse)
+{
+ if (this._oldView) {
+ // Using Animation
+ var newStyle = this._newView.style;
+ var oldStyle = this._oldView.style;
+
+ var durationString = this._getDurationString();
+
+ oldStyle.webkitAnimationDuration = durationString;
+ oldStyle.webkitAnimationTimingFunction = this.timing;
+ var oldViewAnimationName;
+ var direction = this.direction;
+ if (direction != Transition.RIGHT_TO_LEFT_DIRECTION && direction != Transition.LEFT_TO_RIGHT_DIRECTION) direction = Transition.RIGHT_TO_LEFT_DIRECTION;
+
+ if (direction == Transition.RIGHT_TO_LEFT_DIRECTION) {
+ oldViewAnimationName = isReverse ? 'dashcode-transition-revolve-right-old-view' : 'dashcode-transition-revolve-right-reverse-old-view';
+ }
+ else {
+ oldViewAnimationName = isReverse ? 'dashcode-transition-revolve-left-old-view' : 'dashcode-transition-revolve-left-reverse-old-view';
+ }
+ Transition._addClassName(this._oldView, oldViewAnimationName);
+ newStyle.webkitAnimationDuration = durationString;
+ newStyle.webkitAnimationTimingFunction = this.timing;
+ var newViewAnimationName;
+ if (direction == Transition.RIGHT_TO_LEFT_DIRECTION) {
+ newViewAnimationName = isReverse ? 'dashcode-transition-revolve-right-new-view' : 'dashcode-transition-revolve-right-reverse-new-view';
+ }
+ else {
+ newViewAnimationName = isReverse ? 'dashcode-transition-revolve-left-new-view' : 'dashcode-transition-revolve-left-reverse-new-view';
+ }
+ Transition._addClassName(this._newView, newViewAnimationName);
+
+ // Register a callback for the end of the animation for clean up and/or resets
+ Event.observe(this._newView, 'webkitAnimationEnd', this);
+ this._newViewAnimationName = newViewAnimationName;
+ this._oldViewAnimationName = oldViewAnimationName;
+ }
+}
+
+//
+// _hasClassName(element, className)
+// Checks if an element's class attribute has 'className' (adopted from Prototype framework)
+//
+// element: element to act on
+// className: value to check
+//
+Transition._hasClassName = function(element, className)
+{
+ if (element) {
+ var elementClassName = element.className;
+ return (elementClassName.length > 0 && (elementClassName == className ||
+ new RegExp("(^|\\s)" + className + "(\\s|$)").test(elementClassName)));
+ }
+}
+
+//
+// _addClassName(element, className)
+// Add 'className' to element if an element's class attribute doesn't already have 'className' (adopted from Prototype framework)
+//
+// element: element to act on
+// className: value to add
+//
+Transition._addClassName = function(element, className)
+{
+ if (element) {
+ if (!this._hasClassName(element, className)) element.className += (element.className ? ' ' : '') + className;
+ return element;
+ }
+ return null;
+}
+
+//
+// _removeClassName(element, className)
+// Remove 'className' from element if an element's class attribute has 'className' (adopted from Prototype framework)
+//
+// element: element to act on
+// className: value to remove
+//
+Transition._removeClassName = function(element, className)
+{
+ if (element) {
+ element.className = element.className.replace(new RegExp("(^|\\s+)" + className + "(\\s+|$)"), ' ');
+ element.className = element.className.replace(/^\s+|\s+$/g, ""); // strip whitespace
+ return element;
+ }
+ return null;
+}
+
+// Accumulate transitions that will be executed after a 0 delay
+Transition._addDelayedTransitionCallback = function(callback)
+{