Silk.js 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439
  1. define(["amber/boot", "require", "amber/core/Kernel-Collections", "amber/core/Kernel-Infrastructure", "amber/core/Kernel-Methods", "amber/core/Kernel-Objects", "domite/DOMite"], function($boot,requirejs){"use strict";
  2. var $core=$boot.api,nil=$boot.nilAsValue,$nil=$boot.nilAsReceiver,$recv=$boot.asReceiver,$globals=$boot.globals;
  3. var $pkg = $core.addPackage("Silk");
  4. $pkg.innerEval = function (expr) { return eval(expr); };
  5. $pkg.transport = {"type":"amd","amdNamespace":"silk"};
  6. $core.addClass("Silk", $globals.Domite, [], "Silk");
  7. //>>excludeStart("ide", pragmas.excludeIdeData);
  8. $globals.Silk.comment="I am subclass of `Domite` with more convenient high-level API.\x0a\x0a##Rendering\x0a\x0a - `aSilk << anObject` uses double-dispatch via `renderOnSilk:`.\x0aThis allows to create widgets\x0a(no formal superclass, anything with `renderOnSilk:` is a widget),\x0aas well as incorporating magic on certain types of objects:\x0a - blocks: `aSilk << aBlock` runs the block, passing aSilk as a parameter.\x0a - associations: `aSilk << (key -> value)` set attribute key to value.\x0a\x0aWorthful to note is, rendering a collection has its magic\x0aalready built-in (via `putOn:`) -- if you `stream << aCollection`,\x0aits items are `<<`'d in sequence.\x0aSo, de facto, arrays are deeply flattened when put on a stream via `<<`.\x0a\x0a##Convenience\x0a\x0a - `aCssSelectorString asSilk` returns Silk wrapping an element at a selector.\x0a - `anObject inSilk` returns anObject rendered in a document fragment.\x0a\x0a##Element creation\x0a\x0aThese messages use DNU to dynamically create\x0aelements with any (letters-and-numbers) tag name,\x0aNext samples show this on an example of `<div>`.\x0a\x0a - `Silk DIV` is shortcut for `Silk newElement: 'div'`.\x0a - `aSilk DIV` is shortcut for\x0a`[ |tmp| tmp := Silk DIV. aSilk << tmp. tmp] value`.\x0aIOW, it not just creates the element and returns it,\x0abut also puts in on aSilk.\x0a - `aSilk DIV: anObject` is shortcut for\x0a`aSilk DIV << anObject; yourself`.\x0aIOW, it not just creates and inserts the element,\x0abut puts a content into it.\x0a\x0a##Conclusions\x0a\x0aTaken all this together, one can do pretty neat constructs:\x0a\x0a```\x0a aSilk P: { 'id'->'mission'. 'We are the champions.' }\x0a```\x0a\x0aadds `<p id=\x22mission\x22>We are the champions.</p>` into `aSilk`\x0aand returns the Silk-wrapped `<p>` with insertion cursor at the end.";
  9. //>>excludeEnd("ide");
  10. $core.addMethod(
  11. $core.method({
  12. selector: "doesNotUnderstand:",
  13. protocol: "writing",
  14. fn: function (aMessage){
  15. var self=this,$self=this;
  16. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  17. return $core.withContext(function($ctx1) {
  18. //>>excludeEnd("ctx");
  19. var $1,$2,$receiver;
  20. $1=$recv($self._class())._tryMakeDnuElement_in_(aMessage,self);
  21. if(($receiver = $1) == null || $receiver.a$nil){
  22. $2=(
  23. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  24. $ctx1.supercall = true,
  25. //>>excludeEnd("ctx");
  26. ($globals.Silk.superclass||$boot.nilAsClass).fn.prototype._doesNotUnderstand_.apply($self, [aMessage]));
  27. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  28. $ctx1.supercall = false;
  29. //>>excludeEnd("ctx");;
  30. return $2;
  31. } else {
  32. var newElement;
  33. newElement=$receiver;
  34. $self.__lt_lt(newElement);
  35. return newElement;
  36. }
  37. return self;
  38. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  39. }, function($ctx1) {$ctx1.fill(self,"doesNotUnderstand:",{aMessage:aMessage})});
  40. //>>excludeEnd("ctx");
  41. },
  42. //>>excludeStart("ide", pragmas.excludeIdeData);
  43. args: ["aMessage"],
  44. source: "doesNotUnderstand: aMessage\x0a\x09\x22`aSilk DIV` creates a div element and inserts it.\x0a\x09`aSilk DIV: anObject` creates a div element, inserts it\x0a\x09and puts contents in it\x22\x0a\x09(self class tryMakeDnuElement: aMessage in: self)\x0a\x09\x09ifNil: [ ^ super doesNotUnderstand: aMessage ]\x0a\x09\x09ifNotNil: [ :newElement | self << newElement. ^ newElement ]",
  45. referencedClasses: [],
  46. //>>excludeEnd("ide");
  47. pragmas: [],
  48. messageSends: ["ifNil:ifNotNil:", "tryMakeDnuElement:in:", "class", "doesNotUnderstand:", "<<"]
  49. }),
  50. $globals.Silk);
  51. $core.addMethod(
  52. $core.method({
  53. selector: "namespace",
  54. protocol: "accessing",
  55. fn: function (){
  56. var self=this,$self=this;
  57. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  58. return $core.withContext(function($ctx1) {
  59. //>>excludeEnd("ctx");
  60. return $recv($self._element())._namespaceURI();
  61. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  62. }, function($ctx1) {$ctx1.fill(self,"namespace",{})});
  63. //>>excludeEnd("ctx");
  64. },
  65. //>>excludeStart("ide", pragmas.excludeIdeData);
  66. args: [],
  67. source: "namespace\x0a\x09\x22<String>\x0a\x09XML namespace for elements: html.\x0a\x09The default for all virtual Silk tag messages\x22\x0a\x09\x0a\x09^ self element namespaceURI",
  68. referencedClasses: [],
  69. //>>excludeEnd("ide");
  70. pragmas: [],
  71. messageSends: ["namespaceURI", "element"]
  72. }),
  73. $globals.Silk);
  74. $core.addMethod(
  75. $core.method({
  76. selector: "nextPut:",
  77. protocol: "writing",
  78. fn: function (anObject){
  79. var self=this,$self=this;
  80. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  81. return $core.withContext(function($ctx1) {
  82. //>>excludeEnd("ctx");
  83. var $1,$receiver;
  84. $1=$recv(anObject)._renderOnSilk_(self);
  85. if(($receiver = $1) == null || $receiver.a$nil){
  86. (
  87. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  88. $ctx1.supercall = true,
  89. //>>excludeEnd("ctx");
  90. ($globals.Silk.superclass||$boot.nilAsClass).fn.prototype._nextPut_.apply($self, [anObject]));
  91. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  92. $ctx1.supercall = false;
  93. //>>excludeEnd("ctx");;
  94. } else {
  95. $1;
  96. }
  97. return self;
  98. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  99. }, function($ctx1) {$ctx1.fill(self,"nextPut:",{anObject:anObject})});
  100. //>>excludeEnd("ctx");
  101. },
  102. //>>excludeStart("ide", pragmas.excludeIdeData);
  103. args: ["anObject"],
  104. source: "nextPut: anObject\x0a\x09\x22Double-dispatches anObject via renderOnSilk: message.\x0a\x09If a message returns nil, this fallbacks to superclass.\x0a\x09Otherwise, it is assumed renderOnSilk: did its job.\x22\x0a\x0a\x09(anObject renderOnSilk: self)\x0a\x09\x09ifNil: [ super nextPut: anObject ]",
  105. referencedClasses: [],
  106. //>>excludeEnd("ide");
  107. pragmas: [],
  108. messageSends: ["ifNil:", "renderOnSilk:", "nextPut:"]
  109. }),
  110. $globals.Silk);
  111. $core.addMethod(
  112. $core.method({
  113. selector: "doesNotUnderstand:",
  114. protocol: "message handling",
  115. fn: function (aMessage){
  116. var self=this,$self=this;
  117. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  118. return $core.withContext(function($ctx1) {
  119. //>>excludeEnd("ctx");
  120. var $1,$receiver;
  121. $1=$self._tryMakeDnuElement_in_(aMessage,self);
  122. if(($receiver = $1) == null || $receiver.a$nil){
  123. return (
  124. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  125. $ctx1.supercall = true,
  126. //>>excludeEnd("ctx");
  127. ($globals.Silk.a$cls.superclass||$boot.nilAsClass).fn.prototype._doesNotUnderstand_.apply($self, [aMessage]));
  128. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  129. $ctx1.supercall = false;
  130. //>>excludeEnd("ctx");;
  131. } else {
  132. return $1;
  133. }
  134. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  135. }, function($ctx1) {$ctx1.fill(self,"doesNotUnderstand:",{aMessage:aMessage})});
  136. //>>excludeEnd("ctx");
  137. },
  138. //>>excludeStart("ide", pragmas.excludeIdeData);
  139. args: ["aMessage"],
  140. source: "doesNotUnderstand: aMessage\x0a\x09\x22`Silk DIV` creates a div element.\x0a\x09`Silk DIV: anObject` creates a div element and puts contents in it\x22\x0a\x09^ (self tryMakeDnuElement: aMessage in: self)\x0a\x09\x09ifNil: [ super doesNotUnderstand: aMessage ]",
  141. referencedClasses: [],
  142. //>>excludeEnd("ide");
  143. pragmas: [],
  144. messageSends: ["ifNil:", "tryMakeDnuElement:in:", "doesNotUnderstand:"]
  145. }),
  146. $globals.Silk.a$cls);
  147. $core.addMethod(
  148. $core.method({
  149. selector: "htmlNamespace",
  150. protocol: "accessing",
  151. fn: function (){
  152. var self=this,$self=this;
  153. return "http://www.w3.org/1999/xhtml";
  154. },
  155. //>>excludeStart("ide", pragmas.excludeIdeData);
  156. args: [],
  157. source: "htmlNamespace\x0a\x09\x22<String>\x0a\x09XML namespace for HTML elements.\x0a\x09The default for all virtual Silk tag messages\x22\x0a\x09\x0a\x09^ 'http://www.w3.org/1999/xhtml'",
  158. referencedClasses: [],
  159. //>>excludeEnd("ide");
  160. pragmas: [],
  161. messageSends: []
  162. }),
  163. $globals.Silk.a$cls);
  164. $core.addMethod(
  165. $core.method({
  166. selector: "namespace",
  167. protocol: "accessing",
  168. fn: function (){
  169. var self=this,$self=this;
  170. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  171. return $core.withContext(function($ctx1) {
  172. //>>excludeEnd("ctx");
  173. return $self._htmlNamespace();
  174. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  175. }, function($ctx1) {$ctx1.fill(self,"namespace",{})});
  176. //>>excludeEnd("ctx");
  177. },
  178. //>>excludeStart("ide", pragmas.excludeIdeData);
  179. args: [],
  180. source: "namespace\x0a\x09\x22<String>\x0a\x09XML namespace for elements: html.\x0a\x09The default for all virtual Silk tag messages\x22\x0a\x09\x0a\x09^ self htmlNamespace",
  181. referencedClasses: [],
  182. //>>excludeEnd("ide");
  183. pragmas: [],
  184. messageSends: ["htmlNamespace"]
  185. }),
  186. $globals.Silk.a$cls);
  187. $core.addMethod(
  188. $core.method({
  189. selector: "tryMakeDnuElement:in:",
  190. protocol: "instance creation",
  191. fn: function (aMessage,aSilk){
  192. var self=this,$self=this;
  193. var selector,newElement,useArg;
  194. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  195. return $core.withContext(function($ctx1) {
  196. //>>excludeEnd("ctx");
  197. var $1,$2,$3,$4;
  198. selector=$recv(aMessage)._selector();
  199. $1=$recv($recv(selector)._asUppercase()).__eq(selector);
  200. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  201. $ctx1.sendIdx["="]=1;
  202. //>>excludeEnd("ctx");
  203. if(!$core.assert($1)){
  204. return nil;
  205. }
  206. $2=$recv($recv(selector)._last()).__eq(":");
  207. if($core.assert($2)){
  208. useArg=true;
  209. selector=$recv(selector)._allButLast();
  210. selector;
  211. } else {
  212. useArg=false;
  213. useArg;
  214. }
  215. $3=$recv(selector)._includes_(":");
  216. if($core.assert($3)){
  217. return nil;
  218. }
  219. newElement=$self._newElement_xmlns_($recv(selector)._asLowercase(),$recv(aSilk)._namespace());
  220. $4=useArg;
  221. if($core.assert($4)){
  222. $recv(newElement).__lt_lt($recv($recv(aMessage)._arguments())._first());
  223. }
  224. return newElement;
  225. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  226. }, function($ctx1) {$ctx1.fill(self,"tryMakeDnuElement:in:",{aMessage:aMessage,aSilk:aSilk,selector:selector,newElement:newElement,useArg:useArg})});
  227. //>>excludeEnd("ctx");
  228. },
  229. //>>excludeStart("ide", pragmas.excludeIdeData);
  230. args: ["aMessage", "aSilk"],
  231. source: "tryMakeDnuElement: aMessage in: aSilk\x0a\x09\x22`DIV` creates a div element.\x0a\x09`DIV: anObject` creates a div element and puts contents in it.\x0a\x09When aSilk is an instance and not the class Silk, \x0a\x09and the instance has an xml namespace other than the default #html,\x0a\x09Then that namespace is used for the new element.\x0a\x09You can do:\x0a\x09\x09svg := Silk newElement: 'svg' xmlns: 'http://www.w3.org/2000/svg'.\x0a\x09\x09svg CIRCLE: {'cx' -> 60. 'cy' -> 25. 'r' -> 10}.\x0a\x09This creates a svg circle, not a html circle.\x22\x0a\x09\x0a\x09| selector newElement useArg |\x0a\x09selector := aMessage selector.\x0a\x09selector asUppercase = selector\x0a\x09\x09ifFalse: [ ^ nil ].\x0a\x09selector last = ':'\x0a\x09\x09ifTrue: [ useArg := true. selector := selector allButLast ]\x0a\x09\x09ifFalse: [ useArg := false ].\x0a\x09(selector includes: ':')\x0a\x09\x09ifTrue: [ ^ nil ].\x0a\x09newElement := self newElement: selector asLowercase xmlns: aSilk namespace.\x0a\x09useArg ifTrue: [ newElement << aMessage arguments first ].\x0a\x09^ newElement",
  232. referencedClasses: [],
  233. //>>excludeEnd("ide");
  234. pragmas: [],
  235. messageSends: ["selector", "ifFalse:", "=", "asUppercase", "ifTrue:ifFalse:", "last", "allButLast", "ifTrue:", "includes:", "newElement:xmlns:", "asLowercase", "namespace", "<<", "first", "arguments"]
  236. }),
  237. $globals.Silk.a$cls);
  238. $core.addMethod(
  239. $core.method({
  240. selector: "renderOnSilk:",
  241. protocol: "*Silk",
  242. fn: function (aSilk){
  243. var self=this,$self=this;
  244. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  245. return $core.withContext(function($ctx1) {
  246. //>>excludeEnd("ctx");
  247. $recv($self.key)._attrPut_on_($self.value,aSilk);
  248. return self;
  249. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  250. }, function($ctx1) {$ctx1.fill(self,"renderOnSilk:",{aSilk:aSilk})});
  251. //>>excludeEnd("ctx");
  252. },
  253. //>>excludeStart("ide", pragmas.excludeIdeData);
  254. args: ["aSilk"],
  255. source: "renderOnSilk: aSilk\x0a\x09key attrPut: value on: aSilk",
  256. referencedClasses: [],
  257. //>>excludeEnd("ide");
  258. pragmas: [],
  259. messageSends: ["attrPut:on:"]
  260. }),
  261. $globals.Association);
  262. $core.addMethod(
  263. $core.method({
  264. selector: "renderOnSilk:",
  265. protocol: "*Silk",
  266. fn: function (aSilk){
  267. var self=this,$self=this;
  268. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  269. return $core.withContext(function($ctx1) {
  270. //>>excludeEnd("ctx");
  271. $self._value_(aSilk);
  272. return self;
  273. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  274. }, function($ctx1) {$ctx1.fill(self,"renderOnSilk:",{aSilk:aSilk})});
  275. //>>excludeEnd("ctx");
  276. },
  277. //>>excludeStart("ide", pragmas.excludeIdeData);
  278. args: ["aSilk"],
  279. source: "renderOnSilk: aSilk\x0a\x09self value: aSilk",
  280. referencedClasses: [],
  281. //>>excludeEnd("ide");
  282. pragmas: [],
  283. messageSends: ["value:"]
  284. }),
  285. $globals.BlockClosure);
  286. $core.addMethod(
  287. $core.method({
  288. selector: "inSilk",
  289. protocol: "*Silk",
  290. fn: function (){
  291. var self=this,$self=this;
  292. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  293. return $core.withContext(function($ctx1) {
  294. //>>excludeEnd("ctx");
  295. var $1;
  296. $1=$recv($globals.Silk)._newStream();
  297. $recv($1).__lt_lt(self);
  298. return $recv($1)._yourself();
  299. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  300. }, function($ctx1) {$ctx1.fill(self,"inSilk",{})});
  301. //>>excludeEnd("ctx");
  302. },
  303. //>>excludeStart("ide", pragmas.excludeIdeData);
  304. args: [],
  305. source: "inSilk\x0a\x09^ Silk newStream << self; yourself",
  306. referencedClasses: ["Silk"],
  307. //>>excludeEnd("ide");
  308. pragmas: [],
  309. messageSends: ["<<", "newStream", "yourself"]
  310. }),
  311. $globals.JSObjectProxy);
  312. $core.addMethod(
  313. $core.method({
  314. selector: "renderOnSilk:",
  315. protocol: "*Silk",
  316. fn: function (aSilk){
  317. var self=this,$self=this;
  318. return nil;
  319. },
  320. //>>excludeStart("ide", pragmas.excludeIdeData);
  321. args: ["aSilk"],
  322. source: "renderOnSilk: aSilk\x0a\x09^ nil",
  323. referencedClasses: [],
  324. //>>excludeEnd("ide");
  325. pragmas: [],
  326. messageSends: []
  327. }),
  328. $globals.JSObjectProxy);
  329. $core.addMethod(
  330. $core.method({
  331. selector: "inSilk",
  332. protocol: "*Silk",
  333. fn: function (){
  334. var self=this,$self=this;
  335. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  336. return $core.withContext(function($ctx1) {
  337. //>>excludeEnd("ctx");
  338. var $1;
  339. $1=$recv($globals.Silk)._newStream();
  340. $recv($1).__lt_lt(self);
  341. return $recv($1)._yourself();
  342. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  343. }, function($ctx1) {$ctx1.fill(self,"inSilk",{})});
  344. //>>excludeEnd("ctx");
  345. },
  346. //>>excludeStart("ide", pragmas.excludeIdeData);
  347. args: [],
  348. source: "inSilk\x0a\x09^ Silk newStream << self; yourself",
  349. referencedClasses: ["Silk"],
  350. //>>excludeEnd("ide");
  351. pragmas: [],
  352. messageSends: ["<<", "newStream", "yourself"]
  353. }),
  354. $globals.Object);
  355. $core.addMethod(
  356. $core.method({
  357. selector: "renderOnSilk:",
  358. protocol: "*Silk",
  359. fn: function (aSilk){
  360. var self=this,$self=this;
  361. return nil;
  362. },
  363. //>>excludeStart("ide", pragmas.excludeIdeData);
  364. args: ["aSilk"],
  365. source: "renderOnSilk: aSilk\x0a\x09^ nil",
  366. referencedClasses: [],
  367. //>>excludeEnd("ide");
  368. pragmas: [],
  369. messageSends: []
  370. }),
  371. $globals.Object);
  372. $core.addMethod(
  373. $core.method({
  374. selector: "asSilk",
  375. protocol: "*Silk",
  376. fn: function (){
  377. var self=this,$self=this;
  378. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  379. return $core.withContext(function($ctx1) {
  380. //>>excludeEnd("ctx");
  381. return $recv($globals.Silk)._at_($self._asString());
  382. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  383. }, function($ctx1) {$ctx1.fill(self,"asSilk",{})});
  384. //>>excludeEnd("ctx");
  385. },
  386. //>>excludeStart("ide", pragmas.excludeIdeData);
  387. args: [],
  388. source: "asSilk\x0a\x09^ Silk at: self asString",
  389. referencedClasses: ["Silk"],
  390. //>>excludeEnd("ide");
  391. pragmas: [],
  392. messageSends: ["at:", "asString"]
  393. }),
  394. $globals.String);
  395. $core.addMethod(
  396. $core.method({
  397. selector: "attrPut:on:",
  398. protocol: "*Silk",
  399. fn: function (anObject,aSilk){
  400. var self=this,$self=this;
  401. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  402. return $core.withContext(function($ctx1) {
  403. //>>excludeEnd("ctx");
  404. $recv(aSilk)._attrAt_put_(self,anObject);
  405. return self;
  406. //>>excludeStart("ctx", pragmas.excludeDebugContexts);
  407. }, function($ctx1) {$ctx1.fill(self,"attrPut:on:",{anObject:anObject,aSilk:aSilk})});
  408. //>>excludeEnd("ctx");
  409. },
  410. //>>excludeStart("ide", pragmas.excludeIdeData);
  411. args: ["anObject", "aSilk"],
  412. source: "attrPut: anObject on: aSilk\x0a\x09aSilk attrAt: self put: anObject",
  413. referencedClasses: [],
  414. //>>excludeEnd("ide");
  415. pragmas: [],
  416. messageSends: ["attrAt:put:"]
  417. }),
  418. $globals.String);
  419. });