Monster UI Callflows v.4.1.38

LICENSE

@@ -0,0 +1,471 @@
+                          MOZILLA PUBLIC LICENSE
+                                Version 1.1
+
+                              ---------------
+
+1. Definitions.
+
+     1.0.1. "Commercial Use" means distribution or otherwise making the
+     Covered Code available to a third party.
+
+     1.1. "Contributor" means each entity that creates or contributes to
+     the creation of Modifications.
+
+     1.2. "Contributor Version" means the combination of the Original
+     Code, prior Modifications used by a Contributor, and the Modifications
+     made by that particular Contributor.
+
+     1.3. "Covered Code" means the Original Code or Modifications or the
+     combination of the Original Code and Modifications, in each case
+     including portions thereof.
+
+     1.4. "Electronic Distribution Mechanism" means a mechanism generally
+     accepted in the software development community for the electronic
+     transfer of data.
+
+     1.5. "Executable" means Covered Code in any form other than Source
+     Code.
+
+     1.6. "Initial Developer" means the individual or entity identified
+     as the Initial Developer in the Source Code notice required by Exhibit
+     A.
+
+     1.7. "Larger Work" means a work which combines Covered Code or
+     portions thereof with code not governed by the terms of this License.
+
+     1.8. "License" means this document.
+
+     1.8.1. "Licensable" means having the right to grant, to the maximum
+     extent possible, whether at the time of the initial grant or
+     subsequently acquired, any and all of the rights conveyed herein.
+
+     1.9. "Modifications" means any addition to or deletion from the
+     substance or structure of either the Original Code or any previous
+     Modifications. When Covered Code is released as a series of files, a
+     Modification is:
+          A. Any addition to or deletion from the contents of a file
+          containing Original Code or previous Modifications.
+
+          B. Any new file that contains any part of the Original Code or
+          previous Modifications.
+
+     1.10. "Original Code" means Source Code of computer software code
+     which is described in the Source Code notice required by Exhibit A as
+     Original Code, and which, at the time of its release under this
+     License is not already Covered Code governed by this License.
+
+     1.10.1. "Patent Claims" means any patent claim(s), now owned or
+     hereafter acquired, including without limitation,  method, process,
+     and apparatus claims, in any patent Licensable by grantor.
+
+     1.11. "Source Code" means the preferred form of the Covered Code for
+     making modifications to it, including all modules it contains, plus
+     any associated interface definition files, scripts used to control
+     compilation and installation of an Executable, or source code
+     differential comparisons against either the Original Code or another
+     well known, available Covered Code of the Contributor's choice. The
+     Source Code can be in a compressed or archival form, provided the
+     appropriate decompression or de-archiving software is widely available
+     for no charge.
+
+     1.12. "You" (or "Your")  means an individual or a legal entity
+     exercising rights under, and complying with all of the terms of, this
+     License or a future version of this License issued under Section 6.1.
+     For legal entities, "You" includes any entity which controls, is
+     controlled by, or is under common control with You. For purposes of
+     this definition, "control" means (a) the power, direct or indirect,
+     to cause the direction or management of such entity, whether by
+     contract or otherwise, or (b) ownership of more than fifty percent
+     (50%) of the outstanding shares or beneficial ownership of such
+     entity.
+
+2. Source Code License.
+
+     2.1. The Initial Developer Grant.
+     The Initial Developer hereby grants You a world-wide, royalty-free,
+     non-exclusive license, subject to third party intellectual property
+     claims:
+          (a)  under intellectual property rights (other than patent or
+          trademark) Licensable by Initial Developer to use, reproduce,
+          modify, display, perform, sublicense and distribute the Original
+          Code (or portions thereof) with or without Modifications, and/or
+          as part of a Larger Work; and
+
+          (b) under Patents Claims infringed by the making, using or
+          selling of Original Code, to make, have made, use, practice,
+          sell, and offer for sale, and/or otherwise dispose of the
+          Original Code (or portions thereof).
+
+          (c) the licenses granted in this Section 2.1(a) and (b) are
+          effective on the date Initial Developer first distributes
+          Original Code under the terms of this License.
+
+          (d) Notwithstanding Section 2.1(b) above, no patent license is
+          granted: 1) for code that You delete from the Original Code; 2)
+          separate from the Original Code;  or 3) for infringements caused
+          by: i) the modification of the Original Code or ii) the
+          combination of the Original Code with other software or devices.
+
+     2.2. Contributor Grant.
+     Subject to third party intellectual property claims, each Contributor
+     hereby grants You a world-wide, royalty-free, non-exclusive license
+
+          (a)  under intellectual property rights (other than patent or
+          trademark) Licensable by Contributor, to use, reproduce, modify,
+          display, perform, sublicense and distribute the Modifications
+          created by such Contributor (or portions thereof) either on an
+          unmodified basis, with other Modifications, as Covered Code
+          and/or as part of a Larger Work; and
+
+          (b) under Patent Claims infringed by the making, using, or
+          selling of  Modifications made by that Contributor either alone
+          and/or in combination with its Contributor Version (or portions
+          of such combination), to make, use, sell, offer for sale, have
+          made, and/or otherwise dispose of: 1) Modifications made by that
+          Contributor (or portions thereof); and 2) the combination of
+          Modifications made by that Contributor with its Contributor
+          Version (or portions of such combination).
+
+          (c) the licenses granted in Sections 2.2(a) and 2.2(b) are
+          effective on the date Contributor first makes Commercial Use of
+          the Covered Code.
+
+          (d)    Notwithstanding Section 2.2(b) above, no patent license is
+          granted: 1) for any code that Contributor has deleted from the
+          Contributor Version; 2)  separate from the Contributor Version;
+          3)  for infringements caused by: i) third party modifications of
+          Contributor Version or ii)  the combination of Modifications made
+          by that Contributor with other software  (except as part of the
+          Contributor Version) or other devices; or 4) under Patent Claims
+          infringed by Covered Code in the absence of Modifications made by
+          that Contributor.
+
+3. Distribution Obligations.
+
+     3.1. Application of License.
+     The Modifications which You create or to which You contribute are
+     governed by the terms of this License, including without limitation
+     Section 2.2. The Source Code version of Covered Code may be
+     distributed only under the terms of this License or a future version
+     of this License released under Section 6.1, and You must include a
+     copy of this License with every copy of the Source Code You
+     distribute. You may not offer or impose any terms on any Source Code
+     version that alters or restricts the applicable version of this
+     License or the recipients' rights hereunder. However, You may include
+     an additional document offering the additional rights described in
+     Section 3.5.
+
+     3.2. Availability of Source Code.
+     Any Modification which You create or to which You contribute must be
+     made available in Source Code form under the terms of this License
+     either on the same media as an Executable version or via an accepted
+     Electronic Distribution Mechanism to anyone to whom you made an
+     Executable version available; and if made available via Electronic
+     Distribution Mechanism, must remain available for at least twelve (12)
+     months after the date it initially became available, or at least six
+     (6) months after a subsequent version of that particular Modification
+     has been made available to such recipients. You are responsible for
+     ensuring that the Source Code version remains available even if the
+     Electronic Distribution Mechanism is maintained by a third party.
+
+     3.3. Description of Modifications.
+     You must cause all Covered Code to which You contribute to contain a
+     file documenting the changes You made to create that Covered Code and
+     the date of any change. You must include a prominent statement that
+     the Modification is derived, directly or indirectly, from Original
+     Code provided by the Initial Developer and including the name of the
+     Initial Developer in (a) the Source Code, and (b) in any notice in an
+     Executable version or related documentation in which You describe the
+     origin or ownership of the Covered Code.
+
+     3.4. Intellectual Property Matters
+          (a) Third Party Claims.
+          If Contributor has knowledge that a license under a third party's
+          intellectual property rights is required to exercise the rights
+          granted by such Contributor under Sections 2.1 or 2.2,
+          Contributor must include a text file with the Source Code
+          distribution titled "LEGAL" which describes the claim and the
+          party making the claim in sufficient detail that a recipient will
+          know whom to contact. If Contributor obtains such knowledge after
+          the Modification is made available as described in Section 3.2,
+          Contributor shall promptly modify the LEGAL file in all copies
+          Contributor makes available thereafter and shall take other steps
+          (such as notifying appropriate mailing lists or newsgroups)
+          reasonably calculated to inform those who received the Covered
+          Code that new knowledge has been obtained.
+
+          (b) Contributor APIs.
+          If Contributor's Modifications include an application programming
+          interface and Contributor has knowledge of patent licenses which
+          are reasonably necessary to implement that API, Contributor must
+          also include this information in the LEGAL file.
+
+               (c)    Representations.
+          Contributor represents that, except as disclosed pursuant to
+          Section 3.4(a) above, Contributor believes that Contributor's
+          Modifications are Contributor's original creation(s) and/or
+          Contributor has sufficient rights to grant the rights conveyed by
+          this License.
+
+     3.5. Required Notices.
+     You must duplicate the notice in Exhibit A in each file of the Source
+     Code.  If it is not possible to put such notice in a particular Source
+     Code file due to its structure, then You must include such notice in a
+     location (such as a relevant directory) where a user would be likely
+     to look for such a notice.  If You created one or more Modification(s)
+     You may add your name as a Contributor to the notice described in
+     Exhibit A.  You must also duplicate this License in any documentation
+     for the Source Code where You describe recipients' rights or ownership
+     rights relating to Covered Code.  You may choose to offer, and to
+     charge a fee for, warranty, support, indemnity or liability
+     obligations to one or more recipients of Covered Code. However, You
+     may do so only on Your own behalf, and not on behalf of the Initial
+     Developer or any Contributor. You must make it absolutely clear than
+     any such warranty, support, indemnity or liability obligation is
+     offered by You alone, and You hereby agree to indemnify the Initial
+     Developer and every Contributor for any liability incurred by the
+     Initial Developer or such Contributor as a result of warranty,
+     support, indemnity or liability terms You offer.
+
+     3.6. Distribution of Executable Versions.
+     You may distribute Covered Code in Executable form only if the
+     requirements of Section 3.1-3.5 have been met for that Covered Code,
+     and if You include a notice stating that the Source Code version of
+     the Covered Code is available under the terms of this License,
+     including a description of how and where You have fulfilled the
+     obligations of Section 3.2. The notice must be conspicuously included
+     in any notice in an Executable version, related documentation or
+     collateral in which You describe recipients' rights relating to the
+     Covered Code. You may distribute the Executable version of Covered
+     Code or ownership rights under a license of Your choice, which may
+     contain terms different from this License, provided that You are in
+     compliance with the terms of this License and that the license for the
+     Executable version does not attempt to limit or alter the recipient's
+     rights in the Source Code version from the rights set forth in this
+     License. If You distribute the Executable version under a different
+     license You must make it absolutely clear that any terms which differ
+     from this License are offered by You alone, not by the Initial
+     Developer or any Contributor. You hereby agree to indemnify the
+     Initial Developer and every Contributor for any liability incurred by
+     the Initial Developer or such Contributor as a result of any such
+     terms You offer.
+
+     3.7. Larger Works.
+     You may create a Larger Work by combining Covered Code with other code
+     not governed by the terms of this License and distribute the Larger
+     Work as a single product. In such a case, You must make sure the
+     requirements of this License are fulfilled for the Covered Code.
+
+4. Inability to Comply Due to Statute or Regulation.
+
+     If it is impossible for You to comply with any of the terms of this
+     License with respect to some or all of the Covered Code due to
+     statute, judicial order, or regulation then You must: (a) comply with
+     the terms of this License to the maximum extent possible; and (b)
+     describe the limitations and the code they affect. Such description
+     must be included in the LEGAL file described in Section 3.4 and must
+     be included with all distributions of the Source Code. Except to the
+     extent prohibited by statute or regulation, such description must be
+     sufficiently detailed for a recipient of ordinary skill to be able to
+     understand it.
+
+5. Application of this License.
+
+     This License applies to code to which the Initial Developer has
+     attached the notice in Exhibit A and to related Covered Code.
+
+6. Versions of the License.
+
+     6.1. New Versions.
+     Netscape Communications Corporation ("Netscape") may publish revised
+     and/or new versions of the License from time to time. Each version
+     will be given a distinguishing version number.
+
+     6.2. Effect of New Versions.
+     Once Covered Code has been published under a particular version of the
+     License, You may always continue to use it under the terms of that
+     version. You may also choose to use such Covered Code under the terms
+     of any subsequent version of the License published by Netscape. No one
+     other than Netscape has the right to modify the terms applicable to
+     Covered Code created under this License.
+
+     6.3. Derivative Works.
+     If You create or use a modified version of this License (which you may
+     only do in order to apply it to code which is not already Covered Code
+     governed by this License), You must (a) rename Your license so that
+     the phrases "Mozilla", "MOZILLAPL", "MOZPL", "Netscape",
+     "MPL", "NPL" or any confusingly similar phrase do not appear in your
+     license (except to note that your license differs from this License)
+     and (b) otherwise make it clear that Your version of the license
+     contains terms which differ from the Mozilla Public License and
+     Netscape Public License. (Filling in the name of the Initial
+     Developer, Original Code or Contributor in the notice described in
+     Exhibit A shall not of themselves be deemed to be modifications of
+     this License.)
+
+7. DISCLAIMER OF WARRANTY.
+
+     COVERED CODE IS PROVIDED UNDER THIS LICENSE ON AN "AS IS" BASIS,
+     WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING,
+     WITHOUT LIMITATION, WARRANTIES THAT THE COVERED CODE IS FREE OF
+     DEFECTS, MERCHANTABLE, FIT FOR A PARTICULAR PURPOSE OR NON-INFRINGING.
+     THE ENTIRE RISK AS TO THE QUALITY AND PERFORMANCE OF THE COVERED CODE
+     IS WITH YOU. SHOULD ANY COVERED CODE PROVE DEFECTIVE IN ANY RESPECT,
+     YOU (NOT THE INITIAL DEVELOPER OR ANY OTHER CONTRIBUTOR) ASSUME THE
+     COST OF ANY NECESSARY SERVICING, REPAIR OR CORRECTION. THIS DISCLAIMER
+     OF WARRANTY CONSTITUTES AN ESSENTIAL PART OF THIS LICENSE. NO USE OF
+     ANY COVERED CODE IS AUTHORIZED HEREUNDER EXCEPT UNDER THIS DISCLAIMER.
+
+8. TERMINATION.
+
+     8.1.  This License and the rights granted hereunder will terminate
+     automatically if You fail to comply with terms herein and fail to cure
+     such breach within 30 days of becoming aware of the breach. All
+     sublicenses to the Covered Code which are properly granted shall
+     survive any termination of this License. Provisions which, by their
+     nature, must remain in effect beyond the termination of this License
+     shall survive.
+
+     8.2.  If You initiate litigation by asserting a patent infringement
+     claim (excluding declatory judgment actions) against Initial Developer
+     or a Contributor (the Initial Developer or Contributor against whom
+     You file such action is referred to as "Participant")  alleging that:
+
+     (a)  such Participant's Contributor Version directly or indirectly
+     infringes any patent, then any and all rights granted by such
+     Participant to You under Sections 2.1 and/or 2.2 of this License
+     shall, upon 60 days notice from Participant terminate prospectively,
+     unless if within 60 days after receipt of notice You either: (i)
+     agree in writing to pay Participant a mutually agreeable reasonable
+     royalty for Your past and future use of Modifications made by such
+     Participant, or (ii) withdraw Your litigation claim with respect to
+     the Contributor Version against such Participant.  If within 60 days
+     of notice, a reasonable royalty and payment arrangement are not
+     mutually agreed upon in writing by the parties or the litigation claim
+     is not withdrawn, the rights granted by Participant to You under
+     Sections 2.1 and/or 2.2 automatically terminate at the expiration of
+     the 60 day notice period specified above.
+
+     (b)  any software, hardware, or device, other than such Participant's
+     Contributor Version, directly or indirectly infringes any patent, then
+     any rights granted to You by such Participant under Sections 2.1(b)
+     and 2.2(b) are revoked effective as of the date You first made, used,
+     sold, distributed, or had made, Modifications made by that
+     Participant.
+
+     8.3.  If You assert a patent infringement claim against Participant
+     alleging that such Participant's Contributor Version directly or
+     indirectly infringes any patent where such claim is resolved (such as
+     by license or settlement) prior to the initiation of patent
+     infringement litigation, then the reasonable value of the licenses
+     granted by such Participant under Sections 2.1 or 2.2 shall be taken
+     into account in determining the amount or value of any payment or
+     license.
+
+     8.4.  In the event of termination under Sections 8.1 or 8.2 above,
+     all end user license agreements (excluding distributors and resellers)
+     which have been validly granted by You or any distributor hereunder
+     prior to termination shall survive termination.
+
+9. LIMITATION OF LIABILITY.
+
+     UNDER NO CIRCUMSTANCES AND UNDER NO LEGAL THEORY, WHETHER TORT
+     (INCLUDING NEGLIGENCE), CONTRACT, OR OTHERWISE, SHALL YOU, THE INITIAL
+     DEVELOPER, ANY OTHER CONTRIBUTOR, OR ANY DISTRIBUTOR OF COVERED CODE,
+     OR ANY SUPPLIER OF ANY OF SUCH PARTIES, BE LIABLE TO ANY PERSON FOR
+     ANY INDIRECT, SPECIAL, INCIDENTAL, OR CONSEQUENTIAL DAMAGES OF ANY
+     CHARACTER INCLUDING, WITHOUT LIMITATION, DAMAGES FOR LOSS OF GOODWILL,
+     WORK STOPPAGE, COMPUTER FAILURE OR MALFUNCTION, OR ANY AND ALL OTHER
+     COMMERCIAL DAMAGES OR LOSSES, EVEN IF SUCH PARTY SHALL HAVE BEEN
+     INFORMED OF THE POSSIBILITY OF SUCH DAMAGES. THIS LIMITATION OF
+     LIABILITY SHALL NOT APPLY TO LIABILITY FOR DEATH OR PERSONAL INJURY
+     RESULTING FROM SUCH PARTY'S NEGLIGENCE TO THE EXTENT APPLICABLE LAW
+     PROHIBITS SUCH LIMITATION. SOME JURISDICTIONS DO NOT ALLOW THE
+     EXCLUSION OR LIMITATION OF INCIDENTAL OR CONSEQUENTIAL DAMAGES, SO
+     THIS EXCLUSION AND LIMITATION MAY NOT APPLY TO YOU.
+
+10. U.S. GOVERNMENT END USERS.
+
+     The Covered Code is a "commercial item," as that term is defined in
+     48 C.F.R. 2.101 (Oct. 1995), consisting of "commercial computer
+     software" and "commercial computer software documentation," as such
+     terms are used in 48 C.F.R. 12.212 (Sept. 1995). Consistent with 48
+     C.F.R. 12.212 and 48 C.F.R. 227.7202-1 through 227.7202-4 (June 1995),
+     all U.S. Government End Users acquire Covered Code with only those
+     rights set forth herein.
+
+11. MISCELLANEOUS.
+
+     This License represents the complete agreement concerning subject
+     matter hereof. If any provision of this License is held to be
+     unenforceable, such provision shall be reformed only to the extent
+     necessary to make it enforceable. This License shall be governed by
+     California law provisions (except to the extent applicable law, if
+     any, provides otherwise), excluding its conflict-of-law provisions.
+     With respect to disputes in which at least one party is a citizen of,
+     or an entity chartered or registered to do business in the United
+     States of America, any litigation relating to this License shall be
+     subject to the jurisdiction of the Federal Courts of the Northern
+     District of California, with venue lying in Santa Clara County,
+     California, with the losing party responsible for costs, including
+     without limitation, court costs and reasonable attorneys' fees and
+     expenses. The application of the United Nations Convention on
+     Contracts for the International Sale of Goods is expressly excluded.
+     Any law or regulation which provides that the language of a contract
+     shall be construed against the drafter shall not apply to this
+     License.
+
+12. RESPONSIBILITY FOR CLAIMS.
+
+     As between Initial Developer and the Contributors, each party is
+     responsible for claims and damages arising, directly or indirectly,
+     out of its utilization of rights under this License and You agree to
+     work with Initial Developer and Contributors to distribute such
+     responsibility on an equitable basis. Nothing herein is intended or
+     shall be deemed to constitute any admission of liability.
+
+13. MULTIPLE-LICENSED CODE.
+
+     Initial Developer may designate portions of the Covered Code as
+     "Multiple-Licensed".  "Multiple-Licensed" means that the Initial
+     Developer permits you to utilize portions of the Covered Code under
+     Your choice of the NPL or the alternative licenses, if any, specified
+     by the Initial Developer in the file described in Exhibit A.
+
+EXHIBIT A -Mozilla Public License.
+
+     ``The contents of this file are subject to the Mozilla Public License
+     Version 1.1 (the "License"); you may not use this file except in
+     compliance with the License. You may obtain a copy of the License at
+     http://www.mozilla.org/MPL/
+
+     Software distributed under the License is distributed on an "AS IS"
+     basis, WITHOUT WARRANTY OF ANY KIND, either express or implied. See the
+     License for the specific language governing rights and limitations
+     under the License.
+
+     The Original Code is ___Monster_____________________________.
+
+     The Initial Developer of the Original Code is ___VoIP INC___.
+     Portions created by ______________________ are Copyright (C) _2015_
+     _______________________. All Rights Reserved.
+
+     Contributor(s): __Jean-Roch Maitre____________________________.
+                     __Maxime Roux______________________________.
+                     __Joris Tirado______________________________.
+
+     Alternatively, the contents of this file may be used under the terms
+     of the _____ license (the  "[___] License"), in which case the
+     provisions of [______] License are applicable instead of those
+     above.  If you wish to allow use of your version of this file only
+     under the terms of the [____] License and not to allow others to use
+     your version of this file under the MPL, indicate your decision by
+     deleting  the provisions above and replace  them with the notice and
+     other provisions required by the [___] License.  If you do not delete
+     the provisions above, a recipient may use your version of this file
+     under either the MPL or the [___] License."
+
+     [NOTE: The text of this Exhibit A may differ slightly from the text of
+     the notices in the Source Code files of the Original Code. You should
+     use the text of this Exhibit A rather than the text found in the
+     Original Code Source Code for Your Modifications.]

src/apps/callflows/metadata/app.json

@@ -0,0 +1,33 @@
+{
+	"name": "callflows",
+	"i18n": {
+		"en-US": {
+			"label": "Callflows",
+			"description": "The Callflow Manager allows you manage Callflows as well as various VOIP entities.",
+			"extended_description": "Advanced Callflows features a drag and drop interface which allows users to select from over 50 items in our “call handling toolbox” to chain together. These chains, known as callflows, allow you to manipulate the flow a call takes as a caller traverses various features, menus and call routing decisions in the system. Use the Advanced Callflow editor to configure every step a caller can take when calling a phone number or extension. Route calls to menus, ring groups, voicemails, conference bridges, call queues, call recordings and more.",
+			"features": [
+				"Drag and drop management",
+				"50+ call handling actions such as: Time of Day Routing, Device/User Routing, Menus/IVRs, Call Pickup, BLF/Presence Manipulation, Outbound Call Routing...",
+				"Create custom call flows",
+				"Customize feature codes"
+			]
+		}
+	},
+	"tags": [],
+	"icon": "Callflows_app.png",
+	"api_url": "http://10.26.0.41:8000/v2",
+	"author": "2600Hz",
+	"version": "1.0",
+	"license": "-",
+	"price": 0,
+	"screenshots": [
+		"callflows_1.png",
+		"callflows_2.png",
+		"callflows_3.png"
+	],
+	"urls": {
+		"documentation": "{documentation_url}",
+		"howto": "{howto_video_url}"
+	},
+	"pvt_type": "app"
+}

src/apps/callflows/submodules/blacklist/blacklist.css

@@ -0,0 +1,79 @@
+#blacklist_wrapper .list-numbers {
+	display: block;
+	margin-left: 100px;
+	width: 470px;
+}
+
+#blacklist_wrapper .list-numbers .delete-number {
+	margin-bottom: 8px;
+}
+
+#blacklist_wrapper .list-numbers .add-number {
+	margin-bottom: 10px;
+	border-radius: 4px;
+}
+
+#blacklist_wrapper .list-numbers .add-number input {
+	margin: 0 20px 0 0;
+}
+
+#blacklist_wrapper .list-numbers .add-number #cancel_number {
+	margin-left: 20px;
+}
+
+#blacklist_wrapper .list-numbers .saved-numbers {
+	max-height: 300px;
+	overflow: auto;
+}
+
+#blacklist_wrapper .number-wrapper {
+	background: #444;
+	border-top: 1px solid #22ccff;
+	border-right: 1px solid #22ccff;
+	border-left: 1px solid #22ccff;
+	line-height: 30px;
+}
+
+#blacklist_wrapper .number-wrapper.placeholder > div,
+#blacklist_wrapper .number-wrapper:not(.placeholder) {
+	padding: 5px 10px;
+}
+
+#blacklist_wrapper .number-wrapper.placeholder .create-text:hover {
+	background: #222;
+	cursor: pointer;
+}
+
+#blacklist_wrapper .saved-numbers .number-wrapper:first-child {
+	border-top-right-radius: 4px;
+	border-top-left-radius: 4px;
+}
+
+#blacklist_wrapper .saved-numbers .number-wrapper:last-child {
+	border-bottom-right-radius: 4px;
+	border-bottom-left-radius: 4px;
+
+	border-bottom: 1px solid #22ccff;
+}
+
+#blacklist_wrapper .number-wrapper.placeholder {
+	background: none;
+	border: 1px dashed #999;
+}
+
+#blacklist_wrapper .number-wrapper.placeholder .create-inputs,
+#blacklist_wrapper .number-wrapper.placeholder.active .create-text {
+	display: none;
+}
+
+#blacklist_wrapper .number-wrapper.placeholder.active .create-inputs,
+#blacklist_wrapper .number-wrapper.placeholder .create-text {
+	display: inherit;
+}
+
+#blacklist_wrapper .help-text-icon {
+	color: white;
+	margin-right: 10px;
+	margin-left: 100px;
+	margin-top :15px;
+}

src/apps/callflows/submodules/blacklist/blacklist.js

@@ -0,0 +1,310 @@
+define(function(require){
+	var $ = require('jquery'),
+		_ = require('underscore'),
+		monster = require('monster');
+
+	var app = {
+		requests: {},
+
+		subscribe: {
+			'callflows.blacklist.edit': 'blacklistEdit',
+			'callflows.fetchActions': 'blacklistDefineActions',
+		},
+
+		blacklistDefineActions: function(args) {
+			var self = this,
+				callflow_nodes = args.actions;
+
+			$.extend(callflow_nodes, {
+				'blacklist': {
+					name: self.i18n.active().callflows.blacklist.title,
+					module: 'blacklist',
+					listEntities: function(callback) {
+						self.callApi({
+							resource: 'blacklist.list',
+							data: {
+								accountId: self.accountId,
+								filters: { paginate:false }
+							},
+							success: function(data, status) {
+								callback && callback(data.data);
+							}
+						});
+					},
+					editEntity: 'callflows.blacklist.edit'
+				}
+			});
+		},
+
+		// Added for the subscribed event to avoid refactoring conferenceEdit
+		blacklistEdit: function(args) {
+			var self = this,
+				afterGetData = function(data) {
+					var template = $(monster.template(self, 'blacklist-edit', {data: data})),
+						blacklistForm = template.find('#blacklist-form'),
+						$listNumbers = template.find('.saved-numbers');
+
+					monster.ui.validate(blacklistForm, {
+						rules: {
+							'name': { required: true },
+						}
+					});
+
+					_.each(data.numbers, function(v, number) {
+						$listNumbers.append(monster.template(self, 'blacklist-addNumber', {number: number}));
+					});
+
+					self.blacklistBindEvents(data, template, args.callbacks);
+
+					(args.target)
+						.empty()
+						.append(template);
+				};
+
+			if(args.data.id) {
+				self.blacklistGet(args.data.id, function(data) {
+					afterGetData(data);
+				});
+			}
+			else {
+				afterGetData({});
+			}
+		},
+
+/*		blacklistBindEvents: function(data, template, callbacks) {
+			var self = this,
+				addNumber = function(e) {
+					var number = template.find('#number_value').val();
+
+					if (number) {
+						$('.list-numbers .saved-numbers', template).prepend(monster.template(self, 'blacklist-addNumber', { number: number }));
+
+						$('#number_value', template).val('');
+					}
+				};
+
+			$('.number-wrapper.placeholder:not(.active)', template).on('click', function() {
+				var $this = $(this);
+
+				$this.addClass('active');
+
+				$('#number_value', template).focus();
+			});
+
+			$('#add_number', template).on('click', function(e) {
+				e.preventDefault();
+				addNumber(e);
+			});
+
+			$('.add-number', template).bind('keypress', function(e) {
+				var code = e.keyCode || e.which;
+
+				if (code === 13) {
+					addNumber(e);
+				}
+			});
+
+			$(template).delegate('.delete-number', 'click', function(e) {
+				$(this).parents('.number-wrapper').remove();
+			});
+
+			$('#cancel_number', template).on('click', function(e) {
+				e.stopPropagation();
+
+				$('.number-wrapper.placeholder.active', template).removeClass('active');
+				$('#number_value', template).val('');
+			});
+
+			$('.blacklist-save', template).on('click', function() {
+				var formData = form2object('blacklist-form'),
+					cleanData = self.blacklistCleanFormData(formData),
+					mapNumbers = {};
+
+				$('.saved-numbers .number-wrapper', template).each(function(k, wrapper) {
+					var number = $(wrapper).attr('data-number');
+					mapNumbers[number] = {};
+				});
+
+				cleanData.numbers = mapNumbers;
+
+				if (data.id) {
+					cleanData.id = data.id;
+				}
+
+				self.blacklistSave(cleanData, callbacks.save_success);
+			});
+
+			$('.blacklist-delete', template).on('click', function() {
+				monster.ui.confirm(self.i18n.active().callflows.blacklist.are_you_sure_you_want_to_delete, function() {
+					self.blacklistDelete(data.id, callbacks.delete_success);
+				});
+			});
+		},*/
+
+
+		blacklistBindEvents: function(data, template, callbacks) {
+			var self = this,
+				addNumber = function(e) {
+					var number = template.find('#number_value').val();
+
+					if(number) {
+						$('.list-numbers .saved-numbers', template).prepend(monster.template(self,'blacklist-addNumber', { number: number }));
+
+						$('#number_value', template).val('');
+					}
+				};
+
+			$('.number-wrapper.placeholder:not(.active)', template).click(function() {
+				var $this = $(this);
+
+				$this.addClass('active');
+
+				$('#number_value', template).focus();
+			});
+
+			$('#add_number', template).click(function(e) {
+				e.preventDefault();
+				addNumber();
+			});
+
+			$('.add-number', template).bind('keypress', function(e) {
+				var code = e.keyCode || e.which;
+
+				if(code === 13) {;
+					addNumber(e);
+				}
+			});
+
+			$(template).delegate('.delete-number', 'click', function(e) {
+				$(this).parents('.number-wrapper').remove();
+			});
+
+			$('#cancel_number', template).click(function(e) {
+				e.stopPropagation();
+
+				$('.number-wrapper.placeholder.active', template).removeClass('active');
+				$('#number_value', template).val('');
+			});
+
+			$('.blacklist-save', template).click(function() {
+				var formData = form2object('blacklist-form'),
+					cleanData = self.blacklistCleanFormData(formData),
+					mapNumbers = {};
+
+				$('.saved-numbers .number-wrapper', template).each(function(k, wrapper) {
+					var number = $(wrapper).attr('data-number');
+					mapNumbers[number] = {};
+				});
+
+				cleanData.numbers = mapNumbers;
+
+				if(data.id) {
+					cleanData.id = data.id;
+				}
+
+				self.blacklistSave(cleanData, callbacks.save_success);
+			});
+
+			$('.blacklist-delete', template).click(function() {
+				monster.ui.confirm(self.i18n.active().callflows.blacklist.are_you_sure_you_want_to_delete, function() {
+					self.blacklistDelete(data.id, callbacks.delete_success);
+				});
+			});
+		},
+
+		blacklistCleanFormData: function(data) {
+			delete data.extra;
+
+			return data;
+		},
+
+		blacklistSave: function(data, callback) {
+			var self = this;
+
+			if(data.id) {
+				self.blacklistUpdate(data, callback);
+			}
+			else {
+				self.blacklistCreate(data, callback);
+			}
+		},
+
+		blacklistList: function(callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'blacklist.list',
+				data: {
+					accountId: self.accountId,
+					filters: { paginate:false }
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		blacklistGet: function(id, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'blacklist.get',
+				data: {
+					accountId: self.accountId,
+					blacklistId: id
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		blacklistCreate: function(data, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'blacklist.create',
+				data: {
+					accountId: self.accountId,
+					data: data
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		blacklistUpdate: function(data, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'blacklist.update',
+				data: {
+					accountId: self.accountId,
+					blacklistId: data.id,
+					data: data
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		blacklistDelete: function(id, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'blacklist.delete',
+				data: {
+					accountId: self.accountId,
+					blacklistId: id
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		}
+	};
+
+	return app;
+});

src/apps/callflows/submodules/conference/conference.js

@@ -0,0 +1,654 @@
+define(function(require){
+	var $ = require('jquery'),
+		_ = require('underscore'),
+		monster = require('monster');
+
+	var app = {
+		requests: {},
+
+		subscribe: {
+			'callflows.conference.popupEdit': 'conferencePopupEdit',
+			'callflows.fetchActions': 'conferenceDefineActions',
+			'callflows.conference.edit': '_conferenceEdit'
+		},
+
+		conferenceDefineActions: function(args) {
+			var self = this,
+				callflow_nodes = args.actions;
+
+			$.extend(callflow_nodes, {
+				'conference[id=*]': {
+					name: self.i18n.active().callflows.conference.conference,
+					icon: 'conference',
+					category: self.i18n.active().oldCallflows.basic_cat,
+					module: 'conference',
+					tip: self.i18n.active().callflows.conference.conference_tip,
+					data: {
+						id: 'null'
+					},
+					rules: [
+						{
+							type: 'quantity',
+							maxSize: '1'
+						}
+					],
+					isUsable: 'true',
+					weight: 30,
+					caption: function(node, caption_map) {
+						var id = node.getMetadata('id'),
+							returned_value = '';
+
+						if(id in caption_map) {
+							returned_value = caption_map[id].name;
+						}
+
+						return returned_value;
+					},
+					edit: function(node, callback) {
+						self.conferenceList(function(data, status) {
+							var popup_html = $(monster.template(self, 'conference-callflowEdit', {
+									items: _.sortBy(data, 'name'),
+									selected: node.getMetadata('id') || ''
+								})),
+								popup;
+
+							if($('#conference_selector option:selected', popup_html).val() == undefined) {
+								$('#edit_link', popup_html).hide();
+							}
+
+							$('.inline_action', popup_html).click(function(ev) {
+								var _data = ($(this).data('action') == 'edit') ? { id: $('#conference_selector', popup_html).val() } : {};
+
+								ev.preventDefault();
+
+								self.conferencePopupEdit(_data, function(_data) {
+									node.setMetadata('id', _data.id || 'null');
+
+									node.caption = _data.name || '';
+
+									popup.dialog('close');
+								});
+							});
+
+							$('#add', popup_html).click(function() {
+								node.setMetadata('id', $('#conference_selector', popup_html).val());
+
+								node.caption = $('#conference_selector option:selected', popup_html).text();
+
+								popup.dialog('close');
+							});
+
+							popup = monster.ui.dialog(popup_html, {
+								title: self.i18n.active().callflows.conference.conference,
+								minHeight: '0',
+								beforeClose: function() {
+									if(typeof callback == 'function') {
+										callback();
+									}
+								}
+							});
+						});
+					},
+					listEntities: function(callback) {
+						self.callApi({
+							resource: 'conference.list',
+							data: {
+								accountId: self.accountId,
+								filters: { paginate:false }
+							},
+							success: function(data, status) {
+								callback && callback(data.data);
+							}
+						});
+					},
+					editEntity: 'callflows.conference.edit'
+				},
+
+				'conference[]': {
+					name: self.i18n.active().callflows.conference.conference_service,
+					icon: 'conference',
+					category: self.i18n.active().oldCallflows.advanced_cat,
+					module: 'conference',
+					tip: self.i18n.active().callflows.conference.conference_service_tip,
+					data: {},
+					rules: [
+						{
+							type: 'quantity',
+							maxSize: '1'
+						}
+					],
+					isUsable: 'true',
+					weight: 110,
+					caption: function(node) {
+						return '';
+					},
+					edit: function(node, callback) {
+						if(typeof callback == 'function') {
+							callback();
+						}
+					}
+				}
+			});
+		},
+
+		conferencePopupEdit: function(data, callback, data_defaults) {
+			var self = this,
+				popup_html = $('<div class="inline_popup callflows-port"><div class="inline_content main_content"/></div>'),
+				popup;
+
+			self.conferenceEdit(data, popup_html, $('.inline_content', popup_html), {
+				save_success: function(_data) {
+					popup.dialog('close');
+
+					if(typeof callback == 'function') {
+						callback(_data);
+					}
+				},
+				delete_success: function() {
+					popup.dialog('close');
+
+					if(typeof callback == 'function') {
+						callback({ data: {} });
+					}
+				},
+				after_render: function() {
+					popup = monster.ui.dialog(popup_html, {
+						title: (data.id) ? self.i18n.active().callflows.conference.edit_conference : self.i18n.active().callflows.conference.create_conference
+					});
+				}
+			}, data_defaults);
+		},
+
+		// Added for the subscribed event to avoid refactoring conferenceEdit
+		_conferenceEdit: function(args) {
+			var self = this;
+			self.conferenceEdit(args.data, args.parent, args.target, args.callbacks, args.data_defaults);
+		},
+
+		conferenceEdit: function(data, _parent, _target, _callbacks, data_defaults) {
+			var self = this,
+				parent = _parent || $('#conference-content'),
+				target = _target || $('#conference-view', parent),
+				_callbacks = _callbacks || {},
+				callbacks = {
+					save_success: _callbacks.save_success || function(_data) {
+						self.conferenceRenderList(parent);
+
+						self.conferenceEdit({ id: _data.id }, parent, target, callbacks);
+					},
+
+					save_error: _callbacks.save_error,
+
+					delete_success: _callbacks.delete_success || function() {
+						target.empty(),
+
+						self.conferenceRenderList(parent);
+					},
+
+					delete_error: _callbacks.delete_error,
+
+					after_render: _callbacks.after_render
+				},
+				defaults = {
+					data: $.extend(true, {
+						member: {},
+						play_entry_tone: true,
+						play_exit_tone: true
+					}, data_defaults || {}),
+					field_data: {
+						users: []
+					}
+				};
+
+			monster.parallel({
+					user_list: function(callback) {
+						self.callApi({
+							resource: 'user.list',
+							data: {
+								accountId: self.accountId,
+								filters: { paginate:false }
+							},
+							success: function(_data, status) {
+								_data.data.unshift({
+									id: '',
+									first_name: '- No',
+									last_name: 'owner -'
+								});
+
+								defaults.field_data.users = _data.data;
+
+								callback(null, _data);
+							}
+						});
+					},
+					get_conference: function(callback) {
+						if(typeof data == 'object' && data.id) {
+							self.conferenceGet(data.id, function(_data, status) {
+								self.conferenceMigrateData(_data);
+
+								self.conferenceFormatData(_data);
+
+								callback(null, _data);
+							});
+						}
+						else {
+							callback(null, {});
+						}
+					}
+				},
+				function(err, results) {
+					var render_data = defaults;
+
+					if(typeof data === 'object' && data.id) {
+						render_data = $.extend(true, defaults, { data: results.get_conference });
+					}
+
+					self.conferenceRender(render_data, target, callbacks);
+
+					if(typeof callbacks.after_render == 'function') {
+						callbacks.after_render();
+					}
+				}
+			);
+		},
+
+		conferenceRender: function(data, target, callbacks){
+			var self = this,
+				conference_html = $(monster.template(self, 'conference-edit', data)),
+				conference_form = conference_html.find('#conference_form');
+
+			monster.ui.validate(conference_form, {
+				rules: {
+					name: {
+						required: true,
+					},
+					'member.pins_string': {
+						regex: /^[a-z0-9A-Z,\s]*$/
+					},
+					'conference_numbers_string': {
+						regex: /^[0-9,\s]*$/
+					}
+				},
+				messages: {
+					'member.pins_string': { regex: self.i18n.active().callflows.conference.validation.member_pins_string },
+					'conference_numbers_string': { regex: self.i18n.active().callflows.conference.validation.member_numbers_string }
+				}
+			});
+
+			$('*[rel=popover]:not([type="text"])', conference_html).popover({
+				trigger: 'hover'
+			});
+
+			$('*[rel=popover][type="text"]', conference_html).popover({
+				trigger: 'focus'
+			});
+
+			self.winkstartTabs(conference_html);
+
+			if(!$('#owner_id', conference_html).val()) {
+				$('#edit_link', conference_html).hide();
+			}
+
+			$('#owner_id', conference_html).change(function() {
+				!$('#owner_id option:selected', conference_html).val() ? $('#edit_link', conference_html).hide() : $('#edit_link', conference_html).show();
+			});
+
+			$('.inline_action', conference_html).click(function(ev) {
+				var _data = ($(this).data('action') == 'edit') ? { id: $('#owner_id', conference_html).val() } : {},
+					_id = _data.id;
+
+				ev.preventDefault();
+
+				monster.pub('callflows.user.popupEdit', {
+					data: _data,
+					callback: function(_data) {
+						/* Create */
+						if(!_id) {
+							$('#owner_id', conference_html).append('<option id="'+ _data.id  +'" value="'+ _data.id +'">'+ _data.first_name + ' ' + _data.last_name  +'</option>');
+							$('#owner_id', conference_html).val(_data.id);
+							$('#edit_link', conference_html).show();
+						}
+						else {
+							/* Update */
+							if('id' in _data) {
+								$('#owner_id #'+_data.id, conference_html).text(_data.first_name + ' ' + _data.last_name);
+							}
+							/* Delete */
+							else {
+								$('#owner_id #'+_id, conference_html).remove();
+								$('#edit_link', conference_html).hide();
+							}
+						}
+					}
+				});
+			});
+
+			$('.conference-save', conference_html).click(function(ev) {
+				ev.preventDefault();
+				var $this = $(this);
+
+				if(!$this.hasClass('disabled')) {
+					$this.addClass('disabled');
+					if (monster.ui.valid(conference_form)) {
+						var form_data = monster.ui.getFormData('conference_form');
+
+						self.conferenceCleanFormData(form_data);
+
+						data.data.member.pins = form_data.member.pins;
+
+						if('field_data' in data) {
+							delete data.field_data;
+						}
+
+						self.conferenceSave(form_data, data, callbacks.save_success, function(data) {
+							$this.removeClass('disabled');
+							callbacks && callbacks.hasOwnProperty('save_error') && callbacks.save_error(data);
+						});
+					}
+					else {
+						$this.removeClass('disabled');
+						monster.ui.alert(self.i18n.active().callflows.conference.there_were_errors_on_the_form);
+					};
+				}
+			});
+
+			$('.conference-delete', conference_html).click(function(ev) {
+				ev.preventDefault();
+
+				monster.ui.confirm(self.i18n.active().callflows.conference.are_you_sure_you_want_to_delete, function() {
+					self.conferenceDelete(data.data.id, callbacks.delete_success, callbacks.delete_error);
+				});
+			});
+
+			(target)
+				.empty()
+				.append(conference_html);
+		},
+
+		conferenceRenderList: function(parent) {
+			var self = this;
+
+			self.conferenceList(function(data, status) {
+				var map_crossbar_data = function(data) {
+						var new_list = [];
+
+						if(data.length > 0) {
+							$.each(data, function(key, val) {
+								new_list.push({
+									id: val.id,
+									title: val.name || self.i18n.active().callflows.conference.name
+								});
+							});
+						}
+
+						new_list.sort(function(a, b) {
+							return a.title.toLowerCase() < b.title.toLowerCase() ? -1 : 1;
+						});
+
+						return new_list;
+					};
+
+			// $('#conference-listpanel', parent)
+			// 	.empty()
+			// 	.listpanel({
+			// 		label: self.i18n.active().callflows.conference.conferences_label,
+			// 		identifier: 'conference-listview',
+			// 		new_entity_label: self.i18n.active().callflows.conference.add_conference_label,
+			// 		data: map_crossbar_data(data),
+			// 		publisher: monster.pub,
+			// 		notifyMethod: 'callflows.conference.edit',
+			// 		notifyCreateMethod: 'callflows.conference.edit',
+			// 		notifyParent: parent
+			// 	});
+			});
+		},
+
+		conferenceMigrateData: function(data) {
+			if(data.member_play_name) {
+				if(data.play_name_on_join == undefined) {
+					data.play_name_on_join = data.member_play_name;
+				}
+
+				delete data.member_play_name;
+			}
+
+			if(data.member_join_muted) {
+				if(data.member.join_muted == undefined) {
+					data.member.join_muted = data.member_join_muted;
+				}
+
+				delete data.member_join_muted;
+			}
+
+			if(data.member_join_deaf) {
+				if(data.member.join_deaf == undefined) {
+					data.member.join_deaf = data.member_join_deaf;
+				}
+
+				delete data.member_join_deaf;
+			}
+
+			return data;
+		},
+
+		conferenceFormatData: function(data) {
+			if(typeof data.member == 'object') {
+				if($.isArray(data.member.pins)) {
+					data.member.pins_string = data.member.pins.join(', ');
+				}
+
+				if($.isArray(data.conference_numbers)) {
+					data.conference_numbers_string = data.conference_numbers.join(', ');
+				}
+			}
+
+			return data;
+		},
+
+		conferenceCleanFormData: function(form_data){
+			var self = this;
+			form_data.member.pins_string = self.conferenceLettersToNumbers(form_data.member.pins_string);
+
+			form_data.member.pins = $.map(form_data.member.pins_string.split(','), function(val) {
+				var pin = $.trim(val);
+
+				if(pin != '') {
+					return pin;
+				}
+				else {
+					return null;
+				}
+			});
+
+			form_data.conference_numbers = $.map(form_data.conference_numbers_string.split(','), function(val) {
+				var number = $.trim(val);
+
+				if(number != '') {
+					return number;
+				}
+				else {
+					return null;
+				}
+			});
+
+			return form_data;
+		},
+
+		conferenceLettersToNumbers: function(string) {
+			var result = '';
+
+			$.each(string.split(''), function(index, value) {
+				if(value.match(/^[aAbBcC]$/)) {
+					result += '2';
+				}
+				else if(value.match(/^[dDeEfF]$/)) {
+					result += '3';
+				}
+				else if(value.match(/^[gGhHiI]$/)) {
+					result += '4';
+				}
+				else if(value.match(/^[jJkKlL]$/)) {
+					result += '5';
+				}
+				else if(value.match(/^[mMnNoO]$/)) {
+					result += '6';
+				}
+				else if(value.match(/^[pPqQrRsS]$/)) {
+					result += '7';
+				}
+				else if(value.match(/^[tTuUvV]$/)) {
+					result += '8';
+				}
+				else if(value.match(/^[wWxXyYzZ]$/)) {
+					result += '9';
+				}
+				else {
+					result += value;
+				}
+			});
+
+			return result;
+		},
+
+		conferenceSave: function(form_data, data, success, error) {
+			var self = this,
+				normalized_data = self.conferenceFixArrays(self.conferenceNormalizeData($.extend(true, {}, data.data, form_data)), form_data);
+
+			if(typeof data.data == 'object' && data.data.id) {
+				self.conferenceUpdate(normalized_data, function(_data, status) {
+						if(typeof success == 'function') {
+							success(_data, status, 'update');
+						}
+					},
+					function(_data, status) {
+						if(typeof error == 'function') {
+							error(_data, status, 'update');
+						}
+					}
+				);
+			}
+			else {
+				self.conferenceCreate(normalized_data, function(_data, status) {
+						if(typeof success == 'function') {
+							success(_data, status, 'create');
+						}
+					},
+					function(_data, status) {
+						if(typeof error == 'function') {
+							error(_data, status, 'create');
+						}
+					}
+				);
+			}
+		},
+
+		/* Since the extend function doesn't override arrays, we need to do that */
+		conferenceFixArrays: function(merged_data, form_data) {
+			var self = this;
+
+			if('conference_numbers' in form_data) {
+				merged_data.conference_numbers = form_data.conference_numbers;
+			}
+
+			return merged_data;
+		},
+
+		conferenceNormalizeData: function(data) {
+			if(!data.member.pins.length) {
+				delete data.member.pins;
+			}
+
+			if(data.hasOwnProperty('member') && data.member.hasOwnProperty('numbers') && !data.member.numbers.length) {
+				delete data.member.numbers;
+			}
+
+			if(!data.owner_id) {
+				delete data.owner_id;
+			}
+
+			delete data.member.pins_string;
+			delete data.conference_numbers_string;
+
+			return data;
+		},
+
+
+		conferenceList: function(callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'conference.list',
+				data: {
+					accountId: self.accountId,
+					filters: { paginate:false }
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		conferenceGet: function(conferenceId, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'conference.get',
+				data: {
+					accountId: self.accountId,
+					conferenceId: conferenceId
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		conferenceCreate: function(data, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'conference.create',
+				data: {
+					accountId: self.accountId,
+					data: data
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		conferenceUpdate: function(data, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'conference.update',
+				data: {
+					accountId: self.accountId,
+					conferenceId: data.id,
+					data: data
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		conferenceDelete: function(conferenceId, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'conference.delete',
+				data: {
+					accountId: self.accountId,
+					conferenceId: conferenceId
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		}
+	};
+
+	return app;
+});

src/apps/callflows/submodules/device/device.css

@@ -0,0 +1,98 @@
+/**************************
+----TOP TABS MEDIA---------
+****************************/
+.callflows-port .media_tabs {
+	background-color: #555555;
+	border: 1px solid #363636;
+	min-height: 90px;
+	padding: 10px;
+	position:relative;
+	overflow-x: auto;
+	white-space: nowrap;
+}
+
+.callflows-port .media_tabs .buttons {
+	width: 128px;
+	height: 90px;
+
+	line-height: 90px;
+	display: inline-block;
+	position: relative;
+	margin: 0 10px 0 0;
+
+	text-align: center;
+
+	-moz-border-radius: 12px;
+	-webkit-border-radius: 12px;
+	border-radius: 4px;
+
+	cursor: pointer;
+	opacity: 0.4;
+
+	background: #05addc;
+	background: -moz-linear-gradient(top,  #05addc 0%, #0099b7 25%, #008ca8 50%, #0099b7 75%, #05addc 100%);
+	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#05addc), color-stop(25%,#0099b7), color-stop(50%,#008ca8), color-stop(75%,#0099b7), color-stop(100%,#05addc));
+	background: -webkit-linear-gradient(top,  #05addc 0%,#0099b7 25%,#008ca8 50%,#0099b7 75%,#05addc 100%);
+	background: -o-linear-gradient(top,  #05addc 0%,#0099b7 25%,#008ca8 50%,#0099b7 75%,#05addc 100%);
+	background: -ms-linear-gradient(top,  #05addc 0%,#0099b7 25%,#008ca8 50%,#0099b7 75%,#05addc 100%);
+	background: linear-gradient(to bottom,  #05addc 0%,#0099b7 25%,#008ca8 50%,#0099b7 75%,#05addc 100%);
+	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#05addc', endColorstr='#05addc',GradientType=0 );
+
+}
+
+.callflows-port .media_tabs .buttons:hover {
+	-moz-box-shadow: 3px 5px 10px #383838;
+	-webkit-box-shadow: 3px 5px 10px #383838;
+	box-shadow: 3px 5px 10px #383838;
+	opacity: 0.6;
+}
+
+.callflows-port .media_tabs .buttons.current, 
+.callflows-port .media_tabs .buttons.current:hover {
+	-moz-box-shadow: 3px 5px 10px #383838;
+	-webkit-box-shadow: 3px 5px 10px #383838;
+	box-shadow: 3px 5px 10px #383838;
+	opacity: 1;
+}
+
+.callflows-port .media_tabs .buttons .label_device {
+	font-size: 12px;
+	text-transform: uppercase;
+	font-weight: bold;
+	color: white;
+}
+
+.callflows-port #device-view .realm_label {
+	line-height: 22px;
+}
+
+.callflows-port .media_pane {
+	margin-left: 0;
+	margin-top: 30px;
+}
+
+.callflows-port #device-form .provisioner select {
+	width: 100px;
+	margin-left: 10px;
+}
+
+.callflows-port #device-form .provisioner {
+	display: inline-block;
+	margin-left: 22px;
+}
+
+.callflows-port .input .text {
+	display: inline-block;
+	width: 210px;
+	height: 20px;
+	margin-bottom: 10px;
+	padding: 4px 6px;
+}
+
+.callflows-port #device-form .shoutcast-div {
+	display: none;
+}
+
+.callflows-port #device-form .shoutcast-div.active {
+	display: block;
+}

src/apps/callflows/submodules/directory/directory.css

@@ -0,0 +1,158 @@
+.callflows-port #directory-form #basic #tab_users  {
+	border: 2px solid #666666;
+	border-radius: 15px 15px 0px 0px;
+	color: #666666;
+	margin: 20px auto auto;
+	width: 480px;
+	max-height: 342px;
+	float: left;
+}
+
+.callflows-port #directory-form #basic #tab_users .rows {
+	max-height: 310px;
+	overflow: auto;
+}
+
+.callflows-port #directory-form #basic #tab_users .action_user {
+	color: #666666;
+	cursor: pointer;
+	text-decoration: underline;
+	line-height: 32px;
+}
+
+.callflows-port #directory-form #basic #tab_users .action_user:not(:first-child) {
+	margin-left: 10px;
+}
+.callflows-port #directory-form #basic #tab_users .action_user:hover {
+	color: #05addc;
+}
+
+.callflows-port #directory-form #basic #tab_users .column.first:not(:last-child) {
+	border-right: 1px solid #A6A6A6;
+}
+
+.callflows-port #directory-form #basic #tab_users .column {
+	float: left;
+	text-align: center;
+	height: 32px;
+	line-height: 32px;
+}
+
+.callflows-port #directory-form #basic #tab_users select {
+	height: 22px;
+}
+
+.callflows-port #directory-form #basic #tab_users .column.first {
+	width: 230px;
+	overflow: hidden;
+	text-align:center;
+}
+
+.callflows-port #directory-form #basic #tab_users .column.third {
+	width: 69px;
+}
+
+.callflows-port #directory-form #basic #tab_users .column.second {
+	min-width: 159px;
+	border-right: 1px solid #A6A6A6;
+}
+
+.callflows-port #directory-form #basic #tab_users .column.second select {
+	margin: 0;
+	max-width: 140px;
+	padding: 0;
+}
+
+.callflows-port #directory-form #basic #tab_users .column.merged {
+	width: 480px;
+}
+
+.callflows-port #directory-form #basic #tab_users .row-user {
+	height: 32px;
+	margin-left: 0px;
+}
+
+.callflows-port #directory-form #basic #tab_users .row-user.title {
+	background-color: #dddddd !important;
+	border-bottom: 2px solid #666666 !important;
+	border-radius: 13px 13px 0px 0px;
+	font-weight: bold;
+}
+
+.callflows-port #directory-form #basic #tab_users .row-user:not(:last-child) {
+	border-bottom: 1px solid #A6A6A6;
+}
+
+.callflows-port #directory-form #basic #tab_users .row-user:nth-child(odd) {
+	background-color: #eeeeee;
+}
+
+.callflows-port #directory-form #basic #tab_users .row-user:nth-child(even) {
+	background-color: #dddddd;
+}
+
+.callflows-port #directory-form #basic .add_user {
+	margin: 20px 0 0 20px;
+	color: #666666;
+	background: #666666;
+	width: 230px;
+	border-radius: 15px 15px 15px 15px;
+	float: right;
+}
+
+.callflows-port #directory-form #basic .add_user .add_content_wrapper {
+	background: #EEEEEE;
+	border-radius: 0 0 15px 15px;
+}
+
+.callflows-port #directory-form #basic .add_user .add_user_title {
+	color: #eeeeee;
+	font-weight: bold;
+	height: 25px;
+	line-height: 25px;
+	text-align: center;
+	border-radius: 10px 10px 0 0;
+}
+
+.callflows-port #directory-form #basic .add_user select {
+	width: 180px;
+}
+
+.callflows-port #directory-form #basic .add_user .add_user_fields {
+	margin: auto;
+	width: 200px;
+}
+
+.callflows-port #directory-form #basic .add_user .add_user_fields .tooltip-wrapper {
+	margin-left: 0px;
+}
+
+.callflows-port #directory-form #basic .add_user .add_user_fields ul {
+	list-style-type: none;
+}
+
+.callflows-port #directory-form #basic .add_user .add_user_div {
+	margin: 10px auto auto auto;
+	width: 200px;
+	padding-bottom: 15px;
+}
+
+.callflows-port #directory-form #basic .add_user .add_user_div a {
+	color: #333333;
+}
+
+.callflows-port #directory-form #basic .add_user label {
+	color: #404040;
+	width: auto;
+}
+
+
+
+.callflows-port #directory-form #basic .add_user .add_user_div:hover a {
+	color: #05addc;
+}
+
+.callflows-port #directory-form #basic .add_user .add_user_div:hover .add_user_icon {
+	background-position: 0 -24px;
+	cursor: pointer;
+}

src/apps/callflows/submodules/directory/directory.js

@@ -0,0 +1,618 @@
+define(function(require){
+	var $ = require('jquery'),
+		_ = require('underscore'),
+		monster = require('monster');
+
+	var app = {
+		requests: {},
+
+		subscribe: {
+			'callflows.fetchActions': 'directoryDefineActions',
+			'callflows.directory.edit': '_directoryEdit'
+		},
+
+		directoryRender: function(data, target, callbacks){
+			var self = this,
+				directory_html = $(monster.template(self, 'directory-edit', data)),
+				directoryForm = directory_html.find('#directory-form');
+
+			self.directoryRenderUserList(data, directory_html);
+
+			monster.ui.validate(directoryForm, {
+				rules: {
+					'min_dtmf': { digits: true },
+					'max_dtmf': { digits: true }
+				}
+			});
+
+			$('*[rel=popover]:not([type="text"])', directory_html).popover({
+				trigger: 'hover'
+			});
+
+			$('*[rel=popover][type="text"]', directory_html).popover({
+				trigger: 'focus'
+			});
+
+			self.winkstartTabs(directory_html);
+
+			$('.directory-save', directory_html).click(function(ev) {
+				ev.preventDefault();
+				var $this = $(this);
+
+				if (!$this.hasClass('disabled')) {
+					$this.addClass('disabled');
+					if (monster.ui.valid(directoryForm)) {
+						var form_data = monster.ui.getFormData('directory-form');
+
+						self.directoryCleanFormData(form_data);
+
+						var old_list = {},
+							new_list = {},
+							userCallflowId;
+
+						$('.rows .row:not(#row_no_data)', directory_html).each(function() {
+							userCallflowId = $('#user_callflow_id', $(this)).val();
+
+							if (userCallflowId !== '_empty') {
+								new_list[$(this).data('id')] = userCallflowId;
+							}
+						});
+
+						data.field_data.user_list = {
+							old_list: data.field_data.old_list,
+							new_list: new_list
+						};
+
+						self.directorySave(form_data, data, callbacks.save_success);
+					} else {
+						$this.removeClass('disabled');
+						monster.ui.alert(self.i18n.active().callflows.directory.there_were_errors_on_the_form);
+					}
+				}
+			});
+
+			$('.directory-delete', directory_html).click(function(ev) {
+				ev.preventDefault();
+
+				monster.ui.confirm(self.i18n.active().callflows.directory.are_you_sure_you_want_to_delete, function() {
+					self.directoryDelete(data.data.id, callbacks.delete_success);
+				});
+			});
+
+			$('.add_user_div', directory_html).click(function() {
+				var $user = $('#select_user_id', directory_html);
+				var $callflow = $('#callflow_id', directory_html);
+
+				if($user.val() != 'empty_option_user' && $callflow.val() != 'empty_option_callflow') {
+					var user_id = $user.val(),
+						user_data = {
+							user_id: user_id,
+							user_name: $('#option_user_'+user_id, directory_html).text(),
+							callflow_id: $callflow.val(),
+							field_data: {
+								callflows: data.field_data.callflows
+							},
+							_t: function(param){
+								return window.translate['directory'][param];
+							}
+						};
+
+					if($('#row_no_data', directory_html).size() > 0) {
+						$('#row_no_data', directory_html).remove();
+					}
+
+					$('.rows', directory_html).prepend(monster.template(self, 'directory-userRow', user_data));
+					$('#option_user_'+user_id, directory_html).hide();
+
+					$user.val('empty_option_user');
+					$callflow.val('empty_option_callflow');
+				}
+				else {
+					monster.ui.alert('warning', self.i18n.active().callflows.directory.noDataSelected);
+				}
+			});
+
+			$(directory_html).delegate('.action_user.delete', 'click', function() {
+				var user_id = $(this).data('id');
+				//removes it from the grid
+				$('#row_user_'+user_id, directory_html).remove();
+				//re-add it to the dropdown
+				$('#option_user_'+user_id, directory_html).show();
+				//if grid empty, add no data line
+				if($('.rows .row', directory_html).size() == 0) {
+					$('.rows', directory_html).append(monster.template(self, 'directory-userRow'));
+				}
+			});
+
+			(target)
+				.empty()
+				.append(directory_html);
+		},
+
+		directoryRenderUserList: function(data, parent) {
+			var self = this;
+
+			if(data.data.id) {
+				if('users' in data.data && data.data.users.length > 0) {
+					var user_item;
+					$.each(data.field_data.users, function(k, v) {
+						if(v.id in data.field_data.old_list) {
+							user_item = {
+								user_id: v.id,
+								user_name: v.first_name + ' ' + v.last_name,
+								callflow_id: data.field_data.old_list[v.id],
+								field_data: {
+									callflows: data.field_data.callflows
+								}
+							};
+
+							$('.rows', parent).append(monster.template(self, 'directory-userRow', user_item));
+							$('#option_user_'+v.id, parent).hide();
+						}
+					});
+				}
+				else {
+					$('.rows', parent).empty()
+									  .append(monster.template(self, 'directory-userRow'));
+				}
+			}
+			else {
+				$('.rows', parent).empty()
+								  .append(monster.template(self,'directory-userRow'));
+			}
+		},
+
+		// Added for the subscribed event to avoid refactoring directoryEdit
+		_directoryEdit: function(args) {
+			var self = this;
+			self.directoryEdit(args.data, args.parent, args.target, args.callbacks, args.data_defaults);
+		},
+
+		directoryEdit: function(data, _parent, _target, _callbacks, data_defaults){
+			var self = this,
+				parent = _parent || $('#directory-content'),
+				target = _target || $('#directory-view', parent),
+				_callbacks = _callbacks || {},
+				callbacks = {
+					save_success: _callbacks.save_success,
+					save_error: _callbacks.save_error,
+					delete_success: _callbacks.delete_success,
+					delete_error: _callbacks.delete_error,
+					after_render: _callbacks.after_render
+				},
+				defaults = {
+					data: $.extend(true, {
+						min_dtmf: '3',
+						max_dtmf: '0',
+						sort_by: 'last_name',
+						confirm_match: false
+					}, data_defaults || {}),
+					field_data: {
+						sort_by: {
+							'first_name': self.i18n.active().callflows.directory.first_name,
+							'last_name': self.i18n.active().callflows.directory.last_name
+						}
+					}
+				};
+
+			monster.parallel({
+					callflow_list: function(callback) {
+						self.callApi({
+							resource: 'callflow.list',
+							data: {
+								accountId: self.accountId,
+								filters: {
+									paginate: 'false'
+								}
+							},
+							success: function(callflows) {
+								var list_callflows = [];
+								$.each(callflows.data, function() {
+									if(this.featurecode == false) {
+										list_callflows.push(this);
+									}
+								});
+
+								list_callflows.sort(function(a, b) {
+									var aName = (a.name || (a.numbers[0] + '')).toLowerCase(),
+										bName = (b.name || (b.numbers[0] + '')).toLowerCase();
+
+									return aName > bName ? 1 : -1;
+								});
+
+								defaults.field_data.callflows = list_callflows;
+
+								callback(null, callflows);
+							}
+						});
+					},
+					user_list: function(callback) {
+						self.callApi({
+							resource: 'user.list',
+							data: {
+								accountId: self.accountId,
+								filters: {
+									paginate: 'false'
+								}
+							},
+							success: function(users) {
+								users.data.sort(function(a,b) {
+									var aName = (a.first_name + ' ' + a.last_name).toLowerCase(),
+										bName = (b.first_name + ' ' + b.last_name).toLowerCase();
+
+									return aName > bName ? 1 : -1;
+								});
+
+								defaults.field_data.users = users.data;
+
+								callback(null, users);
+							}
+						});
+					},
+					directory_get: function(callback) {
+						if(typeof data === 'object' && data.id) {
+							self.directoryGet(data.id, function(directory, status) {
+									defaults.field_data.old_list = {};
+
+									if('users' in directory) {
+										$.each(directory.users, function(k, v) {
+											defaults.field_data.old_list[v.user_id] = v.callflow_id;
+										});
+									}
+
+									callback(null, directory);
+								}
+							);
+						}
+						else {
+							callback(null, {});
+						}
+					}
+				},
+				function(err, results) {
+					var render_data = defaults;
+
+					if(typeof data === 'object' && data.id) {
+						render_data = $.extend(true, defaults, { data: results.directory_get });
+					}
+
+					self.directoryRender(render_data, target, callbacks);
+
+					if(typeof callbacks.after_render == 'function') {
+						callbacks.after_render();
+					}
+				}
+			);
+		},
+
+		directoryPopupEdit: function(args) {
+			var self = this,
+				popup, 
+				popup_html,
+				data = args.data,
+				callback = args.callback,
+				data_defaults = args.data_defaults;
+
+			popup_html = $('<div class="inline_popup callflows-port"><div class="inline_content main_content"/></div>');
+
+			self.directoryEdit(data, popup_html, $('.inline_content', popup_html), {
+				save_success: function(_data) {
+					popup.dialog('close');
+
+					if(typeof callback == 'function') {
+						callback(_data);
+					}
+				},
+				delete_success: function() {
+					popup.dialog('close');
+
+					if(typeof callback == 'function') {
+						callback({ data: {} });
+					}
+				},
+				after_render: function() {
+					popup = monster.ui.dialog(popup_html, {
+						title: (data.id) ? self.i18n.active().callflows.directory.edit_directory : self.i18n.active().callflows.directory.create_directory
+					});
+				}
+			}, data_defaults);
+		},
+
+		directoryNormalizeData: function(form_data) {
+			delete form_data.users;
+			return form_data;
+		},
+
+		directoryCleanFormData: function(form_data) {
+			if(!(form_data.max_dtmf > 0)) {
+				delete form_data.max_dtmf;
+			}
+
+			delete form_data.user_callflow_id;
+			delete form_data.user_id;
+			delete form_data.callflow_id;
+		},
+
+		directorySave: function(form_data, data, success) {
+			var self = this,
+				normalized_data = self.directoryNormalizeData($.extend(true, {}, data.data, form_data));
+
+			if (typeof data.data == 'object' && data.data.id) {
+				self.directoryUpdate(normalized_data, function(_data, status) {
+					self.directoryUpdateUsers(data.field_data.user_list, _data.id, function() {
+						success && success(_data, status, 'update');
+					});
+				})
+			}
+			else {
+				self.directoryCreate(normalized_data, function(_data, status) {
+					self.directoryUpdateUsers(data.field_data.user_list, _data.id, function() {
+						success && success(_data, status, 'create');
+					});
+				});
+			}
+		},
+
+		directoryUpdateSingleUser: function(user_id, directory_id, callflow_id, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'user.get',
+				data: {
+					accountId: self.accountId,
+					userId: user_id
+				},
+				success: function(_data, status) {
+					if(callflow_id) {
+						if(!_data.data.directories || $.isArray(_data.data.directories)) {
+							_data.data.directories = {};
+						}
+						_data.data.directories[directory_id] = callflow_id;
+					}
+					else {
+						delete _data.data.directories[directory_id];
+					}
+
+					self.callApi({
+						resource: 'user.update',
+						data: {
+							accountId: self.accountId,
+							userId: user_id,
+							data: _data.data
+						},
+						success: callback
+					});
+				}
+			});
+		},
+
+		directoryUpdateUsers: function(data, directory_id, success) {
+			var old_directory_user_list = data.old_list,
+				new_directory_user_list = data.new_list,
+				self = this,
+				users_updated_count = 0,
+				users_count = 0,
+				callback = function() {
+					users_updated_count++;
+					if(users_updated_count >= users_count) {
+						success();
+					}
+				};
+
+			if(old_directory_user_list) {
+				$.each(old_directory_user_list, function(k, v) {
+					if(!(k in new_directory_user_list)) {
+						//Request to update user without this directory.
+						users_count++;
+						self.directoryUpdateSingleUser(k, directory_id, undefined, callback);
+					}
+				});
+
+				$.each(new_directory_user_list, function(k, v) {
+					if(k in old_directory_user_list) {
+						if(old_directory_user_list[k] != v) {
+							//Request to update user
+							users_count++;
+							self.directoryUpdateSingleUser(k, directory_id, v, callback);
+						}
+						//else it has not been updated
+					}
+					else {
+						users_count++;
+						self.directoryUpdateSingleUser(k, directory_id, v, callback);
+					}
+				});
+			}
+			else {
+				if(new_directory_user_list) {
+					$.each(new_directory_user_list, function(k, v) {
+						users_count++;
+						self.directoryUpdateSingleUser(k, directory_id, v, callback);
+					});
+				}
+			}
+
+			if(users_count === 0) {
+				success();
+			}
+		},
+
+		directoryDefineActions: function(args) {
+			var self = this,
+				callflow_nodes = args.actions;
+
+			$.extend(callflow_nodes, {
+				'directory[id=*]': {
+					name: self.i18n.active().callflows.directory.directory,
+					icon: 'book',
+					category: self.i18n.active().oldCallflows.advanced_cat,
+					module: 'directory',
+					tip: self.i18n.active().callflows.directory.directory_tip,
+					data: {
+						id: 'null'
+					},
+					rules: [
+						{
+							type: 'quantity',
+							maxSize: '1'
+						}
+					],
+					isUsable: 'true',
+					weight: 160,
+					caption: function(node, caption_map) {
+						var id = node.getMetadata('id'),
+							returned_value = '';
+
+						if(id in caption_map) {
+							returned_value = caption_map[id].name;
+						}
+
+						return returned_value;
+					},
+					edit: function(node, callback) {
+						var _this = this;
+
+						self.directoryList(function(directories) {
+							var popup, popup_html;
+
+							popup_html = $(monster.template(self, 'directory-callflowEdit', {
+								items: _.sortBy(directories, 'name'),
+								selected: node.getMetadata('id') || ''
+							}));
+
+							if($('#directory_selector option:selected', popup_html).val() == undefined) {
+								$('#edit_link', popup_html).hide();
+							}
+
+							$('.inline_action', popup_html).click(function(ev) {
+								var _data = ($(this).data('action') == 'edit') ?
+												{ id: $('#directory_selector', popup_html).val() } : {};
+
+								ev.preventDefault();
+
+								self.directoryPopupEdit({
+									data: _data,
+									callback: function(_data) {
+										node.setMetadata('id', _data.id || 'null');
+
+										node.caption = _data.name || '';
+
+										popup.dialog('close');
+									}
+								});
+							});
+
+							$('#add', popup_html).click(function() {
+								node.setMetadata('id', $('#directory_selector', popup).val());
+
+								node.caption = $('#directory_selector option:selected', popup).text();
+
+								popup.dialog('close');
+							});
+
+							popup = monster.ui.dialog(popup_html, {
+								title: self.i18n.active().callflows.directory.directory_title,
+								beforeClose: function() {
+									if(typeof callback == 'function') {
+										callback();
+									}
+								}
+							});
+						});
+					},
+					listEntities: function(callback) {
+						self.callApi({
+							resource: 'directory.list',
+							data: {
+								accountId: self.accountId,
+								filters: { paginate:false }
+							},
+							success: function(data, status) {
+								callback && callback(data.data);
+							}
+						});
+					},
+					editEntity: 'callflows.directory.edit'
+				}
+			});
+		},
+
+		directoryList: function(callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'directory.list',
+				data: {
+					accountId: self.accountId,
+					filters: { paginate:false }
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		directoryGet: function(directoryId, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'directory.get',
+				data: {
+					accountId: self.accountId,
+					directoryId: directoryId
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		directoryCreate: function(data, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'directory.create',
+				data: {
+					accountId: self.accountId,
+					data: data
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		directoryUpdate: function(data, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'directory.update',
+				data: {
+					accountId: self.accountId,
+					directoryId: data.id,
+					data: data
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		directoryDelete: function(directoryId, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'directory.delete',
+				data: {
+					accountId: self.accountId,
+					directoryId: directoryId
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		}
+	};
+
+	return app;
+});

src/apps/callflows/submodules/faxbox/faxbox.css

@@ -0,0 +1,18 @@
+.callflows-port form .input a {
+	color: #05ADDC;
+	font-size: 13px;
+	line-height: 30px;
+}
+
+.callflows-port #faxbox-form .tooltip {
+	display: inline-block;
+	float: none;
+	margin-left: 5px;
+}
+
+.callflows-port #faxbox-form span.text {
+	color: #22a5ff;
+	font-size: 13px;
+	font-weight: bold;
+	line-height: 30px;
+}

src/apps/callflows/submodules/faxbox/faxbox.js

@@ -0,0 +1,680 @@
+define(function(require){
+	var $ = require('jquery'),
+		_ = require('underscore'),
+		monster = require('monster'),
+		timezone = require('monster-timezone');
+
+	var app = {
+		requests: {},
+
+		subscribe: {
+			'callflows.fetchActions': 'faxboxDefineActions',
+			'callflows.faxbox.edit': '_faxboxEdit'
+		},
+
+		faxboxDefineActions: function(args) {
+			var self = this,
+				callflow_nodes = args.actions;
+
+			$.extend(callflow_nodes, {
+				'faxbox[id=*]': {
+					name: self.i18n.active().callflows.faxbox.faxboxes_label,
+					icon: 'printer2',
+					category: self.i18n.active().oldCallflows.advanced_cat,
+					module: 'faxbox',
+					tip: self.i18n.active().callflows.faxbox.faxbox_tip,
+					data: {
+					},
+					rules: [
+						{
+							type: 'quantity',
+							maxSize: '1'
+						}
+					],
+					isUsable: 'true',
+					weight: 130,
+					caption: function(node, caption_map) {
+						var id = node.getMetadata('id'),
+							returned_value = '';
+
+						if(id in caption_map) {
+							returned_value = caption_map[id].name;
+						}
+
+						return returned_value;
+					},
+					edit: function(node, callback) {
+						var _this = this;
+
+						self.faxboxList(function(data, status) {
+							var popup_html = $(monster.template(self, 'faxbox-callflowEdit', {
+									items: _.sortBy(data, 'name'),
+									selected: node.getMetadata('id') || ''
+								})),
+								popup;
+
+							if($('#faxbox_selector option:selected', popup_html).val() == undefined) {
+								$('#edit_link', popup_html).hide();
+							}
+
+							$('.inline_action', popup_html).click(function(ev) {
+								var _data = ($(this).data('action') == 'edit') ?
+												{ id: $('#faxbox_selector', popup_html).val() } : {};
+
+								ev.preventDefault();
+
+								self.faxboxPopupEdit({
+									data: _data,
+									callback: function(_data) {
+										node.setMetadata('id', _data.id || 'null');
+
+										node.caption = _data.name || '';
+
+										popup.dialog('close');
+									}
+								});
+							});
+
+							$('#add', popup_html).click(function() {
+								node.setMetadata('id', $('#faxbox_selector', popup_html).val());
+
+								node.caption = $('#faxbox_selector option:selected', popup_html).text();
+
+								popup.dialog('close');
+							});
+
+							popup = monster.ui.dialog(popup_html, {
+								title: self.i18n.active().callflows.faxbox.voicemail_title,
+								minHeight: '0',
+								beforeClose: function() {
+									if(typeof callback == 'function') {
+										callback();
+									}
+								}
+							});
+						});
+					},
+					listEntities: function(callback) {
+						self.callApi({
+							resource: 'faxbox.list',
+							data: {
+								accountId: self.accountId,
+								filters: { paginate:false }
+							},
+							success: function(data, status) {
+								callback && callback(data.data);
+							}
+						});
+					},
+					editEntity: 'callflows.faxbox.edit'
+				}
+			});
+		},
+
+		faxboxPopupEdit: function(args) {
+			var self = this,
+				popup_html = popup_html = $('<div class="inline_popup callflows-port"><div class="inline_content main_content"/></div>'),
+				data = args.data,
+				callback = args.callback,
+				data_defaults = args.data_defaults || {},
+				popup;
+
+			self.faxboxEdit(data, popup_html, $('.inline_content', popup_html), {
+				save_success: function(_data) {
+					popup.dialog('close');
+
+					if ( typeof callback == 'function' ) {
+						callback(_data);
+					}
+				},
+				delete_success: function() {
+					popup.dialog('close');
+
+					if ( typeof callback == 'function' ) {
+						callback({ data: {} });
+					}
+				},
+				after_render: function() {
+					popup = monster.ui.dialog(popup_html, {
+						title: self.i18n.active().callflows.faxbox[(data.id ? 'edit' : 'create').concat('_faxbox')]
+					});
+				}
+			}, data_defaults);
+		},
+
+		// Added for the subscribed event to avoid refactoring faxboxEdit
+		_faxboxEdit: function(args) {
+			var self = this;
+			self.faxboxEdit(args.data, args.parent, args.target, args.callbacks, args.data_defaults);
+		},
+
+		faxboxEdit: function(data, _parent, _target, _callbacks) {
+			var self = this,
+				parent = _parent || $('#faxbox-content'),
+				target = _target || $('#faxbox-view', parent),
+				_callbacks = _callbacks || {},
+				callbacks = {
+					save_success: _callbacks.save_success || function(_data) {
+							self.faxboxRenderList(parent);
+
+							self.faxboxEdit({ id: _data.id }, parent, target, callbacks);
+					},
+					delete_success: _callbacks.delete_success || function() {
+						target.empty();
+
+						self.faxboxRenderList(parent);
+					},
+					delete_error: _callbacks.delete_error,
+					after_render: _callbacks.after_render
+				};
+
+			monster.parallel({
+					faxbox: function(callback) {
+						if (typeof data === 'object' && data.id) {
+							self.faxboxGet(data.id, function(_data, status) {
+								_data.id = data.id;
+
+								callback(null, _data);
+							});
+						} else {
+							callback(null, {});
+						}
+					},
+					user_list: function(callback) {
+						self.callApi({
+							resource: 'user.list',
+							data: {
+								accountId: self.accountId,
+								filters: { paginate:false }
+							},
+							success: function(_data, status) {
+								_data.data.sort(function(a, b){
+									if(a.hasOwnProperty('first_name') && a.hasOwnProperty('last_name') && b.hasOwnProperty('first_name') && b.hasOwnProperty('last_name')) {
+										return a.first_name.concat(' ', a.last_name).toLowerCase() > b.first_name.concat(' ', b.last_name).toLowerCase() ? 1 : -1;
+									}
+									else {
+										return 1;
+									}
+								});
+
+								_data.data.unshift({
+									id: '',
+									first_name: self.i18n.active().callflows.faxbox.no,
+									last_name: self.i18n.active().callflows.faxbox.owner
+								});
+
+								callback(null, _data.data);
+							}
+						});
+					},
+					current_user: function(callback) {
+						if (!monster.util.isMasquerading()) {
+							self.faxboxGetUser(self.userId, function(_data, status) {
+								callback(null, _data);
+							});
+						}
+						else {
+							callback(null, {});
+						}
+					}
+				},
+				function(err, results) {
+					if (!data.hasOwnProperty('id')) {
+						if (_.size(results.current_user) === 0) {
+							results.faxbox = $.extend(true, self.faxboxGetDefaultSettings(), results.faxbox);
+						}
+						else {
+							results.faxbox = $.extend(true, self.faxboxGetDefaultSettings(results.current_user), results.faxbox);
+						}
+					}
+
+					delete results.current_user;
+
+					self.faxboxRender(results, target, callbacks);
+
+					if (typeof callbacks.after_render === 'function') {
+						callbacks.after_render();
+					}
+				}
+			);
+		},
+
+		faxboxRender: function(data, target, callbacks) {
+			var self = this,
+				faxbox_html = $(monster.template(self, 'faxbox-edit', {
+					faxbox: self.faxboxNormalizedData(data.faxbox),
+					users: data.user_list
+				}));
+
+			timezone.populateDropdown($('#fax_timezone', faxbox_html), data.faxbox.fax_timezone||'inherit', {inherit: self.i18n.active().defaultTimezone});
+
+			$('*[rel=popover]:not([type="text"])', faxbox_html).popover({
+				trigger: 'hover'
+			});
+
+			$('*[rel=popover][type="text"]', faxbox_html).popover({
+				trigger: 'focus'
+			});
+
+			self.winkstartTabs(faxbox_html);
+
+			if (!data.faxbox.hasOwnProperty('id')) {
+				$('#owner_id', faxbox_html).change(function(ev) {
+					if ($(this).val()) {
+						self.faxboxGetUser($(this).val(),function(_data, status) {
+							data.faxbox = self.faxboxGetDefaultSettings(_data);
+							$('#edit_link', faxbox_html).show();
+							self.faxboxRender(data, target, callbacks);
+						});
+					} else {
+						data.faxbox = self.faxboxGetDefaultSettings();
+						$('#edit_link', faxbox_html).hide();
+						self.faxboxRender(data, target, callbacks);
+					}
+				});
+			}
+			else {
+				$('#owner_id', faxbox_html).change(function(ev) {
+					var currentFaxbox = monster.ui.getFormData('faxbox_form');
+
+					if ($(this).val()) {
+						$('[id$="bound_notification_email"]', faxbox_html).each(function(idx, el) {
+							$(el).attr('disabled', true);
+						});
+
+						self.faxboxGetUser($(this).val(), function(_data, status) {
+							data.faxbox = $.extend(true, {}, self.faxboxGetDefaultSettings(), data.faxbox, currentFaxbox, {
+								cloud_connector_claim_url: faxbox_html.find('#cloud_connector_claim_url').attr('href'),
+								notifications: {
+									inbound: {
+										email: {
+											send_to: _data.email || _data.username
+										}
+									},
+									outbound: {
+										email: {
+											send_to: _data.email || _data.username
+										}
+									}
+								}
+							});
+
+							$('#edit_link', faxbox_html).hide();
+							self.faxboxRender(data, target, callbacks);
+						});
+					}
+					else {
+						$('[id$="bound_notification_email"]', faxbox_html).each(function(idx, el) {
+							$(el).attr('disabled', false);
+						});
+					}
+				});
+			}
+
+			if(!$('#owner_id', faxbox_html).val()) {
+				$('#edit_link', faxbox_html).hide();
+			}
+
+			$('.inline-action', faxbox_html).click(function(ev) {
+				var _data = $(this).data('action') == 'edit' ? { id: $('#owner_id', faxbox_html).val() } : {},
+					_id = _data.id;
+
+				monster.pub('callflows.user.popupEdit', {
+					data: _data,
+					callflow: function(_data) {
+						/* Create */
+						if(!_id) {
+							$('#owner_id', faxbox_html).append('<option id="'+ _data.id  +'" value="'+ _data.id +'">'+ _data.first_name + ' ' + _data.last_name  +'</option>')
+							$('#owner_id', faxbox_html).val(_data.id);
+						}
+						else {
+							/* Update */
+							if('id' in _data) {
+								$('#owner_id #'+_data.id, faxbox_html).text(_data.first_name + ' ' + _data.last_name);
+							}
+							/* Delete */
+							else {
+								$('#owner_id #'+_id, faxbox_html).remove();
+							}
+						}
+					}
+				});
+			});
+
+			$('#caller_id', faxbox_html).change(function(ev) {
+				var number = $(this).val(),
+					fax_identity = $('#fax_identity', faxbox_html);
+
+				if (/^(\+1|1)([0-9]{10})$|^([0-9]{10})$/.test(number)) {
+					if (/^(\+1)/.test(number)) {
+						fax_identity.val(number.replace(/^\+1([0-9]{3})([0-9]{3})([0-9]{4})$/, '+1 ($1) $2-$3'));
+					} else if (/^1([0-9]{10})$/.test(number)) {
+						fax_identity.val(number.replace(/^1([0-9]{3})([0-9]{3})([0-9]{4})$/, '+1 ($1) $2-$3'));
+					} else  {
+						fax_identity.val(number.replace(/^([0-9]{3})([0-9]{3})([0-9]{4})$/, '+1 ($1) $2-$3'));
+					}
+				} else {
+					fax_identity.val('');
+				}
+			});
+
+			$('.faxbox-save', faxbox_html).click(function(ev) {
+				ev.preventDefault();
+
+				var form_html = $('#faxbox_form', faxbox_html),
+					form_data = monster.ui.getFormData('faxbox_form'),
+					word_reg = /^[\w\s'-]+/
+
+				monster.ui.validate(form_html, {
+					rules: {
+						name: {
+							required: true
+						},
+						'caller_name': {
+							regex: word_reg
+						},
+						'fax_header': {
+							regex: word_reg
+						},
+						retries: {
+							regex: /^[0-4]/
+						}
+					},
+					messages: {
+						'caller_name': {
+							regex: self.i18n.active().callflows.faxbox.validation.words
+						},
+						'fax_header': {
+							regex: self.i18n.active().callflows.faxbox.validation.words
+						},
+						retries: {
+							regex: 'Please enter a numeric value between 0 and 4'
+						}
+					}
+				});
+
+				var $this = $(this);
+
+				if(!$this.hasClass('disabled')) {
+					$this.addClass('disabled');
+
+					if (monster.ui.valid(form_html)) {
+						self.faxboxSave(form_data, data.faxbox, function(data) {
+							$this.removeClass('disabled');
+							callbacks && callbacks.hasOwnProperty('save_success') && callbacks.save_success(data);
+						}, function(data) {
+							$this.removeClass('disabled');
+						});
+					}
+					else {
+						$this.removeClass('disabled');
+					}
+				}
+			});
+
+			$('.faxbox-delete', faxbox_html).click(function(ev) {
+				ev.preventDefault();
+
+				monster.ui.confirm(self.i18n.active().callflows.faxbox.are_you_sure_you_want_to_delete, function() {
+					self.faxboxDelete(data.faxbox, callbacks.delete_success, callbacks.delete_error);
+				});
+			});
+
+			target
+				.empty()
+				.append(faxbox_html);
+		},
+
+		faxboxRenderList: function(parent) {
+			var self = this;
+
+			self.faxboxList(function(data, status) {
+				var map_crossbar_data = function(data) {
+					var new_list = [];
+
+					if(data.length > 0) {
+						$.each(data, function(key, val) {
+							new_list.push({
+								id: val.id,
+								title: val.name || self.i18n.active().callflows.faxbox.no_name
+							});
+						});
+					}
+
+					new_list.sort(function(a, b) {
+						return a.title.toLowerCase() < b.title.toLowerCase() ? -1 : 1;
+					});
+
+					return new_list;
+				};
+			});
+		},
+
+		faxboxGetDefaultSettings: function(user) {
+			var self = this,
+				default_faxbox = {
+					name: '',
+					caller_name: '',
+					fax_header: '',
+					fax_timezone: 'inherit',
+					retries: 1,
+					notifications: {
+						inbound: {
+							email: {
+								send_to: ''
+							}
+						},
+						outbound: {
+							email: {
+								send_to: ''
+							}
+						}
+					}
+				};
+
+			if (typeof user === 'undefined') {
+				return default_faxbox;
+			} else {
+				return $.extend(true, {}, default_faxbox, {
+							name: user.first_name.concat(' ', user.last_name, self.i18n.active().callflows.faxbox.default_settings_name_extension),
+							caller_name: user.first_name.concat(' ', user.last_name),
+							fax_header: monster.config.whitelabel.companyName.concat(self.i18n.active().callflows.faxbox.default_settings_header_extension),
+							owner_id: user.id,
+							notifications: {
+								inbound: {
+									email: {
+										send_to: user.email || user.username
+									}
+								},
+								outbound: {
+									email: {
+										send_to: user.email || user.username
+									}
+								}
+							}
+						}
+					);
+			}
+		},
+
+		faxboxSave: function(form_data, data, success, error) {
+			var self = this,
+				normalized_data = self.faxboxNormalizedData($.extend(true, {}, data, form_data));
+
+			if(typeof data == 'object' && data.id) {
+				self.faxboxUpdate(normalized_data, function(_data, status) {
+						if(typeof success == 'function') {
+							success(_data, status, 'update');
+						}
+					},
+					function(_data, status) {
+						if(typeof error == 'function') {
+							error(_data, status, 'update');
+						}
+					}
+				);
+			} else {
+				self.faxboxCreate(normalized_data, function(_data, status) {
+						if(typeof success == 'function') {
+							success(_data, status, 'create');
+						}
+					},
+					function(_data, status) {
+						if(typeof error == 'function') {
+							error(_data, status, 'create');
+						}
+					}
+				);
+			}
+		},
+
+		faxboxNormalizedData: function(form_data) {
+			if (form_data.hasOwnProperty('notifications')) {
+				if (form_data.notifications.hasOwnProperty('inbound') && form_data.notifications.inbound.hasOwnProperty('email') && form_data.notifications.inbound.email.hasOwnProperty('send_to') && form_data.notifications.inbound.email.send_to.length) {
+					var inbound = form_data.notifications.inbound.email.send_to;
+					form_data.notifications.inbound.email.send_to = inbound instanceof Array ? inbound.join(',') : inbound.replace(/\s/g, '').split(',');
+				} else {
+					delete form_data.notifications.inbound.email.send_to;
+				}
+
+				if (form_data.notifications.hasOwnProperty('outbound') && form_data.notifications.outbound.hasOwnProperty('email') && form_data.notifications.outbound.email.hasOwnProperty('send_to') && form_data.notifications.outbound.email.send_to.length) {
+					var outbound = form_data.notifications.outbound.email.send_to;
+					form_data.notifications.outbound.email.send_to = outbound instanceof Array ? outbound.join(',') : outbound.replace(/\s/g, '').split(',');
+				} else {
+					delete form_data.notifications.outbound.email.send_to;
+				}
+			}
+
+			if (form_data.hasOwnProperty('smtp_permission_list')) {
+				if (form_data.smtp_permission_list === '') {
+					delete form_data.smtp_permission_list;
+				} else {
+					var list = form_data.smtp_permission_list;
+
+					form_data.smtp_permission_list  = list instanceof Array ? list.join(',') : list.replace(/\s/g, '').split(',');
+				}
+			}
+
+			if (form_data.hasOwnProperty('custom_smtp_email_address') && form_data.custom_smtp_email_address === '') {
+				delete form_data.custom_smtp_email_address;
+			}
+
+			if (form_data.hasOwnProperty('owner_id') && form_data.owner_id === '') {
+				delete form_data.owner_id;
+			}
+
+			if(form_data.fax_timezone && form_data.fax_timezone === 'inherit') {
+				delete form_data.fax_timezone;
+			}
+
+			return form_data;
+		},
+
+		faxboxList: function(callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'faxbox.list',
+				data: {
+					accountId: self.accountId,
+					filters: { paginate:false }
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		faxboxGet: function(faxboxId, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'faxbox.get',
+				data: {
+					accountId: self.accountId,
+					faxboxId: faxboxId
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		faxboxCreate: function(data, callback, error) {
+			var self = this;
+
+			self.callApi({
+				resource: 'faxbox.create',
+				data: {
+					accountId: self.accountId,
+					data: data
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				},
+				error: function(data) {
+					error && error(data.data);
+				}
+			});
+		},
+
+		faxboxUpdate: function(data, callback, error) {
+			var self = this;
+
+			self.callApi({
+				resource: 'faxbox.update',
+				data: {
+					accountId: self.accountId,
+					faxboxId: data.id,
+					data: data
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				},
+				error: function(data) {
+					error && error(data.data);
+				}
+			});
+		},
+
+		faxboxDelete: function(data, callbackSuccess, callbackError) {
+			var self = this;
+
+			if (typeof data === 'object' && data.hasOwnProperty('id')) {
+				self.callApi({
+					resource: 'faxbox.delete',
+					data: {
+						accountId: self.accountId,
+						faxboxId: data.id
+					},
+					success: function(data) {
+						callbackSuccess && callbackSuccess(data.data);
+					},
+					error: function(error) {
+						callbackError && callbackError();
+					}
+				});
+			}
+		},
+
+		faxboxGetUser: function(userId, callbackSuccess, callbackError) {
+			var self = this;
+
+			self.callApi({
+				resource: 'user.get',
+				data: {
+					accountId: self.accountId,
+					userId: userId
+				},
+				success: function(data, status) {
+					callbackSuccess && callbackSuccess(data.data);
+				},
+				error: function(data, status) {
+					callbackError && callbackError();
+				}
+			});
+		}
+	};
+
+	return app;
+});

src/apps/callflows/submodules/featurecodes/featurecodes.css

@@ -0,0 +1,48 @@
+#featurecode_view form {
+	background-color: #f0f0f9;
+	border: 1px solid #909099;
+	border-radius: 2px;
+	margin: auto;
+	max-width: 1080px;
+	min-width: 400px;
+	padding: 20px;
+}
+
+#featurecode_view .action-bar {
+	border-top: 1px solid #c0c0c9;
+	margin-top: 40px;
+	padding-top: 20px;
+}
+
+
+#featurecode_view .add-on .featurecode_enabled {
+	margin-top: 0;
+}
+
+#featurecode_view .add-on.empty {
+	border: 1px solid #dadada;
+}
+
+#featurecode_view .input-append {
+	display: inline-block;
+}
+
+#featurecode_view .edit-configuration-link {
+	margin-left: 10px;
+}
+
+#parking_settings_popup {
+	width: 450px;
+}
+
+#parking_settings_popup form {
+	margin: 0;
+}
+
+#parking_settings_popup form .controls > * {
+	display: block;
+}
+
+#parking_settings_popup label.monster-invalid {
+	margin-top: 0;
+}

src/apps/callflows/submodules/featurecodes/featurecodes.js

@@ -0,0 +1,983 @@
+define(function(require){
+	var $ = require('jquery'),
+		_ = require('underscore'),
+		monster = require('monster'),
+		toastr = require('toastr');
+
+	var app = {
+		requests: {},
+
+		subscribe: {
+			'callflows.featurecode.render': 'featureCodeRender'
+		},
+
+		featureCodeRender: function(pContainer) {
+			var self = this,
+				container = pContainer || $('.callflow-edition');
+
+			self.featureCodeGetData(function(featureCodes) {
+				var formattedData = self.featureCodeFormatData(featureCodes),
+					template = $(monster.template(self, 'featurecodes-view', formattedData));
+
+				self.featureCodeBindEvents(template, formattedData.actions);
+
+				container.empty()
+						 .append(template);
+			});
+		},
+
+		featureCodeGetData: function(callback) {
+			var self = this;
+
+			self.featureCodeList(function(data) {
+				callback && callback(data);
+			});
+		},
+
+		featureCodeFormatData: function(data) {
+			var self = this,
+				actions = {},
+				categories = {},
+				formattedData = {
+					categories: {},
+					actions: {}
+				};
+
+			self.featureCodesDefine(actions);
+
+			_.each(data, function(callflow) {
+				if (callflow.hasOwnProperty('featurecode') && callflow.featurecode !== false) {
+					if (actions.hasOwnProperty(callflow.featurecode.name)) {
+						actions[callflow.featurecode.name].id = callflow.id;
+						actions[callflow.featurecode.name].enabled = true;
+						actions[callflow.featurecode.name].number = callflow.featurecode.number.replace('\\', '');
+					}
+				}
+			});
+
+			$.each(actions, function(i, action) {
+				this.tag = i;
+				this.number = typeof action.number === 'undefined' ? action.default_number : action.number;
+				this.hasConfig = this.hasOwnProperty('editConfiguration');
+
+				if (action.hasOwnProperty('category')) {
+					categories[action.category] = categories[action.category] || [];
+					categories[action.category].push(action);
+				}
+			});
+
+			formattedData.categories = categories;
+			formattedData.actions = actions;
+
+			return formattedData;
+		},
+
+		featureCodeBindEvents: function(template, actions) {
+			var self = this;
+
+			monster.ui.tooltips(template);
+
+			template.find('.featurecode_enabled').each(function() {
+				var action_wrapper = $(this).parents('.action_wrapper'),
+					number_field = action_wrapper.find('.featurecode-number');
+
+				!$(this).is(':checked') ? $(number_field).attr('disabled', '') : $(number_field).removeAttr('disabled');
+			});
+
+			template.find('.featurecode-number').on('blur keyup focus', function() {
+				var action_wrapper = $(this).parents('.action_wrapper');
+
+				action_wrapper.data('number', $(this).val());
+
+				$(this).val() !== actions[action_wrapper.data('action')].number ? action_wrapper.addClass('changed') : action_wrapper.removeClass('changed');
+			});
+
+			template.find('.featurecode_enabled').on('change', function() {
+			//$('.featurecode_enabled', template).change(function() {
+				var $this = $(this),
+					action_wrapper = $this.parents('.action_wrapper'),
+					number_field = action_wrapper.find('.featurecode-number');
+
+				if(!$this.is(':checked') && action_wrapper.data('enabled') === true) {
+					action_wrapper.addClass('disabled');
+				} else if($this.is(':checked') && action_wrapper.data('enabled') === false){
+					action_wrapper.addClass('enabled');
+				} else {
+					action_wrapper.removeClass('enabled');
+					action_wrapper.removeClass('disabled');
+				}
+
+				!$this.is(':checked') ? number_field.attr('disabled', '') : number_field.removeAttr('disabled');
+			});
+
+			template.find('.featurecode-save').on('click', function(e) {
+				var $this = $(this);
+				e.preventDefault();
+				if(!$this.hasClass('disabled')) {
+					var formData = self.featureCodeCleanFormData(template, actions);
+
+					$this.addClass('disabled');
+
+					self.featureCodeMassUpdate(formData, function() {
+						toastr.success(self.i18n.active().callflows.featureCodes.successUpdate);
+						$this.removeClass('disabled');
+
+						self.featureCodeRender();
+					},
+					function() {
+						$this.removeClass('disabled');
+					});
+				}
+			});
+
+			_.each(actions, function(item) {
+				if (item.hasOwnProperty('editConfiguration')) {
+					template.find('[data-id="' + item.id + '"] .edit-configuration-link').on('click', function() {
+						item.editConfiguration();
+					});
+				}
+			});
+		},
+
+		featureCodeList: function(callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'callflow.list',
+				data: {
+					accountId: self.accountId,
+					filters: {
+						paginate: false
+					}
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		featureCodeGet: function(id, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'callflow.get',
+				data: {
+					accountId: self.accountId,
+					callflowId: id
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		featureCodeCleanFormData: function(template, actions) {
+			var self = this,
+				form_data = {
+					created_callflows: [],
+					deleted_callflows: [],
+					updated_callflows: []
+				};
+
+			template.find('.enabled').each(function() {
+				var callflow = $(this).data();
+
+				// Casting in String, as back-end requires a String
+				callflow.number += '';
+
+				callflow.flow = {
+					data: actions[callflow.action].data,
+					module: actions[callflow.action].module,
+					children: {}
+				};
+
+			/*	if(callflow.type === 'number') { callflow.type = 'numbers'}
+				if(callflow.type === 'pattern') { callflow.type = 'patterns'}*/
+
+				/* if a star is in the pattern, then we need to escape it */
+				if(callflow.type === 'patterns' && typeof callflow.number === 'string') {
+					callflow.number = callflow.number.replace(/([*])/g,'\\$1');
+				}
+
+				callflow[callflow.type] = [actions[callflow.action].build_regex(callflow.number)];
+				form_data.created_callflows.push(callflow);
+			});
+
+
+			template.find('.disabled').each(function() {
+				var callflow = $(this).data();
+
+				callflow.number += '';
+
+				form_data.deleted_callflows.push(callflow);
+			});
+
+			template.find('.changed:not(.enabled, .disabled)').each(function() {
+				if($(this).data('enabled')) {
+					var callflow = $(this).data();
+
+					// Casting in String, as back-end requires a String
+					callflow.number += '';
+
+					callflow.flow = {
+						data: actions[callflow.action].data,
+						module: actions[callflow.action].module,
+						children: {}
+					};
+
+					/* if a star is in the pattern, then we need to escape it */
+					if(callflow.type === 'patterns') {
+						callflow.number = callflow.number.replace(/([*])/g,'\\$1');
+					}
+
+					callflow[callflow.type] = [actions[callflow.action].build_regex(callflow.number)];
+
+					form_data.updated_callflows.push(callflow);
+				}
+			});
+
+			return form_data;
+		},
+
+		featureCodeCreate: function(data, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'callflow.create',
+				data: {
+					accountId: self.accountId,
+					data: data
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		featureCodeDelete: function(callflowId, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'callflow.delete',
+				data: {
+					accountId: self.accountId,
+					callflowId: callflowId
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		featureCodeUpdate: function(callflowId, data, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'callflow.update',
+				data: {
+					accountId: self.accountId,
+					callflowId: callflowId,
+					data: data
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		featureCodeMassUpdate: function(form_data, callback, errorCallback) {
+			var self = this,
+				count = form_data.created_callflows.length + form_data.deleted_callflows.length + form_data.updated_callflows.length;
+
+			if(count) {
+				var parallelRequests = {};
+
+				_.each(form_data.created_callflows, function(callflow) {
+					parallelRequests['create_' + callflow.action] = function(callback) {
+						var dataCallflow = {
+							flow: callflow.flow,
+							patterns: callflow.patterns,
+							numbers: callflow.numbers,
+							featurecode: {
+								name: callflow.action,
+								number: callflow.number
+							}
+						};
+
+						self.featureCodeCreate(dataCallflow, function(data) {
+							callback && callback(null, data);
+						});
+					};
+				});
+
+				_.each(form_data.updated_callflows, function(callflow) {
+					parallelRequests['update_' + callflow.action] = function(callback) {
+						var dataCallflow = {
+							flow: callflow.flow,
+							patterns: callflow.patterns,
+							numbers: callflow.numbers,
+							featurecode: {
+								name: callflow.action,
+								number: callflow.number
+							}
+						};
+
+						self.featureCodeUpdate(callflow.id, dataCallflow, function(data) {
+							callback && callback(null, data);
+						});
+					};
+				});
+
+				_.each(form_data.deleted_callflows, function(callflow) {
+					parallelRequests['delete_' + callflow.action] = function(callback) {
+						self.featureCodeDelete(callflow.id, function(data) {
+							callback && callback(null, data);
+						});
+					};
+				});
+
+				monster.parallel(parallelRequests, function(err, results) {
+					callback && callback();
+				});
+			}
+			else {
+				errorCallback && errorCallback();
+				toastr.error(self.i18n.active().callflows.featureCodes.nothing_to_save);
+			}
+		},
+
+		featureCodesDefine: function(featurecodes) {
+			var self = this;
+
+			$.extend(featurecodes, {
+				'call_forward[action=activate]': {
+					name: self.i18n.active().callflows.featureCodes.enable_call_forward,
+					icon: 'phone',
+					category: self.i18n.active().callflows.featureCodes.call_forward_cat,
+					module: 'call_forward',
+					number_type: 'numbers',
+					data: {
+						action: 'activate'
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '72',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '*'+number;
+					}
+				},
+				'call_forward[action=deactivate]': {
+					name: self.i18n.active().callflows.featureCodes.disable_call_forward,
+					icon: 'phone',
+					category: self.i18n.active().callflows.featureCodes.call_forward_cat,
+					module: 'call_forward',
+					number_type: 'numbers',
+					data: {
+						action: 'deactivate'
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '73',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '*'+number;
+					}
+				},
+				'call_forward[action=toggle]': {
+					name: self.i18n.active().callflows.featureCodes.toggle_call_forward,
+					icon: 'phone',
+					category: self.i18n.active().callflows.featureCodes.call_forward_cat,
+					module: 'call_forward',
+					number_type: 'patterns',
+					data: {
+						action: 'toggle'
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '74',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '^\\*'+number+'([0-9]*)$';
+					}
+				},
+				'call_forward[action=update]': {
+					name: self.i18n.active().callflows.featureCodes.update_call_forward,
+					icon: 'phone',
+					category: self.i18n.active().callflows.featureCodes.call_forward_cat,
+					module: 'call_forward',
+					number_type: 'numbers',
+					data: {
+						action: 'update'
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '56',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '*'+number;
+					}
+				},
+
+				'hotdesk[action=login]': {
+					name: self.i18n.active().callflows.featureCodes.enable_hot_desking,
+					icon: 'phone',
+					category: self.i18n.active().callflows.featureCodes.hot_desking_cat,
+					module: 'hotdesk',
+					number_type: 'numbers',
+					data: {
+						action: 'login'
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '11',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '*'+number;
+					}
+				},
+				'hotdesk[action=logout]': {
+					name: self.i18n.active().callflows.featureCodes.disable_hot_desking,
+					icon: 'phone',
+					category: self.i18n.active().callflows.featureCodes.hot_desking_cat,
+					module: 'hotdesk',
+					number_type: 'numbers',
+					data: {
+						action: 'logout'
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '12',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '*'+number;
+					}
+				},
+				'hotdesk[action=toggle]': {
+					name: self.i18n.active().callflows.featureCodes.toggle_hot_desking,
+					icon: 'phone',
+					category: self.i18n.active().callflows.featureCodes.hot_desking_cat,
+					module: 'hotdesk',
+					number_type: 'numbers',
+					data: {
+						action: 'toggle'
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '13',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '*'+number;
+					}
+				},
+				'voicemail[action=check]': {
+					name: self.i18n.active().callflows.featureCodes.check_voicemail,
+					icon: 'phone',
+					category: self.i18n.active().callflows.featureCodes.miscellaneous_cat,
+					module: 'voicemail',
+					number_type: 'patterns',
+					data: {
+						action: 'check'
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '97',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '^\\*'+number+'([0-9]*)$';
+					}
+				},
+				'voicemail[single_mailbox_login]': {
+					name: self.i18n.active().callflows.featureCodes.single_mailbox_login,
+					icon: 'phone',
+					category: self.i18n.active().callflows.featureCodes.miscellaneous_cat,
+					module: 'voicemail',
+					number_type: 'patterns',
+					data: {
+						action: 'check',
+						single_mailbox_login: true
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '98',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '^\\*'+number+'([0-9]*)$';
+					}
+				},
+				'voicemail[action="direct"]': {
+					name: self.i18n.active().callflows.featureCodes.direct_to_voicemail,
+					category: self.i18n.active().callflows.featureCodes.miscellaneous_cat,
+					module: 'voicemail',
+					number_type: 'patterns',
+					data: {
+						action: 'compose'
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '*',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '^\\*'+number+'([0-9]*)$';
+					}
+				},
+				'intercom': {
+					name: self.i18n.active().callflows.featureCodes.intercom,
+					icon: 'phone',
+					category: self.i18n.active().callflows.featureCodes.miscellaneous_cat,
+					module: 'intercom',
+					number_type: 'patterns',
+					data: {
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '0',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '^\\*'+number+'([0-9]*)$';
+					}
+				},
+				'privacy[mode=full]': {
+					name: self.i18n.active().callflows.featureCodes.privacy,
+					icon: 'phone',
+					category: self.i18n.active().callflows.featureCodes.miscellaneous_cat,
+					module: 'privacy',
+					number_type: 'patterns',
+					data: {
+						mode: 'full'
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '67',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '^\\*'+number+'([0-9]*)$';
+					}
+				},
+				'park_and_retrieve': {
+					name: self.i18n.active().callflows.featureCodes.park_and_retrieve,
+					icon: 'phone',
+					category: self.i18n.active().callflows.featureCodes.parking_cat,
+					module: 'park',
+					number_type: 'patterns',
+					data: {
+						action: 'auto'
+					},
+					enabled: false,
+					hasStar: true,
+					editConfiguration: function() {
+						self.featureCodesEditParkingParkAndRetrieve(this);
+					},
+					default_number: '3',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '^\\*'+number+'([0-9]*)$';
+					}
+				},
+				'valet': {
+					name: self.i18n.active().callflows.featureCodes.valet,
+					icon: 'phone',
+					category: self.i18n.active().callflows.featureCodes.parking_cat,
+					module: 'park',
+					number_type: 'numbers',
+					data: {
+						action: 'park'
+					},
+					enabled: false,
+					hasStar: true,
+					editConfiguration: function() {
+						self.featureCodesEditParkingValet(this);
+					},
+					default_number: '4',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '*'+number;
+					}
+				},
+				'retrieve': {
+					name: self.i18n.active().callflows.featureCodes.retrieve,
+					icon: 'phone',
+					category: self.i18n.active().callflows.featureCodes.parking_cat,
+					module: 'park',
+					number_type: 'patterns',
+					data: {
+						action: 'retrieve'
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '5',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '^\\*'+number+'([0-9]*)$';
+					}
+				},
+				'move': {
+					name: self.i18n.active().callflows.featureCodes.callMove,
+					icon: 'phone',
+					category: self.i18n.active().callflows.featureCodes.miscellaneous_cat,
+					module: 'move',
+					number_type: 'numbers',
+					data: {
+					},
+					enabled: false,
+					hasStar: false,
+					default_number: '6683',
+					number: this.default_number,
+					build_regex: function(number) {
+						return number;
+					}
+				},
+				/*'call_forward[action=on_busy_enable]': {
+					name: 'Enable Call-Forward on Busy',
+					icon: 'phone',
+					category: 'Call-Forward',
+					module: 'call_forward',
+					number_type: 'patterns',
+					data: {
+						action: 'on_busy_enable'
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '90',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '^\\*'+number+'([0-9]*)$';
+					}
+				},
+				'call_forward[action=on_busy_disable]': {
+					name: 'Disable Call-Forward on Busy',
+					icon: 'phone',
+					category: 'Call-Forward',
+					module: 'call_forward',
+					number_type: 'numbers',
+					data: {
+						action: 'on_busy_disable'
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '91',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '*'+number;
+					}
+				},
+				'call_forward[action=no_answer_enable]': {
+					name: 'Enable Call-Forward No Answer',
+					icon: 'phone',
+					category: 'Call-Forward',
+					module: 'call_forward',
+					number_type: 'patterns',
+					data: {
+						action: 'no_answer_enable'
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '53',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '^\\*'+number+'([0-9]*)$';
+					}
+				},
+				'call_forward[action=no_answer_disable]': {
+					name: 'Disable Call-Forward No Answer',
+					icon: 'phone',
+					category: 'Call-Forward',
+					module: 'call_forward',
+					number_type: 'numbers',
+					data: {
+						action: 'no_answer_disable'
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '52',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '*'+number;
+					}
+				},
+				'donotdisturb[action="enable"]': {
+					name: 'Enable Do not disturb',
+					icon: 'phone',
+					category: 'Do not disturb',
+					module: 'do_not_disturb',
+					number_type: 'patterns',
+					data: {
+						action: 'enable'
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '78',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '^\\*'+number+'([0-9]*)$';
+					}
+				},
+				'donotdisturb[action="disable"]': {
+					name: 'Disable Do not disturb',
+					icon: 'phone',
+					category: 'Do not disturb',
+					module: 'do_not_disturb',
+					number_type: 'numbers',
+					data: {
+						action: 'disable'
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '79',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '*'+number;
+					}
+				},
+				'donotdisturb[action="toggle"]': {
+					name: 'Toggle Do not disturb',
+					icon: 'phone',
+					category: 'Do not disturb',
+					module: 'do_not_disturb',
+					number_type: 'patterns',
+					data: {
+						action: 'toggle'
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '76',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '^\\*'+number+'([0-9]*)$';
+					}
+				},
+				'directory': {
+					name: 'Directory',
+					icon: 'phone',
+					category: 'Miscellaneous',
+					module: 'directory',
+					number_type: 'patterns',
+					data: {
+						action: ''
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '411',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '^\\*'+number+'([0-9]*)$';
+					}
+				},
+				'time': {
+					name: 'Check Time',
+					icon: 'phone',
+					category: 'Miscellaneous',
+					module: 'time',
+					number_type: 'patterns',
+					data: {
+						action: ''
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '60',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '^\\*'+number+'([0-9]*)$';
+					}
+				},
+				'call_waiting[action=enable]': {
+					name: 'Enable Call-Waiting',
+					icon: 'phone',
+					category: 'Miscellaneous',
+					module: 'call_waiting',
+					number_type: 'patterns',
+					data: {
+						action: 'enable'
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '70',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '^\\*'+number+'([0-9]*)$';
+					}
+				},
+				'call_waiting[action=disable]': {
+					name: 'Disable Call-Waiting',
+					icon: 'phone',
+					category: 'Miscellaneous',
+					module: 'call_waiting',
+					number_type: 'numbers',
+					data: {
+						action: 'disable'
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '71',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '*'+number;
+					}
+				},
+
+				'sound_test_service': {
+					name: 'Sound Test Service',
+					icon: 'phone',
+					category: 'Miscellaneous',
+					module: '',
+					number_type: 'patterns',
+					data: {
+						action: ''
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '43',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '^\\*'+number+'([0-9]*)$';
+					}
+				},
+
+				'call_recording': {
+					name: 'Call Recording',
+					icon: 'phone',
+					category: 'Miscellaneous',
+					module: 'call_recording',
+					number_type: 'patterns',
+					data: {
+						action: ''
+					},
+					enabled: false,
+					hasStar: true,
+					default_number: '1',
+					number: this.default_number,
+					build_regex: function(number) {
+						return '^\\*'+number+'([0-9]*)$';
+					}
+				}*/
+			});
+		},
+
+		featureCodesEditParkingParkAndRetrieve: function(featureCode) {
+			var self = this;
+
+			self.featureCodeGet(featureCode.id, function(data) {
+				var popup,
+					formattedData = self.featureCodesFormatParkingData(data),
+					template = $(self.getTemplate({
+						name: 'featurecodes-parking-parkandretrieve',
+						submodule: 'featurecodes',
+						data: formattedData
+					}));
+
+				monster.ui.validate(template.find('#form_park_retrieve'), {
+					rules: {
+						'default_ringback_timeout': {
+							'digits': true
+						},
+						'default_callback_timeout': {
+							'digits': true
+						}
+					}
+				});
+
+				monster.ui.tooltips(template);
+
+				template.find('#save').on('click', function(e) {
+					e.preventDefault();
+
+					if (monster.ui.valid(template.find('#form_park_retrieve'))) {
+						var formData = monster.ui.getFormData('form_park_retrieve'),
+							dataToUpdate = self.featureCodesNormalizeData(data, formData);
+
+						self.featureCodeUpdate(dataToUpdate.id, dataToUpdate, function() {
+							toastr.success(self.i18n.active().callflows.featureCodes.parkingParkAndRetrievePopup.successUpdate);
+							popup.dialog('close');
+						});
+					}
+				});
+
+				popup = monster.ui.dialog(template, {
+					title: self.i18n.active().callflows.featureCodes.parkingParkAndRetrievePopup.title
+				});
+			});
+		},
+
+		featureCodesEditParkingValet: function(featureCode) {
+			var self = this;
+
+			self.featureCodeGet(featureCode.id, function(data) {
+				var popup,
+					formattedData = self.featureCodesFormatParkingData(data),
+					template = $(self.getTemplate({
+						name: 'featurecodes-parking-valet',
+						submodule: 'featurecodes',
+						data: formattedData
+					}));
+
+				monster.ui.validate(template.find('#form_valet'), {
+					rules: {
+						'default_ringback_timeout': {
+							'digits': true
+						},
+						'default_callback_timeout': {
+							'digits': true
+						}
+					}
+				});
+
+				monster.ui.tooltips(template);
+
+				template.find('#save').on('click', function(e) {
+					e.preventDefault();
+
+					if (monster.ui.valid(template.find('#form_valet'))) {
+						var formData = monster.ui.getFormData('form_valet'),
+							dataToUpdate = self.featureCodesNormalizeData(data, formData);
+
+						self.featureCodeUpdate(dataToUpdate.id, dataToUpdate, function() {
+							toastr.success(self.i18n.active().callflows.featureCodes.parkingValetPopup.successUpdate);
+							popup.dialog('close');
+						});
+					}
+				});
+
+				popup = monster.ui.dialog(template, {
+					title: self.i18n.active().callflows.featureCodes.parkingValetPopup.title
+				});
+			});
+		},
+
+		featureCodesNormalizeData: function(data, formData) {
+			var self = this,
+				dataToUpdate = $.extend(true, {}, data);
+
+			// If user leaves field empty, we want to delete the field, so it goes back to system default.
+			// Otherwise we transform seconds into milliseconds for back-end
+			if (formData.default_callback_timeout.length) {
+				dataToUpdate.flow.data.default_callback_timeout = parseInt(formData.default_callback_timeout) * 1000;
+			} else {
+				delete dataToUpdate.flow.data.default_callback_timeout;
+			}
+
+			if (formData.default_ringback_timeout.length) {
+				dataToUpdate.flow.data.default_ringback_timeout = parseInt(formData.default_ringback_timeout) * 1000;
+			} else {
+				delete dataToUpdate.flow.data.default_ringback_timeout;
+			}
+
+			return dataToUpdate;
+		},
+
+		featureCodesFormatParkingData: function(data) {
+			var formattedData = $.extend(true, {}, data.flow.data);
+
+			if (formattedData.hasOwnProperty('default_callback_timeout')) {
+				formattedData.default_callback_timeout /= 1000;
+			}
+
+			if (formattedData.hasOwnProperty('default_ringback_timeout')) {
+				formattedData.default_ringback_timeout /= 1000;
+			}
+
+			return formattedData;
+		}
+	};
+
+	return app;
+});

src/apps/callflows/submodules/featurecodes/views/featurecodes-parking-parkandretrieve.html

@@ -0,0 +1,28 @@
+<div id="parking_settings_popup" class="dialog_popup callflows-port">
+	<div class="info-settings">
+		{{#monsterText 'info'}}
+			{{ i18n.callflows.featureCodes.infoSettings }}
+		{{/monsterText}}
+	</div>
+
+	<form id="form_park_retrieve" name="form" class="form-horizontal" method="post" action="#">
+		<div class="form_content">
+			<div class="control-group">
+				<label class="control-label">{{ i18n.callflows.featureCodes.parkingValetPopup.ringBackTimeout.label }}<i class="help-popover fa fa-question-circle" data-original-title="{{ i18n.callflows.featureCodes.parkingValetPopup.ringBackTimeout.tooltip}}" data-placement="right" data-toggle="tooltip"></i></label>
+				<div class="controls">
+					<input type="text" name="default_ringback_timeout" value="{{ default_ringback_timeout }}"/>
+				</div>
+			</div>
+
+			<div class="control-group">
+				<label class="control-label">{{ i18n.callflows.featureCodes.parkingValetPopup.callbackTimeout.label }}<i class="help-popover fa fa-question-circle" data-original-title="{{ i18n.callflows.featureCodes.parkingValetPopup.callbackTimeout.tooltip}}" data-placement="right" data-toggle="tooltip"></i></label>
+				<div class="controls">
+					<input type="text" name="default_callback_timeout" value="{{ default_callback_timeout }}"/>
+				</div>
+			</div>
+	</form>
+	<div class="buttons-center">
+		<button id="save" class="monster-button monster-button-primary">{{ i18n.save }}</button>
+	</div>
+</div>
+

src/apps/callflows/submodules/featurecodes/views/featurecodes-parking-valet.html

@@ -0,0 +1,28 @@
+<div id="parking_settings_popup" class="dialog_popup callflows-port">
+	<div class="info-settings">
+		{{#monsterText 'info'}}
+			{{ i18n.callflows.featureCodes.infoSettings }}
+		{{/monsterText}}
+	</div>
+
+	<form id="form_valet" name="form" class="form-horizontal" method="post" action="#">
+		<div class="form_content">
+			<div class="control-group">
+				<label class="control-label">{{ i18n.callflows.featureCodes.parkingValetPopup.ringBackTimeout.label }}<i class="help-popover fa fa-question-circle" data-original-title="{{ i18n.callflows.featureCodes.parkingValetPopup.ringBackTimeout.tooltip}}" data-placement="right" data-toggle="tooltip"></i></label>
+				<div class="controls">
+					<input type="text" name="default_ringback_timeout" value="{{ default_ringback_timeout }}"/>
+				</div>
+			</div>
+
+			<div class="control-group">
+				<label class="control-label">{{ i18n.callflows.featureCodes.parkingValetPopup.callbackTimeout.label }}<i class="help-popover fa fa-question-circle" data-original-title="{{ i18n.callflows.featureCodes.parkingValetPopup.callbackTimeout.tooltip}}" data-placement="right" data-toggle="tooltip"></i></label>
+				<div class="controls">
+					<input type="text" name="default_callback_timeout" value="{{ default_callback_timeout }}"/>
+				</div>
+			</div>
+	</form>
+	<div class="buttons-center">
+		<button id="save" class="monster-button monster-button-primary">{{ i18n.save }}</button>
+	</div>
+</div>
+

src/apps/callflows/submodules/groups/groups.css

@@ -0,0 +1,289 @@
+.callflows-port#ring_group_popup .form_content .popup_field .media_action {
+	color: #05addc;
+	margin-left: 10px;
+}
+
+.callflows-port#ring_group_popup #two_columns .wrapper {
+	width: 700px;
+}
+
+.callflows-port#ring_group_popup #two_columns .sortable_li a.drag_btn {
+	margin-right: 0px;
+}
+
+.callflows-port#ring_group_popup #two_columns .sortable_li .icon {
+	float: left;
+	margin-top: 3px;
+}
+
+.callflows-port#ring_group_popup #two_columns .sortable_li .icon.head1 {
+	background-position: -477px -197px;
+}
+
+.callflows-port#ring_group_popup #two_columns .sortable_li .icon.device {
+	background-position: -508px -166px;
+}
+
+.callflows-port#ring_group_popup #two_columns .sortable_li .icon.trash {
+	background-position: -32px -68px;
+	margin-left: 10px;
+}
+
+.callflows-port#ring_group_popup #two_columns .column.left {
+	border-radius: 0px 0px 5px 5px;
+	padding: 0px 0px 5px;
+}
+
+.callflows-port#ring_group_popup #two_columns .column.left .search_box {
+	background: #AFAFAF;
+	height: 27px;
+}
+
+.callflows-port#ring_group_popup #two_columns .column.left .search_box .searchsubmit1 {
+	margin-left: 18px;
+}
+
+.callflows-port#ring_group_popup #two_columns .column.right {
+	width: 420px;
+}
+
+.callflows-port#ring_group_popup.page_group #two_columns .column.right .item_name {
+	width: 315px;
+}
+
+.callflows-port#ring_group_popup #two_columns .column.right .item_name {
+	width: 205px;
+	padding-left: 6px;
+}
+
+.callflows-port#ring_group_popup #two_columns .actions_item {
+	font-size: 10px;
+	width: 39px;
+	float: left;
+	line-height: 28px;
+	height: 28px;
+	border-left: 1px solid #444444;
+}
+
+.callflows-port#ring_group_popup #two_columns .options {
+	font-size: 10px;
+	width: 110px;
+	line-height: 28px;
+	height: 28px;
+	float: left;
+}
+
+.callflows-port#ring_group_popup #two_columns .options .option {
+	height: 12px;
+	margin: 2px 5px 0;
+}
+
+.callflows-port#ring_group_popup #two_columns .column.right ul.connect {
+	width: 420px;
+}
+
+.callflows-port#ring_group_popup #two_columns .column.right .title_column .title{
+	float: left;
+	width: 243px;
+	height: 28px;
+	line-height: 28px;
+}
+
+.callflows-port#ring_group_popup.page_group #two_columns .column.right .title_column .title{
+	width: 353px;
+}
+
+.callflows-port#ring_group_popup .form_content .popup_field input {
+	margin: 0px;
+}
+
+.callflows-port#ring_group_popup .form_content .popup_field select {
+	margin: 0px;
+	width: auto;
+}
+
+.callflows-port#ring_group_popup .form_content .popup_field {
+	text-align: left;
+}
+
+.callflows-port#ring_group_popup #two_columns .wrapper .settings_tabs {
+	margin: 0px;
+}
+
+.callflows-port#ring_group_popup #two_columns .wrapper .settings_tabs > li {
+	width: 71px;
+	height: 22px;
+	line-height: 22px;
+	border: 1px solid #888;
+	float: left;
+	border-radius: 0px;
+	color: #fff;
+	background: #b2b2b2; /* Old browsers */
+	background: -moz-linear-gradient(top, #b2b2b2 1%, #7c7c7c 50%, #333333 100%); /* FF3.6+ */
+	background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#b2b2b2), color-stop(50%,#7c7c7c), color-stop(100%,#333333)); /* Chrome,Safari4+ */
+	background: -webkit-linear-gradient(top, #b2b2b2 1%,#7c7c7c 50%,#333333 100%); /* Chrome10+,Safari5.1+ */
+	background: -o-linear-gradient(top, #b2b2b2 1%,#7c7c7c 50%,#333333 100%); /* Opera 11.10+ */
+	background: -ms-linear-gradient(top, #b2b2b2 1%,#7c7c7c 50%,#333333 100%); /* IE10+ */
+	background: linear-gradient(top, #b2b2b2 1%,#7c7c7c 50%,#333333 100%); /* W3C */
+	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b2b2b2', endColorstr='#333333',GradientType=0 ); /* IE6-9 */
+}
+
+.callflows-port#ring_group_popup #two_columns .wrapper .settings_tabs > li:first-child {
+	border-radius: 5px 0px 0px 0px;
+}
+
+.callflows-port#ring_group_popup #two_columns .wrapper .settings_tabs > li:last-of-type {
+	border-radius: 0px 5px 0px 0px;
+	width: 72px;
+}
+
+.callflows-port#ring_group_popup #two_columns .wrapper .settings_tabs > li.current{
+	background: #05addc; /* Old browsers */
+	background: -moz-linear-gradient(top, #05addc 0%, #2989d8 50%, #203838 100%); /* FF3.6+ */
+	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#05addc), color-stop(50%,#2989d8), color-stop(100%,#203838)); /* Chrome,Safari4+ */
+	background: -webkit-linear-gradient(top, #05addc 0%,#2989d8 50%,#203838 100%); /* Chrome10+,Safari5.1+ */
+	background: -o-linear-gradient(top, #05addc 0%,#2989d8 50%,#203838 100%); /* Opera 11.10+ */
+	background: -ms-linear-gradient(top, #05addc 0%,#2989d8 50%,#203838 100%); /* IE10+ */
+	background: linear-gradient(top, #05addc 0%,#2989d8 50%,#203838 100%); /* W3C */
+	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#05addc', endColorstr='#203838',GradientType=0 ); /* IE6-9 */
+}
+
+.callflows-port#ring_group_popup #two_columns .wrapper .settings_tabs > li > a{
+	outline: none;
+	text-decoration: none;
+	color: #fff;
+	display: block;
+	height: 22px;
+}
+
+/* Groups entity */
+#group-form #table_wrapper {
+    display: inline-block;
+    text-align: center;
+    width: 100%;
+}
+
+#group-form #tab_users  {
+    border: 2px solid #666666;
+    border-radius: 5px 5px 0px 0px;
+    color: #666666;
+    width: 330px;
+    max-height: 342px;
+    display: inline-block;
+}
+
+#group-form #tab_users .rows {
+    max-height: 310px;
+    overflow: auto;
+}
+
+#group-form #tab_users .action_user {
+    color: #666666;
+    cursor: pointer;
+    text-decoration: underline;
+    line-height: 30px;
+}
+
+#group-form #tab_users .action_user:not(:first-child) {
+    margin-left: 10px;
+}
+#group-form #tab_users .action_user:hover {
+    color: #05addc;
+}
+
+#group-form #tab_users .column.first:not(:last-child) {
+    border-right: 1px solid #A6A6A6;
+}
+
+#group-form #tab_users .column {
+    float: left;
+    text-align: center;
+    height: 30px;
+    line-height: 30px;
+}
+
+#group-form #tab_users .column.first {
+    width: 250px;
+    overflow: hidden;
+    text-align:center;
+    cursor: move;
+}
+
+#group-form #tab_users .column.second {
+    width: 59px;
+}
+
+#group-form #tab_users .column.merged {
+    width: 330px;
+}
+
+#group-form #tab_users .row {
+    height: 30px;
+    margin-left: 0px;
+}
+
+#group-form #tab_users .row.title {
+    background-color: #dddddd !important;
+    border-bottom: 2px solid #666666 !important;
+    border-radius: 5px 5px 0px 0px;
+    font-weight: bold;
+}
+
+#group-form #tab_users .row:not(:last-child) {
+    border-bottom: 1px solid #A6A6A6;
+}
+
+#group-form #tab_users .row:nth-child(odd) {
+    background-color: #eeeeee;
+}
+
+#group-form #tab_users .row:nth-child(even) {
+    background-color: #dddddd;
+}
+
+#group-form #tab_users .icon.userportal {
+    background-position: -476px -196px;
+}
+
+#group-form .add_endpoint_wrapper{
+    float: right;
+    width: 230px;
+}
+
+#group-form .add_endpoint {
+    color: #666666;
+    background: #666666;
+    border-radius: 5px 5px 5px 5px;
+}
+
+#group-form .add_endpoint:not(:last-child) {
+    margin-bottom: 15px;
+}
+
+#group-form .add_endpoint .add_content_wrapper {
+    background: #EEEEEE;
+    border-radius: 0 0 5px 5px;
+    padding: 10px;
+    text-align: center;
+}
+
+#group-form .add_endpoint .add_endpoint_title {
+    color: #eeeeee;
+    font-weight: bold;
+    height: 25px;
+    line-height: 25px;
+    text-align: center;
+    border-radius: 5px 5px 0 0;
+}
+
+#group-form .add_endpoint .add_endpoint_div {
+    margin-top: 10px;
+}
+
+#group-form .add_endpoint .add_endpoint_div a {
+    color: #333333;
+}
+
+#group-form .add_endpoint .add_endpoint_div:hover a {
+    color: #05addc;
+}

src/apps/callflows/submodules/media/media.js

@@ -0,0 +1,548 @@
+define(function(require){
+	var $ = require('jquery'),
+		_ = require('underscore'),
+		monster = require('monster');
+
+	var app = {
+		requests: {},
+
+		subscribe: {
+			'callflows.fetchActions': 'mediaDefineActions',
+			'callflows.media.editPopup': 'mediaPopupEdit',
+			'callflows.media.edit': '_mediaEdit'
+		},
+
+		mediaRender: function(data, target, callbacks) {
+			var self = this,
+				media_html = $(monster.template(self, 'media-edit', data)),
+				mediaForm = media_html.find('#media-form');
+
+			monster.ui.validate(mediaForm, {
+				rules: {
+					'name': {
+						required: true
+					}
+				}
+			});
+
+			$('*[rel=popover]:not([type="text"])', media_html).popover({
+				trigger: 'hover'
+			});
+
+			$('*[rel=popover][type="text"]', media_html).popover({
+				trigger: 'focus'
+			});
+
+			self.winkstartTabs(media_html);
+
+			if(data.data.id) {
+				$('#upload_div', media_html).hide();
+			}
+
+			$('#change_link', media_html).click(function(ev) {
+				ev.preventDefault();
+				$('#upload_div', media_html).show();
+				$('.player_file', media_html).hide();
+			});
+
+			$('#download_link', media_html).click(function(ev) {
+				ev.preventDefault();
+				window.location.href = self.apiUrl + (self.apiUrl.substring(self.apiUrl.length-1) != '/' ? '/' : '') + 'accounts/' +
+									   self.accountId + '/media/' +
+									   data.data.id + '/raw?auth_token=' + self.getAuthToken();
+			});
+
+			$('#file', media_html).bind('change', function(evt){
+				var files = evt.target.files;
+
+				if(files.length > 0) {
+					var reader = new FileReader();
+
+					file = 'updating';
+					reader.onloadend = function(evt) {
+						var data = evt.target.result;
+
+						file = data;
+					}
+
+					reader.readAsDataURL(files[0]);
+				}
+			});
+
+			function changeType($select) {
+				var type = $select.val();
+
+				switch(type) {
+					case 'tts':
+						$('.tts', media_html).show();
+						$('.file', media_html).hide();
+						break;
+					case 'upload':
+						$('.tts', media_html).hide();
+						$('.file', media_html).show();
+						break;
+				}
+			}
+
+			changeType($('#media_type', media_html));
+
+			$('#media_type', media_html).change(function() {
+				changeType($(this));
+			});
+
+			$('.media-save', media_html).click(function(ev) {
+				ev.preventDefault();
+				var $this = $(this);
+
+				if(!$this.hasClass('disabled')) {
+					$this.addClass('disabled');
+
+					if(monster.ui.valid(mediaForm)) {
+						var form_data = monster.ui.getFormData('media-form');
+
+						form_data = self.mediaCleanFormData(form_data);
+
+						self.mediaSave(form_data, data, function(_data, status) {
+							if(!form_data.tts) {
+								if($('#upload_div', media_html).is(':visible') && $('#file').val() != '') {
+									if(file === 'updating') {
+										monster.ui.alert(self.i18n.active().callflows.media.the_file_you_want_to_apply);
+										
+										$this.removeClass('disabled');
+									}
+									else {
+										self.mediaUpload(file, _data.id, function() {
+											if(typeof callbacks.save_success == 'function') {
+												callbacks.save_success(_data, status);
+											}
+										}, function() {
+											if(data && data.data && data.data.id) {
+												self.mediaSave({}, data, function() {
+													if(typeof callbacks.save_success == 'function') {
+														callbacks.save_success(_data, status);
+													}
+												});
+											} else {
+												self.mediaDelete(_data.id, callbacks.delete_success, callbacks.delete_error);
+											}
+
+											$this.removeClass('disabled');
+
+											if(typeof callbacks.save_error == 'function') {
+												callbacks.save_error(_data, status);
+											}
+										});
+									}
+								}
+								else {
+									if(typeof callbacks.save_success == 'function') {
+										callbacks.save_success(_data, status);
+									}
+								}
+							} else {
+								if(typeof callbacks.save_success == 'function') {
+									callbacks.save_success(_data, status);
+								}
+							}
+						});
+					} else {
+						$this.removeClass('disabled');
+						monster.ui.alert(self.i18n.active().callflows.media.there_were_errors_on_the_form);
+					}
+				}
+			});
+
+			$('.media-delete', media_html).click(function(ev) {
+				ev.preventDefault();
+
+				monster.ui.confirm(self.i18n.active().callflows.media.are_you_sure_you_want_to_delete, function() {
+					self.mediaDelete(data.data.id, callbacks.delete_success, callbacks.delete_error);
+				});
+			});
+
+			(target)
+				.empty()
+				.append(media_html);
+		},
+
+		mediaCleanFormData: function(form_data) {
+			form_data.description = form_data.upload_media;
+
+			if(form_data.description == '') {
+				delete form_data.description;
+			}
+
+			if(form_data.media_source == 'tts') {
+				form_data.description = "tts file";
+			} else {
+				delete form_data.tts;
+			}
+
+			delete form_data.media_type;
+
+			return form_data;
+		},
+
+		// Added for the subscribed event to avoid refactoring mediaEdit
+		_mediaEdit: function(args) {
+			var self = this;
+			self.mediaEdit(args.data, args.parent, args.target, args.callbacks, args.data_defaults);
+		},
+
+		mediaEdit: function(data, _parent, _target, _callbacks, data_defaults){
+			var self = this,
+				parent = _parent || $('#media-content'),
+				target = _target || $('#media-view', parent),
+				_callbacks = _callbacks || {},
+				callbacks = {
+					save_success: _callbacks.save_success,
+					save_error: _callbacks.save_error,
+					delete_success: _callbacks.delete_success,
+					delete_error: _callbacks.delete_error,
+					after_render: _callbacks.after_render
+				},
+				defaults = {
+					data: $.extend(true, {
+						streamable: true
+					}, data_defaults || {})
+				};
+
+			if(typeof data == 'object' && data.id) {
+				self.mediaGet(data.id, function(mediaData) {
+					self.mediaFormatData(mediaData);
+
+					self.mediaRender($.extend(true, defaults, { data: mediaData }), target, callbacks);
+
+					if(typeof callbacks.after_render == 'function') {
+						callbacks.after_render();
+					}
+				});
+			}
+			else {
+				self.mediaRender(defaults, target, callbacks);
+
+				if(typeof callbacks.after_render == 'function') {
+					callbacks.after_render();
+				}
+			}
+		},
+
+		mediaSave: function(form_data, data, success, error) {
+			var self = this,
+				normalized_data = self.mediaNormalizeData($.extend(true, {}, data.data, form_data));
+
+			if(typeof data.data == 'object' && data.data.id) {
+				self.mediaUpdate(normalized_data, function(_data, status) {
+					if(typeof success == 'function') {
+						success(_data, status, 'update');
+					}
+				});
+			}
+			else {
+				self.mediaCreate(normalized_data, function(_data, status) {
+					if(typeof success == 'function') {
+						success(_data, status, 'create');
+					}
+				});
+			}
+		},
+
+		mediaNormalizeData: function(form_data) {
+			delete form_data.upload_media;
+
+			if('field_data' in form_data) {
+				delete form_data.field_data;
+			}
+
+			if(form_data.media_source == 'upload') {
+				delete form_data.tts;
+			}
+
+			return form_data;
+		},
+
+		mediaFormatData: function(data) {
+			/* On creation, crossbar store streamable as a string, and as a boolean on update
+			* And as we're using the same template for both behaviors, we need the same kind of data.
+			* TODO: delete once this bug is fixed!
+			*/
+			if(data.streamable == 'false') {
+				 data.streamable = false;
+			}
+			else if(data.streamable == 'true') {
+				data.streamable = true;
+			}
+
+			if(data.description != undefined && data.description.substr(0,12) == 'C:\\fakepath\\') {
+				data.description = data.description.substr(12);
+			}
+
+			return data;
+		},
+
+		mediaPopupEdit: function(args) {
+			var self = this,
+				data = args.data,
+				callback = args.callback,
+				data_defaults = args.data_defaults || {},
+				popup, 
+				popup_html = $('<div class="inline_popup callflows-port"><div class="inline_content main_content"/></div>');
+
+			self.mediaEdit(data, popup_html, $('.inline_content', popup_html), {
+				save_success: function(_data) {
+					popup.dialog('close');
+
+					if(typeof callback == 'function') {
+						callback(_data);
+					}
+				},
+				delete_success: function() {
+					popup.dialog('close');
+
+					if(typeof callback == 'function') {
+						callback({ data: {} });
+					}
+				},
+				after_render: function() {
+					popup = monster.ui.dialog(popup_html, {
+						title: (data.id) ? self.i18n.active().callflows.media.edit_media : self.i18n.active().callflows.media.create_media
+					});
+				}
+			}, data_defaults);
+		},
+
+		mediaDefineActions: function(args) {
+			var self = this,
+				callflow_nodes = args.actions;
+
+			$.extend(callflow_nodes, {
+				'play[id=*]': {
+					name: self.i18n.active().callflows.media.play_media,
+					icon: 'play',
+					category: self.i18n.active().oldCallflows.basic_cat,
+					module: 'play',
+					tip: self.i18n.active().callflows.media.play_media_tip,
+					data: {
+						id: 'null'
+					},
+					rules: [
+						{
+							type: 'quantity',
+							maxSize: '1'
+						}
+					],
+					isUsable: 'true',
+					weight: 10,
+					caption: function(node, caption_map) {
+						var id = node.getMetadata('id'),
+							isSilence = id && id === 'silence_stream://300000',
+							isShoutcast = id && id.indexOf('://') >= 0 && !isSilence,
+							returned_value = '';
+
+						if(id in caption_map) {
+							returned_value = caption_map[id].name;
+						} else if (isShoutcast) {
+							returned_value = id;
+						} else if (isSilence) {
+							returned_value = self.i18n.active().callflows.media.silence;
+						}
+
+						return returned_value;
+					},
+					edit: function(node, callback) {
+						var _this = this;
+
+						self.mediaList(function(medias) {
+							var popup, popup_html,
+								mediaId = node.getMetadata('id') || '',
+								isSilence = !mediaId || (mediaId && mediaId === 'silence_stream://300000'), // because silence is the default choice, we test for !mediaId
+								isShoutcast = mediaId.indexOf('://') >= 0 && mediaId !== 'silence_stream://300000';
+
+							popup_html = $(monster.template(self, 'media-callflowEdit', {
+								items: medias,
+								selected: isShoutcast ? 'shoutcast' : mediaId,
+								isShoutcast: isShoutcast,
+								shoutcastValue: mediaId,
+								isEditable: !isShoutcast && !isSilence
+							}));
+
+							if($('#media_selector option:selected', popup_html).val() == undefined) {
+								$('#edit_link', popup_html).hide();
+							}
+
+							$('.inline_action', popup_html).click(function(ev) {
+								var _data = ($(this).data('action') == 'edit') ?
+												{ id: $('#media_selector', popup_html).val() } : {};
+
+								ev.preventDefault();
+
+								self.mediaPopupEdit({
+									data: _data, 
+									callback: function(media) {
+										node.setMetadata('id', media.id || 'null');
+										node.caption = media.name || '';
+
+										popup.dialog('close');
+									}
+								});
+							});
+
+							popup_html.find('#media_selector').on('change', function() {
+								var val = $(this).val(),
+									isSilence = val && val === 'silence_stream://300000',
+									isShoutcast = val === 'shoutcast',
+									isEditable = !isShoutcast && !isSilence;
+
+								popup_html.find('#edit_link').toggleClass('active', isEditable);
+								popup_html.find('.shoutcast-div').toggleClass('active', isShoutcast).find('input').val('');
+							});
+
+							$('#add', popup_html).click(function() {
+								var mediaValue = $('#media_selector', popup_html).val(),
+									shoutcastValue = $('.shoutcast-url-input', popup_html).val();
+
+								node.caption = mediaValue === 'shoutcast' ? shoutcastValue : $('#media_selector option:selected', popup_html).text();
+								mediaValue = mediaValue === 'shoutcast' ? shoutcastValue : mediaValue;
+								node.setMetadata('id', mediaValue);
+
+								popup.dialog('close');
+							});
+
+							monster.ui.tooltips(popup_html);
+
+							popup = monster.ui.dialog(popup_html, {
+								title: self.i18n.active().callflows.media.media,
+								minHeight: '0',
+								beforeClose: function() {
+									if(typeof callback == 'function') {
+										callback();
+									}
+								}
+							});
+						});
+					},
+					listEntities: function(callback) {
+						self.callApi({
+							resource: 'media.list',
+							data: {
+								accountId: self.accountId,
+								filters: { paginate:false }
+							},
+							success: function(data, status) {
+								callback && callback(data.data);
+							}
+						});
+					},
+					editEntity: 'callflows.media.edit'
+				}
+			});
+		},
+
+		mediaList: function(callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'media.list',
+				data: {
+					accountId: self.accountId,
+					filters: { paginate:false }
+				},
+				success: function(data) {
+					var mediaList = _.sortBy(data.data, function(item) { return item.name.toLowerCase(); });
+
+					mediaList.unshift(
+						{
+							id: 'silence_stream://300000',
+							name: self.i18n.active().callflows.media.silence
+						},
+						{
+							id: 'shoutcast',
+							name: self.i18n.active().callflows.media.shoutcastURL
+						}
+					);
+
+					callback && callback(mediaList);
+				}
+			});
+		},
+
+		mediaGet: function(mediaId, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'media.get',
+				data: {
+					accountId: self.accountId,
+					mediaId: mediaId
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		mediaCreate: function(data, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'media.create',
+				data: {
+					accountId: self.accountId,
+					data: data
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		mediaUpdate: function(data, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'media.update',
+				data: {
+					accountId: self.accountId,
+					mediaId: data.id,
+					data: data
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		mediaDelete: function(mediaId, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'media.delete',
+				data: {
+					accountId: self.accountId,
+					mediaId: mediaId
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		mediaUpload: function(data, mediaId, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'media.upload',
+				data: {
+					accountId: self.accountId,
+					mediaId: mediaId,
+					data: data
+				},
+				success: function(data, status) {
+					callback && callback(data, status);
+				}
+			});
+		}
+	};
+
+	return app;
+});

src/apps/callflows/submodules/menu/menu.js

@@ -0,0 +1,571 @@
+define(function(require){
+	var $ = require('jquery'),
+		_ = require('underscore'),
+		monster = require('monster');
+
+	var app = {
+		requests: {},
+
+		subscribe: {
+			'callflows.fetchActions': 'menuDefineActions',
+			'callflows.menu.edit': '_menuEdit'
+		},
+
+		// Added for the subscribed event to avoid refactoring menuEdit
+		_menuEdit: function(args) {
+			var self = this;
+			self.menuEdit(args.data, args.parent, args.target, args.callbacks, args.data_defaults);
+		},
+
+		menuEdit: function(data, _parent, _target, _callbacks, data_defaults) {
+			var self = this,
+				parent = _parent || $('#menu-content'),
+				target = _target || $('#menu-view', parent),
+				_callbacks = _callbacks || {},
+				callbacks = {
+					save_success: _callbacks.save_success,
+					save_error: _callbacks.save_error,
+					delete_success: _callbacks.delete_success,
+					delete_error: _callbacks.delete_error,
+					after_render: _callbacks.after_render
+				},
+				defaults = {
+					data: $.extend(true, {
+						timeout: '10',
+						interdigit_timeout: '2',
+						max_extension_length: '4',
+						media: {},
+						extra: {
+							retries: 2
+						}
+					}, data_defaults || {}),
+					field_data: {
+						media: []
+					}
+				};
+
+			monster.parallel({
+					media_list: function(callback) {
+						self.callApi({
+							resource: 'media.list', 
+							data: {
+								accountId: self.accountId,
+								filters: { paginate:false }
+							},
+							success: function(mediaList, status) {
+								_.each(mediaList.data, function(media) {
+									if(media.media_source) {
+										media.name = '['+media.media_source.substring(0,3).toUpperCase()+'] ' + media.name;
+									}
+								});
+
+								mediaList.data.unshift({
+									id: '',
+									name: self.i18n.active().callflows.menu.not_set
+								});
+
+								defaults.field_data.media = mediaList.data;
+
+								callback(null, mediaList);
+							}
+						});
+					},
+					menu_get: function(callback) {
+						if(typeof data == 'object' && data.id) {
+							self.menuGet(data.id, function(menuData, status) {
+								self.menuformatData(menuData);
+
+								callback(null, { data: menuData });
+							});
+						}
+						else {
+							callback(null, {});
+						}
+					}
+				},
+				function(err, results) {
+					var render_data = defaults;
+
+					if(typeof data === 'object' && data.id) {
+						render_data = $.extend(true, defaults, results.menu_get)
+					}
+
+					self.menuRender(render_data, target, callbacks);
+
+					if(typeof callbacks.after_render == 'function') {
+						callbacks.after_render();
+					}
+				}
+			);
+		},
+
+		menuPopupEdit: function(data, callback, data_defaults) {
+			var self = this,
+				popup, 
+				popup_html = $('<div class="inline_popup callflows-port"><div class="inline_content main_content"/></div>');
+
+			self.menuEdit(data, popup_html, $('.inline_content', popup_html), {
+				save_success: function(_data) {
+					popup.dialog('close');
+
+					if(typeof callback == 'function') {
+						callback(_data);
+					}
+				},
+				delete_success: function() {
+					popup.dialog('close');
+
+					if(typeof callback == 'function') {
+						callback({ data: {} });
+					}
+				},
+				after_render: function() {
+					popup = monster.ui.dialog(popup_html, {
+						title: (data.id) ? self.i18n.active().callflows.menu.edit_menu : self.i18n.active().callflows.menu.create_menu
+					});
+				}
+			}, data_defaults);
+		},
+
+		menuRender: function(data, target, callbacks){
+			var self = this,
+				menu_html = $(monster.template(self, 'menu-edit', data)),
+				menuForm = menu_html.find('#menu-form');
+
+			monster.ui.validate(menuForm, {
+				rules: {
+					'extra.retries': {
+						digits: true,
+						min: 0
+					},
+					'record_pin': {
+						digits: true
+					},
+					'timeout': {
+						number: true,
+						max: 10
+					},
+					'interdigit_timeout': {
+						number: true,
+						max: 10
+					},
+					'max_extension_length': {
+						digits: true
+					}
+				}
+			});
+
+			$('*[rel=popover]:not([type="text"])', menu_html).popover({
+				trigger: 'hover'
+			});
+
+			$('*[rel=popover][type="text"]', menu_html).popover({
+				trigger: 'focus'
+			});
+
+			self.winkstartTabs(menu_html);
+
+			if(!$('#media_greeting', menu_html).val()) {
+				$('#edit_link_media', menu_html).hide();
+			}
+
+			$('#media_greeting', menu_html).change(function() {
+				!$('#media_greeting option:selected', menu_html).val() ? $('#edit_link_media', menu_html).hide() : $('#edit_link_media', menu_html).show();
+			});
+
+			$('.inline_action_media', menu_html).click(function(ev) {
+				var _data = ($(this).data('action') == 'edit') ? { id: $('#media_greeting', menu_html).val() } : {},
+					_id = _data.id;
+
+				ev.preventDefault();
+
+				monster.pub('callflows.media.editPopup', {
+					data: _data,
+					callback: function(dataMedia) {
+						/* Create */
+						dataMedia.name = '[UPL] ' + dataMedia.name;
+
+						if(!_id) {
+							$('#media_greeting', menu_html).append('<option id="'+ dataMedia.id  +'" value="'+ dataMedia.id +'">'+ dataMedia.name +'</option>')
+							$('#media_greeting', menu_html).val(dataMedia.id);
+
+							$('#edit_link_media', menu_html).show();
+						}
+						else {
+							/* Update */
+							if(dataMedia.hasOwnProperty('id')) {
+								$('#media_greeting #'+dataMedia.id, menu_html).text(dataMedia.name);
+							}
+							/* Delete */
+							else {
+								$('#media_greeting #'+_id, menu_html).remove();
+								$('#edit_link_media', menu_html).hide();
+							}
+						}
+					}
+				});
+			});
+
+			$('.menu-save', menu_html).click(function(ev) {
+				ev.preventDefault();
+
+				var $this = $(this);
+
+				if(!$this.hasClass('disabled')) {
+					$this.addClass('disabled');
+
+					if(monster.ui.valid(menuForm)) {
+						var form_data = monster.ui.getFormData('menu-form');
+
+						self.menuCleanFormData(form_data);
+
+						if('field_data' in data) {
+							delete data.field_data;
+						}
+
+						self.menuSave(form_data, data, callbacks.save_success, function() {
+							$this.removeClass('disabled');
+						});
+					} else {
+						$this.removeClass('disabled');
+						monster.ui.alert('error', self.i18n.active().callflows.menu.there_were_errors_on_the_form);
+					}
+				}
+			});
+
+			$('.menu-delete', menu_html).click(function(ev) {
+				ev.preventDefault();
+
+				monster.ui.confirm(self.i18n.active().callflows.menu.are_you_sure_you_want_to_delete, function() {
+					self.menuDelete(data.data.id, callbacks.delete_success, callbacks.delete_error);
+				});
+			});
+
+			(target)
+				.empty()
+				.append(menu_html);
+		},
+
+		menuSave: function(form_data, data, success, error) {
+			var self = this,
+				normalized_data = self.menuNormalizeData($.extend(true, {}, data.data, form_data));
+
+			if (typeof data.data == 'object' && data.data.id) {
+				self.menuUpdate(normalized_data, function(data, status) {
+					success && success(data, status, 'update');
+				}, error);
+			} else {
+				self.menuCreate(normalized_data, function(data, status) {
+					success && success(data, status, 'create');
+				}, error);
+			}
+		},
+
+		menuformatData: function(data) {
+			var self = this;
+
+			data.extra = {};
+			data.extra.retries = parseInt(data.retries) - 1;
+
+			if (data.timeout) {
+				data.timeout /= 1000; // ms to seconds
+			}
+
+			if(data.interdigit_timeout) {
+				data.interdigit_timeout /= 1000; // ms to seconds
+			}
+
+
+			if(data.media) {
+				if(data.media.invalid_media === false && data.media.transfer_media === false && data.media.exit_media === false) {
+					data.suppress_media = true;
+				}
+				else {
+					data.suppress_media = false;
+				}
+			}
+		},
+
+		menuCleanFormData: function(form_data) {
+			if(form_data.record_pin.length == 0) {
+				form_data.max_extension_length = 4;
+			}
+			else if(form_data.max_extension_length < form_data.record_pin.length) {
+				form_data.max_extension_length = form_data.record_pin.length;
+			}
+
+			/* Hack to put timeouts in ms in database. */
+			form_data.timeout = form_data.timeout * 1000;
+			form_data.interdigit_timeout = form_data.interdigit_timeout * 1000;
+
+			form_data.retries = parseInt(form_data.extra.retries) + 1;
+
+			if ('suppress_media' in form_data) {
+				form_data.media = form_data.media || {};
+				if(form_data.suppress_media === true) {
+					form_data.media.invalid_media = false;
+					form_data.media.transfer_media = false;
+					form_data.media.exit_media = false;
+				}
+				else {
+					form_data.media.invalid_media = true;
+					form_data.media.transfer_media = true;
+					form_data.media.exit_media = true;
+				}
+			}
+		},
+
+		menuNormalizeData: function(form_data) {
+			if(!form_data.media.greeting) {
+				delete form_data.media.greeting;
+			}
+
+			if(form_data.hunt_allow == '') {
+				delete form_data.hunt_allow;
+			}
+
+			if(form_data.hunt_deny == '') {
+				delete form_data.hunt_deny;
+			}
+
+			if(form_data.record_pin == '') {
+				delete form_data.record_pin;
+			}
+
+			delete form_data.extra;
+
+			return form_data;
+		},
+
+		menuDefineActions: function(args) {
+			var self = this,
+				callflow_nodes = args.actions;
+
+			$.extend(callflow_nodes, {
+				'menu[id=*]': {
+					name: self.i18n.active().callflows.menu.menu_title,
+					icon: 'menu1',
+					category: self.i18n.active().oldCallflows.basic_cat,
+					module: 'menu',
+					tip: self.i18n.active().callflows.menu.menu_tip,
+					data: {
+						id: 'null'
+					},
+					rules: [
+						{
+							type: 'quantity',
+							maxSize: '9999'
+						}
+					],
+					isUsable: 'true',
+					weight: 60,
+					key_caption: function(child_node, caption_map) {
+						var key = child_node.key;
+
+						return (key != '_') ? key : self.i18n.active().callflows.menu.default_action;
+					},
+					key_edit: function(child_node, callback) {
+						var popup, popup_html;
+
+						/* The '#' Key is not available anymore but we let it here so that it doesn't break existing callflows.
+						   The '#' Key is only displayed if it exists in the callflow, otherwise it is hidden by the template (see /tmpl/menu_key_callflow.html)
+						*/
+
+						popup_html = $(monster.template(self, 'menu-callflowKey', {
+							items: {
+								'_': self.i18n.active().callflows.menu.default_action,
+								'0': '0',
+								'1': '1',
+								'2': '2',
+								'3': '3',
+								'4': '4',
+								'5': '5',
+								'6': '6',
+								'7': '7',
+								'8': '8',
+								'9': '9',
+								'*': '*',
+								'#': '#'
+							},
+							selected: child_node.key
+						}));
+
+						popup_html.find('#add').on('click', function() {
+							child_node.key = $('#menu_key_selector', popup).val();
+
+							child_node.key_caption = $('#menu_key_selector option:selected', popup).text();
+
+							popup.dialog('close');
+						});
+
+						popup = monster.ui.dialog(popup_html, {
+							title: self.i18n.active().callflows.menu.menu_option_title,
+							minHeight: '0',
+							beforeClose: function() {
+								callback && callback();
+							}
+						});
+					},
+					caption: function(node, caption_map) {
+						var id = node.getMetadata('id'),
+							returned_value = '';
+
+						if(id in caption_map) {
+							returned_value = caption_map[id].name;
+						}
+
+						return returned_value;
+					},
+					edit: function(node, callback) {
+						var _this = this;
+
+						self.menuList(function(menus) {
+							var popup, popup_html;
+
+							popup_html = $(monster.template(self, 'menu-callflowEdit', {
+								items: _.sortBy(menus, 'name'),
+								selected: node.getMetadata('id') || ''
+							}));
+
+							if($('#menu_selector option:selected', popup_html).val() == undefined) {
+								$('#edit_link', popup_html).hide();
+							}
+
+							$('.inline_action', popup_html).click(function(ev) {
+								var _data = ($(this).data('action') == 'edit') ?
+												{ id: $('#menu_selector', popup_html).val() } : {};
+
+								ev.preventDefault();
+
+								self.menuPopupEdit(_data, function(menu) {
+									node.setMetadata('id', menu.id || 'null');
+									node.caption = menu.name || '';
+
+									popup.dialog('close');
+								});
+							});
+
+							popup_html.find('#add').on('click', function() {
+								node.setMetadata('id', $('#menu_selector', popup).val());
+								node.caption = $('#menu_selector option:selected', popup).text();
+
+								popup.dialog('close');
+							});
+
+							popup = monster.ui.dialog(popup_html, {
+								title: self.i18n.active().callflows.menu.menu_title,
+								minHeight: '0',
+								beforeClose: function() {
+									if(typeof callback == 'function') {
+										callback();
+									}
+								}
+							});
+						});
+					},
+					listEntities: function(callback) {
+						self.callApi({
+							resource: 'menu.list',
+							data: {
+								accountId: self.accountId,
+								filters: { paginate:false }
+							},
+							success: function(data, status) {
+								callback && callback(data.data);
+							}
+						});
+					},
+					editEntity: 'callflows.menu.edit'
+				}
+			});
+		},
+
+		menuList: function(callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'menu.list',
+				data: {
+					accountId: self.accountId,
+					filters: { paginate:false }
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		menuGet: function(menuId, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'menu.get',
+				data: {
+					accountId: self.accountId,
+					menuId: menuId
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		menuCreate: function(data, callback, error) {
+			var self = this;
+
+			self.callApi({
+				resource: 'menu.create',
+				data: {
+					accountId: self.accountId,
+					data: data
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				},
+				error: function(errorPayload, data, globalHandler) {
+					error && error(errorPayload);
+
+					//globalHandler(data, { generateError: true });
+				}
+			});
+		},
+
+		menuUpdate: function(data, callback, error) {
+			var self = this;
+
+			self.callApi({
+				resource: 'menu.update',
+				data: {
+					accountId: self.accountId,
+					menuId: data.id,
+					data: data
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				},
+				error: function(errorPayload, data, globalHandler) {
+					error && error(errorPayload);
+
+					//globalHandler(data, { generateError: true });
+				}
+			});
+		},
+
+		menuDelete: function(menuId, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'menu.delete',
+				data: {
+					accountId: self.accountId,
+					menuId: menuId
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		}
+	};
+
+	return app;
+});

src/apps/callflows/submodules/misc/misc.css

@@ -0,0 +1,196 @@
+/********** Two columns **********/
+
+.callflows-port #two_columns {
+	padding-bottom: 20px;
+}
+
+.callflows-port #two_columns .wrapper {
+	clear: left;
+	width: 520px;
+	padding: 10px;
+}
+
+.callflows-port #two_columns .wrapper_form {
+	margin-top: 20px;
+	margin-left: 40px;
+}
+
+.callflows-port #two_columns .wrapper .column {
+	width: 220px;
+	padding: 6px 0px 5px;
+	background: #444;
+	border-radius: 6px;
+}
+
+.callflows-port #two_columns .wrapper .column.right {
+	float: right;
+	margin-left: 10px;
+}
+
+.callflows-port #two_columns .wrapper .column.left {
+	float: left;
+	margin-right: 10px;
+}
+
+.callflows-port #two_columns .wrapper .title_column {
+	background-color: #AFAFAF;
+	height: 28px;
+	line-height: 28px;
+	font-weight: bold;
+	font-size: 14px;
+	text-align: center;
+	margin-bottom: 3px;
+}
+
+.callflows-port #two_columns .wrapper .left ul.connect {
+	background-color: #444444;
+	height: 289px;
+	width: 220px;
+	overflow: auto;
+	float: left;
+}
+
+.callflows-port #two_columns .wrapper .connect {
+	min-height: 289px;
+}
+
+.callflows-port #two_columns .wrapper .right ul.connect {
+	background-color: #444444;
+	height: 289px;
+	width: 220px;
+	overflow: auto;
+}
+
+.callflows-port #two_columns .wrapper li {
+	list-style-type: none;
+	background-color: #AFAFAF;
+	color: #444;
+	display: block;
+	height: 28px;
+	line-height: 28px;
+	list-style-type: none;
+	overflow: hidden;
+	position: relative;
+	cursor: default;
+}
+
+.callflows-port #two_columns .wrapper li:not(:first-child) {
+	border-top: 1px solid #444;
+}
+
+.callflows-port #two_columns .item_name {
+	float:left;
+	overflow: hidden;
+	height: 28px;
+	line-height: 28px;
+	width: 155px;
+	font-size: 12px;
+	white-space: nowrap;
+}
+.callflows-port #two_columns .item_name.right {
+	width: 120px;
+}
+
+.callflows-port #two_columns .wrapper li:hover {
+	background-color: #cccccc;
+}
+
+.callflows-port #two_columns .wrapper li a.drag_btn {
+	float: left;
+	height: 28px;
+	width: 7px;
+	margin-right: 5px;
+	margin-left: 1px;
+}
+
+/* Ring group specific css */
+.callflows-port #two_columns .options {
+	float: right;
+	margin-right: 2px;
+	padding-left: 4px;
+	border-left: 1px solid #444444;
+	height: 28px;
+}
+
+.callflows-port #two_columns .options .option {
+	width: 30px;
+	font-size: 12px;
+	margin-top: 2px;
+	height: 20px;
+}
+
+.callflows-port #two_columns .ring_group_form_wrapper {
+	display: block;
+	margin: auto;
+	width: 260px;
+}
+
+.callflows-port #two_columns .form_field_div {
+	width: 260px;
+}
+
+.callflows-port #two_columns .button_field_div {
+	margin: 20px 0px 5px;
+	text-align: center;
+}
+
+/********** Listpanel's search box **********/
+
+.callflows-port .search_box {
+	height: 28px;
+	background-color:#444444;
+	padding-top: 7px;
+	border-bottom: 1px solid #222;
+}
+
+.callflows-port .search_box .searchsubmit1 {
+	float: left;
+	height: 20px;
+	width: 23px;
+}
+.callflows-port .search_box .searchsubmit2 {
+	float: left;
+	height: 20px;
+	width: 26px;
+}
+
+.callflows-port .search_box .searchfield {
+	border: medium none;
+	float: left;
+	height: 14px;
+	width: 130px;
+	border-radius: 0px;
+	box-shadow: none;
+}
+
+.callflows-port .search_box .searchfield:focus {
+	border: none;
+	border-color: transparent;
+	-webkit-box-shadow: none;
+	-moz-box-shadow: none;
+	box-shadow: none;
+}
+
+/********** Receive Fax **********/
+
+.callflows-port#fax_callflow_popup #t_38_checkbox {
+	margin-top: 8px;
+}
+
+/* Missed call alert */
+#missed_call_alert_popup {
+	width: 540px;
+}
+#missed_call_alert_popup .buttons-center {
+	margin-top: 10px;
+}
+
+#missed_call_alert_popup form {
+	margin-bottom: 0;
+	margin-top: 20px;
+}
+
+/* Collect DTMF Popup */
+.dialog_popup.collect-dtmf-popup .form_content .popup_field {
+	padding-bottom: 0;
+}

src/apps/callflows/submodules/qubicle/qubicle.js

@@ -0,0 +1,93 @@
+define(function(require) {
+	var $ = require('jquery'),
+		_ = require('underscore'),
+		monster = require('monster');
+
+	var app = {
+		requests: {},
+
+		subscribe: {
+			'callflows.fetchActions': 'qubicleDefineActions'
+		},
+
+		qubicleDefineActions: function(args) {
+			var self = this,
+				callflow_nodes = args.actions;
+
+			$.extend(callflow_nodes, {
+				'qubicle[id=*]': {
+					name: self.i18n.active().callflows.qubicle.qubicle,
+					icon: 'support',
+					category: self.i18n.active().oldCallflows.advanced_cat,
+					module: 'qubicle',
+					tip: self.i18n.active().callflows.qubicle.qubicle_tip,
+					data: {
+					},
+					rules: [
+						{
+							type: 'quantity',
+							maxSize: '1'
+						}
+					],
+					isUsable: 'true',
+					isListed: false,
+					weight: 30,
+					caption: function(node, caption_map) {
+						var id = node.getMetadata('id'),
+							returned_value = '';
+
+						if (id in caption_map) {
+							returned_value = caption_map[id].name;
+						}
+
+						return returned_value;
+					},
+					edit: function(node, callback) {
+						self.qubicleList(function(data) {
+							var popup_html = $(monster.template(self, 'qubicle-callflowEdit', {
+									items: _.sortBy(data, 'name'),
+									selected: node.getMetadata('id') || ''
+								})),
+								popup;
+
+							$('#add', popup_html).click(function() {
+								node.setMetadata('id', $('#queue_selector', popup_html).val());
+
+								node.caption = $('#queue_selector option:selected', popup_html).text();
+
+								popup.dialog('close');
+							});
+
+							popup = monster.ui.dialog(popup_html, {
+								title: self.i18n.active().callflows.qubicle.qubicle,
+								minHeight: '0',
+								beforeClose: function() {
+									if (typeof callback === 'function') {
+										callback();
+									}
+								}
+							});
+						});
+					}
+				}
+			});
+		},
+
+		qubicleList: function(callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'qubicleQueues.list',
+				data: {
+					accountId: self.accountId,
+					filters: { paginate: false }
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		}
+	};
+
+	return app;
+});

src/apps/callflows/submodules/resource/resource.js

@@ -0,0 +1,94 @@
+define(function(require){
+	var $ = require('jquery'),
+		_ = require('underscore'),
+		monster = require('monster');
+
+	var app = {
+		requests: {},
+
+		subscribe: {
+			'callflows.fetchActions': 'resourceDefineActions'
+		},
+
+		resourceDefineActions: function(args) {
+			var self = this,
+				callflow_nodes = args.actions;
+
+			$.extend(callflow_nodes, {
+				'offnet[]': {
+					name: self.i18n.active().callflows.resource.global_carrier,
+					icon: 'offnet',
+					category: self.i18n.active().oldCallflows.advanced_cat,
+					module: 'offnet',
+					tip: self.i18n.active().callflows.resource.global_carrier_tip,
+					data: {},
+					rules: [
+						{
+							type: 'quantity',
+							maxSize: '0'
+						}
+					],
+					isUsable: 'true',
+					weight: 140,
+					caption: function(node, caption_map) {
+						return '';
+					},
+					edit: function(node, callback) {
+						if(typeof callback == 'function') {
+							callback();
+						}
+					}
+				},
+				'resources[]': {
+					name: self.i18n.active().callflows.resource.account_carrier,
+					icon: 'resource',
+					category: self.i18n.active().oldCallflows.advanced_cat,
+					module: 'resources',
+					tip: self.i18n.active().callflows.resource.account_carrier_tip,
+					data: {},
+					rules: [
+						{
+							type: 'quantity',
+							maxSize: '0'
+						}
+					],
+					isUsable: 'true',
+					weight: 150,
+					caption: function(node, caption_map) {
+						return '';
+					},
+					edit: function(node, callback) {
+						var popup, popup_html;
+
+						popup_html = $(monster.template(self, 'resource-account_carrier',  {
+							data_resource: {
+								'hunt_account_id': node.getMetadata('hunt_account_id') || '',
+							}
+						}));
+
+						$('#add', popup_html).click(function() {
+							var hunt_id = $('#hunt_account_id', popup_html).val();
+
+							if(hunt_id) {
+								node.setMetadata('hunt_account_id', hunt_id);
+							}
+
+							popup.dialog('close');
+						});
+
+						popup = monster.ui.dialog(popup_html, {
+							title: self.i18n.active().callflows.resource.account_carrier_title,
+							beforeClose: function() {
+								if(typeof callback == 'function') {
+									 callback();
+								}
+							}
+						});
+					}
+				}
+			});
+		}
+	};
+
+	return app;
+});

src/apps/callflows/submodules/temporalset/temporalset.css

@@ -0,0 +1,10 @@
+.callflows-port #temporalset-form .items-selector-wrapper {
+	width: 535px;
+	margin-left: 99px;
+}
+
+.callflows-port .warning-no-save {
+	display: inline-block;
+	color: red;
+	margin-right: 10px;
+}

src/apps/callflows/submodules/temporalset/temporalset.js

@@ -0,0 +1,369 @@
+define(function(require){
+	var $ = require('jquery'),
+		_ = require('underscore'),
+		monster = require('monster');
+
+	var app = {
+		requests: {},
+
+		subscribe: {
+			'callflows.fetchActions': 'temporalsetDefineActions',
+			'callflows.temporalset.edit': '_temporalsetEdit'
+		},
+
+		temporalsetSave: function(form_data, data, success, error) {
+			var self = this,
+				normalized_data = self.temporalsetNormalizeData($.extend(true, {}, data.data, form_data), form_data);
+
+			if (typeof data.data === 'object' && data.data.id) {
+				self.temporalSetUpdate(normalized_data, function(_data, status) {
+					success && success(_data, status, 'update');
+				});
+			} else {
+				self.temporalSetCreate(normalized_data, function(_data, status) {
+					success & success(_data, status, 'create');
+				});
+			}
+		},
+
+		temporalsetPopupEdit: function(args) {
+			var self = this,
+				popup,
+				popup_html,
+				data = args.data,
+				callback = args.callback,
+				data_defaults = args.data_defaults;
+
+			popup_html = $('<div class="inline_popup callflows-port"><div class="main_content inline_content"/></div>');
+
+			self.temporalsetEdit(data, popup_html, $('.inline_content', popup_html), {
+				save_success: function(_data) {
+					popup.dialog('close');
+
+					if (typeof callback === 'function') {
+						callback(_data);
+					}
+				},
+				delete_success: function() {
+					popup.dialog('close');
+
+					if (typeof callback === 'function') {
+						callback({ data: {} });
+					}
+				},
+				after_render: function() {
+					popup = monster.ui.dialog(popup_html, {
+						title: (data.id) ? self.i18n.active().callflows.temporalset.editSet : self.i18n.active().callflows.temporalset.createSet
+					});
+				}
+			}, data_defaults);
+		},
+
+		// Added for the subscribed event to avoid refactoring temporalsetEdit
+		_temporalsetEdit: function(args) {
+			var self = this;
+			self.temporalsetEdit(args.data, args.parent, args.target, args.callbacks, args.data_defaults);
+		},
+
+		temporalsetEdit: function(data, _parent, _target, _callbacks, data_defaults) {
+			var self = this,
+				parent = _parent || $('#temporalset-content'),
+				target = _target || $('#temporalset-view', parent),
+				_callbacks = _callbacks || {},
+				callbacks = {
+					save_success: _callbacks.save_success,
+					save_error: _callbacks.save_error,
+					delete_success: _callbacks.delete_success,
+					delete_error: _callbacks.delete_error,
+					after_render: _callbacks.after_render
+				},
+				defaults = {
+					data: $.extend(true, {
+						extra: {
+							showSave: true
+						}
+					}, data_defaults || {}),
+					field_data: {}
+				};
+
+			self.temporalSetGetData((data || {}).id, function(results) {
+				var formattedData = self.temporalsetFormatData(results.temporalSet),
+					templateData = $.extend(true, defaults, { data: formattedData, field_data: { rules: results.temporalRules } });
+
+				self.temporalsetRender(templateData, target, callbacks);
+
+				if (typeof callbacks.after_render === 'function') {
+					callbacks.after_render();
+				}
+			});/*
+
+			if (typeof data === 'object' && data.id) {
+				self.temporalSetGet(data.id, function(_data, status) {
+					var oldFormatData = { data: _data };
+
+					self.temporalsetFormatData(oldFormatData);
+
+					self.temporalsetRender($.extend(true, defaults, oldFormatData), target, callbacks);
+
+					if (typeof callbacks.after_render === 'function') {
+						callbacks.after_render();
+					}
+				});
+			} else {
+				self.temporalsetRender(defaults, target, callbacks);
+
+				if (typeof callbacks.after_render === 'function') {
+					callbacks.after_render();
+				}
+			}*/
+		},
+
+		temporalSetGetData: function(id, callback) {
+			var self = this;
+
+			monster.parallel({
+				'temporalSet': function(callback) {
+					if (id) {
+						self.temporalSetGet(id, function(data) {
+							callback && callback(null, data);
+						});
+					} else {
+						callback && callback(null, {});
+					}
+				},
+				'temporalRules': function(callback) {
+					self.temporalSetGetAllRules(function(data) {
+						callback && callback(null, data);
+					});
+				}
+			},
+			function(err, results) {
+				callback && callback(results);
+			});
+		},
+
+		temporalSetFormatRules: function(data) {
+			var self = this,
+				mapRules = _.indexBy(data.field_data.rules, 'id'),
+				formattedData = {};
+
+			formattedData.available = _.map(data.field_data.rules, function(rule) {
+				return { key: rule.id, value: rule.name };
+			});
+
+			formattedData.selected = _.chain(data.data.temporal_rules)
+				.filter(function(id) {
+					if (mapRules.hasOwnProperty(id)) {
+						return id;
+					}
+				}).map(function(id) {
+					return {
+						key: id,
+						value: mapRules[id].name
+					};
+				}).value();
+
+			return formattedData;
+		},
+
+		temporalsetRender: function(data, target, callbacks) {
+			var self = this,
+				temporalset_html = $(monster.template(self, 'temporalset-callflowEdit', data)),
+				temporalsetForm = temporalset_html.find('#temporalset-form'),
+				widgetRules = self.temporalSetFormatRules(data);
+
+			var widget = monster.ui.linkedColumns(temporalset_html.find('.items-selector-wrapper'), widgetRules.available, widgetRules.selected, {
+				i18n: {
+					columnsTitles: {
+						available: self.i18n.active().callflows.temporalset.unselectedTOD,
+						selected: self.i18n.active().callflows.temporalset.selectedTOD
+					}
+				},
+				containerClasses: 'skinny'
+			});
+
+			monster.ui.validate(temporalsetForm);
+
+			$('*[rel=popover]', temporalset_html).popover({
+				trigger: 'focus'
+			});
+
+			self.winkstartTabs(temporalset_html);
+
+			$('.temporalset-save', temporalset_html).click(function(ev) {
+				ev.preventDefault();
+
+				var $this = $(this);
+
+				if (!$this.hasClass('disabled')) {
+					$this.addClass('disabled');
+
+					if (monster.ui.valid(temporalsetForm)) {
+						var form_data = monster.ui.getFormData('temporalset-form');
+						form_data.temporal_rules = widget.getSelectedItems();
+
+						form_data = self.temporalsetCleanFormData(form_data);
+
+						self.temporalsetSave(form_data, data, callbacks.save_success);
+					} else {
+						$this.removeClass('disabled');
+						monster.ui.alert('error', self.i18n.active().callflows.temporalset.there_were_errors_on_the_form);
+					}
+				}
+			});
+
+			$('.temporalset-delete', temporalset_html).click(function(ev) {
+				ev.preventDefault();
+
+				monster.ui.confirm(self.i18n.active().callflows.temporalset.are_you_sure_you_want_to_delete, function() {
+					self.temporalSetDelete(data.data.id, callbacks.delete_success);
+				});
+			});
+
+			(target)
+				.empty()
+				.append(temporalset_html);
+		},
+
+		temporalsetCleanFormData: function(form_data) {
+			return form_data;
+		},
+
+		temporalsetNormalizeData: function(merged_data, form_data) {
+			// Because extend doesn't merge arrays properly
+			delete merged_data.temporal_rules;
+			merged_data.temporal_rules = form_data.temporal_rules;
+
+			delete merged_data.extra;
+
+			return merged_data;
+		},
+
+		temporalsetFormatData: function(data) {
+			data.extra = data.extra || {};
+			data.extra.showSave = true;
+			data.extra.showDelete = data.id ? true : false;
+
+			if (data.hasOwnProperty('ui_metadata') && data.ui_metadata.hasOwnProperty('origin') && data.ui_metadata.origin === 'voip') {
+				data.extra.showSave = false;
+
+				if (!monster.util.isSuperDuper()) {
+					data.extra.showDelete = false;
+				}
+			}
+
+			return data;
+		},
+
+		temporalsetDefineActions: function(args) {
+			var self = this,
+				callflow_nodes = args.actions;
+
+			$.extend(callflow_nodes, {
+				'temporal_set[]': {
+					name: self.i18n.active().callflows.temporalset.name,
+					module: 'temporal_set',
+					listEntities: function(callback) {
+						self.temporalSetList(function(data) {
+							callback && callback(data);
+						});
+					},
+					editEntity: 'callflows.temporalset.edit'
+				}
+			});
+		},
+
+		temporalSetGetAllRules: function(callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'temporalRule.list',
+				data: {
+					accountId: self.accountId,
+					filters: { paginate:false }
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		temporalSetList: function(callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'temporalSet.list',
+				data: {
+					accountId: self.accountId,
+					filters: { paginate:false }
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		temporalSetGet: function(temporalSetId, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'temporalSet.get',
+				data: {
+					accountId: self.accountId,
+					setId: temporalSetId
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		temporalSetCreate: function(data, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'temporalSet.create',
+				data: {
+					accountId: self.accountId,
+					data: data
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		temporalSetUpdate: function(data, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'temporalSet.update',
+				data: {
+					accountId: self.accountId,
+					setId: data.id,
+					data: data
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		temporalSetDelete: function(temporalSetId, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'temporalSet.delete',
+				data: {
+					accountId: self.accountId,
+					setId: temporalSetId
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		}
+	};
+
+	return app;
+});

src/apps/callflows/submodules/timeofday/timeofday.css

@@ -0,0 +1,75 @@
+.callflows-port #timeofday-form {
+	color: #EBEBEB;
+}
+
+.callflows-port #timeofday-form .time-wrapper-field {
+	height: 50px;
+	padding: 10px 20px 0 0;
+}
+
+.callflows-port #timeofday-form #days_checkboxes .fake_checkbox {
+	float: left;
+	color: #eeeeee;
+	width: 15px;
+	height: 20px;
+	line-height: 20px;
+	text-align: center;
+	padding: 0px;
+	margin: 0px;
+	border-top: 1px solid #000000;
+	border-bottom: 1px solid #000000;
+	border-right: 1px solid #000000;
+	background-color: #989898;
+	cursor: pointer;
+}
+
+.callflows-port #timeofday-form #days_checkboxes .fake_checkbox:first-child {
+	border-left: 1px solid #000000;
+	border-radius: 5px 0 0 5px;
+}
+
+.callflows-port #timeofday-form #days_checkboxes .fake_checkbox:last-child {
+	border-radius: 0 5px 5px 0;
+}
+
+.callflows-port #timeofday-form #days_checkboxes .fake_checkbox:hover {
+	background-color: #BEBEBE;
+}
+
+.callflows-port #timeofday-form #days_checkboxes .fake_checkbox.checked {
+	background-color: #05ADDC;
+}
+
+.callflows-port #timeofday-form .time-wrapper label.monster-invalid {
+	margin-top: 0;
+	position: absolute;
+}
+
+
+.callflows-port #timeofday-form .time-wrapper-field .time-wrapper {
+	width: 233px;
+	padding: 0;
+	margin: 0 0 0 20px;
+	float: left;
+}
+
+.callflows-port #timeofday-form .time-wrapper-field .checkbox-container {
+	float: left;
+	margin-left: 20px;
+}
+
+
+.callflows-port #timeofday-form .time-wrapper-field .checkbox-container label.monster-checkbox {
+	text-align: left;
+	padding-top: 0;
+	margin-top: 5px;
+}
+
+.callflows-port #timeofday-form .timepicker:first-child {
+	margin-left: 0;
+}
+
+.callflows-port #timeofday-form .timepicker {
+	width: 80px;
+	margin: 0 10px;
+}

src/apps/callflows/submodules/user/user.css

@@ -0,0 +1,171 @@
+.callflows-port #user-form input[disabled=disabled] {
+	background: #ccc;
+}
+
+.callflows-port #user-form #equipment {
+	text-align: center;
+	font-size: 12px;
+	font-family: 'Helvetica';
+}
+
+.callflows-port #user-form #equipment .help_box {
+	color: #333333;
+	line-height: 12px;
+}
+
+.callflows-port #user-form #equipment .add_device {
+	margin-top: 15px;
+	display: inline-block;
+}
+
+.callflows-port #user-form #equipment .add_device:hover a {
+	color: #333333;
+}
+
+.callflows-port #user-form #equipment .add_device:hover .add_device_icon {
+	background-position: 0 -24px;
+	cursor: pointer;
+}
+
+.callflows-port #user-form #equipment #tab_devices  {
+	border: 2px solid #666666;
+	border-radius: 15px 15px 15px 15px;
+	color: #666666;
+	margin: 20px auto auto;
+	width: 560px;
+}
+
+.callflows-port #user-form #equipment #tab_devices .action_device {
+	color: #666666;
+	cursor: pointer;
+	text-decoration: underline;
+	line-height: 30px;
+}
+
+.callflows-port #user-form #equipment #tab_devices .action_device:not(:first-child) {
+	margin-left: 10px;
+}
+.callflows-port #user-form #equipment #tab_devices .action_device:hover {
+	color: #05addc;
+}
+
+.callflows-port #user-form #equipment #tab_devices .column:not(.fifth) {
+	border-right: 1px solid #A6A6A6;
+}
+
+.callflows-port #user-form #equipment #tab_devices .column {
+	float: left;
+	text-align: center;
+	height: 30px;
+	line-height: 30px;
+}
+
+.callflows-port #user-form #equipment #tab_devices .column.first {
+	width: 190px;
+	overflow: hidden;
+	text-align:center;
+}
+
+.callflows-port #user-form #equipment #tab_devices .column.second {
+	width: 99px;
+}
+
+.callflows-port #user-form #equipment #tab_devices .column.third {
+	min-width: 49px;
+}
+
+.callflows-port #user-form #equipment #tab_devices .rows .column.third {
+	background-image: url('../../style/static/images/red_phone.png');
+	background-repeat: no-repeat;
+	background-position: 16px center;
+}
+
+.callflows-port #user-form #equipment #tab_devices .rows .column.third.registered,.callflows-port #user-form #equipment #tab_devices .rows .column.third.cellphone {
+	background-image: url('../../style/static/images/green_phone.png');
+}
+
+.callflows-port #user-form #equipment #tab_devices .rows .column.third.disabled {
+	background-image: url('../../style/static/images/gray_phone.png') !important;
+}
+
+.callflows-port #user-form #equipment #tab_devices .column.fourth {
+	width: 59px;
+}
+
+.callflows-port #user-form #equipment #tab_devices .column.fourth .enabled_checkbox {
+	margin-top: 8px;
+}
+
+.callflows-port #user-form #equipment #tab_devices .column.fifth {
+	width: 159px;
+}
+
+.callflows-port #user-form #equipment #tab_devices .column.merged {
+	width: 560px;
+	border-right: none;
+}
+
+.callflows-port #user-form #equipment #tab_devices .row {
+	height: 30px;
+	margin-left: 0px;
+}
+
+.callflows-port #user-form #equipment #tab_devices .row.title {
+	background-color: #dddddd !important;
+	border-bottom: 2px solid #666666 !important;
+	border-radius: 15px 15px 0px 0px;
+	font-weight: bold;
+}
+
+.callflows-port #user-form #equipment #tab_devices .row:not(:last-child) {
+	border-bottom: 1px solid #A6A6A6;
+}
+
+.callflows-port #user-form #equipment #tab_devices .row:last-child {
+	border-radius: 0px 0px 15px 15px;
+}
+
+.callflows-port #user-form #equipment #tab_devices .row:nth-child(odd) {
+	background-color: #eeeeee;
+}
+
+.callflows-port #user-form #equipment #tab_devices .row:nth-child(even) {
+	background-color: #dddddd;
+}
+
+.callflows-port #user-form #username_label {
+	color: #05addc;
+	text-align: left;
+	font-weight: bold;
+}
+
+.callflows-port #user-form .shoutcast-div {
+	display: none;
+}
+
+.callflows-port #user-form .shoutcast-div.active {
+	display: block;
+}
+
+/* Hotdesk devices */
+.callflows-port #user-form #hotdesk_devices {
+	/*width: 400px;*/
+	width: 320px;
+}
+
+.callflows-port #user-form #hotdesk_devices .row .column:nth-child(1) {
+	width: 300px;
+}
+
+.callflows-port #user-form #hotdesk_devices .row .column:nth-child(2) {
+	width: 80px;
+}
+
+.callflows-port #user-form #hotdesk_devices .row .column.merged {
+	/* width: 400px; */
+	width: 320px;
+}
+
+.callflows-port #user-form #hotdesk_devices .row input[type="checkbox"] {
+	margin-top: 10px;
+}

src/apps/callflows/submodules/vmbox/vmbox.js

@@ -0,0 +1,634 @@
+define(function(require){
+	var $ = require('jquery'),
+		_ = require('underscore'),
+		monster = require('monster'),
+		timezone = require('monster-timezone');
+
+	var app = {
+		requests: {},
+
+		subscribe: {
+			'callflows.fetchActions': 'vmboxDefineActions',
+			'callflows.vmbox.edit': '_vmboxEdit'
+		},
+
+		vmboxPopupEdit: function(args) {
+			var self = this,
+				data = args.data,
+				callback = args.callback,
+				data_defaults = args.data_defaults || {},
+				popup,
+				popup_html = $('<div class="inline_popup callflows-port"><div class="inline_content main_content"/></div>');
+
+			self.vmboxEdit(data, popup_html, $('.inline_content', popup_html), {
+				save_success: function(_data) {
+					popup.dialog('close');
+
+					if(typeof callback == 'function') {
+						callback(_data);
+					}
+				},
+				delete_success: function() {
+					popup.dialog('close');
+
+					if(typeof callback == 'function') {
+						callback({ data: {} });
+					}
+				},
+				after_render: function() {
+					popup = monster.ui.dialog(popup_html, {
+						title: (data.id) ? self.i18n.active().callflows.vmbox.edit_voicemail_box_title : self.i18n.active().callflows.vmbox.create_voicemail_box_title
+					});
+				}
+			}, data_defaults);
+		},
+
+		// Added for the subscribed event to avoid refactoring vmboxEdit
+		_vmboxEdit: function(args) {
+			var self = this;
+			self.vmboxEdit(args.data, args.parent, args.target, args.callbacks, args.data_defaults);
+		},
+
+		vmboxEdit: function(data, _parent, _target, _callbacks, data_defaults) {
+			var self = this,
+				parent = _parent || $('#vmbox-content'),
+				target = _target || $('#vmbox-view', parent),
+				_callbacks = _callbacks || {},
+				callbacks = {
+					save_success: _callbacks.save_success,
+					save_error: _callbacks.save_error,
+					delete_success: _callbacks.delete_success,
+					delete_error: _callbacks.delete_error,
+					after_render: _callbacks.after_render
+				},
+				defaults = {
+					data: $.extend(true, {
+						require_pin: true,
+						check_if_owner: true,
+						pin: '',
+						media: {},
+						timezone: 'inherit'
+					}, data_defaults || {}),
+
+					field_data: {
+						users: [],
+						media: []
+					}
+				};
+
+			monster.parallel({
+				media_list: function(callback) {
+					self.vmboxMediaList(function(_data) {
+						_data.unshift({
+							id: '',
+							name: self.i18n.active().callflows.vmbox.not_set
+						});
+
+						defaults.field_data.media = _data;
+
+						callback(null, _data);
+					});
+				},
+				user_list: function(callback) {
+					self.vmboxUserList(function(_data) {
+						_data.unshift({
+							id: '',
+							first_name: self.i18n.active().callflows.vmbox.no,
+							last_name: self.i18n.active().callflows.vmbox.owner
+						});
+
+						defaults.field_data.users = _data;
+
+						callback(null, _data);
+					});
+				},
+				get_vmbox: function(callback) {
+					if(typeof data == 'object' && data.id) {
+						self.vmboxGet(data.id, function(_data) {
+							callback(null, _data);
+						});
+					}
+					else {
+						callback(null, {});
+					}
+				}
+			},
+			function(err, results) {
+				var render_data = defaults;
+
+				if(typeof data === 'object' && data.id) {
+					render_data = $.extend(true, defaults, { data: results.get_vmbox });
+				}
+
+				self.vmboxRender(render_data, target, callbacks);
+
+				if(typeof callbacks.after_render == 'function') {
+					callbacks.after_render();
+				}
+			});
+		},
+
+		vmboxFormatData: function(data) {
+			var self = this;
+
+			data.data.extra = data.data.extra || {};
+
+			data.data.extra.recipients = (data.data.notify_email_addresses || []).toString();
+
+			return data;
+		},
+
+		vmboxRender: function(data, target, callbacks) {
+			var self = this,
+				formattedData = self.vmboxFormatData(data),
+				vmbox_html = $(monster.template(self, 'vmbox-edit', formattedData)),
+				vmboxForm = vmbox_html.find('#vmbox-form');
+
+			timezone.populateDropdown($('#timezone', vmbox_html), data.data.timezone||'inherit', {inherit: self.i18n.active().defaultTimezone});
+
+			monster.ui.validate(vmboxForm, {
+				rules: {
+					'mailbox': {
+						required: true,
+						digits: true
+					},
+					'pin': {
+						digits: true,
+						minlength: 4
+					},
+					'name': {
+						required: true
+					}
+				}
+			});
+
+			$('*[rel=popover]:not([type="text"])', vmbox_html).popover({
+				trigger: 'hover'
+			});
+
+			$('*[rel=popover][type="text"]', vmbox_html).popover({
+				trigger: 'focus'
+			});
+
+			self.winkstartTabs(vmbox_html);
+
+
+			$('#owner_id', vmbox_html).change(function() {
+				if($(this).val()) {
+					self.callApi({
+						resource: 'user.get',
+						data: {
+							accountId: self.accountId,
+							userId: $(this).val()
+						},
+						success: function(data) {
+							if('timezone' in data.data) {
+								$('#timezone', vmbox_html).val(data.data.timezone);
+							}
+						}
+					});
+				}
+			});
+
+			if(!$('#owner_id', vmbox_html).val()) {
+				$('#edit_link', vmbox_html).hide();
+			}
+
+			$('#owner_id', vmbox_html).change(function() {
+				if(!$('#owner_id option:selected', vmbox_html).val()) {
+					$('#edit_link', vmbox_html).hide();
+					$('#timezone', vmbox_html).val(timezone.getLocaleTimezone());
+				}
+				else {
+					 $('#edit_link', vmbox_html).show();
+				}
+			});
+
+			$('.inline_action', vmbox_html).click(function(ev) {
+				var _data = ($(this).data('action') == 'edit') ? { id: $('#owner_id', vmbox_html).val() } : {},
+					_id = _data.id;
+
+				ev.preventDefault();
+
+				monster.pub('callflows.user.popupEdit', {
+					data: _data,
+					callback: function(_data) {
+						/* Create */
+						if(!_id) {
+							$('#owner_id', vmbox_html).append('<option id="'+ _data.id  +'" value="'+ _data.id +'">'+ _data.first_name + ' ' + _data.last_name  +'</option>')
+							$('#owner_id', vmbox_html).val(_data.id);
+
+							$('#edit_link', vmbox_html).show();
+							$('#timezone', vmbox_html).val(_data.timezone);
+						}
+						else {
+							/* Update */
+							if('id' in _data) {
+								$('#owner_id #'+_data.data.id, vmbox_html).text(_data.first_name + ' ' + _data.last_name);
+								$('#timezone', vmbox_html).val(_data.timezone);
+							}
+							/* Delete */
+							else {
+								$('#owner_id #'+_id, vmbox_html).remove();
+								$('#edit_link', vmbox_html).hide();
+								$('#timezone', vmbox_html).val('America/Los_Angeles');
+							}
+						}
+					}
+				});
+			});
+
+			if(!$('#media_unavailable', vmbox_html).val()) {
+				$('#edit_link_media', vmbox_html).hide();
+			}
+
+			$('#media_unavailable', vmbox_html).change(function() {
+				!$('#media_unavailable option:selected', vmbox_html).val() ? $('#edit_link_media', vmbox_html).hide() : $('#edit_link_media', vmbox_html).show();
+			});
+
+			$('.inline_action_media', vmbox_html).click(function(ev) {
+				var _data = ($(this).data('action') == 'edit') ? { id: $('#media_unavailable', vmbox_html).val() } : {},
+					_id = _data.id;
+
+				ev.preventDefault();
+
+				monster.pub('callflows.media.editPopup', {
+					data: _data,
+					callback: function(_data) {
+						/* Create */
+						if(!_id) {
+							$('#media_unavailable', vmbox_html).append('<option id="'+ _data.id  +'" value="'+ _data.id +'">'+ _data.name +'</option>')
+							$('#media_unavailable', vmbox_html).val(_data.id);
+
+							$('#edit_link_media', vmbox_html).show();
+						}
+						else {
+							/* Update */
+							if('id' in _data) {
+								$('#media_unavailable #'+_data.id, vmbox_html).text(_data.name);
+							}
+							/* Delete */
+							else {
+								$('#media_unavailable #'+_id, vmbox_html).remove();
+								$('#edit_link_media', vmbox_html).hide();
+							}
+						}
+					}
+				});
+			});
+
+
+			var validateEmail = function (email) {
+					var re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
+					return re.test(email);
+				},
+				getRecipients = function() {
+					var list = $('#recipients_list', vmbox_html).val().replace(/\s+/g, '').split(',');
+
+					return list.filter(function(email) { return validateEmail(email) });
+				};
+
+			$('.vmbox-save', vmbox_html).click(function(ev) {
+				ev.preventDefault();
+
+				var $this = $(this);
+
+				if(!$this.hasClass('disabled')) {
+					$this.addClass('disabled');
+
+					if(monster.ui.valid(vmboxForm)) {
+						var form_data = monster.ui.getFormData('vmbox-form');
+
+						form_data.notify_email_addresses = getRecipients();
+
+						/* self.clean_form_data(form_data); */
+
+						if('field_data' in data) {
+							delete data.field_data;
+						}
+
+						self.vmboxSave(form_data, data, callbacks.save_success);
+					}
+					else {
+						$this.removeClass('disabled');
+					}
+				}
+			});
+
+			$('.vmbox-delete', vmbox_html).click(function(ev) {
+				ev.preventDefault();
+
+				monster.ui.confirm(self.i18n.active().callflows.vmbox.are_you_sure_you_want_to_delete, function() {
+					self.vmboxDelete(data.data.id, callbacks.delete_success);
+				});
+			});
+
+			(target)
+				.empty()
+				.append(vmbox_html);
+		},
+
+		vmboxSave: function(form_data, data, success, error) {
+			var self = this,
+				normalized_data = self.vmboxNormalizeData($.extend(true, {}, data.data, form_data), form_data);
+
+			if(typeof data.data == 'object' && data.data.id) {
+				self.vmboxUpdate(normalized_data, function(_data, status) {
+					if(typeof success == 'function') {
+						success(_data, status, 'update');
+					}
+				});
+			}
+			else {
+				self.vmboxCreate(normalized_data, function(_data, status) {
+					if(typeof success == 'function') {
+						success(_data, status, 'create');
+					}
+				});
+			}
+		},
+
+		vmboxNormalizeData: function(mergedData, formData) {
+			if(!mergedData.owner_id) {
+				delete mergedData.owner_id;
+			}
+
+			if(!mergedData.media.unavailable) {
+				delete mergedData.media.unavailable;
+			}
+
+			if(mergedData.pin === '') {
+				delete mergedData.pin;
+			}
+
+			if(mergedData.timezone && mergedData.timezone === 'inherit') {
+				delete mergedData.timezone;
+			}
+
+			if (mergedData.media_extension === 'default') {
+				delete mergedData.media_extension;
+			}
+
+			mergedData.not_configurable = !mergedData.extra.allow_configuration;
+
+			// extend doesn't override arrays...
+			mergedData.notify_email_addresses = formData.notify_email_addresses;
+
+			delete mergedData.extra;
+
+			return mergedData;
+		},
+
+		vmboxDefineActions: function(args) {
+			var self = this,
+				callflow_nodes = args.actions,
+				getVoicemailNode = function(hasCategory) {
+					var action = {
+						name: self.i18n.active().callflows.vmbox.voicemail,
+						icon: 'voicemail',
+						module: 'voicemail',
+						tip: self.i18n.active().callflows.vmbox.voicemail_tip,
+						data: {
+							id: 'null'
+						},
+						rules: [
+							{
+								type: 'quantity',
+								maxSize: '1'
+							}
+						],
+						isUsable: 'true',
+						weight: 50,
+						caption: function(node, caption_map) {
+							var id = node.getMetadata('id'),
+								returned_value = '';
+
+							if(id in caption_map) {
+								returned_value = caption_map[id].name;
+							}
+
+							return returned_value;
+						},
+						edit: function(node, callback) {
+							var _this = this;
+
+							self.vmboxList(function(data) {
+									var popup, popup_html;
+
+									popup_html = $(monster.template(self, 'vmbox-callflowEdit', {
+										items: _.sortBy(data, 'name'),
+										selected: node.getMetadata('id') || ''
+									}));
+
+									if($('#vmbox_selector option:selected', popup_html).val() == undefined) {
+										$('#edit_link', popup_html).hide();
+									}
+
+									$('.inline_action', popup_html).click(function(ev) {
+										var _data = ($(this).data('action') == 'edit') ?
+														{ id: $('#vmbox_selector', popup_html).val() } : {};
+
+										ev.preventDefault();
+
+										self.vmboxPopupEdit({
+											data: _data, 
+											callback: function(vmbox) {
+												node.setMetadata('id', vmbox.id || 'null');
+
+												node.caption = vmbox.name || '';
+
+												popup.dialog('close');
+											}
+										});
+									});
+
+									$('#add', popup_html).click(function() {
+										node.setMetadata('id', $('#vmbox_selector', popup_html).val());
+
+										node.caption = $('#vmbox_selector option:selected', popup_html).text();
+
+										popup.dialog('close');
+									});
+
+									popup = monster.ui.dialog(popup_html, {
+										title: self.i18n.active().callflows.vmbox.voicemail_title,
+										minHeight: '0',
+										beforeClose: function() {
+											if(typeof callback == 'function') {
+												callback();
+											}
+										}
+									});
+								}
+							);
+						},
+						listEntities: function(callback) {
+							self.callApi({
+								resource: 'voicemail.list',
+								data: {
+									accountId: self.accountId,
+									filters: { paginate:false }
+								},
+								success: function(data, status) {
+									callback && callback(data.data);
+								}
+							});
+						},
+						editEntity: 'callflows.vmbox.edit'
+					};
+
+					if(hasCategory) {
+						action.category = self.i18n.active().oldCallflows.basic_cat;
+					}
+
+					return action;
+				};
+
+			$.extend(callflow_nodes, {
+				// some old nodes won't have an action set, so we need a node to support no "action"
+				// this is also the node we want to use when we drag it onto a callflow as we want the back-end to use the default action set in the schemas
+				'voicemail[id=*]': getVoicemailNode(true),
+
+				// the default action being "compose", the front-end needs a node handling the "compose" action. 
+				// but we set the flag to false so we don't have 2 times the same node in the right list of actions
+				'voicemail[id=*,action=compose]': getVoicemailNode(false),
+
+				'voicemail[action=check]': {
+					name: self.i18n.active().callflows.vmbox.check_voicemail,
+					icon: 'voicemail',
+					category: self.i18n.active().oldCallflows.advanced_cat,
+					module: 'voicemail',
+					tip: self.i18n.active().callflows.vmbox.check_voicemail_tip,
+					data: {
+						action: 'check'
+					},
+					rules: [
+						{
+							type: 'quantity',
+							maxSize: '1'
+						}
+					],
+					isUsable: 'true',
+					weight: 120,
+					caption: function(node, caption_map) {
+						return '';
+					},
+					edit: function(node, callback) {
+						if(typeof callback == 'function') {
+							callback();
+						}
+					}
+				}
+			});
+		},
+
+		vmboxList: function(callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'voicemail.list',
+				data: {
+					accountId: self.accountId,
+					filters: { paginate:false }
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		vmboxGet: function(vmboxId, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'voicemail.get',
+				data: {
+					accountId: self.accountId,
+					voicemailId: vmboxId
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		vmboxCreate: function(data, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'voicemail.create',
+				data: {
+					accountId: self.accountId,
+					data: data
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		vmboxUpdate: function(data, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'voicemail.update',
+				data: {
+					accountId: self.accountId,
+					voicemailId: data.id,
+					data: data
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		vmboxDelete: function(vmboxId, callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'voicemail.delete',
+				data: {
+					accountId: self.accountId,
+					voicemailId: vmboxId
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		vmboxMediaList: function(callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'media.list',
+				data: {
+					accountId: self.accountId,
+					filters: { paginate:false }
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		},
+
+		vmboxUserList: function(callback) {
+			var self = this;
+
+			self.callApi({
+				resource: 'user.list',
+				data: {
+					accountId: self.accountId,
+					filters: { paginate:false }
+				},
+				success: function(data) {
+					callback && callback(data.data);
+				}
+			});
+		}
+
+	};
+
+	return app;
+});

src/apps/callflows/views/accountSettings.html

@@ -0,0 +1,189 @@
+<div class="account-settings-container">
+	<div class="entity-header">
+		<div class="entity-title">{{ i18n.callflows.accountSettings.title }}</div>
+		<button type="button" class="back-button monster-button-secondary">{{ i18n.entityManager.backButton }}</button>
+	</div>
+	<div class="entity-content">
+		<form id="account_settings_form" class="form-horizontal">
+			<div class="tab-bar">
+				<ul class="nav nav-tabs account-settings-tabs">
+					<li class="tab-overview active"><a href="#account_settings_caller_id">Caller-ID</a></li>
+					<li class="tab-overview"><a href="#account_settings_blacklist">Blacklist</a></li>
+					<li class="tab-overview"><a href="#account_settings_misc">Misc</a></li>
+				</ul>
+			</div>
+
+			<div class="tab-content">
+				<div class="tab-pane active" id="account_settings_caller_id">
+					<div class="settings-section">
+						<div class="section-title">{{ i18n.callflows.accountSettings.callerId.titleInbound }}</div>
+						<div class="section-content">
+							<div class="control-group">
+								<label class="control-label">{{ i18n.callflows.accountSettings.callerId.nameLabel }}</label>
+								<div class="controls">
+									<input type="text" name="caller_id.internal.name" value="{{account.caller_id.internal.name}}"/>
+								</div>
+							</div>
+							<div class="control-group">
+								<label class="control-label">{{ i18n.callflows.accountSettings.callerId.numberLabel }}</label>
+								<div class="controls">
+								<select name="caller_id.internal.number" class="cid-number-select">
+									<option value="">{{ i18n.callflows.accountSettings.callerId.defaultNumber }}</option>
+									{{#each numberList}}
+										<option value="{{@key}}" {{#compare ../account.caller_id.internal.number '===' @key}}selected{{/compare}}>{{formatPhoneNumber @key}}</option>
+									{{/each}}
+								</select>
+								</div>
+							</div>
+						</div>
+					</div>
+
+					<div class="settings-section">
+						<div class="section-title">{{ i18n.callflows.accountSettings.callerId.titleOutbound }}</div>
+						<div class="section-content">
+							<div class="control-group">
+								<label class="control-label">{{ i18n.callflows.accountSettings.callerId.nameLabel }}</label>
+								<div class="controls">
+									<input type="text" name="caller_id.external.name" value="{{account.caller_id.external.name}}"/>
+								</div>
+							</div>
+							<div class="control-group">
+								<label class="control-label">{{ i18n.callflows.accountSettings.callerId.numberLabel }}</label>
+								<div class="controls">
+								<select name="caller_id.external.number" class="cid-number-select">
+									<option value="">{{ i18n.callflows.accountSettings.callerId.defaultNumber }}</option>
+									{{#each numberList}}
+										<option value="{{@key}}" {{#compare ../account.caller_id.external.number '===' @key}}selected{{/compare}}>{{formatPhoneNumber @key}}</option>
+									{{/each}}
+								</select>
+								</div>
+							</div>
+						</div>
+					</div>
+
+					<div class="settings-section">
+						<div class="section-title">{{ i18n.callflows.accountSettings.callerId.titleEmergency }}</div>
+						<div class="section-content">
+							<div class="control-group">
+								<label class="control-label">{{ i18n.callflows.accountSettings.callerId.nameLabel }}</label>
+								<div class="controls">
+									<input type="text" name="caller_id.emergency.name" value="{{account.caller_id.emergency.name}}"/>
+								</div>
+							</div>
+							<div class="control-group">
+								<label class="control-label">{{ i18n.callflows.accountSettings.callerId.numberLabel }}</label>
+								<div class="controls">
+								<select name="caller_id.emergency.number" class="cid-number-select">
+									<option value="">{{ i18n.callflows.accountSettings.callerId.defaultNumber }}</option>
+									{{#each numberList}}
+										<option value="{{@key}}" {{#compare ../account.caller_id.emergency.number '===' @key}}selected{{/compare}}>{{formatPhoneNumber @key}}</option>
+									{{/each}}
+								</select>
+								</div>
+							</div>
+						</div>
+					</div>
+				</div>
+
+				<div class="tab-pane" id="account_settings_blacklist">
+					<div class="settings-section">
+						<div class="section-title">{{ i18n.callflows.accountSettings.blacklist.title }}</div>
+						<div class="section-content">
+							<div class="blacklists-wrapper">
+							</div>
+						</div>
+					</div>
+				</div>
+
+				<div class="tab-pane" id="account_settings_misc">
+					<div class="settings-section">
+						<div class="section-title">{{ i18n.callflows.accountSettings.musicOnHold.title }}</div>
+						<div class="section-content">
+							<div class="control-group">
+								<label class="control-label">{{ i18n.callflows.accountSettings.musicOnHold.dropdownLabel }}</label>
+								<div class="controls">
+									<select name="music_on_hold.media_id" class="media-dropdown">
+										<option value="" {{#unless account.music_on_hold.media_id}}selected{{/unless}}>
+											{{ i18n.callflows.accountSettings.musicOnHold.default }}
+										</option>
+										<option value="{{silenceMedia}}" {{#compare account.music_on_hold.media_id '===' silenceMedia}}selected{{/compare}}>
+											{{ i18n.callflows.accountSettings.musicOnHold.silence }}
+										</option>
+										<option value="shoutcast" {{#if extra.isShoutcast}}selected{{/if}}>
+											{{ i18n.callflows.accountSettings.musicOnHold.shoutcastURL }}
+										</option>
+										{{#each mediaList}}
+											<option value="{{this.id}}" {{#compare ../account.music_on_hold.media_id '===' this.id}}selected{{/compare}}>{{this.name}}</option>
+										{{/each}}
+									</select>
+									<button type="button" class="monster-button-primary upload-toggle" data-toggle="button">{{ i18n.upload }}</button>
+								</div>
+							</div>
+							<div class="shoutcast-div{{#if extra.isShoutcast}} active{{/if}}">
+								<div class="control-group">
+									<label class="control-label">{{ i18n.callflows.accountSettings.musicOnHold.shoutcastURL }}<i class="help-popover fa fa-question-circle" data-original-title="{{ i18n.callflows.accountSettings.musicOnHold.shoutcastURLHelp }}" data-placement="top" data-toggle="tooltip"></i></label>
+									<div class="controls">
+										<input type="text" class="shoutcast-url-input" name="extra.shoutcastUrl" value="{{account.music_on_hold.media_id}}"/>
+									</div>
+								</div>
+							</div>
+							<div class="upload-div">
+								<input type="file" class="upload-input" accept="audio/*">
+								<button type="button" class="monster-button-success upload-action upload-submit"><i class="fa fa-upload"></i></button>
+								<button type="button" class="monster-button-danger upload-action upload-cancel"><i class="fa fa-times"></i></button>
+							</div>
+						</div>
+					</div>
+
+					<div class="settings-section">
+						<div class="section-title">{{ i18n.callflows.accountSettings.preflow.title }}</div>
+						<div class="section-content">
+							<div class="control-group">
+								<label class="control-label">{{ i18n.callflows.accountSettings.preflow.dropdownLabel }}<i class="help-popover fa fa-question-circle" data-original-title="{{ i18n.callflows.accountSettings.preflow.help }}" data-placement="top" data-toggle="tooltip"></i></label>
+								<div class="controls">
+									<select name="preflow.always" class="preflow-callflows-dropdown">
+										{{#select account.preflow.always}}
+											<option value="_disabled">{{ i18n.callflows.accountSettings.preflow.empty }}</option>
+											{{#each extra.preflowCallflows}}
+												<option value="{{id}}">{{friendlyName}}</option>
+											{{/each}}
+										{{/select}}
+									</select>
+								</div>
+							</div>
+						</div>
+					</div>
+					<div class="settings-section">
+						<div class="section-title">
+							{{ i18n.callflows.accountSettings.outboundFlags.title }}
+						</div>
+						<div class="section-content">
+							<div class="control-group">
+								<label for="dynamic" class="control-label">
+									{{ i18n.callflows.accountSettings.outboundFlags.labels.dynamic }}
+									<i class="help-popover fa fa-question-circle" data-original-title="{{ i18n.callflows.accountSettings.outboundFlags.help }}" data-placement="top" data-toggle="tooltip"></i>
+								</label>
+								<div class="controls">
+									<input type="text" id="dynamic" name="outbound_flags.dynamic" value="{{account.outbound_flags.dynamic}}">
+								</div>
+							</div>
+							<div class="control-group">
+								<label for="static" class="control-label">
+									{{ i18n.callflows.accountSettings.outboundFlags.labels.static }}
+									<i class="help-popover fa fa-question-circle" data-original-title="{{ i18n.callflows.accountSettings.outboundFlags.help }}" data-placement="top" data-toggle="tooltip"></i>
+								</label>
+								<div class="controls">
+									<input type="text" id="static" name="outbound_flags.static" value="{{account.outbound_flags.static}}">
+								</div>
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+
+			<div class="action-bar clearfix">
+				<button type="button" class="monster-button-success account-settings-update pull-right">{{i18n.update}}</button>
+			</div>
+		</form>
+	</div>
+</div>

src/apps/callflows/views/addNumber.html

@@ -0,0 +1,45 @@
+<div class="dialog_popup_new add_number_popup">
+	<form class="form-inline">
+		<div class="popup_field">
+			<input type="radio" id="number_type_1" name="number_type" value="your_numbers" checked="checked"></input>
+			<label for="number_type_1">{{ i18n.oldCallflows.available_numbers }}</label>
+
+			<div class="list_numbers_content">
+				<select id="list_numbers">
+					{{#each phoneNumbers}}
+						<option value="{{ this.phoneNumber }}">{{ formatPhoneNumber this.phoneNumber }}</option>
+					{{/each}}
+				</select>
+
+				<ul class="nav pull-right number-selection-sidelink">
+					<li class="dropdown">
+						<a href="#" class="dropdown-toggle buy-dropdown monster-link" data-toggle="dropdown" data-target="#">
+							<i class="fa fa-shopping-cart monster-green fa-lg"></i>
+							{{ i18n.callflows.buyNumbers }}
+						</a>
+						<ul class="dropdown-menu" role="menu">
+							<li><a class="buy-link" data-type="regular" href="#">{{ i18n.callflows.buyLocal }}</a></li>
+							<li><a class="buy-link" data-type="tollfree" href="#">{{ i18n.callflows.buyTollfree }}</a></li>
+							<!-- <li><a class="buy-link" data-type="vanity" href="#">{{ i18n.callflows.buyVanity }}</a></li> -->
+						</ul>
+					</li>
+				</ul>
+				
+			</div>
+		</div>
+
+		<div class="popup_field">
+			<input type="radio" id="number_type_2" name="number_type" value="extension"></input>
+			<label for="number_type_2">{{ i18n.oldCallflows.extension }}</label>
+
+			<div class="extensions_content">
+				<input id="add_number_text" placeholder="2001" type="text" name="number"/>
+				<a href="javascript:void(0);" class="number-selection-sidelink search-extension-link">{{ i18n.callflows.findExtension }}</a>
+			</div>
+		</div>
+
+		<div class="buttons">
+			<button class="monster-button monster-button-primary add_number">{{ i18n.oldCallflows.add }}</button>
+		</div>
+	</form>
+</div>

src/apps/callflows/views/blacklist-addNumber.html

@@ -0,0 +1,7 @@
+<div class="number-wrapper" data-number="{{number}}">
+	{{number}}
+	
+	<div class="actions-number pull-right">
+		<a class="delete-number icon medium trash" href="javascript:void(0);"></a>
+	</div>
+</div>

src/apps/callflows/views/blacklist-edit.html

@@ -0,0 +1,62 @@
+<div>
+	<div id="blacklist_wrapper">
+		<div class="whapp-header clearfix">
+			<h1>{{#if data.id}}{{ i18n.callflows.blacklist.edit }}{{else}}{{ i18n.callflows.blacklist.create }}{{/if}}</h1>
+		</div>
+
+		<div>
+			<form id="blacklist-form" action="#" method="post">
+				<div class="pill-content">
+					<div class="active basic_view" id="basic">
+						<div class="clearfix">
+							<label for="blacklistname">{{ i18n.callflows.blacklist.name }}</label>
+							<div class="input">
+								<input class="span4" id="blacklistname" name="name" type="text" value="{{data.name}}"/>
+							</div>
+						</div>
+						<div class="clearfix">
+							<label for="should_block_anonymous">{{ i18n.callflows.blacklist.blockAnonymous }}</label>
+							<div class="input">
+							{{#monsterSwitch}}
+								<input type="checkbox" id="should_block_anonymous" name="should_block_anonymous"{{#if data.should_block_anonymous}} checked{{/if}}>
+							{{/monsterSwitch}}
+							</div>
+						</div>
+
+						<div class="list-numbers">
+							<h4>{{ i18n.callflows.blacklist.listNumbers }}</h4>
+							<div class="add-number">
+								<div class="number-wrapper placeholder">
+									<div class="create-text">
+										<i class="icon-plus-sign"></i>
+										{{ i18n.callflows.blacklist.addNumber }}
+									</div>
+									
+									<div class="create-inputs">
+										<input type="text" id="number_value" name="extra.numberValue" class="input-medium">
+										<button class="monster-button-primary" id="add_number">{{ i18n.add }}</button>
+										<a href="javascript:void(0);" id="cancel_number">{{ i18n.cancel }}</a>
+									</div>
+								</div>
+							</div>
+
+							<div class="saved-numbers">
+							</div>
+						</div>
+
+						<div class="clearfix">
+							<p><i class="fa fa-question help-text-icon"></i>{{ i18n.callflows.blacklist.help }}</p>
+						</div>
+					</div>
+				</div>
+			</form>
+
+			<div class="buttons-right">
+				{{#if data.id}}
+					<button class="monster-button monster-button-danger blacklist-delete">{{ i18n.delete }}</button>
+				{{/if}}
+				<button class="monster-button monster-button-success blacklist-save">{{ i18n.save }}</button>
+			</div>
+		</div>
+	</div>
+</div>

src/apps/callflows/views/branch.html

@@ -0,0 +1,31 @@
+<div class="child">
+	{{#compare node.actionName "!==" "root"}}
+		{{#if display_key}}    
+			<div class="span_arrow small"></div>
+		{{else}}
+			<div class="span_arrow large"></div>
+		{{/if}}
+
+		<div class="clear"></div>
+
+		<div class="div_line" id="divLine{{ node.id }}"/>
+
+		<div class="clear"></div>
+
+		{{#if display_key}}
+			<div class="div_option">
+				<a class="a_link_option" href="#">{{ node.key_caption }}</a>
+			</div>
+		{{/if}}
+	{{/compare}}
+
+	<div class="branch">
+		{{#compare node.actionName "!==" "root"}}
+			<div id="{{ node.id }}" name="{{ node.actionName }}" class="node icons_black"></div>
+		{{else}}
+			<div id="{{ node.id }}" name="root" class="node icons_black root"></div>
+		{{/compare}}
+
+		<div class="children"></div>
+	</div>
+</div>

src/apps/callflows/views/buttons.html

@@ -0,0 +1,4 @@
+<span class="wrapper_callflow_buttons">
+	<div class="monster-button monster-button-danger non-fixed delete">{{ i18n.oldCallflows.delete_callflow }}</div>
+	<div class="monster-button monster-button-success non-fixed save">{{ i18n.oldCallflows.save_changes }}</div>
+</span>

src/apps/callflows/views/callflow-edit_dialog.html

@@ -0,0 +1,23 @@
+<div class="dialog_popup callflows-port">
+	<h1>{{ i18n.oldCallflows.connect_caller_to_another_callflow }}</h1>
+	<form name="form" method="post" action="#">
+		<div class="form_content">
+			<div class="popup_field">
+				<label for="object-selector">{{ i18n.callflows.ringGroupToggle.callflow }}</label>
+				<div class="select_wrapper">
+					<select id="object-selector">
+						{{#select objects.selected}}
+							{{#each objects.items}}
+									<option value="{{ id }}">{{ name }}</option>
+							{{/each}}
+						{{/select}}
+					</select>
+					<div class="clear"/>
+				</div>
+			</div>
+		</div>
+	</form>
+	<div class="buttons-center">
+		<button id="add" class="monster-button monster-button-primary">{{ i18n.save }}</button>
+	</div>
+</div>

src/apps/callflows/views/callflow-manager.html

@@ -0,0 +1,62 @@
+<div>
+	<div class="left-bar-container">
+		<div class="search-box">
+			<i class="fa fa-search"></i>
+			<input type="text" class="search-query" placeholder="{{ i18n.search }}">
+		</div>
+		<div class="list-add">
+			<i class="fa fa-plus-circle fa-lg"></i>
+			<span>{{ i18n.callflows.addCallflow }}</span>
+		</div>
+		<div class="list-container clearfix">
+			<ul class="list"></ul>
+		</div>
+	</div>
+
+	<div class="callflow-content listing-mode">
+		<div class="entity-header">
+			<div class="entity-title">{{ i18n.entityManager.callflowsTitle }}</div>
+			
+			<button type="button" class="back-button monster-button-secondary">{{ i18n.entityManager.backButton }}</button>
+			{{#if canToggleCallflows}}
+				<div class="superadmin-mode">
+					<span class="switch-title">
+						<i class="help-popover fa fa-question-circle" data-toggle="tooltip" data-placement="right" data-original-title="{{ i18n.entityManager.showSystemCallflows.help }}"></i>
+						{{ i18n.entityManager.showSystemCallflows.title }}
+					</span>
+					{{#monsterSwitch}}
+						<input type="checkbox" id="switch_role" {{#if hasAllCallflows}} checked{{/if}} />
+					{{/monsterSwitch}}
+				</div>
+			{{/if}}
+		</div>
+		<div class="callflow-view clearfix">
+			<div class="real-content"> 
+				<div class="callflow-help"/>
+
+				<div id="ws_callflow" class="clearfix">
+					<div class="tools">
+						<div id="ws_cf_tools"></div>
+					</div>
+					<div class="flowchart">
+						<div id="callflow_header">
+							<div id="pending_change">
+								<span>{{ i18n.oldCallflows.you_have_modified_this_callflow }}</span>
+							</div>
+						</div>
+						<div id="hidden_callflow_warning">{{ i18n.callflows.hiddenCallflowWarning }}</div>
+						<div class="callflow">
+							<div>
+								<span class="flow">
+									<div class="buttons"></div>
+									<div id="ws_cf_flow"></div>
+								</span>
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	</div>
+</div>
+

src/apps/callflows/views/callflowList-searchLink.html

@@ -0,0 +1,5 @@
+<li class="search-link">
+	<div>{{i18n.oldCallflows.searchLink}}</div>
+	<div>"<span class="search-value"></span>"</div>
+	<div class="search-reset">{{i18n.oldCallflows.searchReset}}</div>
+</li>

src/apps/callflows/views/callflowList.html

@@ -0,0 +1,8 @@
+{{#each callflows}}
+	<li class="list-element" data-id="{{this.id}}" data-search="{{this.title}} {{this.description}} {{this.id}}">
+		<div class="link">
+			<div class="title">{{this.title}}</div>
+			<div class="description">{{this.description}}</div>
+		</div>
+	</li>
+{{/each}}

src/apps/callflows/views/conference-callflowEdit.html

@@ -0,0 +1,26 @@
+<div class="dialog_popup callflows-port">
+	<h1>{{ i18n.callflows.conference.connect_caller_to_conference }}</h1>
+	<form name="form" method="post" action="#">
+		<div class="form_content">
+			<div class="popup_field">
+				<label for="conference_selector">{{ i18n.callflows.conference.which_conference}}</label>
+				<div class="select_wrapper">
+					<select id="conference_selector">
+					{{#select selected}}
+						{{#each items}}
+							<option value="{{id}}">{{name}}</option>
+						{{/each}}
+					{{/select}}
+					</select>
+					<div class="action_links_div">
+						<div id="edit_link"><a class="inline_action" data-action="edit" href="#">{{ i18n.callflows.conference.edit_conference_options}}</a></div>
+						<div><a class="inline_action" data-action="create" href="#">{{ i18n.callflows.conference.add_conference}}</a></div>
+					</div>
+				</div>
+			</div>
+		</div>
+	</form>
+	<div class="buttons-center">
+		<button id="add" class="monster-button monster-button-primary">{{ i18n.save }}</button>
+	</div>
+</div>

src/apps/callflows/views/conference-edit.html

@@ -0,0 +1,134 @@
+<div>
+	<div class="whapp-header clearfix">
+		<h1>{{#if data.id}}{{ i18n.callflows.conference.edit_conference }}{{else}}{{ i18n.callflows.conference.create_conference }}{{/if}}</h1>
+		<div class="buttons-right pasted view-buttons">
+			<button class="btn black basic activate">{{ i18n.callflows.conference.basic }}</button>
+			<button class="btn black advanced">{{ i18n.callflows.conference.advanced }}</button>
+		</div>
+	</div>
+
+	<div>
+		<ul class="tabs" data-tabs="tabs">
+			<li class="active"><a href="#basic">{{ i18n.callflows.conference.basic }}</a></li>
+			<li><a href="#options"><span class="icon wrench_screw"></span>{{ i18n.callflows.conference.options }}</a></li>
+			<li><a href="#conference_server"><span class="icon conference"></span>{{ i18n.callflows.conference.conference_server }}</a></li>
+		</ul>
+
+		<form id="conference_form" action="" method="post" >
+			<div class="pill-content">
+				<div class="active basic_view" id="basic">
+					<div class="clearfix">
+						<label for="">{{ i18n.callflows.conference.conference_name }}</label>
+						<div class="input">
+							<input class="span4" id="name" name="name" type="text" placeholder="Name" value="{{data.name}}" rel="popover" data-content="{{ i18n.callflows.conference.conference_name_data_content }}"/>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<label for="owner_id">{{ i18n.callflows.conference.assign_to }}</label>
+						<div class="input">
+							<span rel="popover" data-content="{{ i18n.callflows.conference.assign_to_data_content }}">
+								<select name="owner_id" id="owner_id" class="medium" >
+								{{#select data.owner_id}}
+									{{#each field_data.users}}
+										<option value="{{id}}" id="{{id}}">{{first_name}} {{last_name}}</option>
+									{{/each}}
+								{{/select}}
+								</select>
+								<div class="edit_create">
+									<a id="edit_link"  class="inline_action" data-action="edit" href="#">{{ i18n.callflows.conference.edit }}</a>
+									<a class="inline_action" data-action="create" href="#">{{ i18n.callflows.conference.create }}</a>
+								</div>
+							</span>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<label for="member_pins_string">{{ i18n.callflows.conference.pins }}</label>
+						<div class="input">
+							<input class="span4" id="member_pins_string" name="member.pins_string" type="text" placeholder="PIN" value="{{data.member.pins_string}}" rel="popover" data-content="{{ i18n.callflows.conference.pins_data_content }}"/>
+						</div>
+					</div>
+				</div>
+
+				<div id="options">
+					<div class="clearfix">
+						<div class="input">
+							<ul class="inputs-list">
+								<li>
+									<label>
+										<span rel="popover" data-content="{{ i18n.callflows.conference.join_the_conference_muted_data_content }}">
+											<input type="checkbox" id="member_join_muted" name="member.join_muted"{{#if data.member.join_muted}} checked="checked"{{/if}} />
+											<span>{{ i18n.callflows.conference.join_the_conference_muted }}</span>
+										</span>
+									</label>
+								</li>
+							</ul>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<div class="input">
+							<ul class="inputs-list">
+								<li>
+									<label>
+										<span rel="popover" data-content="{{ i18n.callflows.conference.join_the_conference_deaf_data_content }}">
+											<input type="checkbox" id="member_join_deaf" name="member.join_deaf"{{#if data.member.join_deaf}} checked="checked"{{/if}} />
+											<span>{{ i18n.callflows.conference.join_the_conference_deaf }}</span>
+										</span>
+									</label>
+								</li>
+							</ul>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<div class="input">
+							<ul class="inputs-list">
+								<li>
+									<label>
+										<span rel="popover" data-content="{{ i18n.callflows.conference.play_entry_tone_help }}">
+											<input type="checkbox" id="play_entry_tone" name="play_entry_tone"{{#if data.play_entry_tone}} checked="checked"{{/if}} />
+											<span>{{ i18n.callflows.conference.play_entry_tone }}</span>
+										</span>
+									</label>
+								</li>
+							</ul>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<div class="input">
+							<ul class="inputs-list">
+								<li>
+									<label>
+										<span rel="popover" data-content="{{ i18n.callflows.conference.play_exit_tone_help }}">
+											<input type="checkbox" id="play_exit_tone" name="play_exit_tone"{{#if data.play_exit_tone}} checked="checked"{{/if}} />
+											<span>{{ i18n.callflows.conference.play_exit_tone }}</span>
+										</span>
+									</label>
+								</li>
+							</ul>
+						</div>
+					</div>
+				</div>
+
+				<div id="conference_server">
+					<div class="clearfix">
+						<label for="conference_numbers_string">{{ i18n.callflows.conference.numbers }}</label>
+						<div class="input">
+							<input class="span4" id="conference_numbers_string" name="conference_numbers_string" type="text" placeholder="{{ i18n.callflows.conference.numbers_placeholder }}" value="{{data.conference_numbers_string}}" rel="popover" data-content="{{ i18n.callflows.conference.numbers_data_content }}" />
+						</div>
+					</div>
+				</div>
+			</div>
+		</form>
+
+		<div class="buttons-right">
+			{{#if data.id}}
+				<button class="monster-button monster-button-danger conference-delete">{{ i18n.callflows.conference.delete }}</button>
+			{{/if}}
+			<button class="monster-button monster-button-success conference-save">{{ i18n.callflows.conference.save }}</button>
+		</div>
+	</div>
+</div>

src/apps/callflows/views/device-ata.html

@@ -0,0 +1,266 @@
+<div>
+	<div>
+		<div class="whapp-header clearfix">
+			{{#if data.id}}
+				<h1>{{ i18n.callflows.device.edit_ata }}</h1>
+			{{else}}
+				<h1>{{ i18n.callflows.device.add_a_ata }}</h1>
+			{{/if}}
+			<div class="buttons-right pasted view-buttons">
+				<button class="btn black basic activate">{{ i18n.callflows.device.basic }}</button>
+				<button class="btn black advanced">{{ i18n.callflows.device.advanced }}</button>
+			</div>
+		</div>
+	</div>
+	<div>
+		<ul class="tabs" data-tabs="tabs">
+			<li class="active"><a href="#basic">{{ i18n.callflows.device.basic }}</a></li>
+			<li><a href="#caller_id">{{ i18n.callflows.device.caller_id }}</a></li>
+			<li><a href="#sip_settings">{{ i18n.callflows.device.sip_settings }}</a></li>
+			<li><a href="#options">{{ i18n.callflows.device.options }}</a></li>
+			<li><a href="#restrictions">{{ i18n.callflows.device.restrictions }}</a></li>
+		</ul>
+		<form id="device-form" action="" method="post">
+			<div class="pill-content">
+				<div class="active basic_view" id="basic">
+					<div class="clearfix">
+						<label for="name">{{ i18n.callflows.device.device_nickname }}</label>
+						<div class="input">
+							<input class="span4" id="name" name="name" type="text" placeholder="{{ i18n.callflows.device.name }}" value="{{ data.name }}" rel="popover" data-content="{{ i18n.callflows.device.name_data_content }}" required/>
+						</div>
+					</div>
+
+					{{#unless field_data.hide_owner}}
+						<div class="clearfix">
+							<label for="owner_id">{{ i18n.callflows.device.assign_to }}</label>
+							<div class="input">
+								<span rel="popover" data-content="{{ i18n.callflows.device.belongs_to_data_content }}">
+									<select name="owner_id" id="owner_id" class="medium">
+										{{#select data.owner_id}}
+											{{#each field_data.users}}
+												<option value="{{id}}" id="{{id}}">{{first_name}} {{last_name}}</option>
+											{{/each}}
+										{{/select}}
+									</select>
+									<div class="edit_create">
+										<a id="edit_link"  class="inline_action" data-action="edit" href="#">{{ i18n.callflows.device.edit }}</a>
+										<a class="inline_action" data-action="create" href="#">{{ i18n.callflows.device.create }}</a>
+									</div>
+								</span>
+							</div>
+						</div>
+					{{/unless}}
+
+					<div class="clearfix">
+						<label for="mac_address">{{ i18n.callflows.device.device_mac_address }}</label>
+						<div class="input">
+							<input class="span4" id="mac_address" name="mac_address" type="text" placeholder="01:23:45:67:89:AB" value="{{ data.mac_address }}" rel="popover" data-content="{{ i18n.callflows.device.device_mac_address_data_content }}"/>
+							<span class="provisioner"></span>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<div class="input">
+							<ul class="inputs-list">
+								<li>
+									<label>
+										<span rel="popover" data-content="{{ i18n.callflows.device.enabled_data_content }}">
+											<input type="checkbox" id="enabled" name="enabled"{{#if data.enabled}} checked="checked"{{/if}}/>
+											<span>{{ i18n.callflows.device.enabled }}</span>
+										</span>
+									</label>
+								</li>
+							</ul>
+						</div>
+					</div>
+				</div>
+
+				<div id="caller_id">
+					<div class="clearfix">
+						<label for="name">{{ i18n.callflows.device.presence_id }}</label>
+						<div class="input">
+							<input class="span4" id="presence_id" name="presence_id" type="text" placeholder="{{ i18n.callflows.device.presence_id_placeholder }}" value="{{ data.presence_id }}" rel="popover" data-content="{{ i18n.callflows.device.presence_id_help }}"/>
+						</div>
+					</div>
+
+					<h3>{{ i18n.callflows.device.in_house_calls }}</h3>
+					<div class="clearfix">
+						<label for="caller_id_name_internal">{{ i18n.callflows.device.caller_id_name }}</label>
+						<div class="input">
+							<input class="span4" id="caller_id_name_internal" name="caller_id.internal.name" type="text" placeholder="{{ i18n.callflows.device.name }}" value="{{ data.caller_id.internal.name }}"  rel="popover" data-content="{{ i18n.callflows.device.caller_id_name_data_content }}" />
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<label for="caller_id_number_internal">{{ i18n.callflows.device.caller_id_number }}</label>
+						<div class="input">
+							<input class="span4" id="caller_id_number_internal" name="caller_id.internal.number" type="text" placeholder="+15555555555" value="{{ data.caller_id.internal.number }}" rel="popover" data-content="{{ i18n.callflows.device.caller_id_number_data_content }}"/>
+						</div>
+					</div>
+					<hr />
+
+					<h3>{{ i18n.callflows.device.outbound_calls }}</h3>
+					<div class="clearfix">
+						<label for="caller_id_name_external">{{ i18n.callflows.device.caller_id_name }}</label>
+						<div class="input">
+							<input class="span4" id="caller_id_name_external" name="caller_id.external.name" type="text" placeholder="{{ i18n.callflows.device.name }}" value="{{ data.caller_id.external.name }}" rel="popover" data-content="{{ i18n.callflows.device.caller_id_name_data_content2 }}" />
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<label for="caller_id_number_external">{{ i18n.callflows.device.caller_id_number }}</label>
+						<div class="input">
+							<input class="span4" id="caller_id_number_external" name="caller_id.external.number" type="text" placeholder="+15555555555" value="{{ data.caller_id.external.number }}" rel="popover" data-content="{{ i18n.callflows.device.caller_id_number_data_content2 }}"/>
+						</div>
+					</div>
+					<hr />
+
+					<h3>{{ i18n.callflows.device.emergency }}</h3>
+					<div class="clearfix">
+						<label for="caller_id_name_emergency">{{ i18n.callflows.device.caller_id_name }}</label>
+						<div class="input">
+							<input class="span4" id="caller_id_name_emergency" name="caller_id.emergency.name" type="text" placeholder="{{ i18n.callflows.device.name }}" value="{{ data.caller_id.emergency.name }}" rel="popover" data-content="{{ i18n.callflows.device.caller_id_name_data_content3 }}" />
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<label for="caller_id_number_emergency">{{ i18n.callflows.device.caller_id_number }}</label>
+						<div class="input">
+							<input class="span4" id="caller_id_number_emergency" name="caller_id.emergency.number" type="text" placeholder="+15555555555" value="{{ data.caller_id.emergency.number }}" rel="popover" data-content="{{ i18n.callflows.device.caller_id_number_data_content3 }}"/>
+						</div>
+					</div>
+				</div>
+
+
+				<div id="sip_settings">
+					<div class="clearfix">
+						<label for="sip_realm">{{ i18n.callflows.device.realm }}</label>
+						<div class="input">
+							<span class="uneditable-input">{{ field_data.sip.realm }}</span>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<label for="sip_method">{{ i18n.callflows.device.authentication_method }}</label>
+						<div class="input">
+							<select name="sip.method" id="sip_method" class="medium" rel="popover" data-content="{{ i18n.callflows.device.authentication_method_data_content }}">
+								{{#select data.sip.method}}
+									{{#each field_data.sip.methods}}
+										<option value="{{ @key }}">{{ this }}</option>
+									{{/each}}
+								{{/select}}
+							</select>
+						</div>
+					</div>
+
+					<div id="ip_block" class="clearfix">
+						<div class="clearfix">
+							<label for="sip_ip">{{ i18n.callflows.device.ip_address }}</label>
+							<div class="input">
+								<input class="span4" id="sip_ip" name="sip.ip" type="text" placeholder="255.255.255.255" value="{{ data.sip.ip }}" rel="popover" data-content="{{ i18n.callflows.device.ip_address_data_content }}"/>
+							</div>
+						</div>
+					</div>
+
+					<div id="username_block" class="clearfix">
+						<div class="clearfix">
+							<label for="sip_username">{{ i18n.callflows.device.username }}</label>
+							<div class="input">
+								<input class="span4" id="sip_username" name="sip.username" type="text" placeholder="{{ i18n.callflows.device.username }}" value="{{ data.sip.username }}" rel="popover" data-content="{{ i18n.callflows.device.username_data_content }}" required/>
+							</div>
+						</div>
+
+						<div class="clearfix">
+							<label for="sip_password">{{ i18n.callflows.device.password }}</label>
+							<div class="input">
+								<input class="span4" id="sip_password" name="sip.password" type="password" placeholder="" value="{{ data.sip.password }}" required/>
+							</div>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<label for="sip_invite_format">{{ i18n.callflows.device.invite_format }}</label>
+						<div class="input">
+							<select name="sip.invite_format" id="sip_invite_format" class="medium" rel="popover" data-content="{{ i18n.callflows.device.invite_format_data_content }}">
+								{{#select data.sip.invite_format}}
+									{{#each field_data.sip.invite_formats}}
+										<option value="{{ @key }}">{{ this }}</option>
+									{{/each}}
+								{{/select}}
+							</select>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<label for="sip_expire_seconds">{{ i18n.callflows.device.expire_seconds }}</label>
+						<div class="input">
+							<input class="span4" id="sip_expire_seconds" name="sip.expire_seconds" type="text" placeholder="{{ i18n.callflows.device.expire_seconds }}" value="{{ data.sip.expire_seconds }}" rel="popover" data-content="{{ i18n.callflows.device.expire_seconds_data_content }}" required/>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<label for="outbound_flags">{{ i18n.callflows.device.outbound_flags }}</label>
+						<div class="input">
+							<input class="span4" id="outbound_flags" name="outbound_flags" type="text" placeholder="{{ i18n.callflows.device.outbound_flags }}" value="{{ data.outbound_flags }}" rel="popover" data-content="{{ i18n.callflows.device.outbound_flags_data_content }}"/>
+						</div>
+					</div>
+				</div>
+
+				<div id="options">
+					<div class="clearfix">
+						<div class="input">
+							<ul class="inputs-list">
+								<li>
+									<label>
+										<span rel="popover" data-content="{{ i18n.callflows.device.hide_from_contact_list_data_content }}">
+											<input id="contact_list_exclude" type="checkbox" name="contact_list.exclude"{{#if data.contact_list.exclude}} checked="checked"{{/if}} />
+											<span>{{ i18n.callflows.device.hide_from_contact_list }}</span>
+										</span>
+									</label>
+								</li>
+							</ul>
+						</div>
+					</div>
+				</div>
+
+				<div id="restrictions">
+					<div class="clearfix">
+						<div class="input">
+							<ul class="inputs-list">
+								<li>
+									<label>
+										<span rel="popover" data-content="{{ i18n.callflows.device.closed_groups_data_content }}">
+											<input type="checkbox" name="extra.closed_groups"{{#compare data.call_restriction.closed_groups.action "===" "deny"}} checked="checked"{{/compare}}/>
+											<span>{{ i18n.callflows.device.closed_groups }}</span>
+										</span>
+									</label>
+								</li>
+							</ul>
+						</div>
+					</div>
+
+					{{#each field_data.call_restriction}}
+					<div class="clearfix">
+						<label>{{ this.friendly_name }}</label>
+						<div class="input">
+							<select name="call_restriction.{{ @key }}.action" class="medium" rel="popover">
+								{{#select this.value }}
+									<option value="allow">{{ @root.i18n.callflows.device.allow }}</option>
+									<option value="deny">{{ @root.i18n.callflows.device.deny }}</option>
+									<option value="inherit">{{ @root.i18n.callflows.device.inherit }}</option>
+								{{/select}}
+							</select>
+						</div>
+					</div>
+					{{/each}}
+				</div>
+			</div>
+		</form>
+		<div class="buttons-right">
+			{{#if data.id}}
+				<button class="monster-button monster-button-danger device-delete">{{ i18n.callflows.device.delete }}</button>
+			{{/if}}
+			<button class="monster-button monster-button-success device-save">{{ i18n.callflows.device.save }}</button>
+		</div>
+	</div>
+</div>

src/apps/callflows/views/device-callflowEdit.html

@@ -0,0 +1,40 @@
+<div class="dialog_popup callflows-port">
+	<h1>{{ i18n.callflows.device.connect_caller_to_device }}</h1>
+	<form name="form" method="post" action="#">
+		<div class="form_content">
+			<div class="popup_field">
+				<label for="device_selector">{{ i18n.callflows.device.which_device }}</label>
+				<div class="select_wrapper">
+					<select id="device_selector">
+						{{#select objects.selected}}
+							{{#each objects.items}}
+								<option value="{{ this.id }}">{{ this.name }}</option>
+							{{/each}}
+						{{/select}}
+					</select>
+					<div class="action_links_div">
+						<div id="edit_link"><a class="inline_action" data-action="edit" href="#">{{ i18n.callflows.device.edit_phone_options }}</a></div>
+						<div><a class="inline_action" data-action="create" href="#">{{ i18n.callflows.device.add_new_device }}</a></div>
+					</div>
+				</div>
+				<div class="clear"/>
+			</div>
+
+			<div class="parameter_div">
+				{{ i18n.callflows.device.ring_this_device_for }} <input type="text" class="size2" name="parameter_input" id="parameter_input" value="{{ parameter.value }}"/> {{ i18n.callflows.device.seconds }}.
+			</div>
+
+			<div class="parameter_div">
+				<input type="checkbox"{{#if can_call_self}} checked="checked"{{/if}} id="device_can_call_self">
+				{{ i18n.callflows.device.allow_this_device_to_call_itself }}
+
+				<div class="parameter_description">{{ i18n.callflows.device.when_you_check_this_box }}</div>
+			</div>
+		</div>
+	</form>
+	<div class="buttons-center">
+		<button id="add" class="monster-button monster-button-primary">{{ i18n.save }}</button>
+	</div>
+	<div class="clear"/>
+</div>
+

src/apps/callflows/views/device-cellphone.html

@@ -0,0 +1,131 @@
+<div>
+	<div>
+		<div class="whapp-header clearfix">
+			{{#if data.id}}
+				<h1>{{ i18n.callflows.device.edit_cell_phone }}</h1>
+			{{else}}
+				<h1>{{ i18n.callflows.device.add_a_cell_phone }}</h1>
+			{{/if}}
+			<div class="buttons-right pasted view-buttons">
+				<button class="btn black basic activate">{{ i18n.callflows.device.basic }}</button>
+				<button class="btn black advanced">{{ i18n.callflows.device.advanced }}</button>
+			</div>
+		</div>
+	</div>
+	<div>
+		<ul class="tabs" data-tabs="tabs">
+			<li class="active"><a href="#basic">{{ i18n.callflows.device.basic }}</a></li>
+			<li><a href="#options"><span class="icon wrench_screw"></span>{{ i18n.callflows.device.options }}</a></li>
+		</ul>
+		<form id="device-form" action="" method="post">
+			<div class="pill-content">
+				<div class="active basic_view" id="basic">
+					<div class="clearfix">
+						<label for="name">{{ i18n.callflows.device.name }}</label>
+						<div class="input">
+							<input class="span4" id="name" name="name" type="text" placeholder="{{ i18n.callflows.device.name }}" value="{{ data.name }}" rel="popover" data-content="{{ i18n.callflows.device.name_data_content }}" required/>
+						</div>
+					</div>
+
+					{{#unless field_data.hide_owner}}
+						<div class="clearfix">
+							<label for="owner_id">{{ i18n.callflows.device.belongs_to }}</label>
+							<div class="input">
+								<span rel="popover" data-content="{{ i18n.callflows.device.belongs_to_data_content }}">
+									<select name="owner_id" id="owner_id" class="medium">
+										{{#select data.owner_id}}
+											{{#each field_data.users}}
+												<option value="{{ id }}" id="{{ id }}">{{ first_name }} {{ last_name }}</option>
+											{{/each}}
+										{{/select}}
+									</select>
+									<div class="edit_create">
+										<a id="edit_link" class="inline_action" data-action="edit" href="#">{{ i18n.callflows.device.edit }}</a>
+										<a class="inline_action" data-action="create" href="#">{{ i18n.callflows.device.create }}</a>
+									</div>
+								</span>
+							</div>
+						</div>
+					{{/unless}}
+
+					<div class="clearfix">
+						<label for="call_forward_number">{{ i18n.callflows.device.number }}</label>
+						<div class="input">
+							<input class="span4" id="call_forward_number" name="call_forward.number" type="text" placeholder="{{ i18n.callflows.device.number }}" value="{{ data.call_forward.number }}" rel="popover" data-content="{{ i18n.callflows.device.number_data_content }}"/>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<div class="input">
+							<ul class="inputs-list">
+								<li>
+									<label>
+										<span rel="popover" data-content="{{ i18n.callflows.device.enabled_data_content }}">
+											<input type="checkbox" id="call_forward_enabled" name="call_forward.enabled"{{#if data.call_forward.enabled}} checked="checked"{{/if}}/>
+											<span>{{ i18n.callflows.device.enabled }}</span>
+										</span>
+									</label>
+								</li>
+							</ul>
+						</div>
+					</div>
+					<input type="hidden" value="{{ data.device_type }}" name="device_type"/>
+					<input type="hidden" value="false" name="extra.notify_unregister"/>
+				</div>
+
+				<div id="options">
+					<div class="clearfix">
+						<div class="input">
+							<ul class="inputs-list">
+								<li>
+									<label>
+										<span rel="popover" data-content="{{ i18n.callflows.device.require_key_press_data_content }}">
+											<input type="checkbox" id="call_forward_require_keypress" name="call_forward.require_keypress"{{#if data.call_forward.require_keypress}} checked="checked"{{/if}} />
+											<span>{{ i18n.callflows.device.require_key_press }}</span>
+										</span>
+									</label>
+								</li>
+							</ul>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<div class="input">
+							<ul class="inputs-list">
+								<li>
+									<label>
+										<span rel="popover" data-content="{{ i18n.callflows.device.keep_caller_id_data_content }}">
+											<input type="checkbox" id="call_forward_keep_caller_id" name="call_forward.keep_caller_id"{{#if data.call_forward.keep_caller_id}} checked="checked"{{/if}}/>
+											<span>{{ i18n.callflows.device.keep_caller_id }}</span>
+										</span>
+									</label>
+								</li>
+							</ul>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<div class="input">
+						   <ul class="inputs-list">
+							   <li>
+									<label>
+										<span rel="popover" data-content="{{ i18n.callflows.device.hide_from_contact_list_data_content }}">
+											<input id="contact_list_exclude" type="checkbox" name="contact_list.exclude"{{#if data.contact_list.exclude}} checked="checked"{{/if}} />
+											<span>{{ i18n.callflows.device.hide_from_contact_list }}</span>
+										</span>
+									</label>
+								</li>
+							</ul>
+					   </div>
+					</div>
+				</div>
+			</div>
+		</form>
+		<div class="buttons-right">
+			{{#if data.id}}
+				<button class="monster-button monster-button-danger device-delete">{{ i18n.delete }}</button>
+			{{/if}}
+			<button class="monster-button monster-button-success device-save">{{ i18n.save }}</button>
+		</div>
+	</div>
+</div>

src/apps/callflows/views/device-entity-element.html

@@ -0,0 +1,3 @@
+<div class="title standalone">
+	<i data-toggle="tooltip" data-placement="top" data-original-title="{{ tryI18n @root.i18n.callflows.device device_type }}" class="{{extra.deviceIcon}} {{#if extra.isRegistered}}monster-green{{else}}monster-red{{/if}}"></i>{{name}}</div>
+</div>

src/apps/callflows/views/device-fax.html

@@ -0,0 +1,289 @@
+<div>
+	<div>
+		<div class="whapp-header clearfix">
+			{{#if data.id}}
+				<h1>{{ i18n.callflows.device.edit_fax }}</h1>
+			{{else}}
+				<h1>{{ i18n.callflows.device.add_a_fax }}</h1>
+			{{/if}}
+			<div class="buttons-right pasted view-buttons">
+				<button class="btn black basic activate">{{ i18n.callflows.device.basic }}</button>
+				<button class="btn black advanced">{{ i18n.callflows.device.advanced }}</button>
+			</div>
+		</div>
+	</div>
+	<div>
+		<ul class="tabs" data-tabs="tabs">
+			<li class="active"><a href="#basic">{{ i18n.callflows.device.basic }}</a></li>
+			<li><a href="#caller_id">{{ i18n.callflows.device.caller_id }}</a></li>
+			<li><a href="#sip_settings">{{ i18n.callflows.device.sip_settings }}</a></li>
+			<li><a href="#options">{{ i18n.callflows.device.options }}</a></li>
+			<li><a href="#restrictions">{{ i18n.callflows.device.restrictions }}</a></li>
+		</ul>
+		<form id="device-form" action="" method="post">
+			<div class="pill-content">
+				<div class="active basic_view" id="basic">
+					<div class="clearfix">
+						<label for="name">{{ i18n.callflows.device.device_nickname }}</label>
+						<div class="input">
+							<input class="span4" id="name" name="name" type="text" placeholder="{{ i18n.callflows.device.name }}" value="{{ data.name }}" rel="popover" data-content="{{ i18n.callflows.device.name_data_content }}" required/>
+						</div>
+					</div>
+
+					{{#unless field_data.hide_owner}}
+						<div class="clearfix">
+							<label for="owner_id">{{ i18n.callflows.device.assign_to }}</label>
+							<div class="input">
+								<span rel="popover" data-content="{{ i18n.callflows.device.belongs_to_data_content }}">
+									<select name="owner_id" id="owner_id" class="medium">
+										{{#select data.owner_id}}
+											{{#each field_data.users}}
+												<option value="{{id}}" id="{{id}}">{{first_name}} {{last_name}}</option>
+											{{/each}}
+										{{/select}}
+									</select>
+									<div class="edit_create">
+										<a id="edit_link"  class="inline_action" data-action="edit" href="#">{{ i18n.callflows.device.edit }}</a>
+										<a class="inline_action" data-action="create" href="#">{{ i18n.callflows.device.create }}</a>
+									</div>
+								</span>
+							</div>
+						</div>
+					{{/unless}}
+
+					<div class="clearfix">
+						<label for="mac_address">{{ i18n.callflows.device.device_mac_address }}</label>
+						<div class="input">
+							<input class="span4" id="mac_address" name="mac_address" type="text" placeholder="01:23:45:67:89:AB" value="{{ data.mac_address }}" rel="popover" data-content="{{ i18n.callflows.device.device_mac_address_data_content }}"/>
+							<span class="provisioner"></span>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<div class="input">
+							<ul class="inputs-list">
+								<li>
+									<label>
+										<span rel="popover" data-content="{{ i18n.callflows.device.enabled_data_content }}">
+											<input type="checkbox" id="enabled" name="enabled"{{#if data.enabled}} checked="checked"{{/if}}/>
+											<span>{{ i18n.callflows.device.enabled }}</span>
+										</span>
+									</label>
+								</li>
+							</ul>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<div class="input">
+							<ul class="inputs-list">
+								<li>
+									<label>
+										<span rel="popover" data-content="{{ i18n.callflows.device.notify_when_unregistered_data_content }}">
+											<input type="checkbox" id="suppress_unregister_notifications" name="extra.notify_unregister"{{#unless data.suppress_unregister_notifications}} checked="checked"{{/unless}} />
+											<span>{{ i18n.callflows.device.notify_when_unregistered }}</span>
+										</span>
+									</label>
+								</li>
+							</ul>
+						</div>
+					</div>
+				</div>
+
+				<div id="caller_id">
+					<div class="clearfix">
+						<label for="name">{{ i18n.callflows.device.presence_id }}</label>
+						<div class="input">
+							<input class="span4" id="presence_id" name="presence_id" type="text" placeholder="{{ i18n.callflows.device.presence_id_placeholder }}" value="{{ data.presence_id }}" rel="popover" data-content="{{ i18n.callflows.device.presence_id_help }}"/>
+						</div>
+					</div>
+
+					<h3>{{ i18n.callflows.device.in_house_calls }}</h3>
+					<div class="clearfix">
+						<label for="caller_id_name_internal">{{ i18n.callflows.device.caller_id_name }}</label>
+						<div class="input">
+							<input class="span4" id="caller_id_name_internal" name="caller_id.internal.name" type="text" placeholder="{{ i18n.callflows.device.name }}" value="{{ data.caller_id.internal.name }}"  rel="popover" data-content="{{ i18n.callflows.device.caller_id_name_data_content }}" />
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<label for="caller_id_number_internal">{{ i18n.callflows.device.caller_id_number }}</label>
+						<div class="input">
+							<input class="span4" id="caller_id_number_internal" name="caller_id.internal.number" type="text" placeholder="+15555555555" value="{{ data.caller_id.internal.number }}" rel="popover" data-content="{{ i18n.callflows.device.caller_id_number_data_content }}"/>
+						</div>
+					</div>
+					<hr />
+
+					<h3>{{ i18n.callflows.device.outbound_calls }}</h3>
+					<div class="clearfix">
+						<label for="caller_id_name_external">{{ i18n.callflows.device.caller_id_name }}</label>
+						<div class="input">
+							<input class="span4" id="caller_id_name_external" name="caller_id.external.name" type="text" placeholder="{{ i18n.callflows.device.name }}" value="{{ data.caller_id.external.name }}" rel="popover" data-content="{{ i18n.callflows.device.caller_id_name_data_content2 }}" />
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<label for="caller_id_number_external">{{ i18n.callflows.device.caller_id_number }}</label>
+						<div class="input">
+							<input class="span4" id="caller_id_number_external" name="caller_id.external.number" type="text" placeholder="+15555555555" value="{{ data.caller_id.external.number }}" rel="popover" data-content="{{ i18n.callflows.device.caller_id_number_data_content2 }}"/>
+						</div>
+					</div>
+					<hr />
+
+					<h3>{{ i18n.callflows.device.emergency }}</h3>
+					<div class="clearfix">
+						<label for="caller_id_name_emergency">{{ i18n.callflows.device.caller_id_name }}</label>
+						<div class="input">
+							<input class="span4" id="caller_id_name_emergency" name="caller_id.emergency.name" type="text" placeholder="{{ i18n.callflows.device.name }}" value="{{ data.caller_id.emergency.name }}" rel="popover" data-content="{{ i18n.callflows.device.caller_id_name_data_content3 }}" />
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<label for="caller_id_number_emergency">{{ i18n.callflows.device.caller_id_number }}</label>
+						<div class="input">
+							<input class="span4" id="caller_id_number_emergency" name="caller_id.emergency.number" type="text" placeholder="+15555555555" value="{{ data.caller_id.emergency.number }}" rel="popover" data-content="{{ i18n.callflows.device.caller_id_number_data_content3 }}"/>
+						</div>
+					</div>
+				</div>
+
+
+				<div id="sip_settings">
+					<div class="clearfix">
+						<label for="sip_realm">{{ i18n.callflows.device.realm }}</label>
+						<div class="input">
+							<span class="uneditable-input">{{ field_data.sip.realm }}</span>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<label for="sip_method">{{ i18n.callflows.device.authentication_method }}</label>
+						<div class="input">
+							<select name="sip.method" id="sip_method" class="medium" rel="popover" data-content="{{ i18n.callflows.device.authentication_method_data_content }}">
+								{{#select data.sip.method}}
+									{{#each field_data.sip.methods}}
+										<option value="{{ @key }}">{{ this }}</option>
+									{{/each}}
+								{{/select}}
+							</select>
+						</div>
+					</div>
+
+					<div id="ip_block" class="clearfix">
+						<div class="clearfix">
+							<label for="sip_ip">{{ i18n.callflows.device.ip_address }}</label>
+							<div class="input">
+								<input class="span4" id="sip_ip" name="sip.ip" type="text" placeholder="255.255.255.255" value="{{ data.sip.ip }}" rel="popover" data-content="{{ i18n.callflows.device.ip_address_data_content }}"/>
+							</div>
+						</div>
+					</div>
+
+					<div id="username_block" class="clearfix">
+						<div class="clearfix">
+							<label for="sip_username">{{ i18n.callflows.device.username }}</label>
+							<div class="input">
+								<input class="span4" id="sip_username" name="sip.username" type="text" placeholder="{{ i18n.callflows.device.username }}" value="{{ data.sip.username }}" rel="popover" data-content="{{ i18n.callflows.device.username_data_content }}" required/>
+							</div>
+						</div>
+
+						<div class="clearfix">
+							<label for="sip_password">{{ i18n.callflows.device.password }}</label>
+							<div class="input">
+								<input class="span4" id="sip_password" name="sip.password" type="password" placeholder="" value="{{ data.sip.password }}" required/>
+							</div>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<label for="sip_invite_format">{{ i18n.callflows.device.invite_format }}</label>
+						<div class="input">
+							<select name="sip.invite_format" id="sip_invite_format" class="medium" rel="popover" data-content="{{ i18n.callflows.device.invite_format_data_content }}">
+								{{#select data.sip.invite_format}}
+									{{#each field_data.sip.invite_formats}}
+										<option value="{{ @key }}">{{ this }}</option>
+									{{/each}}
+								{{/select}}
+							</select>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<label for="sip_expire_seconds">{{ i18n.callflows.device.expire_seconds }}</label>
+						<div class="input">
+							<input class="span4" id="sip_expire_seconds" name="sip.expire_seconds" type="text" placeholder="{{ i18n.callflows.device.expire_seconds }}" value="{{ data.sip.expire_seconds }}" rel="popover" data-content="{{ i18n.callflows.device.expire_seconds_data_content }}" required/>
+						</div>
+					</div>
+				</div>
+
+				<div id="options">
+					<div class="clearfix">
+						<div class="input">
+							<ul class="inputs-list">
+								<li>
+									<label>
+										<span rel="popover" data-content="{{ i18n.callflows.device.hide_from_contact_list_data_content }}">
+											<input id="contact_list_exclude" type="checkbox" name="contact_list.exclude"{{#if data.contact_list.exclude}} checked="checked"{{/if}} />
+											<span>{{ i18n.callflows.device.hide_from_contact_list }}</span>
+										</span>
+									</label>
+								</li>
+							</ul>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<div class="input">
+							<ul class="inputs-list">
+								<li>
+									<label>
+										<span rel="popover" data-content="{{ i18n.callflows.device.t_38_data_content }}">
+											<input id="media_fax_option" type="checkbox" name="media.fax_option"{{#if data.media.fax_option}} checked="checked"{{/if}} />
+											<span>{{ i18n.callflows.device.t_38 }}</span>
+										</span>
+									</label>
+								</li>
+							</ul>
+						</div>
+					</div>
+				</div>
+
+				<div id="restrictions">
+					<div class="clearfix">
+						<div class="input">
+							<ul class="inputs-list">
+								<li>
+									<label>
+										<span rel="popover" data-content="{{ i18n.callflows.device.closed_groups_data_content }}">
+											<input type="checkbox" name="extra.closed_groups"{{#compare data.call_restriction.closed_groups.action "===" "deny"}} checked="checked"{{/compare}}/>
+											<span>{{ i18n.callflows.device.closed_groups }}</span>
+										</span>
+									</label>
+								</li>
+							</ul>
+						</div>
+					</div>
+
+					{{#each field_data.call_restriction}}
+					<div class="clearfix">
+						<label>{{ this.friendly_name }}</label>
+						<div class="input">
+							<select name="call_restriction.{{ @key }}.action" class="medium" rel="popover">
+								{{#select this.value }}
+									<option value="allow">{{ @root.i18n.callflows.device.allow }}</option>
+									<option value="deny">{{ @root.i18n.callflows.device.deny }}</option>
+									<option value="inherit">{{ @root.i18n.callflows.device.inherit }}</option>
+								{{/select}}
+							</select>
+						</div>
+					</div>
+					{{/each}}
+				</div>
+			</div>
+		</form>
+		<div class="buttons-right">
+			{{#if data.id}}
+				<button class="monster-button monster-button-danger device-delete">{{ i18n.callflows.device.delete }}</button>
+			{{/if}}
+			<button class="monster-button monster-button-success device-save">{{ i18n.callflows.device.save }}</button>
+		</div>
+	</div>
+</div>

src/apps/callflows/views/device-general_edit.html

@@ -0,0 +1,49 @@
+<div>
+	<div>
+		<div class="media_tabs">
+			<span class="buttons" device_type="sip_device">
+				<span class="icon white phone"/>
+				<span class="label_device">{{ i18n.callflows.device.voip_phone }}</span>
+			</span>
+
+			<span class="buttons" device_type="cellphone">
+				<span class="icon white active_phone"/>
+				<span class="label_device">{{ i18n.callflows.device.cell_phone }}</span>
+			</span>
+
+			<span class="buttons" device_type="smartphone">
+				<span class="icon white active_phone"/>
+				<span class="label_device">{{ i18n.callflows.device.smart_phone }}</span>
+			</span>
+
+			<span class="buttons" device_type="landline">
+				<span class="icon white active_phone"/>
+				<span class="label_device">{{ i18n.callflows.device.landline }}</span>
+			</span>
+			
+			<span class="buttons" device_type="softphone">
+				<span class="icon white menu1"/>
+				<span class="label_device">{{ i18n.callflows.device.soft_phone }}</span>
+			</span>
+
+			<span class="buttons" device_type="fax">
+				<span class="icon white phone"/>
+				<span class="label_device">{{ i18n.callflows.device.fax }}</span>
+			</span>
+
+			<span class="buttons" device_type="ata">
+				<span class="icon white phone"/>
+				<span class="label_device">{{ i18n.callflows.device.ata }}</span>
+			</span>
+
+			 <span class="buttons" device_type="sip_uri">
+				<span class="icon white phone"/>
+				<span class="label_device">{{ i18n.callflows.device.sip_uri }}</span>
+			</span>
+		</div>
+	</div>
+	
+	<div class="media_pane">
+
+	</div>
+</div>

src/apps/callflows/views/device-landline.html

@@ -0,0 +1,131 @@
+<div>
+	<div>
+		<div class="whapp-header clearfix">
+			{{#if data.id}}
+				<h1>{{ i18n.callflows.device.edit_landline }}</h1>
+			{{else}}
+				<h1>{{ i18n.callflows.device.add_a_landline }}</h1>
+			{{/if}}
+			<div class="buttons-right pasted view-buttons">
+				<button class="btn black basic activate">{{ i18n.callflows.device.basic }}</button>
+				<button class="btn black advanced">{{ i18n.callflows.device.advanced }}</button>
+			</div>
+		</div>
+	</div>
+	<div>
+		<ul class="tabs" data-tabs="tabs">
+			<li class="active"><a href="#basic">{{ i18n.callflows.device.basic }}</a></li>
+			<li><a href="#options"><span class="icon wrench_screw"></span>{{ i18n.callflows.device.options }}</a></li>
+		</ul>
+		<form id="device-form" action="" method="post">
+			<div class="pill-content">
+				<div class="active basic_view" id="basic">
+					<div class="clearfix">
+						<label for="name">{{ i18n.callflows.device.name }}</label>
+						<div class="input">
+							<input class="span4" id="name" name="name" type="text" placeholder="{{ i18n.callflows.device.name }}" value="{{ data.name }}" rel="popover" data-content="{{ i18n.callflows.device.name_data_content }}" required/>
+						</div>
+					</div>
+
+					{{#unless field_data.hide_owner}}
+						<div class="clearfix">
+							<label for="owner_id">{{ i18n.callflows.device.belongs_to }}</label>
+							<div class="input">
+								<span rel="popover" data-content="{{ i18n.callflows.device.belongs_to_data_content }}">
+									<select name="owner_id" id="owner_id" class="medium">
+										{{#select data.owner_id}}
+											{{#each field_data.users}}
+												<option value="{{ id }}" id="{{ id }}">{{ first_name }} {{ last_name }}</option>
+											{{/each}}
+										{{/select}}
+									</select>
+									<div class="edit_create">
+										<a id="edit_link"  class="inline_action" data-action="edit" href="#">{{ i18n.callflows.device.edit }}</a>
+										<a class="inline_action" data-action="create" href="#">{{ i18n.callflows.device.create }}</a>
+									</div>
+								</span>
+							</div>
+						</div>
+					{{/unless}}
+
+					<div class="clearfix">
+						<label for="call_forward_number">{{ i18n.callflows.device.number }}</label>
+						<div class="input">
+							<input class="span4" id="call_forward_number" name="call_forward.number" type="text" placeholder="{{ i18n.callflows.device.number }}" value="{{ data.call_forward.number }}" rel="popover" data-content="{{ i18n.callflows.device.number_data_content }}"/>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<div class="input">
+							<ul class="inputs-list">
+								<li>
+									<label>
+										<span rel="popover" data-content="{{ i18n.callflows.device.enabled_data_content }}">
+											<input type="checkbox" id="call_forward_enabled" name="call_forward.enabled"{{#if data.call_forward.enabled}} checked="checked"{{/if}}/>
+											<span>{{ i18n.callflows.device.enabled }}</span>
+										</span>
+									</label>
+								</li>
+							</ul>
+						</div>
+					</div>
+					<input type="hidden" value="{{ data.device_type }}" name="device_type"/>
+					<input type="hidden" value="false" name="extra.notify_unregister"/>
+				</div>
+
+				<div id="options">
+					<div class="clearfix">
+						<div class="input">
+							<ul class="inputs-list">
+								<li>
+									<label>
+										<span rel="popover" data-content="{{ i18n.callflows.device.require_key_press_data_content }}">
+											<input type="checkbox" id="call_forward_require_keypress" name="call_forward.require_keypress"{{#if data.call_forward.require_keypress}} checked="checked"{{/if}}/>
+											<span>{{ i18n.callflows.device.require_key_press }}</span>
+										</span>
+									</label>
+								</li>
+							</ul>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<div class="input">
+							<ul class="inputs-list">
+								<li>
+									<label>
+										<span rel="popover" data-content="{{ i18n.callflows.device.keep_caller_id_data_content }}">
+											<input type="checkbox" id="call_forward_keep_caller_id" name="call_forward.keep_caller_id"{{#if data.call_forward.keep_caller_id}} checked="checked"{{/if}}/>
+											<span>{{ i18n.callflows.device.keep_caller_id }}</span>
+										</span>
+									</label>
+								</li>
+							</ul>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<div class="input">
+						   <ul class="inputs-list">
+							   <li>
+									<label>
+										<span rel="popover" data-content="{{ i18n.callflows.device.hide_from_contact_list_data_content }}">
+											<input id="contact_list_exclude" type="checkbox" name="contact_list.exclude"{{#if data.contact_list.exclude}} checked="checked"{{/if}} />
+											<span>{{ i18n.callflows.device.hide_from_contact_list }}</span>
+										</span>
+									</label>
+								</li>
+							</ul>
+					   </div>
+					</div>
+				</div>
+			</div>
+		</form>
+		<div class="buttons-right">
+			{{#if data.id}}
+				<button class="monster-button monster-button-danger device-delete">{{ i18n.callflows.device.delete }}</button>
+			{{/if}}
+			<button class="monster-button monster-button-success device-save">{{ i18n.callflows.device.save }}</button>
+		</div>
+	</div>
+</div>

src/apps/callflows/views/device-mobile.html

@@ -0,0 +1,343 @@
+<div>
+	<div>
+		<div class="whapp-header clearfix">
+			<h1>{{ i18n.callflows.device.view_mobile_phone }}</h1>
+			<div class="buttons-right pasted view-buttons">
+				<button class="btn black basic activate">{{ i18n.callflows.device.basic }}</button>
+				<button class="btn black advanced">{{ i18n.callflows.device.advanced }}</button>
+			</div>
+		</div>
+	</div>
+	<div>
+		<ul class="tabs" data-tabs="tabs">
+			<li class="active"><a href="#basic">{{ i18n.callflows.device.basic }}</a></li>
+			<li><a href="#caller_id">{{ i18n.callflows.device.caller_id }}</a></li>
+			<li><a href="#restrictions">{{ i18n.callflows.device.restrictions }}</a></li>
+		</ul>
+		<form id="device-form" action="" method="post">
+			<div class="pill-content">
+				<div class="active basic_view" id="basic">
+					<div class="clearfix">
+						<label for="name">{{ i18n.callflows.device.device_nickname }}</label>
+						<div class="input">
+							<div class="text">{{ data.name }}</div>
+						</div>
+					</div>
+
+					{{#unless field_data.hide_owner}}
+						<div class="clearfix">
+							<label for="owner_id">{{ i18n.callflows.device.assign_to }}</label>
+							<div class="input">
+								<div class="text">{{field_data.users.first_name}} {{field_data.users.last_name}}</div>
+							</div>
+						</div>
+					{{/unless}}
+
+					<div class="clearfix">
+						<label for="sip_realm">{{ i18n.callflows.device.realm }}</label>
+						<div class="input">
+							<div class="text">{{ field_data.sip.realm }}</div>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<label for="sip_username">{{ i18n.callflows.device.username }}</label>
+						<div class="input">
+							<div class="text">{{ data.sip.username }}</div>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<label for="sip_password">{{ i18n.callflows.device.password }}</label>
+						<div class="input">
+							<div class="text">{{ data.sip.password }}</div>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<label for="name">{{ i18n.callflows.device.mdn }}</label>
+						<div class="input">
+							<div class="text">{{ data.mobile.mdn }}</div>
+						</div>
+					</div>
+
+					<div class="clearfix hidden">
+						<div class="input">
+							<ul class="inputs-list">
+								<li>
+									<label>
+										<span rel="popover" data-content="{{ i18n.callflows.device.enabled_data_content }}">
+											<input type="checkbox" id="enabled" name="enabled"{{#if data.enabled}} checked="checked"{{/if}} />
+											<span>{{ i18n.callflows.device.enabled }}</span>
+										</span>
+									</label>
+								</li>
+							</ul>
+						</div>
+					</div>
+
+					<input type="hidden" value="{{ data.device_type }}" name="device_type"/>
+				</div>
+
+				<div id="caller_id">
+					<div class="clearfix">
+						<label for="name">{{ i18n.callflows.device.presence_id }}</label>
+						<div class="input">
+							<input class="span4" id="presence_id" name="presence_id" type="text" placeholder="{{ i18n.callflows.device.presence_id_placeholder }}" value="{{ data.presence_id }}" rel="popover" data-content="{{ i18n.callflows.device.presence_id_help }}"/>
+						</div>
+					</div>
+
+					<h3>{{ i18n.callflows.device.in_house_calls }}</h3>
+					<div class="clearfix">
+						<label for="caller_id_name_internal">{{ i18n.callflows.device.caller_id_name }}</label>
+						<div class="input">
+							<input class="span4" id="caller_id_name_internal" name="caller_id.internal.name" type="text" placeholder="{{ i18n.callflows.device.name }}" value="{{ data.caller_id.internal.name }}"  rel="popover" data-content="{{ i18n.callflows.device.caller_id_name_data_content }}" />
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<label for="caller_id_number_internal">{{ i18n.callflows.device.caller_id_number }}</label>
+						<div class="input">
+							<input class="span4" id="caller_id_number_internal" name="caller_id.internal.number" type="text" placeholder="+15555555555" value="{{ data.caller_id.internal.number }}" rel="popover" data-content="{{ i18n.callflows.device.caller_id_number_data_content }}"/>
+						</div>
+					</div>
+					<hr />
+
+					<h3>{{ i18n.callflows.device.outbound_calls }}</h3>
+					<div class="clearfix">
+						<label for="caller_id_name_external">{{ i18n.callflows.device.caller_id_name }}</label>
+						<div class="input">
+							<input class="span4" id="caller_id_name_external" name="caller_id.external.name" type="text" placeholder="{{ i18n.callflows.device.name }}" value="{{ data.caller_id.external.name }}" rel="popover" data-content="{{ i18n.callflows.device.caller_id_name_data_content2 }}"/>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<label for="caller_id_number_external">{{ i18n.callflows.device.caller_id_number }}</label>
+						<div class="input">
+							<input class="span4" id="caller_id_number_external" name="caller_id.external.number" type="text" placeholder="+15555555555" value="{{ data.caller_id.external.number }}" rel="popover" data-content="{{ i18n.callflows.device.caller_id_number_data_content2 }}"/>
+						</div>
+					</div>
+
+					<div class="clearfix hidden">
+						<label for="caller_id_name_emergency">{{ i18n.callflows.device.caller_id_name }}</label>
+						<div class="input">
+							<input class="span4" id="caller_id_name_emergency" name="caller_id.emergency.name" type="text" placeholder="{{ i18n.callflows.device.name }}" value="{{ data.caller_id.emergency.name }}" rel="popover" data-content="{{ i18n.callflows.device.caller_id_name_data_content3 }}" />
+						</div>
+					</div>
+
+					<div class="clearfix hidden">
+						<label for="caller_id_number_emergency">{{ i18n.callflows.device.caller_id_number }}</label>
+						<div class="input">
+							<input class="span4" id="caller_id_number_emergency" name="caller_id.emergency.number" type="text" placeholder="+15555555555" value="{{ data.caller_id.emergency.number }}" rel="popover" data-content="{{ i18n.callflows.device.aller_id_number_data_content3 }}"/>
+						</div>
+					</div>
+				</div>
+
+				<div id="sip_settings">
+					<div class="clearfix">
+						<label for="sip_method">{{ i18n.callflows.device.authentication_method }}</label>
+						<div class="input">
+							<select name="sip.method" id="sip_method" class="medium" rel="popover" data-content="{{ i18n.callflows.device.authentication_method_data_content }}">
+								{{#select data.sip.method}}
+									{{#each field_data.sip.methods}}
+										{{#compare key "!=" "ip"}}
+											<option value="{{ @key }}">{{ this }}</option>
+										{{/compare}}
+									{{/each}}
+								{{/select}}
+							</select>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<label for="sip_invite_format">{{ i18n.callflows.device.invite_format }}</label>
+						<div class="input">
+							<select name="sip.invite_format" id="sip_invite_format" class="medium" rel="popover" data-content="{{ i18n.callflows.device.invite_format_data_content }}">
+								{{#select data.sip.invite_format}}
+									{{#each field_data.sip.invite_formats}}
+										<option value="{{ @key }}">{{ this }}</option>
+									{{/each}}
+								{{/select}}
+							</select>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<label for="sip_expire_seconds">{{ i18n.callflows.device.expire_seconds }}</label>
+						<div class="input">
+							<input class="span4" id="sip_expire_seconds" name="sip.expire_seconds" type="text" placeholder="{{ i18n.callflows.device.expire_seconds }}" value="{{ data.sip.expire_seconds }}" rel="popover" data-content="{{ i18n.callflows.device.expire_seconds_data_content }}" required/>
+						</div>
+					</div>
+				</div>
+
+				<div id="audio_settings">
+					<div class="clearfix">
+						<label for="music_on_hold">{{ i18n.callflows.device.music_on_hold }}</label>
+						<div class="input">
+							<span rel="popover" data-content="{{ i18n.callflows.device.music_on_hold_data_content }}">
+								<select name="music_on_hold.media_id" id="music_on_hold_media_id" class="medium">
+									{{#select data.music_on_hold.media_id}}
+										{{#each field_data.music_on_hold}}
+											<option id="{{ id }}" value="{{ id }}">{{ name }}</option>
+										{{/each}}
+									{{/select}}
+								</select>
+								<div class="edit_create">
+									<a id="edit_link_media" class="inline_action_media" data-action="edit" href="#">{{ i18n.callflows.device.edit }}</a>
+									<a class="inline_action_media" data-action="create" href="#">{{ i18n.callflows.device.create }}</a>
+								</div>
+							</span>
+						</div>
+					</div>
+
+					<div class="clearfix shoutcast-div{{#if extra.isShoutcast}} active{{/if}}">
+						<label for="extra.shoutcastUrl">{{ i18n.callflows.accountSettings.musicOnHold.shoutcastURL }}</label>
+						<div class="input">
+							<input type="text" class="shoutcast-url-input" name="extra.shoutcastUrl" value="{{extra.shoutcastValue}}" rel="popover" data-content="{{ i18n.callflows.accountSettings.musicOnHold.shoutcastURLHelp }}"/>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<label for="media_peer_to_peer">{{ i18n.callflows.device.peer_to_peer_audio }}</label>
+						<div class="input">
+							<select name="media.peer_to_peer" id="media_peer_to_peer" class="medium" rel="popover" data-content="{{ i18n.callflows.device.peer_to_peer_audio_data_content }}">
+								{{#select data.media.peer_to_peer}}
+									{{#each field_data.media.peer_to_peer_options}}
+										<option value="{{ @key }}">{{ this }}</option>
+									{{/each}}
+								{{/select}}
+							</select>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<label for="secure_rtp">{{ i18n.callflows.device.secure_rtp }}</label>
+						<div class="input">
+							<select name="extra.encryptionMethod" id="secure_rtp" class="medium" rel="popover" data-content="{{ i18n.callflows.device.secure_rtp_help }}">
+								{{#select field_data.media.secure_rtp.value}}
+									{{#each field_data.media.secure_rtp.options}}
+										<option value="{{ @key }}">{{ this }}</option>
+									{{/each}}
+								{{/select}}
+							</select>
+						</div>
+					</div>
+
+					{{#each field_data.media.audio.codecs}}
+						<div>
+							<div class="input">
+								<ul class="inputs-list">
+									<li>
+										<label>
+											<input type="checkbox" id="media_audio_codecs" name="media.audio.codecs[]"{{#ifInArray @key ../data.media.audio.codecs}} checked="checked"{{/ifInArray}} rel="popover" data-content="" value="{{ @key }}"/>
+											<span>{{ this }}</span>
+										</label>
+									</li>
+								</ul>
+							</div>
+						</div>
+					{{/each}}
+				</div>
+
+				<div id="video_settings">
+					{{#each field_data.media.video.codecs}}
+						<div class="clearfix">
+							<div class="input">
+								<ul class="inputs-list">
+									<li>
+										<label>
+											<input type="checkbox" id="media_video_codecs" name="media.video.codecs[]"{{#ifInArray @key ../data.media.video.codecs}} checked="checked"{{/ifInArray}} rel="popover" data-content="" value="{{ @key }}"/>
+											<span>{{ this }}</span>
+										</label>
+									</li>
+								</ul>
+							</div>
+						</div>
+					{{/each}}
+				</div>
+
+				<div id="options">
+					<div class="clearfix">
+						<div class="input">
+							<ul class="inputs-list">
+								<li>
+									<label>
+										<span rel="popover" data-content="{{ i18n.callflows.device.t_38_data_content }}">
+											<input id="media_fax_option" type="checkbox" name="media.fax_option"{{#if data.media.fax_option}} checked="checked"{{/if}} />
+											<span>{{ i18n.callflows.device.t_38 }}</span>
+										</span>
+									</label>
+								</li>
+							</ul>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<div class="input">
+							<ul class="inputs-list">
+								<li>
+									<label>
+										<span rel="popover" data-content="{{ i18n.callflows.device.hide_from_contact_list_data_content }}">
+											<input id="contact_list_exclude" type="checkbox" name="contact_list.exclude"{{#if data.contact_list.exclude}} checked="checked"{{/if}} />
+											<span>{{ i18n.callflows.device.hide_from_contact_list }}</span>
+										</span>
+									</label>
+								</li>
+							</ul>
+						</div>
+					</div>
+
+					<div class="clearfix">
+						<div class="input">
+							<ul class="inputs-list">
+								<li>
+									<label>
+										<span rel="popover" data-content="{{ i18n.callflows.device.ignore_completed_elsewhere_data_content }}">
+											<input id="ignore_completed_elsewhere" type="checkbox" name="ignore_completed_elsewhere"{{#if data.ignore_completed_elsewhere}} checked="checked"{{/if}} />
+											<span>{{ i18n.callflows.device.ignore_completed_elsewhere }}</span>
+										</span>
+									</label>
+								</li>
+							</ul>
+						</div>
+					</div>
+					<input type="hidden" name="extra.notify_unregister" value="false"/>
+				</div>
+
+				<div id="restrictions">
+					<div class="clearfix">
+						<div class="input">
+							<ul class="inputs-list">
+								<li>
+									<label>
+										<span rel="popover" data-content="{{ i18n.callflows.device.closed_groups_data_content }}">
+											<input type="checkbox" name="extra.closed_groups"{{#compare data.call_restriction.closed_groups.action "===" "deny"}} checked="checked"{{/compare}}/>
+											<span>{{ i18n.callflows.device.closed_groups }}</span>
+										</span>
+									</label>
+								</li>
+							</ul>
+						</div>
+					</div>
+
+					{{#each field_data.call_restriction}}
+					<div class="clearfix">
+						<label>{{ this.friendly_name }}</label>
+						<div class="input">
+							<select name="call_restriction.{{ @key }}.action" class="medium" rel="popover">
+								{{#select this.value }}
+									<option value="deny">{{ @root.i18n.callflows.device.deny }}</option>
+									<option value="inherit">{{ @root.i18n.callflows.device.inherit }}</option>
+								{{/select}}
+							</select>
+						</div>
+					</div>
+					{{/each}}
+				</div>
+			</div>
+		</form>
+		<div class="buttons-right">
+			<button class="monster-button monster-button-success device-save">{{ i18n.callflows.device.save }}</button>
+		</div>
+	</div>
+</div>