| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372 |
- Object subclass: #HTMLCanvas
- instanceVariableNames: 'root'
- category: 'Canvas'!
- !HTMLCanvas methodsFor: 'accessing'!
- root: aTagBrush
- root := aTagBrush
- !
- root
- ^root
- ! !
- !HTMLCanvas methodsFor: 'initialization'!
- initialize
- super initialize.
- root := TagBrush fromString: 'div' canvas: self
- ! !
- !HTMLCanvas methodsFor: 'tags'!
- newTag: aString
- ^TagBrush fromString: aString canvas: self
- !
- tag: aString
- ^root addBrush: (self newTag: aString)
- !
- h1
- ^self tag: 'h1'
- !
- h2
- ^self tag: 'h2'
- !
- h3
- ^self tag: 'h3'
- !
- h4
- ^self tag: 'h4'
- !
- h5
- ^self tag: 'h5'
- !
- h6
- ^self tag: 'h6'
- !
- p
- ^self tag: 'p'
- !
- div
- ^self tag: 'div'
- !
- span
- ^self tag: 'span'
- !
- img
- ^self tag: 'img'
- !
- ul
- ^self tag: 'ul'
- !
- ol
- ^self tag: 'ol'
- !
- li
- ^self tag: 'li'
- !
- table
- ^self tag: 'table'
- !
- tr
- ^self tag: 'tr'
- !
- td
- ^self tag: 'td'
- !
- th
- ^self tag: 'th'
- !
- form
- ^self tag: 'form'
- !
- input
- ^self tag: 'input'
- !
- button
- ^self tag: 'button'
- !
- select
- ^self tag: 'select'
- !
- option
- ^self tag: 'option'
- !
- textarea
- ^self tag: 'textarea'
- !
- a
- ^self tag: 'a'
- ! !
- !HTMLCanvas methodsFor: '*JQuery'!
- appendToJQuery: aJQuery
- aJQuery appendElement: root element
- ! !
- Object subclass: #TagBrush
- instanceVariableNames: 'element'
- category: 'Canvas'!
- !TagBrush class methodsFor: 'instance creation'!
- fromString: aString canvas: aCanvas
- ^self new
- initializeFromString: aString canvas: aCanvas;
- yourself
- ! !
- !TagBrush methodsFor: 'adding'!
- contents: anObject
- self asJQuery empty.
- self append: anObject
- !
- addBrush: aTagBrush
- self appendChild: aTagBrush element.
- ^aTagBrush
- !
- with: anObject
- self append: anObject
- !
- append: anObject
- anObject appendToBrush: self
- !
- appendToBrush: aTagBrush
- aTagBrush addBrush: self
- !
- appendBlock: aBlock
- | root |
- root := canvas root.
- canvas root: self.
- aBlock value: canvas.
- canvas root: root
- !
- appendChild: anElement
- {'self[''@element''].appendChild(anElement)'}
- !
- appendString: aString
- self appendChild: (self createTextNodeFor: aString)
- ! !
- !TagBrush methodsFor: 'attributes'!
- at: aString put: aValue
- {'self[''@element''].setAttribute(aString, aValue)'}
- !
- removeAt: aString
- {'self[''@element''].removeAttribute(aString)'}
- !
- class: aString
- self at: 'class' put: aString
- !
- id: aString
- self at: 'id' put: aString
- !
- src: aString
- self at: 'src' put: aString
- !
- href: aString
- self at: 'href' put: aString
- !
- title: aString
- self at: 'title' put: aString
- !
- style: aString
- self at: 'style' put: aString
- ! !
- !TagBrush methodsFor: 'initialization'!
- initializeFromString: aString canvas: aCanvas
- element := self createElementFor: aString.
- canvas := aCanvas
- ! !
- !TagBrush methodsFor: 'accessing'!
- element
- ^element
- ! !
- !TagBrush methodsFor: 'converting'!
- asJQuery
- ^{'return smalltalk.JQuery._from_(jQuery(self[''@element'']))'}
- ! !
- !TagBrush methodsFor: 'events'!
- onKeyDown: aBlock
- self asJQuery on: 'keydown' do: aBlock
- !
- onKeyPress: aBlock
- self asJQuery on: 'keypress' do: aBlock
- !
- onKeyUp: aBlock
- self asJQuery on: 'keyup' do: aBlock
- !
- onFocus: aBlock
- self asJQuery on: 'focus' do: aBlock
- !
- onBlur: aBlock
- self asJQuery on: 'blur' do: aBlock
- !
- onChange: aBlock
- self asJQuery on: 'change' do: aBlock
- !
- onClick: aBlock
- self asJQuery on: 'click' do: aBlock
- ! !
- !TagBrush methodsFor: 'private'!
- createElementFor: aString
- ^{'return document.createElement(String(aString))'}
- !
- createTextNodeFor: aString
- ^{'return document.createTextNode(String(aString))'}
- ! !
- Object subclass: #Widget
- instanceVariableNames: 'root'
- category: 'Canvas'!
- !Widget methodsFor: 'accessing'!
- root
- ^root
- ! !
- !Widget methodsFor: 'adding'!
- appendToBrush: aTagBrush
- self appendToJQuery: aTagBrush asJQuery
- !
- appendToJQuery: aJQuery
- self render.
- aJQuery append: self root asJQuery
- ! !
- !Widget methodsFor: 'actions'!
- confirm: aString
- ^{'return window.confirm(aString)'}
- !
- prompt: aString
- ^self prompt: aString default: ''
- !
- prompt: aString default: anotherString
- ^{'return window.prompt(aString, anotherString)'}
- !
- update
- | canvas |
- canvas := HTMLCanvas new.
- canvas root: self root.
- self root asJQuery empty.
- self renderOn: canvas
- ! !
- !Widget methodsFor: 'rendering'!
- render
- | canvas |
- canvas := HTMLCanvas new.
- root := canvas root.
- self renderOn: canvas
- !
- renderOn: html
- self
- ! !
- Widget subclass: #Counter
- instanceVariableNames: 'count'
- category: 'Canvas'!
- !Counter methodsFor: 'initialization'!
- initialize
- super initialize.
- count := 0
- ! !
- !Counter methodsFor: 'rendering'!
- renderOn: html
- html h1 with: count asString.
- html button
- with: '++';
- onClick: [self increase].
- html button
- with: '--';
- onClick: [self decrease]
- ! !
- !Counter methodsFor: 'actions'!
- increase
- count := count + 1.
- self update
- !
- decrease
- count := count - 1.
- self update
- ! !
|
