Skip to content
This repository has been archived by the owner on Apr 29, 2022. It is now read-only.

Commit

Permalink
Added iOS view of the REST pane
Browse files Browse the repository at this point in the history
  • Loading branch information
jasonjoh committed Feb 6, 2017
1 parent 8091ab0 commit 4050858
Show file tree
Hide file tree
Showing 8 changed files with 535 additions and 90 deletions.
170 changes: 85 additions & 85 deletions RestCaller/RestCaller.html
Expand Up @@ -35,103 +35,103 @@
REST details
</li>
</ul>
<div class="ms-Pivot-content" data-content="get-item">
<div class="ms-Grid">
<div class="ms-Grid-row">
<div class="ms-Grid-col ms-u-sm6">
<button class="ms-Button ms-Button--primary get-item-button is-disabled">
<span class="ms-Button-label">Get Item</span>
</button>
</div>
<div class="ms-Grid-col ms-u-sm6">
<div class="ms-Spinner ms-Spinner--large get-item-spinner">
<div class="ms-Spinner-label">
Loading...
</div>
<div class="ms-Pivot-content" data-content="get-item">
<div class="ms-Grid">
<div class="ms-Grid-row">
<div class="ms-Grid-col ms-u-sm6">
<button class="ms-Button ms-Button--primary get-item-button is-disabled">
<span class="ms-Button-label">Get Item</span>
</button>
</div>
<div class="ms-Grid-col ms-u-sm6">
<div class="ms-Spinner ms-Spinner--large get-item-spinner">
<div class="ms-Spinner-label">
Loading...
</div>
</div>
</div>
</div>
</div>
<div class="code-box item-display">
<pre><code></code></pre>
</div>
</div>
<div class="ms-Pivot-content" data-content="update-item">
<div class="ms-Dropdown change-dropdown">
<label class="ms-Label">Change current item:</label>
<i class="ms-Dropdown-caretDown ms-Icon ms-Icon--ChevronDown"></i>
<select class="ms-Dropdown-select change-select">
<option>Choose a change&amp;hellip;</option>
<option>Mark unread</option>
<option>Flag for followup</option>
<option>Apply category</option>
</select>
</div>
<div class="code-box update-display">
<pre><code>Choose a change...</code></pre>
</div>
<div class="ms-Grid">
<div class="ms-Grid-row">
<div class="ms-Grid-col ms-u-sm6">
<button class="ms-Button ms-Button--primary update-item-button is-disabled">
<span class="ms-Button-label">Update Item</span>
</button>
</div>
<div class="ms-Grid-col ms-u-sm6">
<div class="ms-Spinner ms-Spinner--large update-item-spinner">
<div class="ms-Spinner-label">
Loading...
</div>
<div class="code-box item-display">
<pre><code></code></pre>
</div>
</div>
<div class="ms-Pivot-content" data-content="update-item">
<div class="ms-Dropdown change-dropdown">
<label class="ms-Label">Change current item:</label>
<i class="ms-Dropdown-caretDown ms-Icon ms-Icon--ChevronDown"></i>
<select class="ms-Dropdown-select change-select">
<option>Choose a change&amp;hellip;</option>
<option>Mark unread</option>
<option>Flag for followup</option>
<option>Apply category</option>
</select>
</div>
<div class="code-box update-display">
<pre><code>Choose a change...</code></pre>
</div>
<div class="ms-Grid">
<div class="ms-Grid-row">
<div class="ms-Grid-col ms-u-sm6">
<button class="ms-Button ms-Button--primary update-item-button is-disabled">
<span class="ms-Button-label">Update Item</span>
</button>
</div>
<div class="ms-Grid-col ms-u-sm6">
<div class="ms-Spinner ms-Spinner--large update-item-spinner">
<div class="ms-Spinner-label">
Loading...
</div>
</div>
</div>
</div>
</div>
</div>
<div class="ms-Pivot-content" data-content="item-details">
<div class="diagnostics">
<table class="ms-Table">
<thead>
<tr>
<th>Diagnostic field</th>
<th>Value</th>
</thead>
<tbody>
<tr>
<td>hostName</td>
<td class="hostname"></td>
</tr>
<tr>
<td>hostVersion</td>
<td class="hostversion"></td>
</tr>
<tr>
<td>OWAView</td>
<td class="owaview"></td>
</tr>
</tbody>
</table>
</div>
<div class="ms-Pivot-content" data-content="item-details">
<div class="diagnostics">
<table class="ms-Table">
<thead>
<tr>
<th>Diagnostic field</th>
<th>Value</th>
</thead>
<tbody>
<tr>
<td>hostName</td>
<td class="hostname"></td>
</tr>
<tr>
<td>hostVersion</td>
<td class="hostversion"></td>
</tr>
<tr>
<td>OWAView</td>
<td class="owaview"></td>
</tr>
</tbody>
</table>
</div>
<div class="token-view">
<div class="ms-font-xl">Access Token</div>
<div class="ms-Toggle">
<span class="ms-Toggle-description">Parse token</span>
<input type="checkbox" id="parse-token-toggle" class="ms-Toggle-input" />
<label for="parse-token-toggle" class="ms-Toggle-field" tabindex="0" >
<span class="ms-Label ms-Label--off">Off</span>
<span class="ms-Label ms-Label--on">On</span>
</label>
</div>
<div class="token-view">
<div class="ms-font-xl">Access Token</div>
<div class="ms-Toggle">
<span class="ms-Toggle-description">Parse token</span>
<input type="checkbox" id="parse-token-toggle" class="ms-Toggle-input" />
<label for="parse-token-toggle" class="ms-Toggle-field" tabindex="0" >
<span class="ms-Label ms-Label--off">Off</span>
<span class="ms-Label ms-Label--on">On</span>
</label>
</div>
<div class="code-box token-display">
<pre><code>loading...</code></pre>
</div>
<div class="code-box token-display">
<pre><code>loading...</code></pre>
</div>
<div class="resturl-view">
<div class="ms-font-xl">REST URL to item</div>
<div class="code-box resturl-display">
<pre><code>loading...</code></pre>
</div>
</div>
<div class="resturl-view">
<div class="ms-font-xl">REST URL to item</div>
<div class="code-box resturl-display">
<pre><code>loading...</code></pre>
</div>
</div>
</div>
</div>
</div>
</body>
Expand Down
23 changes: 23 additions & 0 deletions RestCaller/mobile/RestCaller-ios.css
@@ -0,0 +1,23 @@
.content-main {
padding: 10px;
}

.code-box > pre {
background-color: #eaeaea;
border: 1px solid #ccc;
padding: 5px 10px;
word-wrap: break-word;
white-space: pre-wrap;
}

.get-item-button, .update-item-button {
width: 100%;
}

.token-view {
margin-top: 10px;
}

.ms-Spinner {
display: none;
}
155 changes: 155 additions & 0 deletions RestCaller/mobile/RestCaller-ios.html
@@ -0,0 +1,155 @@
<!-- Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See full license at the bottom of this file. -->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<title></title>
<link rel="stylesheet" href="../../node_modules/framework7/dist/css/framework7.ios.min.css" />
<link rel="stylesheet" href="../../node_modules/framework7/dist/css/framework7.ios.colors.min.css" />

<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.1.1.min.js" type="text/javascript"></script>

<script src="https://appsforoffice.microsoft.com/lib/1/hosted/office.js" type="text/javascript"></script>

<script src="../../node_modules/framework7/dist/js/framework7.min.js" type="text/javascript"></script>

<script src="../../Scripts/jwt-decode.min.js" type="text/javascript"></script>

<link rel="stylesheet" href="RestCaller-ios.css" />
<script src="..\RestCaller.js" type="text/javascript"></script>
<script src="RestCaller-ios.js" type="text/javascript"></script>
</head>
<body class="framework7-root">
<div class="views tabs toolbar-through">
<div id="get-item-view" class="view view-main tab active" data-page="get-item">
<div class="pages">
<div data-page="get-item" class="page">
<div class="page-content">
<div class="content-block-title">Get item</div>
<div class="content-block">
<p><a href="#" class="button get-item-button disabled">Get Item</a></p>
<div class="code-box item-display">
<pre><code></code></pre>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="update-item-view" class="view tab" data-page="update-item">
<div class="pages">
<div data-page="update-item" class="page">
<div class="page-content">
<div class="content-block-title">Change current item</div>
<div class="list-block">
<ul>
<li>
<div class="item-content">
<div class="item-inner">
<div class="item-input">
<input type="text" placeholder="Choose a change" readonly id="change-picker">
</div>
</div>
</div>
</li>
</ul>
</div>
<div class="content-block">
<div class="code-box update-display">
<pre><code>Choose a change...</code></pre>
</div>
<p><a href="#" class="button update-item-button disabled">Update Item</a></p>
</div>
</div>
</div>
</div>
</div>
<div id="item-details-view" class="view tab" data-page="item-details">
<div class="pages">
<div data-page="item-details" class="page">
<div class="page-content">
<div class="content-block-title">Diagnostic fields</div>
<div class="list-block">
<ul>
<li class="item-content">
<div class="item-inner">
<div class="item-title">hostName</div>
<div class="item-after hostname"></div>
</div>
</li>
<li class="item-content">
<div class="item-inner">
<div class="item-title">hostVersion</div>
<div class="item-after hostversion"></div>
</div>
</li>
<li class="item-content">
<div class="item-inner">
<div class="item-title">OWAView</div>
<div class="item-after owaview"></div>
</div>
</li>
</ul>
</div>
<div class="content-block-title">Access Token</div>
<div class="content-block">
<div class="item-title label">Parse token</div>
<div class="item-input">
<label class="label-switch">
<input type="checkbox" id="parse-token-toggle">
<div class="checkbox"></div>
</label>
</div>
<div class="code-box token-display">
<pre><code>loading...</code></pre>
</div>
</div>
<div class="content-block-title">REST URL to item</div>
<div class="content-block">
<div class="code-box resturl-display">
<pre><code>loading...</code></pre>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="toolbar tabbar tabbar-labels">
<div class="toolbar-inner">
<a href="#get-item-view" class="tab-link">
<span class="tabbar-label">GET item</span>
</a>
<a href="#update-item-view" class="tab-link">
<span class="tabbar-label">PATCH item</span>
</a>
<a href="#item-details-view" class="tab-link">
<span class="tabbar-label">REST details</span>
</a>
</div>
</div>
</div>
</body>
</html>

<!-- MIT License:
Permission is hereby granted, free of charge, to any person obtaining
a copy of this software and associated documentation files (the
""Software""), to deal in the Software without restriction, including
without limitation the rights to use, copy, modify, merge, publish,
distribute, sublicense, and/or sell copies of the Software, and to
permit persons to whom the Software is furnished to do so, subject to
the following conditions:
The above copyright notice and this permission notice shall be
included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED ""AS IS"", WITHOUT WARRANTY OF ANY KIND,
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
-->

0 comments on commit 4050858

Please sign in to comment.