This commit is contained in:
Ali Abdalla 2019-02-18 23:45:26 -08:00
commit ac81a49275
6 changed files with 161 additions and 134 deletions

1
.gitignore vendored
View File

@ -6,3 +6,4 @@ staticfiles
.idea/*
.ipynb_checkpoints/*
models/*
.models/*

View File

@ -4,6 +4,7 @@
<list default="true" id="fd73cd66-e80f-470e-a2ec-e220d3b6b864" name="Default Changelist" comment="">
<change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
<change beforePath="$PROJECT_DIR$/Test Notebook.ipynb" beforeDir="false" afterPath="$PROJECT_DIR$/Test Notebook.ipynb" afterDir="false" />
<change beforePath="$PROJECT_DIR$/Usage.ipynb" beforeDir="false" afterPath="$PROJECT_DIR$/Usage.ipynb" afterDir="false" />
<change beforePath="$PROJECT_DIR$/gradio.py" beforeDir="false" afterPath="$PROJECT_DIR$/gradio.py" afterDir="false" />
<change beforePath="$PROJECT_DIR$/js/all-io.js" beforeDir="false" afterPath="$PROJECT_DIR$/js/all-io.js" afterDir="false" />
<change beforePath="$PROJECT_DIR$/networking.py" beforeDir="false" afterPath="$PROJECT_DIR$/networking.py" afterDir="false" />
@ -76,20 +77,20 @@
<counts>
<entry key="css" value="3" />
<entry key="gitignore" value="1" />
<entry key="html" value="2" />
<entry key="html" value="3" />
<entry key="ipynb" value="1" />
<entry key="js" value="3" />
<entry key="py" value="6" />
<entry key="js" value="5" />
<entry key="py" value="9" />
</counts>
</usages-collector>
<usages-collector id="statistics.file.types.open">
<counts>
<entry key="CSS" value="3" />
<entry key="HTML" value="2" />
<entry key="HTML" value="3" />
<entry key="IPNB" value="1" />
<entry key="JavaScript" value="3" />
<entry key="JavaScript" value="5" />
<entry key="PLAIN_TEXT" value="1" />
<entry key="Python" value="6" />
<entry key="Python" value="9" />
</counts>
</usages-collector>
<usages-collector id="statistics.file.extensions.edit">
@ -98,90 +99,32 @@
<entry key="dummy" value="10" />
<entry key="gitignore" value="2" />
<entry key="html" value="112" />
<entry key="js" value="104" />
<entry key="py" value="2672" />
<entry key="js" value="240" />
<entry key="py" value="3205" />
</counts>
</usages-collector>
<usages-collector id="statistics.file.types.edit">
<counts>
<entry key="CSS" value="11" />
<entry key="HTML" value="112" />
<entry key="JavaScript" value="104" />
<entry key="JavaScript" value="240" />
<entry key="PLAIN_TEXT" value="12" />
<entry key="Python" value="2672" />
<entry key="Python" value="3205" />
</counts>
</usages-collector>
</session>
</component>
<component name="FileEditorManager">
<leaf SIDE_TABS_SIZE_LIMIT_KEY="300">
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/templates/all_io.html">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="-1100">
<caret line="1" column="15" lean-forward="true" selection-start-line="1" selection-start-column="15" selection-end-line="1" selection-end-column="15" />
<folding>
<element signature="n#style#0;n#div#0;n#body#0;n#html#0;n#!!top" expanded="true" />
<element signature="n#style#0;n#span#0;n#strong#0;n#em#0;n#li#0;n#ul#1;n#div#0;n#nav#0;n#body#0;n#html#0;n#!!top" expanded="true" />
</folding>
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/gradio.py">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="441">
<caret line="91" column="116" selection-start-line="91" selection-start-column="52" selection-end-line="91" selection-end-column="116" />
<folding>
<element signature="e#0#14#0" expanded="true" />
</folding>
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/networking.py">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="435">
<caret line="34" column="26" lean-forward="true" selection-start-line="34" selection-start-column="26" selection-end-line="34" selection-end-column="26" />
<folding>
<element signature="e#0#17#0" expanded="true" />
<marker date="1550464345323" expanded="true" signature="925:1028" ph="..." />
<marker date="1550464345323" expanded="true" signature="925:1029" ph="..." />
<marker date="1550464345323" expanded="true" signature="1058:1062" ph="..." />
</folding>
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="true">
<entry file="file://$PROJECT_DIR$/js/all-io.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="300">
<caret line="12" column="13" lean-forward="true" selection-start-line="12" selection-start-column="13" selection-end-line="12" selection-end-column="13" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/css/draw-a-digit.css">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="489">
<state relative-caret-position="1225">
<caret line="49" column="15" lean-forward="true" selection-start-line="49" selection-start-column="15" selection-end-line="49" selection-end-column="15" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/js/webcam-input.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="300">
<caret line="12" column="32" lean-forward="true" selection-start-line="12" selection-start-column="32" selection-end-line="12" selection-end-column="32" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/.gitignore">
<provider selected="true" editor-type-id="text-editor">
@ -194,12 +137,55 @@
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/preprocessing_utils.py">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="41">
<state relative-caret-position="-264">
<caret line="16" column="31" selection-start-line="16" selection-start-column="31" selection-end-line="16" selection-end-column="31" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="true">
<entry file="file://$PROJECT_DIR$/gradio.py">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="761">
<caret line="119" lean-forward="true" selection-start-line="119" selection-end-line="119" />
<folding>
<element signature="e#0#14#0" expanded="true" />
<marker date="1550552437371" expanded="true" signature="1885:2171" ph="..." />
</folding>
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/js/all-io.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="50">
<caret line="2" selection-start-line="2" selection-end-line="2" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/templates/webcam_input.html">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="200">
<caret line="13" column="11" selection-start-line="13" selection-start-column="11" selection-end-line="13" selection-end-column="11" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/networking.py">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="575">
<caret line="23" lean-forward="true" selection-start-line="23" selection-end-line="23" />
<folding>
<element signature="e#0#17#0" expanded="true" />
</folding>
</state>
</provider>
</entry>
</file>
</leaf>
</component>
<component name="FileTemplateManagerImpl">
@ -281,9 +267,9 @@
<option value="$PROJECT_DIR$/outputs.py" />
<option value="$PROJECT_DIR$/templates/all_io.html" />
<option value="$PROJECT_DIR$/css/draw-a-digit.css" />
<option value="$PROJECT_DIR$/networking.py" />
<option value="$PROJECT_DIR$/js/all-io.js" />
<option value="$PROJECT_DIR$/gradio.py" />
<option value="$PROJECT_DIR$/networking.py" />
</list>
</option>
</component>
@ -294,10 +280,10 @@
<sorting>DEFINITION_ORDER</sorting>
</component>
<component name="ProjectFrameBounds" extendedState="6">
<option name="x" value="3353" />
<option name="y" value="189" />
<option name="width" value="1288" />
<option name="height" value="548" />
<option name="x" value="-16" />
<option name="y" value="-16" />
<option name="width" value="5152" />
<option name="height" value="2192" />
</component>
<component name="ProjectLevelVcsManager" settingsEditedManually="true">
<ConfirmationsSetting value="2" id="Add" />
@ -315,11 +301,21 @@
<item name="gradio" type="b2602c69:ProjectViewProjectNode" />
<item name="gradio" type="462c0819:PsiDirectoryNode" />
</path>
<path>
<item name="gradio" type="b2602c69:ProjectViewProjectNode" />
<item name="gradio" type="462c0819:PsiDirectoryNode" />
<item name="css" type="462c0819:PsiDirectoryNode" />
</path>
<path>
<item name="gradio" type="b2602c69:ProjectViewProjectNode" />
<item name="gradio" type="462c0819:PsiDirectoryNode" />
<item name="js" type="462c0819:PsiDirectoryNode" />
</path>
<path>
<item name="gradio" type="b2602c69:ProjectViewProjectNode" />
<item name="gradio" type="462c0819:PsiDirectoryNode" />
<item name="templates" type="462c0819:PsiDirectoryNode" />
</path>
</expand>
<select />
</subPane>
@ -363,10 +359,10 @@
<servers />
</component>
<component name="ToolWindowManager">
<frame x="2552" y="-8" width="2576" height="1096" extended-state="6" />
<frame x="-6" y="-6" width="1513" height="1013" extended-state="6" />
<editor active="true" />
<layout>
<window_info active="true" content_ui="combo" id="Project" order="0" visible="true" weight="0.14666137" />
<window_info active="true" content_ui="combo" id="Project" order="0" visible="true" weight="0.25360826" />
<window_info id="Structure" order="1" side_tool="true" weight="0.25" />
<window_info id="Favorites" order="2" side_tool="true" />
<window_info anchor="bottom" id="Message" order="0" />
@ -472,13 +468,6 @@
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/.gitignore">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="175">
<caret line="7" selection-start-line="7" selection-end-line="7" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/inputs.py">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="50">
@ -486,20 +475,6 @@
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/preprocessing_utils.py">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="41">
<caret line="16" column="31" selection-start-line="16" selection-start-column="31" selection-end-line="16" selection-end-column="31" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/js/webcam-input.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="300">
<caret line="12" column="32" lean-forward="true" selection-start-line="12" selection-start-column="32" selection-end-line="12" selection-end-column="32" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/css/index.css">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="700">
@ -521,16 +496,9 @@
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/css/draw-a-digit.css">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="489">
<caret line="49" column="15" lean-forward="true" selection-start-line="49" selection-start-column="15" selection-end-line="49" selection-end-column="15" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/templates/all_io.html">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="-1100">
<state relative-caret-position="-875">
<caret line="1" column="15" lean-forward="true" selection-start-line="1" selection-start-column="15" selection-end-line="1" selection-end-column="15" />
<folding>
<element signature="n#style#0;n#div#0;n#body#0;n#html#0;n#!!top" expanded="true" />
@ -539,33 +507,66 @@
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/gradio.py">
<entry file="file://$PROJECT_DIR$/.gitignore">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="441">
<caret line="91" column="116" selection-start-line="91" selection-start-column="52" selection-end-line="91" selection-end-column="116" />
<folding>
<element signature="e#0#14#0" expanded="true" />
</folding>
<state relative-caret-position="175">
<caret line="7" selection-start-line="7" selection-end-line="7" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/js/webcam-input.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="300">
<caret line="12" column="32" lean-forward="true" selection-start-line="12" selection-start-column="32" selection-end-line="12" selection-end-column="32" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/css/draw-a-digit.css">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="1225">
<caret line="49" column="15" lean-forward="true" selection-start-line="49" selection-start-column="15" selection-end-line="49" selection-end-column="15" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/preprocessing_utils.py">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="-264">
<caret line="16" column="31" selection-start-line="16" selection-start-column="31" selection-end-line="16" selection-end-column="31" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/networking.py">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="435">
<caret line="34" column="26" lean-forward="true" selection-start-line="34" selection-start-column="26" selection-end-line="34" selection-end-column="26" />
<state relative-caret-position="575">
<caret line="23" lean-forward="true" selection-start-line="23" selection-end-line="23" />
<folding>
<element signature="e#0#17#0" expanded="true" />
<marker date="1550464345323" expanded="true" signature="925:1028" ph="..." />
<marker date="1550464345323" expanded="true" signature="925:1029" ph="..." />
<marker date="1550464345323" expanded="true" signature="1058:1062" ph="..." />
</folding>
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/templates/webcam_input.html">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="200">
<caret line="13" column="11" selection-start-line="13" selection-start-column="11" selection-end-line="13" selection-end-column="11" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/js/all-io.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="300">
<caret line="12" column="13" lean-forward="true" selection-start-line="12" selection-start-column="13" selection-end-line="12" selection-end-column="13" />
<state relative-caret-position="50">
<caret line="2" selection-start-line="2" selection-end-line="2" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/gradio.py">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="761">
<caret line="119" lean-forward="true" selection-start-line="119" selection-end-line="119" />
<folding>
<element signature="e#0#14#0" expanded="true" />
<marker date="1550552437371" expanded="true" signature="1885:2171" ph="..." />
</folding>
</state>
</provider>
</entry>

View File

@ -139,7 +139,7 @@
"name": "python",
"nbconvert_exporter": "python",
"pygments_lexer": "ipython3",
"version": "3.7.1"
"version": "3.7.0"
}
},
"nbformat": 4,

View File

@ -37,7 +37,7 @@ class Interface():
input_soup = BeautifulSoup(input_page.read(), features="html.parser")
output_soup = BeautifulSoup(output_page.read(), features="html.parser")
all_io_url = 'templates/all_io.html'
all_io_url = 'templates/all_io.html'
all_io_page = open(all_io_url)
all_io_soup = BeautifulSoup(all_io_page.read(), features="html.parser")
input_tag = all_io_soup.find("div", {"id": "input"})
@ -50,6 +50,15 @@ class Interface():
f.write(str(all_io_soup.prettify))
return self.build_template_path
def _set_socket_url_in_js(self, socket_url):
with open('js/all-io.js') as fin:
lines = fin.readlines()
lines[0] = 'var NGROK_URL = "{}"\n'.format(socket_url.replace('http', 'ws'))
with open('js/all-io.js', 'w') as fout:
for line in lines:
fout.write(line)
def predict(self, array):
if self.model_type=='sklearn':
return self.model_obj.predict(array)[0]
@ -84,7 +93,6 @@ class Interface():
path_to_server = 'http://localhost:{}/'.format(server_port)
path_to_template = self._build_template()
webbrowser.open(path_to_server + path_to_template)
try:
start_server = websockets.serve(self.communicate, LOCALHOST_IP, INITIAL_WEBSOCKET_PORT)
except OSError:
@ -94,11 +102,18 @@ class Interface():
print("Model available locally at: {}".format(path_to_server + path_to_template))
if share_link:
ngrok_url = networking.setup_ngrok(server_port)
print("Model available publicly for 8 hours at: {}".format(ngrok_url + '/' + path_to_template))
site_ngrok_url = networking.setup_ngrok(server_port)
socket_ngrok_url = networking.setup_ngrok(INITIAL_WEBSOCKET_PORT, api_url=networking.NGROK_TUNNELS_API_URL2)
print(socket_ngrok_url)
self._set_socket_url_in_js(socket_ngrok_url)
print("Model available publicly for 8 hours at: {}".format(site_ngrok_url + '/' + path_to_template))
print("-- Gradio is in beta stage --")
print("Please report all bugs to: a12d@stanford.edu")
print("If you'd like to launch another gradio instance, please restart your notebook/python kernel.")
asyncio.get_event_loop().run_until_complete(start_server)
try:
asyncio.get_event_loop().run_forever()
except RuntimeError: # Runtime errors are thrown in jupyter notebooks because of async.
pass
pass
webbrowser.open(path_to_server + path_to_template)

View File

@ -1,17 +1,25 @@
var NGROK_URL = "wss://40d65b0a.ngrok.io"
try {
var ws = new WebSocket("ws://127.0.0.1:9200/")
var origin = window.location.origin;
if (origin.includes("ngrok")){
var ws = new WebSocket(NGROK_URL)
} else {
var ws = new WebSocket("ws://127.0.0.1:9200/")
}
ws.onerror = function(evt) {
notifyError(evt)
console.log(evt)
};
ws.onclose = function(event) {
console.log("WebSocket is closed now.");
$('#model-status').html('Model: closed');
$('#model-status').css('color', '#e23e44');
var model_status = $('#model-status')
model_status.html('Model: closed');
model_status.css('color', '#e23e44');
$('#overlay').css('visibility','visible')
};
} catch (e) {
notifyError(e)
console.log(e)
}
const sleep = (milliseconds) => {

View File

@ -7,7 +7,9 @@ import os
INITIAL_PORT_VALUE = 7860
LOCALHOST_PREFIX = 'localhost:'
NGROK_TUNNELS_URL = "http://localhost:4040/api/tunnels"
NGROK_TUNNELS_API_URL = "http://localhost:4040/api/tunnels" # TODO(this should be captured from output)
NGROK_TUNNELS_API_URL2 = "http://localhost:4041/api/tunnels" # TODO(this should be captured from output)
NGROK_ZIP_URLS = {
"linux": "https://bin.equinox.io/c/4VmDzA7iaHb/ngrok-stable-linux-amd64.zip",
"darwin": "https://bin.equinox.io/c/4VmDzA7iaHb/ngrok-stable-darwin-amd64.zip",
@ -32,11 +34,11 @@ def download_ngrok():
z.extractall()
def setup_ngrok(local_port):
def setup_ngrok(local_port, api_url=NGROK_TUNNELS_API_URL):
if not(os.path.isfile('ngrok.exe')):
download_ngrok()
subprocess.Popen(['ngrok', 'http', str(local_port)])
r = requests.get(NGROK_TUNNELS_URL)
r = requests.get(api_url)
for tunnel in r.json()['tunnels']:
if LOCALHOST_PREFIX + str(local_port) in tunnel['config']['addr']:
return tunnel['public_url']