daily pastebin goal
53%
SHARE
TWEET

Untitled

a guest Sep 21st, 2011 83 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!DOCTYPE html>
  2. <html>
  3.   <head>
  4.     <title>Decorator test</title>
  5.     <script type="text/javascript">
  6.       <!--
  7.        /**
  8.         * Paragraph is the master object that the client will interact with
  9.         * in a black-box composite fashion.
  10.         */
  11.        Paragraph = function() {
  12.            this.text = new Text();
  13.        }
  14.        Paragraph.prototype.set_text = function(text) {
  15.            this.text.set_text(text);
  16.        };
  17.        Paragraph.prototype.add_decoration = function(decoration) {
  18.            this.text = new decoration(this.text);
  19.        }
  20.        Paragraph.prototype.remove_decoration = function(decoration) {
  21.            if(this.text.remove_decoration) {
  22.                this.text.remove_decoration(this, decoration);
  23.            }
  24.        };
  25.        Paragraph.prototype.render = function() {
  26.            return this.text.render();
  27.        };
  28.        
  29.        /**
  30.         * Text is a sub-object of Paragraph that can be decorated. When it is decorated
  31.         * in Paragraph.prototype.add_decoration, Paragraph is unaware of the change when
  32.         * rendering. all decorations must share the interface of Text
  33.         */
  34.        Text = function() {};
  35.        Text.prototype.set_text = function(text) {
  36.            this.text = text;
  37.        };
  38.        Text.prototype.render = function() {
  39.            return this.text;
  40.        };
  41.        
  42.        /**
  43.         * Decorator is the base abstract class of all Decorators. it exists to match the
  44.         * interface of all Decorators to the interface of Text, and to define the constructor
  45.         */
  46.        Decorator = function Decorator(text) {
  47.            this.text = text;
  48.        };
  49.        Decorator.prototype.render = function() {
  50.            return this.text.render();
  51.        };
  52.        Decorator.prototype.remove_decoration = function(parent, decoration) {
  53.            if(decoration.name == this.name) {
  54.                parent.text = this.text;
  55.            }
  56.            if(this.text.remove_decoration) {
  57.                this.text.remove_decoration(this, decoration);
  58.            }
  59.        };
  60.        
  61.        /**
  62.         * the individual decorators just modify the render method to do their own thing,
  63.         * before calling this.text.render, which encapsulates Paragraph.text.
  64.         */
  65.        BoldDecorator = function BoldDecorator(text) {
  66.            this.text = text;
  67.            this.name = 'BoldDecorator';
  68.        };
  69.        BoldDecorator.prototype = new Decorator();
  70.        BoldDecorator.prototype.render = function() {
  71.            return '<b>' + this.text.render() + '</b>';
  72.        };
  73.        
  74.        ItalicDecorator = function ItalicDecorator(text) {
  75.            this.text = text;
  76.            this.name = 'ItalicDecorator';
  77.        };
  78.        ItalicDecorator.prototype = new Decorator();
  79.        ItalicDecorator.prototype.render = function() {
  80.            return '<i>' + this.text.render() + '</i>';
  81.        };
  82.        
  83.        var init = function init() {
  84.            var p = new Paragraph(),
  85.                output = document.getElementById('output');
  86.            
  87.            output.innerHTML = 'Rendering:' + '<br />';
  88.            
  89.            // Paragraph -> Text.set_text
  90.            p.set_text('this is the text');
  91.            
  92.            // Paragraph -> Text.render
  93.            output.innerHTML += p.render() + '<br />';
  94.            
  95.            // Paragraph.add_decoration
  96.            p.add_decoration(BoldDecorator);
  97.            
  98.            // Paragraph -> BoldDecorator.render -> Text.render
  99.            output.innerHTML += p.render() + '<br />';
  100.            
  101.            // Paragraph.add_decoration
  102.            p.add_decoration(ItalicDecorator);
  103.            
  104.            // Paragraph -> ItalicDecorator.render -> BoldDecorator.render -> Text.render
  105.            output.innerHTML += p.render() + '<br />';
  106.  
  107.            // Paragraph.remove_decoration -> ItalicDecorator.remove_decoration
  108.            //   -> BoldDecorator.remove_decoration
  109.            p.remove_decoration(BoldDecorator);
  110.            
  111.            // Paragraph -> ItalicDecorator.render -> Text.render
  112.            output.innerHTML += p.render() + '<br />';
  113.        };
  114.    
  115.        window.onload = init;
  116.      -->
  117.     </script>
  118.   </head>
  119.   <body>
  120.     <h1>Decorator Test</h1>
  121.     <div id="output"></div>
  122.   </body>
  123. </html>
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top