Potato_PhoneMask - Version 1.0.0

Version Notes

+ Phone mask at checkout
+ Customers don't have to input parentheses, spaces and dashes anymore

Release Info

Developer	PotatoCommerce
Extension	Potato_PhoneMask
Version	1.0.0
Comparing to
See all releases

Version 1.0.0

Files changed (12) hide show

app/code/community/Potato/PhoneMask/Block/Mask.php +15 -0
app/code/community/Potato/PhoneMask/Helper/Config.php +27 -0
app/code/community/Potato/PhoneMask/Helper/Data.php +6 -0
app/code/community/Potato/PhoneMask/etc/adminhtml.xml +22 -0
app/code/community/Potato/PhoneMask/etc/config.xml +57 -0
app/code/community/Potato/PhoneMask/etc/system.xml +51 -0
app/design/frontend/base/default/layout/po_phonemask.xml +11 -0
app/design/frontend/base/default/template/potato_phonemask/mask.phtml +16 -0
app/etc/modules/Potato_PhoneMask.xml +9 -0
app/locale/en_US/Potato_PhoneMask.csv +7 -0
js/po_phonemask/PhoneNumberMask.js +137 -0
package.xml +36 -0

app/code/community/Potato/PhoneMask/Block/Mask.php ADDED Viewed

	@@ -0,0 +1,15 @@


1	+ <?php
2	+
3	+ class Potato_PhoneMask_Block_Mask extends Mage_Core_Block_Template
4	+ {
5	+ public function canShow()
6	+ {
7	+ $isEnabled = $this->helper('po_phonemask/config')->isEnabled();
8	+ return $isEnabled && $this->getMask();
9	+ }
10	+
11	+ public function getMask()
12	+ {
13	+ return $this->helper('po_phonemask/config')->getPhoneMask();
14	+ }
15	+ }

app/code/community/Potato/PhoneMask/Helper/Config.php ADDED Viewed

	@@ -0,0 +1,27 @@


1	+ <?php
2	+
3	+ class Potato_PhoneMask_Helper_Config extends Mage_Core_Helper_Abstract
4	+ {
5	+ const GENERAL_IS_ENABLED = 'po_phonemask/general/is_enabled';
6	+ const GENERAL_MASK = 'po_phonemask/general/mask';
7	+
8	+ /**
9	+ * @param null\|string\|bool\|int\|Mage_Core_Model_Store $store
10	+ *
11	+ * @return bool
12	+ */
13	+ public static function isEnabled($store = null)
14	+ {
15	+ return (bool)Mage::getStoreConfig(self::GENERAL_IS_ENABLED, $store);
16	+ }
17	+
18	+ /**
19	+ * @param null\|string\|bool\|int\|Mage_Core_Model_Store $store
20	+ *
21	+ * @return string
22	+ */
23	+ public static function getPhoneMask($store = null)
24	+ {
25	+ return (string)trim(Mage::getStoreConfig(self::GENERAL_MASK, $store));
26	+ }
27	+ }

app/code/community/Potato/PhoneMask/Helper/Data.php ADDED Viewed

	@@ -0,0 +1,6 @@


1	+ <?php
2	+
3	+ class Potato_PhoneMask_Helper_Data extends Mage_Core_Helper_Abstract
4	+ {
5	+
6	+ }

app/code/community/Potato/PhoneMask/etc/adminhtml.xml ADDED Viewed

	@@ -0,0 +1,22 @@


1	+ <?xml version="1.0"?>
2	+ <config>
3	+ <acl>
4	+ <resources>
5	+ <admin>
6	+ <children>
7	+ <system>
8	+ <children>
9	+ <config>
10	+ <children>
11	+ <po_phonemask>
12	+ <title>PotatoCommerce - Phone Mask</title>
13	+ </po_phonemask>
14	+ </children>
15	+ </config>
16	+ </children>
17	+ </system>
18	+ </children>
19	+ </admin>
20	+ </resources>
21	+ </acl>
22	+ </config>

app/code/community/Potato/PhoneMask/etc/config.xml ADDED Viewed

	@@ -0,0 +1,57 @@


1	+ <?xml version="1.0"?>
2	+ <config>
3	+ <modules>
4	+ <Potato_PhoneMask>
5	+ <version>1.0.0</version>
6	+ </Potato_PhoneMask>
7	+ </modules>
8	+ <global>
9	+ <blocks>
10	+ <po_phonemask>
11	+ <class>Potato_PhoneMask_Block</class>
12	+ </po_phonemask>
13	+ </blocks>
14	+ <helpers>
15	+ <po_phonemask>
16	+ <class>Potato_PhoneMask_Helper</class>
17	+ </po_phonemask>
18	+ </helpers>
19	+ </global>
20	+ <adminhtml>
21	+ <translate>
22	+ <modules>
23	+ <Potato_PhoneMask>
24	+ <files>
25	+ <default>Potato_PhoneMask.csv</default>
26	+ </files>
27	+ </Potato_PhoneMask>
28	+ </modules>
29	+ </translate>
30	+ </adminhtml>
31	+ <frontend>
32	+ <layout>
33	+ <updates>
34	+ <po_phonemask module="Potato_PhoneMask">
35	+ <file>po_phonemask.xml</file>
36	+ </po_phonemask>
37	+ </updates>
38	+ </layout>
39	+ <translate>
40	+ <modules>
41	+ <Potato_PhoneMask>
42	+ <files>
43	+ <default>Potato_PhoneMask.csv</default>
44	+ </files>
45	+ </Potato_PhoneMask>
46	+ </modules>
47	+ </translate>
48	+ </frontend>
49	+ <default>
50	+ <po_phonemask>
51	+ <general>
52	+ <is_enabled>0</is_enabled>
53	+ <mask>(___) ___-____</mask>
54	+ </general>
55	+ </po_phonemask>
56	+ </default>
57	+ </config>

app/code/community/Potato/PhoneMask/etc/system.xml ADDED Viewed

	@@ -0,0 +1,51 @@


1	+ <?xml version="1.0"?>
2	+ <config>
3	+ <tabs>
4	+ <po_core translate="label" module="po_phonemask">
5	+ <label>POTATOCOMMERCE</label>
6	+ <class>po_core</class>
7	+ <sort_order>300</sort_order>
8	+ </po_core>
9	+ </tabs>
10	+ <sections>
11	+ <po_phonemask translate="label" module="po_phonemask">
12	+ <label>Phone Mask</label>
13	+ <tab>po_core</tab>
14	+ <frontend_type>text</frontend_type>
15	+ <sort_order>99998</sort_order>
16	+ <show_in_default>1</show_in_default>
17	+ <show_in_website>1</show_in_website>
18	+ <show_in_store>1</show_in_store>
19	+ <groups>
20	+ <general translate="label">
21	+ <label>General Settings</label>
22	+ <frontend_type>text</frontend_type>
23	+ <sort_order>10</sort_order>
24	+ <show_in_default>1</show_in_default>
25	+ <show_in_website>1</show_in_website>
26	+ <show_in_store>1</show_in_store>
27	+ <fields>
28	+ <is_enabled translate="label">
29	+ <label>Enable extension</label>
30	+ <frontend_type>select</frontend_type>
31	+ <sort_order>10</sort_order>
32	+ <show_in_default>1</show_in_default>
33	+ <show_in_website>1</show_in_website>
34	+ <show_in_store>1</show_in_store>
35	+ <source_model>adminhtml/system_config_source_yesno</source_model>
36	+ </is_enabled>
37	+ <mask translate="label comment">
38	+ <label>Phone mask</label>
39	+ <comment><![CDATA[<b>Example:</b> (___) ___-____<br>Where underscore is a digit.]]></comment>
40	+ <frontend_type>text</frontend_type>
41	+ <sort_order>20</sort_order>
42	+ <show_in_default>1</show_in_default>
43	+ <show_in_website>1</show_in_website>
44	+ <show_in_store>1</show_in_store>
45	+ </mask>
46	+ </fields>
47	+ </general>
48	+ </groups>
49	+ </po_phonemask>
50	+ </sections>
51	+ </config>

app/design/frontend/base/default/layout/po_phonemask.xml ADDED Viewed

	@@ -0,0 +1,11 @@


1	+ <?xml version="1.0"?>
2	+ <layout>
3	+ <default>
4	+ <reference name="head">
5	+ <action ifconfig="po_phonemask/general/is_enabled" method="addJs"><script>po_phonemask/PhoneNumberMask.js</script></action>
6	+ </reference>
7	+ <reference name="before_body_end">
8	+ <block type="po_phonemask/mask" name="po_phonemask.mask" template="potato_phonemask/mask.phtml"/>
9	+ </reference>
10	+ </default>
11	+ </layout>

app/design/frontend/base/default/template/potato_phonemask/mask.phtml ADDED Viewed

	@@ -0,0 +1,16 @@


1	+ <?php /* @var $this Potato_PhoneMask_Block_Mask */ ?>
2	+ <?php if ($this->canShow()):?>
3	+ <script type="text/javascript">
4	+ //<![CDATA[
5	+ if ($('billing:telephone')) {
6	+ new PhoneNumberMask('billing:telephone', '<?php echo $this->getMask()?>');
7	+ }
8	+ if ($('shipping:telephone')) {
9	+ new PhoneNumberMask('shipping:telephone', '<?php echo $this->getMask()?>');
10	+ }
11	+ if ($('telephone')) {
12	+ new PhoneNumberMask('telephone', '<?php echo $this->getMask()?>');
13	+ }
14	+ //]]>
15	+ </script>
16	+ <?php endif;?>

app/etc/modules/Potato_PhoneMask.xml ADDED Viewed

	@@ -0,0 +1,9 @@


1	+ <?xml version="1.0"?>
2	+ <config>
3	+ <modules>
4	+ <Potato_PhoneMask>
5	+ <active>true</active>
6	+ <codePool>community</codePool>
7	+ </Potato_PhoneMask>
8	+ </modules>
9	+ </config>

app/locale/en_US/Potato_PhoneMask.csv ADDED Viewed

	@@ -0,0 +1,7 @@


1	+ "<b>Example:</b> (___) ___-____<br>Where underscore is a digit.","<b>Example:</b> (___) ___-____<br>Where underscore is a digit."
2	+ "Enable extension","Enable extension"
3	+ "General Settings","General Settings"
4	+ "General Settings","General Settings"
5	+ "POTATOCOMMERCE","POTATOCOMMERCE"
6	+ "Phone mask","Phone mask"
7	+ "PotatoCommerce - Phone Mask","PotatoCommerce - Phone Mask"

js/po_phonemask/PhoneNumberMask.js ADDED Viewed

	@@ -0,0 +1,137 @@


1	+ var PhoneNumberMask = Class.create();
2	+ PhoneNumberMask.prototype = {
3	+ initialize: function(elementId, mask) {
4	+ this.element = $(elementId);
5	+ this.numberMask = mask.toString();
6	+
7	+ if (!this.numberMask.length \|\| !this.element) {
8	+ return;
9	+ }
10	+
11	+ this._blockedKeyCodeList = [
12	+ 35, // End
13	+ 36, // Home
14	+ 37, // Left
15	+ 38, // Up
16	+ 39, // Right
17	+ 40, // Down
18	+ 46 // Delete
19	+ ];
20	+
21	+ if (this.element.getValue() && !this.validate()) {
22	+ this.element.observe('input', this._onInputEmpty.bind(this));
23	+ } else {
24	+ this.initObservers();
25	+ this.initValidation();
26	+ this.processPhoneMask();
27	+ }
28	+ },
29	+ initObservers: function() {
30	+ if (typeof(this.element) === 'object') {
31	+ this.element.observe('click', this._onFocus.bind(this));
32	+ this.element.observe('focus', this._onFocus.bind(this));
33	+ this.element.observe('keydown', this._onKeyDown.bind(this));
34	+ this.element.observe('input', this._onInput.bind(this));
35	+ }
36	+ },
37	+ initValidation: function() {
38	+ var me = this;
39	+ this.element.addClassName('validate-po-phonemask-' + this.element.identify());
40	+ Validation.add(
41	+ 'validate-po-phonemask-' + this.element.identify(),
42	+ 'This is a required field.',
43	+ function() {
44	+ return me.validate();
45	+ }
46	+ );
47	+ },
48	+ validate: function() {
49	+ for (var i = 0; i < this.numberMask.length; i++) {
50	+ if (typeof(this.element.value[i]) == 'undefined') {
51	+ return false;
52	+ }
53	+ var isCharNotDigit = (this.element.value[i].charCodeAt() < 48 \|\| this.element.value[i].charCodeAt() > 57);
54	+ if (isCharNotDigit && this.numberMask[i] == '_') {
55	+ return false;
56	+ }
57	+ if (this.element.value[i] != this.numberMask[i] && this.numberMask[i] != '_') {
58	+ return false;
59	+ }
60	+ }
61	+ return true;
62	+ },
63	+ processPhoneMask: function() {
64	+ var elementValue = '';
65	+ for (var i = 0; i < this.numberMask.length; i++) {
66	+ if (
67	+ (typeof(this.element.value[i]) == 'undefined') \|\|
68	+ (
69	+ (this.element.value[i].charCodeAt() < 48 \|\| this.element.value[i].charCodeAt() > 57) &&
70	+ (this.numberMask[i] == '_')
71	+ )
72	+ )
73	+ {
74	+ elementValue = elementValue + this.numberMask[i];
75	+ } else if (this.element.value[i] != this.numberMask[i] && this.numberMask[i] != '_') {
76	+ elementValue = elementValue + this.numberMask[i];
77	+ } else {
78	+ elementValue = elementValue + this.element.value[i];
79	+ }
80	+ }
81	+ this.element.value = elementValue;
82	+ },
83	+ moveCursorToFirstUnderScore: function() {
84	+ for (var i = 0; i < this.element.value.length; i++) {
85	+ if (this.element.value[i] == '_') {
86	+ this._moveCursor(i);
87	+ break;
88	+ }
89	+ }
90	+ },
91	+ moveCursorToLastDigit: function() {
92	+ var position = -1;
93	+ for (var i = 0; i < this.element.value.length; i++) {
94	+ if (this.element.value[i].charCodeAt() >= 48 && this.element.value[i].charCodeAt() <= 57) {
95	+ position = i;
96	+ }
97	+ if (this.element.value[i] == '_') {
98	+ if (position > -1) {
99	+ this._moveCursor(position + 1);
100	+ } else {
101	+ this._moveCursor(i);
102	+ }
103	+ break;
104	+ }
105	+ }
106	+ },
107	+ _moveCursor: function(position) {
108	+ this.element.selectionStart = position;
109	+ this.element.selectionEnd = position;
110	+ },
111	+ _onFocus: function(e) {
112	+ this.moveCursorToFirstUnderScore();
113	+ },
114	+ _onInput: function() {
115	+ this.processPhoneMask();
116	+ this.moveCursorToFirstUnderScore();
117	+ },
118	+ _onInputEmpty: function() {
119	+ if (this.element.getValue() == '') {
120	+ this.initObservers();
121	+ this.initValidation();
122	+ this.processPhoneMask();
123	+ this.moveCursorToFirstUnderScore();
124	+ }
125	+ },
126	+ _onKeyDown: function(e) {
127	+ // Prevent navigation by keys
128	+ if (this._blockedKeyCodeList.indexOf(e.keyCode) > -1) {
129	+ e.stop();
130	+ return;
131	+ }
132	+ // Move cursor when backspace is pressed
133	+ if (e.keyCode == 8) {
134	+ this.moveCursorToLastDigit();
135	+ }
136	+ }
137	+ };

package.xml ADDED Viewed

	@@ -0,0 +1,36 @@


1	+ <?xml version="1.0"?>
2	+ <package>
3	+ <name>Potato_PhoneMask</name>
4	+ <version>1.0.0</version>
5	+ <stability>stable</stability>
6	+ <license>OSL v3.0</license>
7	+ <channel>community</channel>
8	+ <extends/>
9	+ <summary>Phone Mask is a simple Magento extension that helps customers to input phone number easier at checkout. Auto-Formatted phone numbers always.</summary>
10	+ <description><p>Phone Mask is a simple Magento extension that helps customers to input phone number easier at checkout. Auto-Formatted phone numbers. Your customers don't have to input parentheses, spaces and dashes anymore.</p>
11	+ <p>No need to modify templates. Javascript only - the extension does not use any additional libraries.<br />Mask is defined by store administrator, that governs what a user is allowed to enter in as input. It can be said to be a template, or set format that entered data must conform to, mainly used for the purposes of data integrity by preventing transcription errors.</p>
12	+ <p>e.g. When entering a phone number on a data capture form, in the format <strong>"(___) ___ - ____"</strong> the area code brackets, the space between the number and the area code will automatically be placed in.</p>
13	+ <p><br /><br /></p>
14	+ <h3>Features</h3>
15	+ <ul>
16	+ <li><strong>Simplifies Magento checkout.</strong>&nbsp;Customer don't have to input parentheses, spaces and dashes.</li>
17	+ <li><strong>Mainly used for the purposes of data integrity by preventing transcription errors.</strong> All phone numbers will be of the same format. Say goodbye to obscurity.</li>
18	+ <li>Lifetime free support, bugfixes and updates</li>
19	+ <li>Installation service included</li>
20	+ </ul>
21	+ <p>&nbsp;</p>
22	+ <p>&nbsp;</p>
23	+ <p style="display: block; max-width: 391px; margin-left: auto; margin-right: auto;"><img style="box-shadow: #888888 1px 1px 3px 1px; display: block; margin-left: auto; margin-right: auto;" title="Phone Mask Magento Extension - in action" src="http://potatocommerce.com/media/animated-image-phone-mask-magento-extension.gif" alt="Phone Mask Magento Extension" width="100%" height="auto" /></p>
24	+ <p>&nbsp;</p>
25	+ <p>&nbsp;</p>
26	+ <p>&nbsp;</p>
27	+ <p style="display: block; max-width: 795px; margin-left: auto; margin-right: auto;"><a href="http://potatocommerce.com/about-us/"><img title="Click to learn more" src="http://potatocommerce.com/media/why-potatocommerce.png" alt="PotatoCommerce - Magento Extensions" width="100%" height="auto" /></a></p></description>
28	+ <notes>+ Phone mask at checkout
29	+ + Customers don't have to input parentheses, spaces and dashes anymore</notes>
30	+ <authors><author><name>PotatoCommerce</name><user>potatocommerce</user><email>potatocommerce@gmail.com</email></author></authors>
31	+ <date>2015-05-28</date>
32	+ <time>20:28:40</time>
33	+ <contents><target name="magecommunity"><dir name="Potato"><dir name="PhoneMask"><dir name="Block"><file name="Mask.php" hash="117b507c7bfd255ef07e50f648713b70"/></dir><dir name="Helper"><file name="Config.php" hash="5900d28017b784efe41399c4805979f1"/><file name="Data.php" hash="d0bbab12ced81d145fe67a8c33db16ea"/></dir><dir name="etc"><file name="adminhtml.xml" hash="bed30896474dc0301b188c41948dd48c"/><file name="config.xml" hash="915cd5e308fede70b6c1861e9a548e8f"/><file name="system.xml" hash="a0192ae661c318f52e7aa0719085b0cd"/></dir></dir></dir></target><target name="magedesign"><dir name="frontend"><dir name="base"><dir name="default"><dir name="layout"><file name="po_phonemask.xml" hash="c4b83b00290c1ee1125230777041f189"/></dir><dir name="template"><dir name="potato_phonemask"><file name="mask.phtml" hash="edc4a564b3eab919ea026238fc0ae75d"/></dir></dir></dir></dir></dir></target><target name="mageetc"><dir name="modules"><file name="Potato_PhoneMask.xml" hash="45a4483489af419011365df7b77bb4fd"/></dir></target><target name="magelocale"><dir name="en_US"><file name="Potato_PhoneMask.csv" hash="417a58c5be932f737b5dd6e5b80279d3"/></dir></target><target name="mageweb"><dir name="js"><dir name="po_phonemask"><file name="PhoneNumberMask.js" hash="7ecf59c4821d98dd372d1988519fb168"/></dir></dir></target></contents>
34	+ <compatible/>
35	+ <dependencies><required><php><min>5.1.0</min><max>6.0.0</max></php></required></dependencies>
36	+ </package>