calculator-$7.lzx

<canvas height="500" width="100%">
    <!-- Uncomment to include fonts for SWF -->
    <!-- fonts -->
    <!-- 
    <font src="helmetbi.ttf" name="obliqueText" />
    <font src="helmetr.ttf" name="displayText" />
    -->
    <!-- art assets -->
    <resource name="calc_body" src="resources/body.png"/>
    <resource name="calc_display" src="resources/display.png"/>
    <resource name="button_grn" src="resources/button_green.gif"/>
    <resource name="button_red" src="resources/button_red.gif"/>
    <resource name="button_blu" src="resources/button_blue.gif"/>
    
    <!-- global variables and functions -->
    <script>
    
        // utility function that finds an item in an array
        //
        function isInArray( x, theArray ) {
            var isThere = false;
            for ( var i=0; i<theArray.length; i++ ) {
                if ( theArray[i] == x ) {
                    isThere = true;
                }
            }
            return isThere;
        }
    
    </script>
    <view name="calculator" resource="calc_body" x="20" y="20">
        <!-- display -->
        <view id="display" resource="calc_display" x="20" y="31" oninit="this.start()">
            <!-- the text in the display -->
            <text name="screen" height="30" width="165" font="displayText" fontsize="25" y="5" x="5">
                0
            </text>
            <method name="start">
                this.valueX = 0;
                this.lastInput = 'none';
                this.oldValue = false;
                this.allOperators = new Array( '+', '-', '/', '*' );
                this.operator = '+';
                this.screen.setAttribute('text',  this.valueX.toString() );
            </method>
           
            <method name="clear">
                this.start();
            </method>
            <!-- handles the push of a button -->
            <method name="inputDigit" args="buttonObj">
            
                var val = buttonObj.buttonText.text;
                // weed out any non-numbers (e.g. operators, clear button)
                if ( isInArray( val, this.allOperators ) ) {
                    var theOperator = val;
                    this.inputOperator( theOperator );
                    return;
                } else if ( val == 'C' ) {
                    this.start();
                    return;
                } else if ( val == '.' ) {
                    this.addDecimalPoint();
                    return;
                } else if ( val == '+/-' ) {
                    this.negative();
                    return;
                } else if ( val == '=' ) {
                    this.equals();
                    return;
                }
                var displ = this.screen.text;
                if  ( displ == '0' ) if ( val == '0' )  {
                    return;
                }
                if ( ( this.lastInput == 'none' ) 
                    || ( this.lastInput == 'operator' ) ) {
                    // clear display and rewrite
                    this.screen.setAttribute('text',  val );    
                } else if ( this.lastInput == 'digit' ) {
                    this.screen.setAttribute('text',  displ + val );
                } else if ( this.lastInput == 'equals' ) {
                    this.clear();
                    this.screen.setAttribute('text',  val );
                }
                this.lastInput = 'digit';
            
            </method>
            <method name="inputOperator" args="operator">
                if ( this.lastInput == 'digit' ) {
                    this.execute( this.screen.text );
                }
                this.valueX = this.screen.text;
                this.operator = operator;
                this.lastInput = 'operator';
            </method>
            <method name="equals">
                if (this.lastInput != 'equals' ) {
                    this.oldValue = this.screen.text;
                    this.lastInput = 'equals';
                    this.execute( this.oldValue );
                } else {
                    this.lastInput = 'equals';
                    this.execute( this.oldValue );
                }
            </method>
            <method name="execute" args="val">
                this.valueX -= 0;
                var valFromDisp = val - 0;
                if ( this.valueX == 0 ) return;
                if ( this.operator == '+' ) {
                    val = this.valueX + valFromDisp;
                } else if ( this.operator == '-' ) {
                    val = this.valueX - valFromDisp;
                } else if ( this.operator == '*' ) {
                    val = this.valueX * valFromDisp;
                } else if ( this.operator == '/' ) {
                    val = this.valueX / valFromDisp;
                }
                valFromDisp = val;
                this.screen.setAttribute('text',  valFromDisp.toString() );
                this.valueX = this.screen.text;
            </method>
            <method name="isThereDecimal">
            
                var disp = this.screen.text;
                var isDecimal = false;
                for ( var i=0; i < disp.length; i++ ) {
                    if ( disp.charAt( i ) == '.' ) {
                        return true;
                    }
                }
                return false;
            
            </method>
            
            <method name="addDecimalPoint">
                if ( ( this.lastInput == 'none' ) 
                   || ( this.lastInput == 'operator' ) ) {
                    if ( !this.isThereDecimal() ) {
                        this.screen.setAttribute('text',  "0." );
                    }
                } else if ( this.lastInput == 'digit' ) {
                    if ( !this.isThereDecimal() ) {
                        var newText = this.screen.text;
                        newText += ".";
                        this.screen.setAttribute('text',  newText );
                    }
                } else if ( this.lastInput == 'equals' ) {
                    this.clear(); 
                    this.screen.setAttribute('text',  '0.' );
                }
                this.lastInput = 'digit';
            </method>
            
            <method name="negative">
                if ( ( this.lastInput == 'digit' ) ||
                    ( this.lastInput == 'equals' ) ) {
                    var newDisp = ( this.screen.text - 0 ) * -1;
                    this.screen.setAttribute('text',  newDisp.toString() ); 
                } else {
                    clear();
                }            
            </method>
        </view>
        <!-- 5 rows of buttons -->
        <view name="buttons" x="19" y="88">
            <simplelayout axis="y" spacing="7"/>
            <!-- row 1 -->
            <view name="row1" width="${parent.width}">
                <view resource="button_red" clickable="true" onclick="display.inputDigit( this );">
                    <text name="buttonText" font="obliqueText" fontsize="30" fgcolor="#ffffff" x="7" valign="middle">
                        C
                    </text>
                </view>
                <view resource="button_blu" clickable="true" onclick="display.inputDigit( this );" align="right">
                    <text name="buttonText" font="obliqueText" fontsize="30" fgcolor="#ffffff" x="9" valign="middle">
                        /
                    </text>
                </view>
            </view>
            <!-- row 2 -->
            <view name="row2">
                <simplelayout axis="x" spacing="7"/>
                <view resource="button_blu" clickable="true" onclick="display.inputDigit( this );">
                    <text name="buttonText" font="obliqueText" fontsize="30" fgcolor="#ffffff" x="9" valign="middle">
                        7
                    </text>
                </view>
                <view resource="button_blu" clickable="true" onclick="display.inputDigit( this );">
                    <text name="buttonText" font="obliqueText" fontsize="30" fgcolor="#ffffff" x="9" valign="middle">
                        8
                    </text>
                </view>
                <view resource="button_blu" clickable="true" onclick="display.inputDigit( this );">
                    <text name="buttonText" font="obliqueText" fontsize="30" fgcolor="#ffffff" x="9" valign="middle">
                        9
                    </text>
                </view>
                <view resource="button_blu" clickable="true" onclick="display.inputDigit( this );">
                    <text name="buttonText" font="obliqueText" fontsize="30" fgcolor="#ffffff" x="9" valign="middle">
                        *
                    </text>
                </view>
            </view>
            <!-- row 3 -->
            <view name="row3">
                <simplelayout axis="x" spacing="7"/>
                <view resource="button_blu" clickable="true" onclick="display.inputDigit( this );">
                    <text name="buttonText" font="obliqueText" fontsize="30" fgcolor="#ffffff" x="9" valign="middle">
                        4
                    </text>
                </view>
                <view resource="button_blu" clickable="true" onclick="display.inputDigit( this );">
                    <text name="buttonText" font="obliqueText" fontsize="30" fgcolor="#ffffff" x="9" valign="middle">
                        5
                    </text>
                </view>
                <view resource="button_blu" clickable="true" onclick="display.inputDigit( this );">
                    <text name="buttonText" font="obliqueText" fontsize="30" fgcolor="#ffffff" x="9" valign="middle">
                        6
                    </text>
                </view>
                <view resource="button_blu" clickable="true" onclick="display.inputDigit( this );">
                    <text name="buttonText" font="obliqueText" fontsize="30" fgcolor="#ffffff" x="15" valign="middle">
                        -
                    </text>
                </view>
            </view>
            <!-- row 4 -->
            <view name="row4">
                <simplelayout axis="x" spacing="7"/>
                <view resource="button_blu" clickable="true" onclick="display.inputDigit( this );">
                    <text name="buttonText" font="obliqueText" fontsize="30" fgcolor="#ffffff" x="9" valign="middle">
                        1
                    </text>
                </view>
                <view resource="button_blu" clickable="true" onclick="display.inputDigit( this );">
                    <text name="buttonText" font="obliqueText" fontsize="30" fgcolor="#ffffff" x="9" valign="middle">
                        2
                    </text>
                </view>
                <view resource="button_blu" clickable="true" onclick="display.inputDigit( this );">
                    <text name="buttonText" font="obliqueText" fontsize="30" fgcolor="#ffffff" x="9" valign="middle">
                        3
                    </text>
                </view>
                <view resource="button_blu" clickable="true" onclick="display.inputDigit( this );">
                    <text name="buttonText" font="obliqueText" fontsize="30" fgcolor="#ffffff" x="9" valign="middle">
                        +
                    </text>
                </view>
            </view>
            <!-- row 5 -->
            <view name="row5">
                <simplelayout axis="x" spacing="7"/>
                <view resource="button_blu" clickable="true" onclick="display.inputDigit( this );">
                    <text name="buttonText" font="obliqueText" fontsize="30" fgcolor="#ffffff" x="9" valign="middle">
                        0
                    </text>
                </view>
                <view resource="button_blu" clickable="true" onclick="display.inputDigit( this );">
                    <text name="buttonText" font="obliqueText" fontsize="20" fgcolor="#ffffff" x="5" valign="middle">
                        +/-
                    </text>
                </view>
                <view resource="button_blu" clickable="true" onclick="display.inputDigit( this );">
                    <text name="buttonText" font="obliqueText" fontsize="30" fgcolor="#ffffff" x="9" valign="middle">
                        .
                    </text>
                </view>
                <view resource="button_grn" clickable="true" onclick="display.inputDigit( this );">
                    <text name="buttonText" font="obliqueText" fontsize="30" fgcolor="#ffffff" x="9" valign="middle">
                        =
                    </text>
                </view>
            </view>
        </view>
    </view>
</canvas>
<!-- * X_LZ_COPYRIGHT_BEGIN ***************************************************
* Copyright 2007, 2008-2011 Laszlo Systems, Inc.  All Rights Reserved.                   *
* Use is subject to license terms.                                            *
* X_LZ_COPYRIGHT_END ****************************************************** -->

Cross References

Resources

Name	Source	Image
calc_body	resources/body.png
calc_display	resources/display.png
button_grn	resources/button_green.gif
button_red	resources/button_red.gif
button_blu	resources/button_blue.gif

Named Instances

• <view id="display">
• <view name="calculator">