Skip to content

Commit

Permalink
[other] ENGMT-1983: split buttons on left from output on right
Browse files Browse the repository at this point in the history
  • Loading branch information
@bredmond5
bredmond5 committed Dec 18, 2024
1 parent 5121263 commit c5d6ddb
Showing 1 changed file with 88 additions and 65 deletions.
153 changes: 88 additions & 65 deletions examples/example.template.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,20 @@
<title>Branch Metrics Web SDK Example App</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<style type="text/css">
.lineBreak {
opacity: 0.5;
background-color: lightgray;
}

.horizontalLine {
height: 0.5px;
width: 100%;
}

.verticalLine {
width: 0.5px;
}

body {
font-family: Arial, sans-serif;
background-color: #f4f4f9;
Expand Down Expand Up @@ -172,73 +186,82 @@
</head>

<body>
<div class="container">
<div class="row col-lg-8 col-lg-offset-2">
<h2>Branch Metrics Web SDK Example</h2>
</div>
<section>
<div class="row col-lg-8 col-lg-offset-2">
<h4>Session Info
<button class="btn btn-info" onclick="copySessionInfo()" style="margin-left: 10px; font-size: 12px; padding: 2px 8px; cursor: pointer;">
Copy
</button>
</h4>
<pre id="session-info">Reading session from .init()...</pre>
<h4>Request</h4>
<pre id="request">Click a button!</pre>
<h4>Response</h4>
<pre id="response">Click a button!</pre>
</div>
</section>
<section>
<div class="row col-lg-8 col-lg-offset-2">
<h3>Methods</h3>
<a>https://help.branch.io/developers-hub/docs/web-full-reference</a>
<hr>
<h4>Session</h4>
<div class="group">
<button class="btn btn-info" onclick="callData()">.data()</button>
<button class="btn btn-info" onclick="callLogout()">Logout</button>
<button class="btn btn-info" onclick="callFirst()">.first()</button>
</div>
<h4>Identity</h4>
<div class="group">
<input class="example-input" type="text" id="identityID" placeholder="[email protected]">
<button id="setIdentity" class="btn btn-info" onclick="callSetIdentity()">Set Identity</button>
</div>
<h4>Events</h4>
<div class="group">
<button class="btn btn-info" onclick="callLogEvent('PURCHASE')">Create Standard Event</button>
<button class="btn btn-info" onclick="callLogEvent('testedCustomEvent')">Create Custom Event</button>
</div>
<h4>Sharing</h4>
<div class="group">
<button class="btn btn-info" onclick="callLink()">Create Link</button>
<button class="btn btn-info" onclick="callQrCode()">Create QrCode</button>
<button class="btn btn-info" onclick="callBanner()">.banner()</button>
</div>
<h4>Tracking</h4>
<div class="group">
<button class="btn btn-info" onclick="callDisableTracking()">Disable Tracking</button>
<button class="btn btn-info" onclick="callEnableTracking()">Enable Tracking</button>
</div>
<div style="display: flex; flex-direction: column; align-items: center; width: 100%">
<h2>Branch Metrics Web SDK Example</h2>
<hr class="lineBreak horizontalLine">
<div style="display: flex; align-items: stretch; justify-content: center; width: 90%;">
<div class="container">
<section>
<div class="row col-lg-8 col-lg-offset-2">
<h3>Methods</h3>
<a>https://help.branch.io/developers-hub/docs/web-full-reference</a>
<hr class="lineBreak horizontalLine">
<h4>Session</h4>
<div class="group">
<button class="btn btn-info" onclick="callData()">.data()</button>
<button class="btn btn-info" onclick="callLogout()">Logout</button>
<button class="btn btn-info" onclick="callFirst()">.first()</button>
</div>
<h4>Identity</h4>
<div class="group">
<input class="example-input" type="text" id="identityID" placeholder="[email protected]">
<button id="setIdentity" class="btn btn-info" onclick="callSetIdentity()">Set Identity</button>
</div>
<h4>Events</h4>
<div class="group">
<button class="btn btn-info" onclick="callLogEvent('PURCHASE')">Create Standard Event</button>
<button class="btn btn-info" onclick="callLogEvent('testedCustomEvent')">Create Custom Event</button>
</div>
<h4>Sharing</h4>
<div class="group">
<button class="btn btn-info" onclick="callLink()">Create Link</button>
<button class="btn btn-info" onclick="callQrCode()">Create QrCode</button>
<button class="btn btn-info" onclick="callBanner()">.banner()</button>
</div>
<h4>Tracking</h4>
<div class="group">
<button class="btn btn-info" onclick="callDisableTracking()">Disable Tracking</button>
<button class="btn btn-info" onclick="callEnableTracking()">Enable Tracking</button>
</div>
</div>
<div class="row col-lg-8 col-lg-offset-2">
<h3>Api Settings</h3>
<hr class="lineBreak horizontalLine">
<div class="group" id="configButtons"></div>

<label id="branchKeyLabel" for="branchKeyInput">Branch Key:</label>
<input type="text" id="branchKeyInput" class="apiInput">
<br>
<label id="apiUrlLabel" for="apiUrlInput">Api Url:</label>
<input type="text" id="apiUrlInput" class="apiInput">
<br>
<button class="btn btn-info" onclick="updateQueryParams()">
Update Api Settings
</button>
</div>
</section>
</div>
<div class="row col-lg-8 col-lg-offset-2">
<h3>Api Settings</h3>
<hr>
<div class="group" id="configButtons"></div>

<label id="branchKeyLabel" for="branchKeyInput">Branch Key:</label>
<input type="text" id="branchKeyInput" class="apiInput">
<br>
<label id="apiUrlLabel" for="apiUrlInput">Api Url:</label>
<input type="text" id="apiUrlInput" class="apiInput">
<br>
<button class="btn btn-info" onclick="updateQueryParams()">
Update Api Settings
</button>
<div class="lineBreak verticalLine"></div>
<div class="container">
<section>
<div class="row col-lg-8 col-lg-offset-2">
<h3>Api Requests</h3>
<hr class="lineBreak horizontalLine">
<h4>Session Info
<button class="btn btn-info" onclick="copySessionInfo()" style="margin-left: 10px; font-size: 12px; padding: 2px 8px; cursor: pointer;">
Copy
</button>
</h4>
<pre id="session-info">Reading session from .init()...</pre>
<h4>Request</h4>
<pre id="request">Click a button!</pre>
<h4>Response</h4>
<pre id="response">Click a button!</pre>
</div>
</section>
</div>
</section>
</div>

</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
Expand Down

0 comments on commit c5d6ddb

Please sign in to comment.