Canvas.st 7.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564
  1. Smalltalk current createPackage: 'Canvas' properties: #{}!
  2. Object subclass: #HTMLCanvas
  3. instanceVariableNames: 'root'
  4. category: 'Canvas'!
  5. !HTMLCanvas methodsFor: 'accessing'!
  6. root: aTagBrush
  7. root := aTagBrush
  8. !
  9. root
  10. ^root
  11. ! !
  12. !HTMLCanvas methodsFor: 'adding'!
  13. with: anObject
  14. ^self root with: anObject
  15. ! !
  16. !HTMLCanvas methodsFor: 'initialization'!
  17. initialize
  18. super initialize.
  19. root ifNil: [root := TagBrush fromString: 'div' canvas: self]
  20. !
  21. initializeFromJQuery: aJQuery
  22. root := TagBrush fromJQuery: aJQuery canvas: self
  23. ! !
  24. !HTMLCanvas methodsFor: 'tags'!
  25. newTag: aString
  26. ^TagBrush fromString: aString canvas: self
  27. !
  28. tag: aString
  29. ^root addBrush: (self newTag: aString)
  30. !
  31. h1
  32. ^self tag: 'h1'
  33. !
  34. h2
  35. ^self tag: 'h2'
  36. !
  37. h3
  38. ^self tag: 'h3'
  39. !
  40. h4
  41. ^self tag: 'h4'
  42. !
  43. h5
  44. ^self tag: 'h5'
  45. !
  46. h6
  47. ^self tag: 'h6'
  48. !
  49. p
  50. ^self tag: 'p'
  51. !
  52. div
  53. ^self tag: 'div'
  54. !
  55. span
  56. ^self tag: 'span'
  57. !
  58. img
  59. ^self tag: 'img'
  60. !
  61. ul
  62. ^self tag: 'ul'
  63. !
  64. ol
  65. ^self tag: 'ol'
  66. !
  67. li
  68. ^self tag: 'li'
  69. !
  70. table
  71. ^self tag: 'table'
  72. !
  73. tr
  74. ^self tag: 'tr'
  75. !
  76. td
  77. ^self tag: 'td'
  78. !
  79. th
  80. ^self tag: 'th'
  81. !
  82. form
  83. ^self tag: 'form'
  84. !
  85. input
  86. ^self tag: 'input'
  87. !
  88. button
  89. ^self tag: 'button'
  90. !
  91. select
  92. ^self tag: 'select'
  93. !
  94. option
  95. ^self tag: 'option'
  96. !
  97. textarea
  98. ^self tag: 'textarea'
  99. !
  100. a
  101. ^self tag: 'a'
  102. !
  103. canvas
  104. ^self tag: 'canvas'
  105. !
  106. pre
  107. ^self tag: 'pre'
  108. !
  109. code
  110. ^self tag: 'code'
  111. !
  112. br
  113. ^self tag: 'br'
  114. !
  115. script
  116. ^self tag: 'script'
  117. !
  118. link
  119. ^self tag: 'link'
  120. !
  121. style
  122. ^ root addBrush: (StyleTag canvas: self)
  123. !
  124. p: anObject
  125. ^self p with: anObject
  126. !
  127. h1: anObject
  128. ^self h1 with: anObject
  129. !
  130. iframe
  131. ^self tag: 'iframe'
  132. !
  133. iframe: aString
  134. ^self iframe src: aString
  135. !
  136. h2: anObject
  137. ^ self h2 with: anObject
  138. !
  139. h3: anObject
  140. ^self h3 with: anObject
  141. !
  142. h4: anObject
  143. ^self h4 with: anObject
  144. !
  145. h5: anObject
  146. ^self h5 with: anObject
  147. !
  148. h6: anObject
  149. ^self h6 with: anObject
  150. !
  151. img: aString
  152. ^self img src: aString
  153. !
  154. ol: anObject
  155. ^self ol with: anObject
  156. !
  157. li: anObject
  158. ^self li with: anObject
  159. !
  160. ul: anObject
  161. ^self ul with: anObject
  162. !
  163. span: anObject
  164. ^self span with: anObject
  165. !
  166. style: aString
  167. ^ self style with: aString; yourself
  168. !
  169. articles
  170. ^self tag: 'articles'
  171. !
  172. audio
  173. ^self tag: 'audio'
  174. !
  175. fieldset
  176. ^self tag: 'fieldset'
  177. !
  178. footer
  179. ^self tag: 'footer'
  180. !
  181. header
  182. ^self tag: 'header'
  183. !
  184. hr
  185. ^self tag: 'hr'
  186. !
  187. section
  188. ^self tag: 'section'
  189. !
  190. tbody
  191. ^self tag: 'tbody'
  192. !
  193. tfoot
  194. ^self tag: 'tfoot'
  195. !
  196. thead
  197. ^self tag: 'thead'
  198. !
  199. video
  200. ^self tag: 'video'
  201. ! !
  202. !HTMLCanvas class methodsFor: 'instance creation'!
  203. onJQuery: aJQuery
  204. ^self basicNew
  205. initializeFromJQuery: aJQuery;
  206. initialize;
  207. yourself
  208. !
  209. isMSIE
  210. ^((jQuery at: #browser) at: #msie) notNil
  211. !
  212. isOpera
  213. ^((jQuery at: #browser) at: #opera) notNil
  214. !
  215. isMozilla
  216. ^((jQuery at: #browser) at: #mozilla) notNil
  217. !
  218. isWebkit
  219. ^((jQuery at: #browser) at: #webkit) notNil
  220. ! !
  221. Object subclass: #TagBrush
  222. instanceVariableNames: 'canvas element'
  223. category: 'Canvas'!
  224. !TagBrush methodsFor: 'accessing'!
  225. element
  226. ^element
  227. ! !
  228. !TagBrush methodsFor: 'adding'!
  229. contents: anObject
  230. self
  231. empty;
  232. append: anObject
  233. !
  234. addBrush: aTagBrush
  235. self appendChild: aTagBrush element.
  236. ^aTagBrush
  237. !
  238. with: anObject
  239. self append: anObject
  240. !
  241. append: anObject
  242. anObject appendToBrush: self
  243. !
  244. appendToBrush: aTagBrush
  245. aTagBrush addBrush: self
  246. !
  247. appendBlock: aBlock
  248. | root |
  249. root := canvas root.
  250. canvas root: self.
  251. aBlock value: canvas.
  252. canvas root: root
  253. !
  254. appendChild: anElement
  255. "In IE7 and IE8 appendChild fails on several node types. So we need to check"
  256. <var element=self['@element'];
  257. if (null == element.canHaveChildren || element.canHaveChildren) {
  258. element.appendChild(anElement);
  259. } else {
  260. element.text = String(element.text) + anElement.innerHTML;
  261. } >
  262. !
  263. appendString: aString
  264. self appendChild: (self createTextNodeFor: aString)
  265. !
  266. empty
  267. self asJQuery empty
  268. ! !
  269. !TagBrush methodsFor: 'attributes'!
  270. at: aString put: aValue
  271. <self['@element'].setAttribute(aString, aValue)>
  272. !
  273. removeAt: aString
  274. <self['@element'].removeAttribute(aString)>
  275. !
  276. class: aString
  277. <self['@element'].className = aString>
  278. !
  279. id: aString
  280. self at: 'id' put: aString
  281. !
  282. src: aString
  283. self at: 'src' put: aString
  284. !
  285. href: aString
  286. self at: 'href' put: aString
  287. !
  288. title: aString
  289. self at: 'title' put: aString
  290. !
  291. style: aString
  292. self at: 'style' put: aString
  293. !
  294. type: aString
  295. self at: 'type' put: aString
  296. !
  297. media: aString
  298. self at: 'media' put: aString
  299. !
  300. rel: aString
  301. self at: 'rel' put: aString
  302. !
  303. width: aString
  304. self at: 'width' put: aString
  305. !
  306. height: aString
  307. self at: 'height' put: aString
  308. !
  309. value: aString
  310. self at: 'value' put: aString
  311. ! !
  312. !TagBrush methodsFor: 'converting'!
  313. asJQuery
  314. ^window jQuery: self element
  315. ! !
  316. !TagBrush methodsFor: 'events'!
  317. onKeyDown: aBlock
  318. self asJQuery bind: 'keydown' do: aBlock
  319. !
  320. onKeyPress: aBlock
  321. self asJQuery bind: 'keypress' do: aBlock
  322. !
  323. onKeyUp: aBlock
  324. self asJQuery bind: 'keyup' do: aBlock
  325. !
  326. onFocus: aBlock
  327. self asJQuery bind: 'focus' do: aBlock
  328. !
  329. onBlur: aBlock
  330. self asJQuery bind: 'blur' do: aBlock
  331. !
  332. onChange: aBlock
  333. self asJQuery bind: 'change' do: aBlock
  334. !
  335. onClick: aBlock
  336. self asJQuery bind: 'click' do: aBlock
  337. ! !
  338. !TagBrush methodsFor: 'initialization'!
  339. initializeFromString: aString canvas: aCanvas
  340. element := self createElementFor: aString.
  341. canvas := aCanvas
  342. !
  343. initializeFromJQuery: aJQuery canvas: aCanvas
  344. element := aJQuery get: 0.
  345. canvas := aCanvas
  346. ! !
  347. !TagBrush methodsFor: 'private'!
  348. createElementFor: aString
  349. <return document.createElement(String(aString))>
  350. !
  351. createTextNodeFor: aString
  352. <return document.createTextNode(String(aString))>
  353. ! !
  354. !TagBrush class methodsFor: 'instance creation'!
  355. fromString: aString canvas: aCanvas
  356. ^self new
  357. initializeFromString: aString canvas: aCanvas;
  358. yourself
  359. !
  360. fromJQuery: aJQuery canvas: aCanvas
  361. ^self new
  362. initializeFromJQuery: aJQuery canvas: aCanvas;
  363. yourself
  364. ! !
  365. Object subclass: #Widget
  366. instanceVariableNames: ''
  367. category: 'Canvas'!
  368. !Widget methodsFor: 'adding'!
  369. appendToBrush: aTagBrush
  370. self appendToJQuery: aTagBrush asJQuery
  371. !
  372. appendToJQuery: aJQuery
  373. self renderOn: (HTMLCanvas onJQuery: aJQuery)
  374. ! !
  375. !Widget methodsFor: 'rendering'!
  376. renderOn: html
  377. self
  378. ! !
  379. TagBrush subclass: #StyleTag
  380. instanceVariableNames: 'canvas element'
  381. category: 'Canvas'!
  382. !StyleTag commentStamp!
  383. I'm a <style> tag use to inline CSS or load a stylesheet.
  384. For inlining handle IE compatibility problems.!
  385. !StyleTag methodsFor: 'adding'!
  386. with: aString
  387. HTMLCanvas isMSIE
  388. ifTrue: [self element styleSheet cssText: aString ]
  389. ifFalse: [super with: aString ].
  390. ! !
  391. !StyleTag class methodsFor: 'instance creation'!
  392. canvas: aCanvas
  393. ^self new
  394. initializeFromString: 'style' canvas: aCanvas;
  395. yourself
  396. ! !
  397. !Object methodsFor: '*Canvas'!
  398. appendToJQuery: aJQuery
  399. aJQuery append: self asString
  400. !
  401. appendToBrush: aTagBrush
  402. aTagBrush append: self asString
  403. ! !
  404. !BlockClosure methodsFor: '*Canvas'!
  405. appendToJQuery: aJQuery
  406. self value: (HTMLCanvas onJQuery: aJQuery)
  407. !
  408. appendToBrush: aTagBrush
  409. aTagBrush appendBlock: self
  410. ! !
  411. !String methodsFor: '*Canvas'!
  412. asJQuery
  413. <return jQuery(String(self))>
  414. !
  415. appendToJQuery: aJQuery
  416. aJQuery append: self
  417. !
  418. appendToBrush: aTagBrush
  419. aTagBrush appendString: self
  420. ! !