Header

  1. View current page

    Welcome to WZDAPI

Profile_img_60x60_06
6 7

All Pages

Updates

Add to Watch List

[예제] 메모 위젯 소스

Edit
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xmlns:widget="http://wzdapi.com/widget/">
  3. <head>
  4. <meta name="author" content="WzdWorks" />
  5. <meta name="description" content="심플하게 사용하는 나만의 웹메모장" />
  6. <meta name="website" content="http://wzdworks.com/" />
  7. <meta name="apiVersion" content="1.0" />
  8. <meta name="autoRefresh" content="0" />
  9. <meta name="maximizable" content="yes" />
  10. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  11. <link rel="icon" type="image/png" href="http://beta.wzd.com/Design/images/widget/icon_memo.png" />
  12. <script type="text/javascript" src="http://wzdapi.com/widget/emulator.js"></script>
  13. <title>메모</title>
  14. <style type="text/css">
  15. /*<![CDATA[*/

  16. div {
  17.     border: 2px solid #ffe487;
  18.     background-color: #ffffcc;
  19.     padding: 8px;
  20. }

  21. textarea {
  22.     border: 0;
  23.     width: 100%;
  24.     height: 100%;
  25.     background: url(/Design/images/widget/memo/memo_line_pattern_yel.png) top center;
  26.     line-height: 20px;
  27.     overflow: auto;
  28. }

  29. div.modified {
  30.     border-color: #F93;
  31. }

  32. /*]]>*/
  33. </style>
  34. <script type="text/javascript">
  35. //<![CDATA[

  36. var Memo = {
  37.     timer: 0,
  38.     save: function() {
  39.         var el = UWA.$element(widget.body.getElementsByTagName('textarea')[0]);
  40.         el.parentNode.removeClassName('modified');
  41.         widget.setValue('memo', el.value);
  42.         el.defaultValue = el.value;
  43.     },
  44.     saveFromPopup: function(el) {
  45.         UWA.$element(el.parentNode).removeClassName('modified');
  46.         this.save();
  47.     },
  48.     obj: 0
  49. };

  50. widget.onLoad = function() {
  51.     var el = Memo.obj = UWA.$element(widget.body.getElementsByTagName('textarea')[0]);
  52.     el.defaultValue = el.value = widget.getValue('memo');
  53.     el.onkeyup = function(e) {
  54.         Memo.timer && clearTimeout(Memo.timer);
  55.         if (this.defaultValue != this.value) {
  56.             this.parentNode.addClassName('modified');
  57.             Memo.timer = setTimeout(Memo.save, 999);
  58.         }
  59.     };
  60. };

  61. widget.onResize = function(w, h) {
  62.     var el = widget.body.getElementsByTagName('textarea')[0];
  63.     el.style.width  = w - 24 + 'px';
  64.     el.style.height = h - 24 + 'px';
  65. };

  66. widget.onMaximize = function() {
  67.     var popup = widget.createPopup();
  68.     popup.setTitle('메모');
  69.     popup.body.padding = '0 2px 2px';
  70.     popup.body.innerHTML = widget.body.innerHTML;
  71.     popup.onResize = function(w, h) {
  72.         var el = popup.body.getElementsByTagName('textarea')[0];
  73.         el.style.width  = w - 24 + 'px';
  74.         el.style.height = h - 24 + 'px';
  75.     };
  76.     popup.body.getElementsByTagName('textarea')[0].onkeyup = function() {
  77.         Memo.timer && clearTimeout(Memo.timer);
  78.         if (this.defaultValue != this.value) {
  79.             Memo.obj.defaultValue = Memo.obj.value = this.value;
  80.             UWA.$element(this.parentNode).addClassName('modified');
  81.             Memo.timer = setTimeout(Memo.saveFromPopup.bind(Memo, this), 999);
  82.         }
  83.     };
  84. };

  85. //]]>
  86. </script>
  87. <widget:preferences>
  88.     <widget:preference name="memo" type="hidden" />
  89. </widget:preferences>
  90. </head>
  91. <body style="padding: 0 2px 2px;"><div><textarea rows="5" cols="40"></textarea></div></body>
  92. </html>

History

Last edited on 09/11/2007 21:08 by pyo

Linked Page

Linked Pages: 1

Comments (0)

You must log in to leave a comment. Please sign in.