Skip to content

Comparing changes

Choose two branches to see what’s changed or to start a new pull request. If you need to, you can also .

Open a pull request

Create a new pull request by comparing changes across two branches. If you need to, you can also .
...
  • 3 commits
  • 3 files changed
  • 0 commit comments
  • 1 contributor
Showing with 159 additions and 147 deletions.
  1. +4 −0 static/css/style.css
  2. +149 −145 static/js/script.js
  3. +6 −2 templates/index.html
View
4 static/css/style.css
@@ -39,3 +39,7 @@ body {
.full-button {
width: 100%;
}
+
+#phone-number-form {
+ margin: 0;
+}
View
294 static/js/script.js
@@ -1,129 +1,129 @@
$(function(){
- /* Fill in phone number at top of screen */
- var phoneOn = false;
- try {
- var phoneNumberLabel = localStorage["phoneNumber"].replace(/(\d{3})(\d{3})(\d{4})/, "($1) $2-$3");
- if (phoneNumberLabel.length==14) {
- $('#phoneNumberDiv').html(phoneNumberLabel);
- $('#phoneToggleButton').button("toggle");
- phoneOn = true;
- }
- } catch(err) {
- $('#browserToggleButton').button("toggle");
+ /* Fill in phone number at top of screen */
+ var phoneOn = false;
+ try {
+ var phoneNumberLabel = localStorage["phoneNumber"].replace(/(\d{3})(\d{3})(\d{4})/, "($1) $2-$3");
+ if (phoneNumberLabel.length==14) {
+ $('#phoneNumberDiv').html(phoneNumberLabel);
+ $('#phoneToggleButton').button("toggle");
+ phoneOn = true;
}
-
-
- var toggleButtons = function() {
- phoneOn = !phoneOn;
- $('#browserToggleButton').button("toggle");
- };
-
- $("#phoneToggleButton").on("click", toggleButtons);
- $("#browserToggleButton").on("click", toggleButtons);
+ } catch(err) {
+ $('#browserToggleButton').button("toggle");
+ }
+
+
+ var toggleButtons = function() {
+ phoneOn = !phoneOn;
+ $('#browserToggleButton').button("toggle");
+ };
+
+ $("#phoneToggleButton").on("click", toggleButtons);
+ $("#browserToggleButton").on("click", toggleButtons);
/*
- Twilio Client stuff
- */
-
- /* Create the Client with a Capability Token */
- var clientToken = $("#token").val();
- Twilio.Device.setup(clientToken);
-
- /* Let us know when the client is ready. */
- Twilio.Device.ready(function (device) {
- //alert("Ready");
- });
-
- /* Report any errors on the screen */
- Twilio.Device.error(function (error) {
- //alert("Error: "+ error.message)
- });
-
- Twilio.Device.connect(function (conn) {
- //alert("Successfully established call")
- });
-
- /* Connect to Twilio when we call this function. */
- var call = function() {
- var verbType = $("#verb").val();
- var params;
- if (phoneOn == true) {
- params = {
- "verb": verbType,
- "demo": "true",
- "To": localStorage['phoneNumber'],
- "client": "false"
- };
- $.post('/requestCall',
- params,
- function(data) {
- alert("Made call:" + data);
- }
- );
- } else {
- params = {
- "verb": verbType,
- "To": "",
- "demo": "true",
- "client": "true"
- };
- Twilio.Device.connect(params);
+ Twilio Client stuff
+ */
+
+ /* Create the Client with a Capability Token */
+ var clientToken = $("#token").val();
+ Twilio.Device.setup(clientToken);
+
+ /* Let us know when the client is ready. */
+ Twilio.Device.ready(function (device) {
+ //alert("Ready");
+ });
+
+ /* Report any errors on the screen */
+ Twilio.Device.error(function (error) {
+ //alert("Error: "+ error.message)
+ });
+
+ Twilio.Device.connect(function (conn) {
+ //alert("Successfully established call")
+ });
+
+ /* Connect to Twilio when we call this function. */
+ var call = function() {
+ var verbType = $("#verb").val();
+ var params;
+ if (phoneOn == true) {
+ params = {
+ "verb": verbType,
+ "demo": "true",
+ "To": localStorage['phoneNumber'],
+ "client": "false"
+ };
+ $.post('/requestCall',
+ params,
+ function(data) {
+ alert("Made call:" + data);
+ }
+ );
+ } else {
+ params = {
+ "verb": verbType,
+ "To": "",
+ "demo": "true",
+ "client": "true"
+ };
+ Twilio.Device.connect(params);
+ }
+
+ }
+
+ var hangup = function() {
+ Twilio.Device.disconnectAll();
+ }
+
+ $('#callButton').on('click', call);
+
+ /*
+ Validating TwiML stuff
+ */
+
+ var validateTwml = function() {
+ var submittedTwiml = editor.getValue();
+ var Module = {
+ xml: submittedTwiml,
+ schema: twimlSchema,
+ arguments: ["--noout", "--schema", "file.xsd", "file.xml"]
+ };
+ var result = validateXML(Module).trim();
+ alert(result);
+ var verbType = $("#verb").val();
+ if (result == "file.xml validates"){
+ var makeCall = $.post('/requestCall', {
+ To: "+17863029603",
+ twimlBody: submittedTwiml,
+ verb: verbType,
+ demo: 'false'
+ },
+ function(data) {
+ alert("Made call:" + data);
}
-
+ );
+ } else {
+ alert("We're sorry. You can't make a call until your TwiML is valid. We have this error: \n" + result);
}
+ };
+
+
+
+
- var hangup = function() {
- Twilio.Device.disconnectAll();
- }
-
- $('#callButton').on('click', call);
-
- /*
- Validating TwiML stuff
- */
-
- var validateTwml = function() {
- var submittedTwiml = editor.getValue();
- var Module = {
- xml: submittedTwiml,
- schema: twimlSchema,
- arguments: ["--noout", "--schema", "file.xsd", "file.xml"]
- };
- var result = validateXML(Module).trim();
- alert(result);
- var verbType = $("#verb").val();
- if (result == "file.xml validates"){
- var makeCall = $.post('/requestCall', {
- To: "+17863029603",
- twimlBody: submittedTwiml,
- verb: verbType,
- demo: 'false'
- },
- function(data) {
- alert("Made call:" + data);
- }
- );
- } else {
- alert("We're sorry. You can't make a call until your TwiML is valid. We have this error: \n" + result);
- }
- };
-
-
-
-
-
- var validateTwml = function() {
- var submittedTwiml = editor.getValue();
- var Module = {
- xml: submittedTwiml,
- schema: twimlSchema,
- arguments: ["--noout", "--schema", "file.xsd", "file.xml"]
- };
- var result = validateXML(Module).trim();
- alert(result);
- var verbType = $("#verb").val();
- if (result == "file.xml validates"){
-
- if (phoneOn == true) {
+ var validateTwml = function() {
+ var submittedTwiml = editor.getValue();
+ var Module = {
+ xml: submittedTwiml,
+ schema: twimlSchema,
+ arguments: ["--noout", "--schema", "file.xsd", "file.xml"]
+ };
+ var result = validateXML(Module).trim();
+ alert(result);
+ var verbType = $("#verb").val();
+ if (result == "file.xml validates"){
+
+ if (phoneOn == true) {
params = {
"verb": verbType,
"demo": "false",
@@ -132,10 +132,10 @@ $(function(){
"client": "false"
};
$.post('/requestCall', params,
- function(data) {
- alert("Made call:" + data);
- }
- );
+ function(data) {
+ alert("Made call:" + data);
+ }
+ );
} else {
params = {
"verb": verbType,
@@ -146,24 +146,23 @@ $(function(){
};
Twilio.Device.connect(params);
}
- } else {
- alert("We're sorry. You can't make a call until your TwiML is valid. We have this error: \n\n" + result);
- }
- };
-
- $("#submitTwiml").on("click", validateTwml);
-
- var twimlSchema = '<?xml version="1.0" encoding="iso-8859-1" ?><xs:schema xmlns:xs="http://www.w3.org/2001/XMLSchema"><xs:annotation><xs:documentation>Twilio API TwiML XML Schema Copyright Twilio Inc. </xs:documentation></xs:annotation><xs:element name="Response"><xs:complexType><xs:sequence maxOccurs="unbounded" minOccurs="0"><xs:choice><xs:element name="Dial" type="DialType"></xs:element><xs:element name="Gather" type="GatherType"></xs:element><xs:element name="Hangup" type="HangupType"></xs:element><xs:element name="Play" type="PlayType" /><xs:element name="Pause" type="PauseType"></xs:element><xs:element name="Record" type="RecordType"></xs:element><xs:element name="Redirect" type="RedirectType"></xs:element><xs:element name="Reject" type="RejectType"></xs:element><xs:element name="Say" type="SayType"></xs:element><xs:element name="Sms" type="SmsType"></xs:element></xs:choice></xs:sequence><xs:attribute name="version" type="xs:string"></xs:attribute></xs:complexType></xs:element><xs:complexType name="PlayType"><xs:simpleContent><xs:extension base="xs:string"><xs:attribute name="loop" type="xs:int"></xs:attribute></xs:extension></xs:simpleContent></xs:complexType><xs:complexType name="SayType" mixed="true"><xs:attribute name="loop" type="xs:int"></xs:attribute><xs:attribute name="voice" type="voiceType"></xs:attribute><xs:attribute name="language" type="xs:string"></xs:attribute></xs:complexType><xs:complexType name="GatherType"><xs:sequence maxOccurs="unbounded" minOccurs="0"><xs:choice><xs:element name="Play" type="PlayType"></xs:element><xs:element name="Say" type="SayType"></xs:element><xs:element name="Pause" type="PauseType"></xs:element></xs:choice></xs:sequence><xs:attribute name="numDigits" type="xs:int"></xs:attribute><xs:attribute name="finishOnKey" type="xs:string"></xs:attribute><xs:attribute name="method" type="methodType"></xs:attribute><xs:attribute name="action" type="xs:string"></xs:attribute><xs:attribute name="timeout" type="xs:int"></xs:attribute></xs:complexType><xs:simpleType name="methodType"><xs:restriction base="xs:string"></xs:restriction></xs:simpleType><xs:complexType name="DialType" mixed="true"><xs:sequence maxOccurs="unbounded" minOccurs="0"><xs:choice><xs:element name="Number" type="NumberType"></xs:element><xs:element name="Client" type="ClientType"></xs:element><xs:element name="Conference" type="conferenceType"></xs:element></xs:choice></xs:sequence><xs:attribute name="action" type="xs:string"></xs:attribute><xs:attribute name="callerId" type="xs:string"></xs:attribute><xs:attribute name="hangupOnStar" type="xs:string"></xs:attribute><xs:attribute name="method" type="methodType"></xs:attribute><xs:attribute name="record" type="xs:string"></xs:attribute><xs:attribute name="timeLimit" type="xs:int"></xs:attribute><xs:attribute name="timeout" type="xs:int"></xs:attribute><xs:attribute name="transcribe" type="xs:string"></xs:attribute><xs:attribute name="transcribeCallback" type="xs:string"></xs:attribute></xs:complexType><xs:complexType name="NumberType"><xs:simpleContent><xs:extension base="xs:string"><xs:attribute name="sendDigits" type="xs:string"></xs:attribute><xs:attribute name="url" type="xs:string"></xs:attribute></xs:extension></xs:simpleContent></xs:complexType><xs:complexType name="ClientType"><xs:simpleContent><xs:extension base="xs:string"></xs:extension></xs:simpleContent></xs:complexType><xs:complexType name="RecordType"><xs:attribute name="action" type="xs:string"></xs:attribute><xs:attribute name="finishOnKey" type="xs:string"></xs:attribute><xs:attribute name="maxLength" type="xs:int"></xs:attribute><xs:attribute name="method" type="methodType"></xs:attribute><xs:attribute name="playBeep" type="xs:string"></xs:attribute><xs:attribute name="timeout" type="xs:int"></xs:attribute><xs:attribute name="transcribe" type="xs:string"></xs:attribute><xs:attribute name="transcribeCallback" type="xs:string"></xs:attribute></xs:complexType><xs:simpleType name="voiceType"><xs:restriction base="xs:string"><xs:enumeration value="man"></xs:enumeration><xs:enumeration value="woman"></xs:enumeration></xs:restriction></xs:simpleType><xs:simpleType name="reasonType"><xs:restriction base="xs:string"><xs:enumeration value="busy"></xs:enumeration><xs:enumeration value="rejected"></xs:enumeration></xs:restriction></xs:simpleType><xs:simpleType name="HangupType"><xs:restriction base="xs:string"></xs:restriction></xs:simpleType><xs:complexType name="PauseType"><xs:attribute name="length" type="xs:int"></xs:attribute></xs:complexType><xs:simpleType name="langType"><xs:restriction base="xs:string"><xs:enumeration value="en"></xs:enumeration><xs:enumeration value="es"></xs:enumeration><xs:enumeration value="fr"></xs:enumeration><xs:enumeration value="de"></xs:enumeration></xs:restriction></xs:simpleType><xs:complexType name="RedirectType"><xs:simpleContent><xs:extension base="xs:string"><xs:attribute name="method" type="methodType"></xs:attribute></xs:extension></xs:simpleContent></xs:complexType><xs:complexType name="conferenceType"><xs:simpleContent><xs:extension base="xs:string"><xs:attribute name="beep" type="xs:string"></xs:attribute><xs:attribute name="endConferenceOnExit" type="xs:string"></xs:attribute><xs:attribute name="maxParticipants" type="xs:string"></xs:attribute><xs:attribute name="method" type="methodType"></xs:attribute><xs:attribute name="muted" type="xs:string"></xs:attribute><xs:attribute name="startConferenceOnEnter" type="xs:string"></xs:attribute><xs:attribute name="url" type="xs:string"></xs:attribute><xs:attribute name="waitMethod" type="xs:string"></xs:attribute><xs:attribute name="waitUrl" type="xs:string"></xs:attribute></xs:extension></xs:simpleContent></xs:complexType><xs:complexType name="SmsType"><xs:simpleContent><xs:extension base="xs:string"><xs:attribute name="from" type="xs:string"></xs:attribute><xs:attribute name="to" type="xs:string"></xs:attribute><xs:attribute name="action" type="xs:string"></xs:attribute><xs:attribute name="method" type="methodType"></xs:attribute><xs:attribute name="statusCallback" type="xs:string"></xs:attribute></xs:extension></xs:simpleContent></xs:complexType><xs:complexType name="RejectType"><xs:attribute name="reason" type="reasonType"></xs:attribute></xs:complexType></xs:schema>';
+ } else {
+ alert("We're sorry. You can't make a call until your TwiML is valid. We have this error: \n\n" + result);
+ }
+ };
+
+ $("#submitTwiml").on("click", validateTwml);
+
$('.nav-tabs').button();
-
+
/*
- Registering a new user locally
- */
+ Registering a new user locally
+ */
function checkDigits(num) {
num = num.replace(/[^0-9]/g,'');
return num.length==10;
}
-
+
var registerPhone = function() {
var phone = $("#phoneNumber").val().trim();
if (!checkDigits(phone)) {
@@ -178,14 +177,19 @@ $(function(){
localStorage['lesson'] = 'say';
$("#phone-number-register").html("Saved!");
}
-
+
$("#phone-number-register").on("click", registerPhone);
-
+
$("#python-link").click(function(){
- setTimeout( function(){
- demoBoxPython.refresh();
- console.log('editor1 refreshed');
- }, 1);
- });
-
-});
+ setTimeout( function(){
+ demoBoxPython.refresh();
+ console.log('editor1 refreshed');
+ }, 1);
+ });
+
+ $("#phone-number-form").submit(function(e) {
+ e.preventDefault();
+ });
+
+ var twimlSchema = '<?xml version="1.0" encoding="iso-8859-1" ?><xs:schema xmlns:xs="http://www.w3.org/2001/XMLSchema"><xs:annotation><xs:documentation>Twilio API TwiML XML Schema Copyright Twilio Inc. </xs:documentation></xs:annotation><xs:element name="Response"><xs:complexType><xs:sequence maxOccurs="unbounded" minOccurs="0"><xs:choice><xs:element name="Dial" type="DialType"></xs:element><xs:element name="Gather" type="GatherType"></xs:element><xs:element name="Hangup" type="HangupType"></xs:element><xs:element name="Play" type="PlayType" /><xs:element name="Pause" type="PauseType"></xs:element><xs:element name="Record" type="RecordType"></xs:element><xs:element name="Redirect" type="RedirectType"></xs:element><xs:element name="Reject" type="RejectType"></xs:element><xs:element name="Say" type="SayType"></xs:element><xs:element name="Sms" type="SmsType"></xs:element></xs:choice></xs:sequence><xs:attribute name="version" type="xs:string"></xs:attribute></xs:complexType></xs:element><xs:complexType name="PlayType"><xs:simpleContent><xs:extension base="xs:string"><xs:attribute name="loop" type="xs:int"></xs:attribute></xs:extension></xs:simpleContent></xs:complexType><xs:complexType name="SayType" mixed="true"><xs:attribute name="loop" type="xs:int"></xs:attribute><xs:attribute name="voice" type="voiceType"></xs:attribute><xs:attribute name="language" type="xs:string"></xs:attribute></xs:complexType><xs:complexType name="GatherType"><xs:sequence maxOccurs="unbounded" minOccurs="0"><xs:choice><xs:element name="Play" type="PlayType"></xs:element><xs:element name="Say" type="SayType"></xs:element><xs:element name="Pause" type="PauseType"></xs:element></xs:choice></xs:sequence><xs:attribute name="numDigits" type="xs:int"></xs:attribute><xs:attribute name="finishOnKey" type="xs:string"></xs:attribute><xs:attribute name="method" type="methodType"></xs:attribute><xs:attribute name="action" type="xs:string"></xs:attribute><xs:attribute name="timeout" type="xs:int"></xs:attribute></xs:complexType><xs:simpleType name="methodType"><xs:restriction base="xs:string"></xs:restriction></xs:simpleType><xs:complexType name="DialType" mixed="true"><xs:sequence maxOccurs="unbounded" minOccurs="0"><xs:choice><xs:element name="Number" type="NumberType"></xs:element><xs:element name="Client" type="ClientType"></xs:element><xs:element name="Conference" type="conferenceType"></xs:element></xs:choice></xs:sequence><xs:attribute name="action" type="xs:string"></xs:attribute><xs:attribute name="callerId" type="xs:string"></xs:attribute><xs:attribute name="hangupOnStar" type="xs:string"></xs:attribute><xs:attribute name="method" type="methodType"></xs:attribute><xs:attribute name="record" type="xs:string"></xs:attribute><xs:attribute name="timeLimit" type="xs:int"></xs:attribute><xs:attribute name="timeout" type="xs:int"></xs:attribute><xs:attribute name="transcribe" type="xs:string"></xs:attribute><xs:attribute name="transcribeCallback" type="xs:string"></xs:attribute></xs:complexType><xs:complexType name="NumberType"><xs:simpleContent><xs:extension base="xs:string"><xs:attribute name="sendDigits" type="xs:string"></xs:attribute><xs:attribute name="url" type="xs:string"></xs:attribute></xs:extension></xs:simpleContent></xs:complexType><xs:complexType name="ClientType"><xs:simpleContent><xs:extension base="xs:string"></xs:extension></xs:simpleContent></xs:complexType><xs:complexType name="RecordType"><xs:attribute name="action" type="xs:string"></xs:attribute><xs:attribute name="finishOnKey" type="xs:string"></xs:attribute><xs:attribute name="maxLength" type="xs:int"></xs:attribute><xs:attribute name="method" type="methodType"></xs:attribute><xs:attribute name="playBeep" type="xs:string"></xs:attribute><xs:attribute name="timeout" type="xs:int"></xs:attribute><xs:attribute name="transcribe" type="xs:string"></xs:attribute><xs:attribute name="transcribeCallback" type="xs:string"></xs:attribute></xs:complexType><xs:simpleType name="voiceType"><xs:restriction base="xs:string"><xs:enumeration value="man"></xs:enumeration><xs:enumeration value="woman"></xs:enumeration></xs:restriction></xs:simpleType><xs:simpleType name="reasonType"><xs:restriction base="xs:string"><xs:enumeration value="busy"></xs:enumeration><xs:enumeration value="rejected"></xs:enumeration></xs:restriction></xs:simpleType><xs:simpleType name="HangupType"><xs:restriction base="xs:string"></xs:restriction></xs:simpleType><xs:complexType name="PauseType"><xs:attribute name="length" type="xs:int"></xs:attribute></xs:complexType><xs:simpleType name="langType"><xs:restriction base="xs:string"><xs:enumeration value="en"></xs:enumeration><xs:enumeration value="es"></xs:enumeration><xs:enumeration value="fr"></xs:enumeration><xs:enumeration value="de"></xs:enumeration></xs:restriction></xs:simpleType><xs:complexType name="RedirectType"><xs:simpleContent><xs:extension base="xs:string"><xs:attribute name="method" type="methodType"></xs:attribute></xs:extension></xs:simpleContent></xs:complexType><xs:complexType name="conferenceType"><xs:simpleContent><xs:extension base="xs:string"><xs:attribute name="beep" type="xs:string"></xs:attribute><xs:attribute name="endConferenceOnExit" type="xs:string"></xs:attribute><xs:attribute name="maxParticipants" type="xs:string"></xs:attribute><xs:attribute name="method" type="methodType"></xs:attribute><xs:attribute name="muted" type="xs:string"></xs:attribute><xs:attribute name="startConferenceOnEnter" type="xs:string"></xs:attribute><xs:attribute name="url" type="xs:string"></xs:attribute><xs:attribute name="waitMethod" type="xs:string"></xs:attribute><xs:attribute name="waitUrl" type="xs:string"></xs:attribute></xs:extension></xs:simpleContent></xs:complexType><xs:complexType name="SmsType"><xs:simpleContent><xs:extension base="xs:string"><xs:attribute name="from" type="xs:string"></xs:attribute><xs:attribute name="to" type="xs:string"></xs:attribute><xs:attribute name="action" type="xs:string"></xs:attribute><xs:attribute name="method" type="methodType"></xs:attribute><xs:attribute name="statusCallback" type="xs:string"></xs:attribute></xs:extension></xs:simpleContent></xs:complexType><xs:complexType name="RejectType"><xs:attribute name="reason" type="reasonType"></xs:attribute></xs:complexType></xs:schema>';
+ });
View
8 templates/index.html
@@ -40,12 +40,16 @@
<h3>Your Number</h3>
<p>We can call your phone when you want to try out the demos or hear your own
creations. Why not enter your 10-digit phone number here?</p>
- <input class="input-xlarge" id="phoneNumber" placeholder="(555) 555-5555" type="tel"/>
- <button class="btn btn-primary" id="phone-number-register">Save Number</button>
+ <br />
+ <form id="phone-number-form" class="form-inline">
+ <input class="input-xlarge" id="phoneNumber" placeholder="(555) 555-5555" type="tel"/>
+ <button class="btn btn-primary" id="phone-number-register">Save Number</button>
+ </form>
{% endblock %}
{% block twimlbox %}
<h2>Your Mission</h2>
+ <br />
<p>This is where you'll try out the waters of telecommunication. In every tutorial, this box will give you a goal that you'll use TwiML to accomplish. Are you up to the challenge?</p>
<br />
<a href="/lesson/say"><button class="btn-large btn-primary full-button">Let's start!</button></a>

No commit comments for this range

Something went wrong with that request. Please try again.