wordpress_calculator_plugin/wp-widget-calc.php at master · devprojx/wordpress_calculator_plugin · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
<?php
/**
 * Defines Calculatr widget.
 */
class Calculatr extends WP_Widget {

	/**
	 * Register widget with WordPress.
	 */
	function __construct() {
		parent::__construct(
			'Calculatr', // Base ID
			esc_html__( 'Calculator', 'text_domain' ), // Name
			array( 'description' => esc_html__('A stylish calculator to perform basic scientific calculations', 'text_domain' ), ) // Args
		);
	}

	/**
	 * Front-end display of widget.
	 *
	 * @see WP_Widget::widget()
	 *
	 * @param array $args     Widget arguments.
	 * @param array $instance Saved values from database.
	 */
	public function widget( $args, $instance ) {
		echo $args['before_widget'];
		echo <<<EOC
        <div id="container" style="marign-left: -20px !important;">
        <div id="header">
            <h1>Calculatr</h1>
        </div>
        <div id="output-screen">
            <input type="text" placeholder="0" id="output" disabled>
        </div>
        <div id="buttons">
            <!-- buttons -->
            <div class="row">
                <div class="col"><button value="LOG" onclick="buttonClickHandler(this)" class="sci-btn">ln </button></div>
                <div class="col"><button value="SQRT" onclick="buttonClickHandler(this)" class="sci-btn">&radic;</button></div>
                <div class="col"><button value="CUBRT" onclick="buttonClickHandler(this)" class="sci-btn">&#8731;</button></div>
                <div class="col">
                    <button class="c-btn extend" onclick="clearOutput()">C</button>
                </div>
            </div>

            <div class="row">
                <div class="col"><button value="^" onclick="buttonClickHandler(this)" class="sci-btn">x<span class="sub">y</span></button></div>
                <div class="col"><button value="7" onclick="buttonClickHandler(this)" class="num-btn">7</button></div>
                <div class="col"><button value="8" onclick="buttonClickHandler(this)" class="num-btn">8</button></div>
                <div class="col"><button value="9" onclick="buttonClickHandler(this)" class="num-btn">9</button></div>
                <div class="col"><button value="/" onclick="buttonClickHandler(this)" class="basic-btn">&divide</button></div>
            </div>

            <div class="row">
                <div class="col"><button value="SIN" onclick="buttonClickHandler(this)" class="sci-btn">sin</button></div>
                <div class="col"><button value="6" onclick="buttonClickHandler(this)" class="num-btn">6</button></div>
                <div class="col"><button value="5" onclick="buttonClickHandler(this)" class="num-btn">5</button></div>
                <div class="col"><button value="4" onclick="buttonClickHandler(this)" class="num-btn">4</button></div>
                <div class="col"><button value="*" onclick="buttonClickHandler(this)" class="basic-btn">&times;</button></div>
            </div>

            <div class="row">
                <div class="col"><button value="COS" onclick="buttonClickHandler(this)" class="sci-btn">cos</button></div>
                <div class="col"><button value="2" onclick="buttonClickHandler(this)" class="num-btn">2</button></div>
                <div class="col"><button value="3" onclick="buttonClickHandler(this)" class="num-btn">3</button></div>
                <div class="col"><button value="1" onclick="buttonClickHandler(this)" class="num-btn">1</button></div>
                <div class="col"><button value="-" onclick="buttonClickHandler(this)" class="basic-btn">-</button></div>
            </div>

            <div class="row">
                <div class="col"><button value="TAN" onclick="buttonClickHandler(this)" class="sci-btn">tan</button></div>
                <div class="col"><button value="%" onclick="buttonClickHandler(this)" class="sci-btn">mod</button></div>
                <div class="col"><button value="0" onclick="buttonClickHandler(this)" class="num-btn">0</button></div>
                <div class="col"><button onclick="calculate()" id="equal-btn">=</button></div>
                <div class="col"><button value="+" onclick="buttonClickHandler(this)" class="basic-btn">+</button></div>
            </div>
            <!-- /main buttons -->
        </div>
    </div>
EOC;
	}

	/**
	 * Back-end widget form.
	 *
	 * @see WP_Widget::form()
	 *
	 */
	public function form( $instance ) {
		$title = ! empty( $instance['title'] ) ? $instance['title'] : esc_html__( '', 'text_domain' );
		?>
		<p>
		<label for="<?php echo esc_attr( $this->get_field_id( 'title' ) ); ?>"><?php esc_attr_e( 'Title:', 'text_domain' ); ?></label>
		<input class="widefat" id="<?php echo esc_attr( $this->get_field_id( 'title' ) ); ?>" name="<?php echo esc_attr( $this->get_field_name( 'title' ) ); ?>" type="text" value="<?php echo esc_attr( $title ); ?>">
		</p>
	<?php
	}

}

// register Calculatr widget
function register_Calculatr() {
    register_widget( 'Calculatr' );
}
add_action( 'widgets_init', 'register_Calculatr' );
?>