70

View

Responder  |  Clip

Objective
  • Responder
    • View
Views.js
  1. function View() {
  2.     Responder.call(this);
  3.  
  4.     this._parent = null;
  5.     this._widget = null;
  6. }
  7.  
  8. View.prototype = Object.create(Responder.prototype);
  9.  
  10. Object.defineProperty(View.prototype, 'constructor', { value: View, enumerable: false, writable: true });
  11.  
  12. Object.defineProperty(View.prototype, 'widget', {
  13.     get:    function() {
  14.         return this._widget;
  15.     }
  16. });
  17.  
  18. View.prototype.interfaced = function() {
  19.     return this._widget ? true : false;
  20. };
  21.  
  22. View.prototype.isManaged = function() {
  23.     return this._widget && this._parent && this._widget.parentElement === this._parent ? true : false;
  24. };
  25.  
  26. View.prototype.isHidden = function() {
  27.     return this._widget && this._widget.hidden === true;
  28. };
  29.  
  30. View.prototype.isDisabled = function() {
  31.     return this._widget && this._widget.disabled === true;
  32. };
  33.  
  34. View.prototype.isEnabled = function() {
  35.     return this._widget && this._widget.disabled === false;
  36. };
  37.  
  38. View.prototype.hide = function() {
  39.     if (this._widget)
  40.         this._widget.hidden = true;
  41.  
  42.     return this;
  43. };
  44.  
  45. View.prototype.show = function() {
  46.     if (this._widget)
  47.         this._widget.hidden = false;
  48.  
  49.     return this;
  50. };
  51.  
  52. View.prototype.disable = function() {
  53.     if (this._widget)
  54.         this._widget.disabled = true;
  55.  
  56.     return this;
  57. };
  58.  
  59. View.prototype.enable = function() {
  60.     if (this._widget)
  61.         this._widget.disabled = false;
  62.  
  63.     return this;
  64. };
  65.  
  66. View.prototype.setStyle = function(prop, val) {
  67.     if (this._widget)
  68.         this._widget.style[prop] = val;
  69.  
  70.     return this;
  71. };
  72.  
  73. View.prototype.setAttribute = function(attr, val) {
  74.     if (this._widget)
  75.         this._widget.setAttribute(attr, val);
  76.  
  77.     return this;
  78. };
  79.  
  80. View.prototype.removeAttribute = function(attr) {
  81.     if (this._widget)
  82.         this._widget.removeAttribute(attr);
  83.  
  84.     return this;
  85. };
  86.  
  87. View.prototype.addFont = function(font) {
  88.     let link = document.createElement('link');
  89.  
  90.     link.setAttribute('rel', 'stylesheet');
  91.     link.setAttribute('href', `https://fonts.googleapis.com/css?family=${font.replace(/ +/, '+')}`);
  92.  
  93.     document.head.appendChild(link);
  94.  
  95.     return this;
  96. };
  97.  
  98. View.prototype.addClass = function(c) {
  99.     if (this._widget)
  100.         this._widget.classList.add(c);
  101.  
  102.     return this;
  103. };
  104.  
  105. View.prototype.removeClass = function(c) {
  106.     if (this._widget)
  107.         this._widget.classList.remove(c);
  108.  
  109.     return this;
  110. };
  111.  
  112. View.prototype.toggleClass = function(c) {
  113.     if (this._widget)
  114.         this._widget.classList.toggle(c);
  115.  
  116.     return this;
  117. };
  118.  
  119. View.prototype.hasClass = function(c) {
  120.     return this._widget ? this._widget.classList.contains(c) : false;
  121. };
  122.  
  123. View.prototype.addEventListener = function(type, listener, ...args) {
  124.     if (this._widget)
  125.         this._widget.addEventListener(type, listener, ...args);
  126.  
  127.     return this;
  128. };
  129.  
  130. View.prototype.removeEventListener = function(type, listener, ...args) {
  131.     if (this._widget)
  132.         this._widget.removeEventListener(type, listener, ...args);
  133.  
  134.     return this;
  135. };
  136.  
  137. View.prototype.dispatchEvent = function(event) {
  138.     if (this._widget)
  139.         this._widget.dispatchEvent(event);
  140.  
  141.     return this;
  142. };
  143.  
  144. View.prototype.resetWidget = function() {
  145.     return this;
  146. };
  147.  
  148. View.prototype.manageWidget = function(parent = null) {
  149.     if (parent)
  150.         this._parent = parent;
  151.  
  152.     if (this._parent && this._widget)
  153.         this._parent.appendChild(this._widget);
  154.  
  155.     return this;
  156. };
  157.  
  158. View.prototype.unmanageWidget = function() {
  159.     if (this._parent && this._widget)
  160.         this._parent.removeChild(this._widget);
  161.  
  162.     return this;
  163. };
  164.  
  165. View.prototype.setWidget = function(w) {
  166.     this._widget = w;
  167.  
  168.     return this;
  169. };
  170.  
  171. View.prototype.setManagedWidget = function(w) {
  172.     this._parent = w.parentElement;
  173.  
  174.     this.setWidget(w);
  175.  
  176.     return this;
  177. };
  178.  
  179. View.prototype.cloneWidget = function() {
  180.     return this._widget ? this._widget.cloneNode(true) : null;
  181. };
  182.  
  183. View.prototype.createWidget = function() {
  184.     return this;
  185. };
  186.  
  187. View.prototype.createManagedWidget = function(parent, ...args) {
  188.     this.createWidget(...args);
  189.  
  190.     this.manageWidget(parent);
  191.  
  192.     return this;
  193. };
  194.  
  195. View.prototype.destroyWidget = function() {
  196.     this.unmanageWidget();
  197.  
  198.     this._widget = null;
  199.  
  200.     return this;
  201. };
SEE ALSO

Responder, Inspector, Clip, Draggable

Comments

Your comment:
[p] [b] [i] [u] [s] [quote] [pre] [br] [code] [url] [email] strip help 2000

Enter a maximum of 2000 characters.
Improve the presentation of your text with the following formatting tags:
[p]paragraph[/p], [b]bold[/b], [i]italics[/i], [u]underline[/u], [s]strike[/s], [quote]citation[/quote], [pre]as is[/pre], [br]line break,
[url]http://www.izend.org[/url], [url=http://www.izend.org]site[/url], [email]izend@izend.org[/email], [email=izend@izend.org]izend[/email],
[code]command[/code], [code=language]source code in c, java, php, html, javascript, xml, css, sql, bash, dos, make, etc.[/code].