Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
232 changes: 127 additions & 105 deletions _posts/2016-05-24-iframe-api.md
Original file line number Diff line number Diff line change
Expand Up @@ -45,114 +45,136 @@ After the script is executed, a new global `Mergado` variable containing a singl
The `Mergado` object has a number of methods which can be used to better your application, improve its usability or overcome any limitations that are the result of strict handling of sandboxed `IFRAME`s by web browsers.
<table>
<thead>
<tr>
<th>Method</th>
<th>Parameters</th>
<th>Description</th>
</tr>
<tr>
<th>Method</th>
<th>Parameters</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td rowspan="3">
<pre class="highlight"><code>Mergado.startDownload(string url)</code></pre>
</td>
<td rowspan="3"><code class="highlighter-rouge">url</code>: Target URL to start download from</td>
<td>A new mini window will be popped up having <em>target URL</em> as its location. The window will be closed
after 10 seconds; until then the target server has time to make a proper response. In this case most
probably in a form of a file download.
</td>
</tr>
<tr>
<th>Example</th>
</tr>
<tr>
<td>
<pre class="highlight"><code>Mergado.tellHeight([int heightInPixels])</code></pre>
</td>
</tr>
<tr>
<td rowspan="2">
<pre class="highlight"><code>Mergado.openWindow(string url)</code></pre>
</td>
<td rowspan="2"><code class="highlighter-rouge">url</code>: Target page URL</td>
<td>A new browser window will be opened having the <em>target URL</em> as its location. This window will NOT
automatically close itself.
</td>
</tr>
<tr>
<td>
<b>Example:</b>
<!-- 1 -->
<tr>
<td rowspan="3">
<pre class="highlight"><code>Mergado.startDownload(string url)</code></pre>
</td>
<td rowspan="3"><code class="highlighter-rouge">url</code>: Target URL to start download from</td>
<td>A new mini window will be popped up having <em>target URL</em> as its location. The window will be closed
after 10 seconds; until then the target server has time to make a proper response. In this case most
probably in a form of a file download.
</td>
</tr>
<tr>
<th>Example</th>
</tr>
<tr>
<td>
<pre class="highlight"><code>Mergado.startDownload('https://app.mergado.com/')</code></pre>
</td>
</tr>
<!-- 2 -->
<tr>
<td rowspan="3">
<pre class="highlight"><code>Mergado.openWindow(
string url,
string target = '_blank'
)</code></pre>
</td>
<td rowspan="3">
<code class="highlighter-rouge">url</code>: Target page URL<br>
<code class="highlighter-rouge">target</code>: Open URL in new or same browser window.
Possible options are the same as the target attribute for
<a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/a#target" target="_blank">HTML link</a>
</td>
<td>A new browser window will be opened having the <em>target URL</em> as its location. This window will NOT
automatically close itself.
</td>
</tr>
<tr>
<th>Example:</th>
</tr>
<tr>
<td>
<pre class="highlight"><code>Mergado.openWindow('https://app.mergado.com/')</code></pre>
</td>
</tr>
<tr>
<td rowspan="2">
<pre class="highlight"><code>Mergado.scrollTo(int topInPixels)</code></pre>
</td>
<td rowspan="2"><code class="highlighter-rouge">topInPixels</code>: Vertical scroll value, relative to app’s
<code class="highlighter-rouge">IFRAME</code> viewport. Must be set in pixels.
</td>
<td>The browser’s absolute vertical scroll will be calculated automatically. Just set this Y value relative to
your page.
</td>
</tr>
<tr>
<td>
<b>Example:</b>
<pre class="highlight"><code>Mergado.scrollTo(115)</code></pre>
</td>
</tr>
<tr>
<td rowspan="2">
<pre class="highlight"><code>Mergado.setAppRoute(string fullAppRoute)</code></pre>
</td>
<td rowspan="2"><code class="highlighter-rouge">fullAppRoute</code>: Complete app route e.g.
<code class="highlighter-rouge">eshop/1/project/2/help/</code></td>
<td>The <code class="highlighter-rouge">fullAppRoute</code> parameter is than via JS method
<code class="highlighter-rouge">history.replaceState()</code> apended into mergado URL as
<code class="highlighter-rouge">route</code> query string. And if this URL is then invoked, this part is
appended after app URL in IFRAME src attribute.
</td>
</tr>
<tr>
<td>
<b>Example:</b><br>
<ol>
<li>
App calls
<pre class="highlight"><code>setAppRoute('eshop/1/project/2/help/')</code></pre>
</li>
<li>
In Mergado URL is appended
<pre class="highlight"><code>...&amp;route=eshop%2F1%2Fproject%2F2%2Fhelp%2F</code></pre>
</li>
<li>
If this page is loaded then IFRAME src attribute is created from
<pre class="highlight"><code>&lt;your-extension-host&gt;/apps/appname/</code></pre>
and query string <code class="highlighter-rouge">route</code> parameter
<pre class="highlight"><code>eshop/1/project/2/help/</code></pre>
</li>
</ol>
</td>
</tr>
<tr>
<td rowspan="2">
<pre class="highlight"><code>Mergado.tellHeight([int heightInPixels])</code></pre>
</td>
<td rowspan="2"><code class="highlighter-rouge">heightInPixels</code> (optional): Can be set in pixels,
<code class="highlighter-rouge">0</code> or <code class="highlighter-rouge">undefined</code></td>
<td><b>DEPRECATED</b><br><br>The <em>wrapper page</em> will set height of app’s viewport
<code class="highlighter-rouge">IFRAME</code> to this number of pixels. If no height is passed, it will be
determined automatically.<br><br>For newly created apps since Mergado redesign in Spring 2018 this is no
longer necessary, as the app’s iframe spans almost entire browser viewport and uses its own scrolling.
</td>
</tr>
<tr>
<td>
<b>Example:</b>
<pre class="highlight"><code>Mergado.tellHeight(260)</code></pre>
</td>
</tr>
<pre class="highlight"><code>Mergado.openWindow('https://app.mergado.com/', '_self')</code></pre>
</td>
</tr>
<!-- 3 -->
<tr>
<td rowspan="3">
<pre class="highlight"><code>Mergado.scrollTo(int topInPixels)</code></pre>
</td>
<td rowspan="3"><code class="highlighter-rouge">topInPixels</code>: Vertical scroll value, relative to app’s
<code class="highlighter-rouge">IFRAME</code> viewport. Must be set in pixels.
</td>
<td>The browser’s absolute vertical scroll will be calculated automatically. Just set this Y value relative to
your page.
</td>
</tr>
<tr>
<th>Example:</th>
</tr>
<tr>
<td>
<pre class="highlight"><code>Mergado.scrollTo(115)</code></pre>
</td>
</tr>
<!-- 4 -->
<tr>
<td rowspan="3">
<pre class="highlight"><code>Mergado.setAppRoute(string fullAppRoute)</code></pre>
</td>
<td rowspan="3"><code class="highlighter-rouge">fullAppRoute</code>: Complete app route e.g.
<code class="highlighter-rouge">eshop/1/project/2/help/</code></td>
<td>The <code class="highlighter-rouge">fullAppRoute</code> parameter is than via JS method
<code class="highlighter-rouge">history.replaceState()</code> apended into mergado URL as
<code class="highlighter-rouge">route</code> query string. And if this URL is then invoked, this part is
appended after app URL in IFRAME src attribute.
</td>
</tr>
<tr>
<th>Example:</th>
</tr>
<tr>
<td>
<ol>
<li>
App calls
<pre class="highlight"><code>setAppRoute('eshop/1/project/2/help/')</code></pre>
</li>
<li>
In Mergado URL is appended
<pre class="highlight"><code>...&amp;route=eshop%2F1%2Fproject%2F2%2Fhelp%2F</code></pre>
</li>
<li>
If this page is loaded then IFRAME src attribute is created from
<pre class="highlight"><code>&lt;your-extension-host&gt;/apps/appname/</code></pre>
and query string <code class="highlighter-rouge">route</code> parameter
<pre class="highlight"><code>eshop/1/project/2/help/</code></pre>
</li>
</ol>
</td>
</tr>
<!-- 5 -->
<tr>
<td rowspan="3">
<pre class="highlight"><code>Mergado.tellHeight([int heightInPixels])</code></pre>
</td>
<td rowspan="3"><code class="highlighter-rouge">heightInPixels</code> (optional): Can be set in pixels,
<code class="highlighter-rouge">0</code> or <code class="highlighter-rouge">undefined</code></td>
<td><b>DEPRECATED</b><br><br>The <em>wrapper page</em> will set height of app’s viewport
<code class="highlighter-rouge">IFRAME</code> to this number of pixels. If no height is passed, it will be
determined automatically.<br><br>For newly created apps since Mergado redesign in Spring 2018 this is no
longer necessary, as the app’s iframe spans almost entire browser viewport and uses its own scrolling.
</td>
</tr>
<tr>
<th>Example:</th>
</tr>
<tr>
<td>
<pre class="highlight"><code>Mergado.tellHeight(260)</code></pre>
</td>
</tr>
</tbody>
</table>

Expand Down
8 changes: 6 additions & 2 deletions _posts/2016-06-02-app-hooks.md
Original file line number Diff line number Diff line change
Expand Up @@ -665,7 +665,9 @@ Event hook called when a when a user creates a connection in the e-shop’s keyc
```json
{
"action": "control.shop.keychain.link_created",
"shop_id": 123
"shop_id": 123,
"connection_name": "unas.eu",
"user_id": 456
}
```

Expand All @@ -684,7 +686,9 @@ Event hook called when a when a user deletes a connection from the e-shop’s ke
```json
{
"action": "control.shop.keychain.link_deleted",
"shop_id": 123
"shop_id": 123,
"connection_name": "heureka.cz",
"user_id": 456
}
```

Expand Down
24 changes: 24 additions & 0 deletions _posts/2021-07-30-additional-integrations.md
Original file line number Diff line number Diff line change
Expand Up @@ -93,3 +93,27 @@ You can use this button/link to lead your users to the URL mentioned above. Mino
```html
{{ page.mergadoButtonHtml }}
```

## Redirect into Mergado Keychain

If you require a connection with one of the services in Mergado Keychain and the user hasn't connected to Mergado Keychain
(connection status you can see on this [endpoint](https://api-docs.mergado.com/?api=mergado-api#/Eshops/get_shops__id___connection__validate){:target="_blank"}),
you can redirect from your app to Mergado Keychain to create this connection.

#### Minimal version
`https://app.mergado.com/go/keychain
?eshopId=<eshop_id>
&connection=<connection_name>`

#### With additional options
```
https://app.mergado.com/go/keychain
?eshopId=<eshop_id>
&connectionName=<connection_name>
&callbackUrl=<callback_url>
```

### GET Parameters Explained
- `eshopId`: E-shop ID of the user for which you want to create the connection.
- `connectionName`: Connection name, e.g. `unas.eu`, `heureka.cz`, list of available names is on this [endpoint](https://api-docs.mergado.com/?api=mergado-api#/Eshops/get_shops__id__info_){:target="_blank"}.
- `callbackUrl`: Optional parameter with encoded URL for a possible redirect to this URL after successful connection creation.