1
0
Fork 0
mirror of synced 2024-06-01 18:39:57 +12:00
appwrite/app/views/console/database/collection.phtml
2021-11-23 13:46:20 +01:00

1267 lines
64 KiB
PHTML

<?php
$logs = $this->getParam('logs', null);
?>
<div
data-service="database.getCollection"
data-param-collection-id="{{router.params.id}}"
data-scope="sdk"
data-event="load,database.updateCollection,database.createAttribute,database.deleteAttribute,database.createIndex,database.deleteIndex"
data-name="project-collection">
<div class="cover">
<h1 class="zone xl margin-bottom-large">
<a data-ls-attrs="href=/console/database?project={{router.params.project}}" class="back text-size-small link-return-animation--start"><i class="icon-left-open"></i> Database</a>
<br />
<span data-ls-bind="{{project-collection.name}}">&nbsp;&nbsp;</span>
</h1>
</div>
<div data-ui-modal class="modal width-large box close" data-button-hide="on" data-open-event="open-json">
<button type="button" class="close pull-end" data-ui-modal-close=""><i class="icon-cancel"></i></button>
<h2>JSON View</h2>
<div class="margin-bottom">
<input type="hidden" data-ls-bind="{{project-collection}}" data-forms-code />
</div>
<button data-ui-modal-close="" type="button" class="reverse">Cancel</button>
</div>
<div class="zone xl">
<ul class="phases clear" data-ui-phases data-selected="{{router.params.tab}}">
<li data-state="/console/database/collection?id={{router.params.id}}&project={{router.params.project}}">
<h2>Documents</h2>
<div
data-service="database.listDocuments"
data-event="load,database.createDocument,database.updateDocument,database.deleteDocument"
data-param-collection-id="{{router.params.id}}"
data-param-limit="<?php echo APP_PAGING_LIMIT; ?>"
data-param-order-types="DESC"
data-param-order-types-cast-to="array"
data-scope="sdk"
data-name="project-documents">
<div data-ls-if="0 == {{project-documents.sum}}" class="box margin-bottom">
<h3 class="margin-bottom-small text-bold">No Documents Found</h3>
<p class="margin-bottom-no">Add your first document to get started</p>
</div>
<div data-ls-if="({{project-documents.sum}})" class="margin-top-negative">
<div class="margin-bottom-small text-align-end text-size-small text-fade"><span data-ls-bind="{{project-documents.sum}}"></span><span data-ls-if="{{project-documents.sum}} == <?php echo APP_LIMIT_COUNT; ?>">+</span> documents found</div>
<div class="box margin-bottom y-scroll text-size-small">
<table class="vertical borders">
<thead>
<tr data-ls-loop="project-collection.attributes" data-ls-as="attribute" data-ls-prefix="template-attribute-title-first" data-ls-limit="20" data-ls-ignore-path-bind="1">
<td data-ls-if="{{attribute.status}} === 'available'" style="width: 170px">
<i data-ls-if="{{attribute.format}}" data-ls-attrs="class=pull-end icon-{{attribute.format}} text-size-xs"></i>
<i data-ls-if="!{{attribute.format}}" data-ls-attrs="class=pull-end icon-{{attribute.type}} text-size-xs"></i>
<span class="text-bold" data-ls-bind="{{attribute.key}}"></span>
<span class="text-size-small" data-ls-if="{{attribute.array}}">[]</span>
</td>
</tr>
</thead>
<tbody data-ls-loop="project-documents.documents" data-ls-as="node" data-ls-ignore-path-bind="1">
<tr data-ls-loop="project-collection.attributes" data-ls-as="attribute" data-ls-prefix="template-attribute-body-first" data-ls-limit="20" data-ls-ignore-path-bind="1">
<td data-ls-if="{{attribute.status}} === 'available'" data-ls-attrs="data-title={{attribute.key}}">
<a data-ls-attrs="href=/console/database/document?id={{node.$id}}&collection={{node.$collection}}&project={{router.params.project}}">
<span data-ls-if="{{node|documentAttribute}}" data-ls-bind="{{node|documentAttribute}}"></span>
<span data-ls-if="!{{node|documentAttribute}}" class="text-fade">n/a</span>
</a>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="pull-end text-align-center paging">
<form
data-service="database.listDocuments"
data-event="submit"
data-param-collection-id="{{router.params.id}}"
data-param-search="{{router.params.search}}"
data-param-limit="<?php echo APP_PAGING_LIMIT; ?>"
data-param-order-types="DESC"
data-param-order-types-cast-to="array"
data-scope="sdk"
data-name="project-documents"
data-success="state"
data-success-param-state-keys="search,offset">
<button name="offset" data-paging-back data-offset="{{router.params.offset}}" data-sum="{{project-documents.sum}}" class="margin-end round small" aria-label="Back"><i class="icon-left-open"></i></button>
</form>
<span data-ls-bind="{{router.params.offset|pageCurrent}} / {{project-documents.sum|pageTotal}}"></span>
<form
data-service="database.listDocuments"
data-event="submit"
data-param-collection-id="{{router.params.id}}"
data-param-search="{{router.params.search}}"
data-param-limit="<?php echo APP_PAGING_LIMIT; ?>"
data-param-order-types="DESC"
data-param-order-types-cast-to="array"
data-scope="sdk"
data-name="project-documents"
data-success="state"
data-success-param-state-keys="search,offset">
<button name="offset" data-paging-next data-offset="{{router.params.offset}}" data-sum="{{project-documents.sum}}" class="margin-start round small" aria-label="Next"><i class="icon-right-open"></i></button>
</form>
</div>
<a data-ls-if="0 < {{project-collection.attributes.length}}" data-ls-attrs="href=/console/database/document/new?collection={{router.params.id}}&project={{router.params.project}}" class="button">
Add Document
</a>
<a data-ls-if="!{{project-collection.attributes.length}}" data-ls-attrs="href=/console/database/collection/attributes?id={{router.params.id}}&project={{router.params.project}}" class="button">
Create Attribute
</a>
</div>
</li>
<li data-state="/console/database/collection/attributes?id={{router.params.id}}&project={{router.params.project}}">
<h2>Attributes</h2>
<div class="clear box margin-bottom">
<div data-ls-if="0 == {{project-collection.attributes.length}}">
<h3 class="margin-bottom-small text-bold">No Attributes Found</h3>
<p class="margin-bottom-no">Add your first attribute to get started</p>
</div>
<table class="vertical" data-ls-if="0 < {{project-collection.attributes.length}}">
<thead>
<tr>
<th width="30"></th>
<th width="100"></th>
<th width="130">Attribute ID</th>
<th width="100">Type</th>
<th width="180">Default</th>
<th></th>
<th width="80"></th>
</tr>
</thead>
<tbody data-ls-loop="project-collection.attributes" data-ls-as="attribute">
<tr>
<td>
<i data-ls-if="!{{attribute.format}}" data-ls-attrs="class=icon-{{attribute.type}}"></i>
<i data-ls-if="{{attribute.format}}" data-ls-attrs="class=icon-{{attribute.format}}"></i>
</td>
<td data-title="Status">
<span data-ls-if="{{attribute.status}} == 'available'" class="text-size-small text-success">available&nbsp;</span>
<span data-ls-if="{{attribute.status}} == 'processing'" class="text-size-small text-info">processing&nbsp;</span>
<span data-ls-if="{{attribute.status}} == 'failed'" class="text-size-small text-danger">failed&nbsp;</span>
<span data-ls-if="{{attribute.status}} == 'deleting'" class="text-size-small text-danger">deleting&nbsp;</span>
<span data-ls-if="{{attribute.status}} == 'stuck'" class="text-size-small text-danger">stuck&nbsp;</span>
</td>
<td data-title="Attribute ID: ">
<span class="text-size-small" data-ls-bind="{{attribute.key}}"></span><span class="text-size-small" data-ls-if="{{attribute.size}}" data-ls-bind="({{attribute.size}})"></span>
</td>
<td data-title="Type:">
<span class="text-size-small" data-ls-bind="{{attribute.type}}"></span>
<span class="text-size-small" data-ls-if="{{attribute.array}}">[]</span>
<span class="text-size-small" data-ls-if="{{attribute.format}}" data-ls-bind="({{attribute.format}})"></span>
</td>
<td data-title="Default:">
<span class="text-size-small" data-ls-bind="{{attribute.default}}" data-ls-attr="title={{attribute.default}}"></span>
<span class="text-fade text-size-small" data-ls-if="!({{attribute.default}})">n/a</span>
</td>
<td data-title="">
<span class="text-size-small text-danger" data-ls-if="{{attribute.required}}">required</span>
</td>
<td data-title="">
<form
data-ls-if="{{attribute.status}} !== 'deleting'"
class="pull-end"
data-analytics
data-analytics-activity
data-analytics-event="submit"
data-analytics-category="console"
data-analytics-label="Delete Collection Attribute"
data-service="database.deleteAttribute"
data-scope="sdk"
data-event="submit"
data-confirm="Are you sure you want to delete this attribute?"
data-success="alert,trigger"
data-success-param-alert-text="Deleted attribute successfully"
data-success-param-trigger-events="database.deleteAttribute"
data-failure="alert"
data-failure-param-alert-text="Failed to delete attribute"
data-failure-param-alert-classname="error">
<input type="hidden" name="projectId" data-ls-bind="{{router.params.project}}" />
<input type="hidden" name="collectionId" data-ls-bind="{{project-collection.$id}}" />
<input type="hidden" name="attributeId" data-ls-bind="{{attribute.key}}" />
<button class="danger small">Delete</button>
</form>
</td>
</tr>
</tbody>
</table>
</div>
<div class="drop-list pull-start" data-ls-ui-open="" data-button-aria="Choose Platform" data-button-text="Add Attribute" data-button-class="button" data-blur="1">
<ul>
<li>
<div class="link new-attribute-string"><i class="avatar icon-string"></i> New String Attribute</div>
</li>
<li>
<div class="link new-attribute-integer"><i class="avatar icon-integer"></i> New Integer Attribute</div>
</li>
<li>
<div class="link new-attribute-float"><i class="avatar icon-float"></i> New Float Attribute</div>
</li>
<li>
<div class="link new-attribute-boolean"><i class="avatar icon-boolean"></i> New Boolean Attribute</div>
</li>
<li>
<div class="link new-attribute-url"><i class="avatar icon-link"></i> New URL Attribute</div>
</li>
<li>
<div class="link new-attribute-email"><i class="avatar icon-mail"></i> New Email Attribute</div>
</li>
<li>
<div class="link new-attribute-ip"><i class="avatar icon-ip"></i> New IP Attribute</div>
</li>
<li>
<div class="link new-attribute-enum"><i class="avatar icon-enum"></i> New Enum Attribute</div>
</li>
</ul>
</div>
</li>
<li data-state="/console/database/collection/indexes?id={{router.params.id}}&project={{router.params.project}}">
<h2>Indexes</h2>
<div class="clear box margin-bottom">
<div data-ls-if="0 == {{project-collection.indexes.length}}">
<h3 class="margin-bottom-small text-bold">No Indexes Found</h3>
<p class="margin-bottom-no">Add your first index to get started</p>
</div>
<table class="vertical multi-line" data-ls-if="0 < {{project-collection.indexes.length}}">
<thead>
<tr>
<th width="30"></th>
<th width="80"></th>
<th width="130">Index ID</th>
<th width="100">Type</th>
<th width="180">Attributes</th>
<th></th>
<th width="80"></th>
</tr>
</thead>
<tbody data-ls-loop="project-collection.indexes" data-ls-as="index">
<tr>
<td>
<i class="icon-key"></i>
</td>
<td data-title="Status">
<span data-ls-if="{{index.status}} == 'available'" class="text-size-small text-success">available&nbsp;</span>
<span data-ls-if="{{index.status}} == 'processing'" class="text-size-small text-info">processing&nbsp;</span>
<span data-ls-if="{{index.status}} == 'failed'" class="text-size-small text-danger">failed&nbsp;</span>
<span data-ls-if="{{index.status}} == 'deleting'" class="text-size-small text-danger">deleting&nbsp;</span>
</td>
<td data-title="Index ID: ">
<span class="text-size-small" data-ls-bind="{{index.key}}"></span><span class="text-size-small" data-ls-if="{{index.size}}" data-ls-bind="({{index.size}})"></span>
</td>
<td data-title="Type:">
<span class="text-size-small" data-ls-bind="{{index.type}}"></span>
<span class="text-size-small" data-ls-if="{{index.array}}">[]</span>
</td>
<td data-title="Attributes:">
<span class="text-size-small" data-ls-bind="{{index|indexAttributes}}"></span>
</td>
<td data-title="">
<span class="text-size-small text-danger" data-ls-if="{{index.required}}">required</span>
</td>
<td data-title="">
<form
data-ls-if="{{index.status}} !== 'deleting'"
class="pull-end"
data-analytics
data-analytics-activity
data-analytics-event="submit"
data-analytics-category="console"
data-analytics-label="Delete Collection Index"
data-service="database.deleteIndex"
data-scope="sdk"
data-event="submit"
data-confirm="Are you sure you want to delete this index?"
data-success="alert,trigger"
data-success-param-alert-text="Deleted index successfully"
data-success-param-trigger-events="database.deleteIndex"
data-failure="alert"
data-failure-param-alert-text="Failed to delete index"
data-failure-param-alert-classname="error">
<input type="hidden" name="projectId" data-ls-bind="{{router.params.project}}" />
<input type="hidden" name="collectionId" data-ls-bind="{{project-collection.$id}}" />
<input type="hidden" name="indexId" data-ls-bind="{{index.key}}" />
<button class="danger small">Delete</button>
</form>
</td>
</tr>
</tbody>
</table>
</div>
<button class="new-index">Add Index</button>
</li>
<li data-state="/console/database/collection/activity?id={{router.params.id}}&project={{router.params.project}}">
<h2>Activity <span class="badge" data-ls-bind="{{logs.sum}}"></span></h2>
<?php echo $logs->render(); ?>
</li>
<li data-state="/console/database/collection/usage?id={{router.params.id}}&project={{router.params.project}}">
<form
class="pull-end margin-start-small margin-top-small" data-ls-if="{{usage.range}} !== '90d'"
data-service="database.getCollectionUsage"
data-event="submit"
data-name="usage"
data-param-collection-id="{{router.params.id}}"
data-param-range="90d">
<button class="tick">90d</button>
</form>
<button class="tick pull-end margin-start-small margin-top-small" data-ls-if="{{usage.range}} === '90d'" disabled>90d</button>
<form
class="pull-end margin-start-small margin-top-small" data-ls-if="{{usage.range}} !== '30d'"
data-service="database.getCollectionUsage"
data-event="submit"
data-name="usage"
data-param-collection-id="{{router.params.id}}">
<button class="tick">30d</button>
</form>
<button class="tick pull-end margin-start-small margin-top-small" data-ls-if="{{usage.range}} === '30d'" disabled>30d</button>
<form
class="pull-end margin-start-small margin-top-small" data-ls-if="{{usage.range}} !== '24h'"
data-service="database.getCollectionUsage"
data-event="submit"
data-name="usage"
data-param-collection-id="{{router.params.id}}"
data-param-range="24h">
<button class="tick">24h</button>
</form>
<button class="tick pull-end margin-start-small margin-top-small" data-ls-if="{{usage.range}} === '24h'" disabled>24h</button>
<h2>Usage</h2>
<div data-service="database.getCollectionUsage" data-event="load" data-name="usage" data-param-collection-id="{{router.params.id}}">
<h3 class="margin-bottom-tiny">Documents</h3>
<p class="text-fade">Count of documents over time</p>
<div class="box margin-bottom-small">
<div class="margin-start-negative-small margin-end-negative-small margin-top-negative-small margin-bottom-negative-small">
<div class="chart margin-bottom-no">
<input type="hidden" data-ls-bind="{{usage}}" data-forms-chart="Documents=documentsCount" data-show-y-axis="true" data-height="140" />
</div>
</div>
</div>
<ul class="chart-notes margin-bottom-large">
<li>Documents <span data-ls-bind="({{usage.documentsCount|statsGetLast|statsTotal}})"></span></li>
</ul>
<h3 class="margin-bottom-tiny">Operations</h3>
<p class="text-fade">Count of documents create, read, update and delete operations over time</p>
<div class="box margin-bottom-small">
<div class="margin-start-negative-small margin-end-negative-small margin-top-negative-small margin-bottom-negative-small">
<div class="chart margin-bottom-no">
<input
type="hidden"
data-ls-bind="{{usage}}"
data-forms-chart="Created=documentsCreate,Read=documentsRead,Updated=documentsUpdate,Deleted=documentsDelete"
data-show-y-axis="true"
data-colors="create,read,update,delete"
data-height="140" />
</div>
</div>
</div>
<ul class="chart-notes margin-bottom-large crud">
<li>Created</li>
<li>Read</li>
<li>Updated</li>
<li>Deleted</li>
</ul>
</div>
</li>
<li data-state="/console/database/collection/settings?id={{router.params.id}}&project={{router.params.project}}">
<h2>Settings</h2>
<div class="row responsive margin-top-negative">
<div class="col span-8 margin-bottom">
<form
data-analytics
data-analytics-activity
data-analytics-event="submit"
data-analytics-category="console"
data-analytics-label="Update Database Collection"
data-service="database.updateCollection"
data-scope="sdk"
data-event="submit"
data-param-collection-id="{{router.params.id}}"
data-success="alert,trigger"
data-success-param-alert-text="Updated collection successfully"
data-success-param-trigger-events="database.updateCollection"
data-failure="alert"
data-failure-param-alert-text="Failed to update collection"
data-failure-param-alert-classname="error">
<label>&nbsp;</label>
<div class="box">
<label for="collection-name">Name</label>
<input name="name" id="collection-name" type="text" autocomplete="off" data-ls-bind="{{project-collection.name}}" data-forms-text-direction required placeholder="Collection Name" maxlength="128" />
<label class="margin-bottom-small">Permissions</label>
<p class="text-fade text-size-small">Choose the permissions model for this collection.</p>
<hr class="margin-top-small" />
<div class="row">
<div class="col span-1"><input name="permission" value="document" type="radio" class="margin-top-no" data-ls-bind="{{project-collection.permission}}" /></div>
<div class="col span-11">
<b>Document Level</b>
<p class="text-fade margin-top-tiny">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed eget hendrerit est. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>
</div>
</div>
<div class="row">
<div class="col span-1"><input name="permission" value="collection" type="radio" class="margin-top-tiny" data-ls-bind="{{project-collection.permission}}" /></div>
<div class="col span-11">
<b>Collection Level</b>
<p class="text-fade margin-top-tiny">Nulla elementum nisi eu tempor varius. Vivamus lacinia justo orci. Donec libero felis, blandit eu aliquet eu, ultrices eget lectus. Suspendisse dignissim, arcu in malesuada venenatis, tellus felis lobortis dui, quis condimentum purus libero at nunc. Pellentesque luctus sit amet metus ut tincidunt.</p>
<label for="collection-read">Read Access <span class="text-size-small">(<a data-ls-attrs="href={{env.HOME}}/docs/permissions" target="_blank" rel="noopener">Learn more</a>)</span></label>
<input type="hidden" id="collection-read" name="read" data-forms-tags data-cast-to="json" data-ls-bind="{{project-collection.$read}}" placeholder="User ID, Team ID or Role" />
<div class="text-fade text-size-xs margin-top-negative-small margin-bottom">Add 'role:all' for wildcard access</div>
<label for="collection-write">Write Access <span class="text-size-small">(<a data-ls-attrs="href={{env.HOME}}/docs/permissions" target="_blank" rel="noopener">Learn more</a>)</label>
<input type="hidden" id="collection-write" name="write" data-forms-tags data-cast-to="json" data-ls-bind="{{project-collection.$write}}" placeholder="User ID, Team ID or Role" />
<div class="text-fade text-size-xs margin-top-negative-small margin-bottom">Add 'role:all' for wildcard access</div>
</div>
</div>
<hr class="margin-top-no" />
<button>Update</button>
</form>
</div>
</div>
<div class="col span-4 sticky-top">
<label>Collection ID</label>
<div class="input-copy margin-bottom">
<input id="id" type="text" autocomplete="off" placeholder="" data-ls-bind="{{project-collection.$id}}" disabled data-forms-copy class="margin-bottom-no" />
</div>
<ul class="margin-bottom-large text-fade text-size-small">
<li class="margin-bottom-small"><i class="icon-angle-circled-right margin-start-tiny margin-end-tiny"></i> <button data-ls-ui-trigger="open-json" class="link text-size-small">View as JSON</button></li>
<li class="margin-bottom-small"><i class="icon-angle-circled-right margin-start-tiny margin-end-tiny"></i> Last Updated: <span data-ls-bind="{{project-collection.dateUpdated|dateText}}"></span></li>
<li class="margin-bottom-small"><i class="icon-angle-circled-right margin-start-tiny margin-end-tiny"></i> Created: <span data-ls-bind="{{project-collection.dateCreated|dateText}}"></span></li>
</ul>
<form
name="database.deleteCollection" class="margin-bottom"
data-analytics
data-analytics-activity
data-analytics-event="submit"
data-analytics-category="console"
data-analytics-label="Delete Database Collection"
data-service="database.deleteCollection"
data-event="submit"
data-param-collection-id="{{router.params.id}}"
data-confirm="Are you sure you want to delete this collection?"
data-success="alert,trigger,redirect"
data-success-param-alert-text="Collection deleted successfully"
data-success-param-trigger-events="database.deleteCollection"
data-success-param-redirect-url="/console/database?project={{router.params.project}}"
data-failure="alert"
data-failure-param-alert-text="Failed to delete collection"
data-failure-param-alert-classname="error">
<button type="submit" class="danger fill">Delete Collection</button>
</form>
</div>
</div>
</li>
</ul>
</div>
<div data-ui-modal class="modal box close sticky-footer" data-button-alias=".new-attribute-string">
<button type="button" class="close pull-end" data-ui-modal-close=""><i class="icon-cancel"></i></button>
<h1>Add String Attribute</h1>
<form
id="add-string-attribute"
data-analytics
data-analytics-activity
data-analytics-event="submit"
data-analytics-category="console"
data-analytics-label="Create Collection Attribute (string)"
data-service="database.createStringAttribute"
data-scope="sdk"
data-event="submit"
data-success="alert,trigger,reset"
data-success-param-alert-text="Created new attribute successfully"
data-success-param-trigger-events="database.createAttribute"
data-failure="alert"
data-failure-param-alert-text="Failed to create attribute"
data-failure-param-alert-classname="error">
<input type="hidden" name="projectId" data-ls-bind="{{router.params.project}}" />
<input type="hidden" name="collectionId" data-ls-bind="{{router.params.id}}" />
<label for="string-attributeId">Attribute ID</label>
<input type="text" class="full-width" name="attributeId" required autocomplete="off" maxlength="128" />
<label for="string-length">Size</label>
<input id="string-length" name="size" type="number" class="margin-bottom" autocomplete="off" required value="255" data-cast-to="integer" />
<div class="margin-bottom">
<input type="hidden" name="required" data-forms-switch data-cast-to="boolean" /> &nbsp; Required <span class="tooltip" data-tooltip="Mark whether this is a required attribute"><i class="icon-info-circled"></i></span>
</div>
<div class="margin-bottom">
<input type="hidden" name="array" data-forms-switch data-cast-to="boolean" /> &nbsp; Array <span class="tooltip" data-tooltip="Mark whether this attribute should act as an array"><i class="icon-info-circled"></i></span>
</div>
<div>
<label for="xdefault">Default Value</label>
<input name="xdefault" type="text" class="margin-bottom-large" autocomplete="off">
</div>
<footer>
<button type="submit">Create</button> &nbsp; <button data-ui-modal-close="" type="button" class="reverse">Cancel</button>
</footer>
</form>
<script type="text/javascript">
(() => {
const form = document.getElementById("add-string-attribute");
const fields = {
required: {
array: ["disable", "uncheck"],
required: ["enable"]
},
array: {
required: ["disable", "uncheck"],
array: ["enable"]
},
xdefault: {
oneOf: {
if: ["array", "required"],
then: {
xdefault: ["unvalue", "disable"]
},
else: {
required: ["enable"],
array: ["enable"],
xdefault: ["enable"]
}
}
}
};
form.addEventListener("change", event => {
formValidation(form, fields);
});
})();
</script>
</div>
<div data-ui-modal class="modal box close sticky-footer" data-button-alias=".new-attribute-integer">
<button type="button" class="close pull-end" data-ui-modal-close=""><i class="icon-cancel"></i></button>
<h1>Add Integer Attribute</h1>
<form
id="add-integer-attribute"
data-analytics
data-analytics-activity
data-analytics-event="submit"
data-analytics-category="console"
data-analytics-label="Create Collection Attribute (integer)"
data-service="database.createIntegerAttribute"
data-scope="sdk"
data-event="submit"
data-success="alert,trigger,reset"
data-success-param-alert-text="Created new attribute successfully"
data-success-param-trigger-events="database.createAttribute"
data-failure="alert"
data-failure-param-alert-text="Failed to create attribute"
data-failure-param-alert-classname="error">
<input type="hidden" name="projectId" data-ls-bind="{{router.params.project}}" />
<input type="hidden" name="collectionId" data-ls-bind="{{router.params.id}}" />
<label for="integer-attributeId">Attribute ID</label>
<input id="integer-attributeId" type="text" class="full-width" name="attributeId" required autocomplete="off" maxlength="128" />
<div class="margin-bottom">
<input type="hidden" name="required" data-forms-switch data-cast-to="boolean" /> &nbsp; Required <span class="tooltip" data-tooltip="Mark whether this is a required attribute"><i class="icon-info-circled"></i></span>
</div>
<div class="margin-bottom">
<input type="hidden" name="array" data-forms-switch data-cast-to="boolean" /> &nbsp; Array <span class="tooltip" data-tooltip="Mark whether this attribute should act as an array"><i class="icon-info-circled"></i></span>
</div>
<div class="row responsive thin">
<div class="col span-6 margin-bottom-small">
<label for="integer-min">Min</label>
<input id="integer-min" type="number" step="1" class="full-width" name="min" autocomplete="off" data-cast-to="integer" />
</div>
<div class="col span-6 margin-bottom-small">
<label for="integer-max">Max</label>
<input id="integer-max" type="number" step="1" class="full-width" name="max" autocomplete="off" data-cast-to="integer" />
</div>
</div>
<label for="integer-default">Default Value</label>
<input id="integer-default" name="xdefault" type="number" step="1" class="margin-bottom-large" autocomplete="off" data-cast-to="integer">
<footer>
<button type="submit">Create</button> &nbsp; <button data-ui-modal-close="" type="button" class="reverse">Cancel</button>
</footer>
</form>
<script type="text/javascript">
(() => {
const form = document.getElementById("add-integer-attribute");
const fields = {
required: {
array: ["disable", "uncheck"],
required: ["enable"]
},
array: {
required: ["disable", "uncheck"],
array: ["enable"]
},
xdefault: {
oneOf: {
if: ["array", "required"],
then: {
xdefault: ["unvalue", "disable"]
},
else: {
required: ["enable"],
array: ["enable"],
xdefault: ["enable"]
}
}
}
};
form.addEventListener("change", event => {
formValidation(form, fields);
});
})();
</script>
</div>
<div data-ui-modal class="modal box close sticky-footer" data-button-alias=".new-attribute-float">
<button type="button" class="close pull-end" data-ui-modal-close=""><i class="icon-cancel"></i></button>
<h1>Add Float Attribute</h1>
<form
id="add-float-attribute"
data-analytics
data-analytics-activity
data-analytics-event="submit"
data-analytics-category="console"
data-analytics-label="Create Collection Attribute (float)"
data-service="database.createFloatAttribute"
data-scope="sdk"
data-event="submit"
data-success="alert,trigger,reset"
data-success-param-alert-text="Created new attribute successfully"
data-success-param-trigger-events="database.createAttribute"
data-failure="alert"
data-failure-param-alert-text="Failed to create attribute"
data-failure-param-alert-classname="error">
<input type="hidden" name="projectId" data-ls-bind="{{router.params.project}}" />
<input type="hidden" name="collectionId" data-ls-bind="{{router.params.id}}" />
<label for="attributeId">Attribute ID</label>
<input type="text" class="full-width" name="attributeId" required autocomplete="off" maxlength="128" />
<div class="margin-bottom">
<input type="hidden" name="required" data-forms-switch data-cast-to="boolean" /> &nbsp; Required <span class="tooltip" data-tooltip="Mark whether this is a required attribute"><i class="icon-info-circled"></i></span>
</div>
<div class="margin-bottom">
<input type="hidden" name="array" data-forms-switch data-cast-to="boolean" /> &nbsp; Array <span class="tooltip" data-tooltip="Mark whether this attribute should act as an array"><i class="icon-info-circled"></i></span>
</div>
<div class="row responsive thin">
<div class="col span-6 margin-bottom-small">
<label for="float-min">Min</label>
<input id="float-min" type="number" class="full-width" name="min" step="0.01" autocomplete="off" data-cast-to="float" />
</div>
<div class="col span-6 margin-bottom-small">
<label for="float-max">Max</label>
<input id="float-max" type="number" class="full-width" name="max" step="0.01" autocomplete="off" data-cast-to="float" />
</div>
</div>
<label for="float-default">Default Value</label>
<input id="float-default" name="xdefault" type="number" step="0.01" class="margin-bottom-large" autocomplete="off" data-cast-to="float">
<footer>
<button type="submit">Create</button> &nbsp; <button data-ui-modal-close="" type="button" class="reverse">Cancel</button>
</footer>
</form>
<script type="text/javascript">
(() => {
const form = document.getElementById("add-float-attribute");
const fields = {
required: {
array: ["disable", "uncheck"],
required: ["enable"]
},
array: {
required: ["disable", "uncheck"],
array: ["enable"]
},
xdefault: {
oneOf: {
if: ["array", "required"],
then: {
xdefault: ["unvalue", "disable"]
},
else: {
required: ["enable"],
array: ["enable"],
xdefault: ["enable"]
}
}
}
};
form.addEventListener("change", event => {
formValidation(form, fields);
});
})();
</script>
</div>
<div data-ui-modal class="modal box close sticky-footer" data-button-alias=".new-attribute-email">
<button type="button" class="close pull-end" data-ui-modal-close=""><i class="icon-cancel"></i></button>
<h1>Add Email Attribute</h1>
<form
id="add-email-attribute"
data-analytics
data-analytics-activity
data-analytics-event="submit"
data-analytics-category="console"
data-analytics-label="Create Collection Attribute (email)"
data-service="database.createEmailAttribute"
data-scope="sdk"
data-event="submit"
data-success="alert,trigger,reset"
data-success-param-alert-text="Created new attribute successfully"
data-success-param-trigger-events="database.createAttribute"
data-failure="alert"
data-failure-param-alert-text="Failed to create attribute"
data-failure-param-alert-classname="error">
<input type="hidden" name="projectId" data-ls-bind="{{router.params.project}}" />
<input type="hidden" name="collectionId" data-ls-bind="{{router.params.id}}" />
<label for="string-attributeId">Attribute ID</label>
<input type="text" class="full-width" name="attributeId" required autocomplete="off" maxlength="128" />
<div class="margin-bottom">
<input name="required" type="hidden" data-forms-switch data-cast-to="boolean" /> &nbsp; Required <span class="tooltip" data-tooltip="Mark whether this is a required attribute"><i class="icon-info-circled"></i></span>
</div>
<div class="margin-bottom">
<input name="array" type="hidden" data-forms-switch data-cast-to="boolean" /> &nbsp; Array <span class="tooltip" data-tooltip="Mark whether this attribute should act as an array"><i class="icon-info-circled"></i></span>
</div>
<label for="string-default">Default Value</label>
<input id="string-default" name="xdefault" type="email" class="margin-bottom-large" autocomplete="off">
<footer>
<button type="submit">Create</button> &nbsp; <button data-ui-modal-close="" type="button" class="reverse">Cancel</button>
</footer>
</form>
<script type="text/javascript">
(() => {
const form = document.getElementById("add-email-attribute");
const fields = {
required: {
array: ["disable", "uncheck"],
required: ["enable"]
},
array: {
required: ["disable", "uncheck"],
array: ["enable"]
},
xdefault: {
oneOf: {
if: ["array", "required"],
then: {
xdefault: ["unvalue", "disable"]
},
else: {
required: ["enable"],
array: ["enable"],
xdefault: ["enable"]
}
}
}
};
form.addEventListener("change", event => {
formValidation(form, fields);
});
})();
</script>
</div>
<div data-ui-modal class="modal box close sticky-footer" data-button-alias=".new-attribute-boolean">
<button type="button" class="close pull-end" data-ui-modal-close=""><i class="icon-cancel"></i></button>
<h1>Add Boolean Attribute</h1>
<form
id="add-boolean-attribute"
data-analytics
data-analytics-activity
data-analytics-event="submit"
data-analytics-category="console"
data-analytics-label="Create Collection Attribute (boolean)"
data-service="database.createBooleanAttribute"
data-scope="sdk"
data-event="submit"
data-success="alert,trigger,reset"
data-success-param-alert-text="Created new attribute successfully"
data-success-param-trigger-events="database.createAttribute"
data-failure="alert"
data-failure-param-alert-text="Failed to create attribute"
data-failure-param-alert-classname="error">
<input type="hidden" name="projectId" data-ls-bind="{{router.params.project}}" />
<input type="hidden" name="collectionId" data-ls-bind="{{router.params.id}}" />
<label for="string-attributeId">Attribute ID</label>
<input type="text" class="full-width" name="attributeId" required autocomplete="off" maxlength="128" />
<div class="margin-bottom">
<input name="required" type="hidden" data-forms-switch data-cast-to="boolean" /> &nbsp; Required <span class="tooltip" data-tooltip="Mark whether this is a required attribute"><i class="icon-info-circled"></i></span>
</div>
<div class="margin-bottom">
<input name="array" type="hidden" data-forms-switch data-cast-to="boolean" /> &nbsp; Array <span class="tooltip" data-tooltip="Mark whether this attribute should act as an array"><i class="icon-info-circled"></i></span>
</div>
<div class="margin-bottom-large">
<input name="xdefault" type="hidden" data-forms-switch data-cast-to="boolean" autocomplete="off" /> &nbsp; Default Value <span class="tooltip" data-tooltip="Whether this attribute is set to true or false on creation"><i class="icon-info-circled"></i></span>
</div>
<footer>
<button type="submit">Create</button> &nbsp; <button data-ui-modal-close="" type="button" class="reverse">Cancel</button>
</footer>
</form>
<script type="text/javascript">
(() => {
const form = document.getElementById("add-boolean-attribute");
const fields = {
required: {
array: ["disable", "uncheck"],
required: ["enable"]
},
array: {
required: ["disable", "uncheck"],
array: ["enable"]
},
xdefault: {
oneOf: {
if: ["array", "required"],
then: {
xdefault: ["uncheck", "disable"]
},
else: {
required: ["enable"],
array: ["enable"],
xdefault: ["enable"]
}
}
}
};
form.addEventListener("change", event => {
formValidation(form, fields);
});
})();
</script>
</div>
<div data-ui-modal class="modal box close sticky-footer" data-button-alias=".new-attribute-ip">
<button type="button" class="close pull-end" data-ui-modal-close=""><i class="icon-cancel"></i></button>
<h1>Add IP Attribute</h1>
<form
id="add-ip-attribute"
data-analytics
data-analytics-activity
data-analytics-event="submit"
data-analytics-category="console"
data-analytics-label="Create Collection Attribute (IP)"
data-service="database.createIpAttribute"
data-scope="sdk"
data-event="submit"
data-success="alert,trigger,reset"
data-success-param-alert-text="Created new attribute successfully"
data-success-param-trigger-events="database.createAttribute"
data-failure="alert"
data-failure-param-alert-text="Failed to create attribute"
data-failure-param-alert-classname="error">
<input type="hidden" name="projectId" data-ls-bind="{{router.params.project}}" />
<input type="hidden" name="collectionId" data-ls-bind="{{router.params.id}}" />
<label for="string-attributeId">Attribute ID</label>
<input type="text" class="full-width" name="attributeId" required autocomplete="off" maxlength="128" />
<div class="margin-bottom">
<input name="required" type="hidden" data-forms-switch data-cast-to="boolean" /> &nbsp; Required <span class="tooltip" data-tooltip="Mark whether this is a required attribute"><i class="icon-info-circled"></i></span>
</div>
<div class="margin-bottom">
<input name="array" type="hidden" data-forms-switch data-cast-to="boolean" /> &nbsp; Array <span class="tooltip" data-tooltip="Mark whether this attribute should act as an array"><i class="icon-info-circled"></i></span>
</div>
<label for="string-default">Default Value</label>
<input id="string-default" name="xdefault" type="text" data-forms-ip-address class="margin-bottom-large" autocomplete="off">
<footer>
<button type="submit">Create</button> &nbsp; <button data-ui-modal-close="" type="button" class="reverse">Cancel</button>
</footer>
</form>
<script type="text/javascript">
(() => {
const form = document.getElementById("add-ip-attribute");
const fields = {
required: {
array: ["disable", "uncheck"],
required: ["enable"]
},
array: {
required: ["disable", "uncheck"],
array: ["enable"]
},
xdefault: {
oneOf: {
if: ["array", "required"],
then: {
xdefault: ["unvalue", "disable"]
},
else: {
required: ["enable"],
array: ["enable"],
xdefault: ["enable"]
}
}
}
};
form.addEventListener("change", event => {
formValidation(form, fields);
});
})();
</script>
</div>
<div data-ui-modal class="modal box close sticky-footer" data-button-alias=".new-attribute-url">
<button type="button" class="close pull-end" data-ui-modal-close=""><i class="icon-cancel"></i></button>
<h1>Add URL Attribute</h1>
<form
id="add-url-attribute"
data-analytics
data-analytics-activity
data-analytics-event="submit"
data-analytics-category="console"
data-analytics-label="Create Collection Attribute (url)"
data-service="database.createUrlAttribute"
data-scope="sdk"
data-event="submit"
data-success="alert,trigger,reset"
data-success-param-alert-text="Created new attribute successfully"
data-success-param-trigger-events="database.createAttribute"
data-failure="alert"
data-failure-param-alert-text="Failed to create attribute"
data-failure-param-alert-classname="error">
<input type="hidden" name="projectId" data-ls-bind="{{router.params.project}}" />
<input type="hidden" name="collectionId" data-ls-bind="{{router.params.id}}" />
<label for="string-attributeId">Attribute ID</label>
<input type="text" class="full-width" name="attributeId" required autocomplete="off" maxlength="128" />
<div class="margin-bottom">
<input name="required" type="hidden" data-forms-switch data-cast-to="boolean" /> &nbsp; Required <span class="tooltip" data-tooltip="Mark whether this is a required attribute"><i class="icon-info-circled"></i></span>
</div>
<div class="margin-bottom">
<input name="array" type="hidden" data-forms-switch data-cast-to="boolean" /> &nbsp; Array <span class="tooltip" data-tooltip="Mark whether this attribute should act as an array"><i class="icon-info-circled"></i></span>
</div>
<label for="string-default">Default Value</label>
<input id="string-default" name="xdefault" type="url" pattern="https://.*" title="Valid URL address" class="margin-bottom-large" autocomplete="off">
<footer>
<button type="submit">Create</button> &nbsp; <button data-ui-modal-close="" type="button" class="reverse">Cancel</button>
</footer>
</form>
<script type="text/javascript">
(() => {
const form = document.getElementById("add-url-attribute");
const fields = {
required: {
array: ["disable", "uncheck"],
required: ["enable"]
},
array: {
required: ["disable", "uncheck"],
array: ["enable"]
},
xdefault: {
oneOf: {
if: ["array", "required"],
then: {
xdefault: ["unvalue", "disable"]
},
else: {
required: ["enable"],
array: ["enable"],
xdefault: ["enable"]
}
}
}
};
form.addEventListener("change", event => {
formValidation(form, fields);
});
})();
</script>
</div>
<div data-ui-modal class="modal box close sticky-footer" data-button-alias=".new-attribute-enum">
<button type="button" class="close pull-end" data-ui-modal-close=""><i class="icon-cancel"></i></button>
<h1>Add Enum Attribute</h1>
<form
id="add-enum-attribute"
data-analytics
data-analytics-activity
data-analytics-event="submit"
data-analytics-category="console"
data-analytics-label="Create Collection Attribute (enum)"
data-service="database.createEnumAttribute"
data-scope="sdk"
data-event="submit"
data-success="alert,trigger,reset"
data-success-param-alert-text="Created new attribute successfully"
data-success-param-trigger-events="database.createAttribute"
data-failure="alert"
data-failure-param-alert-text="Failed to create attribute"
data-failure-param-alert-classname="error">
<input type="hidden" name="projectId" data-ls-bind="{{router.params.project}}" />
<input type="hidden" name="collectionId" data-ls-bind="{{router.params.id}}" />
<label for="enum-attributeId">Attribute ID</label>
<input id="enum-attributeId" type="text" class="full-width" name="attributeId" required autocomplete="off" maxlength="128" />
<label>Elements</label>
<div id="elements-section"></div>
<div class="margin-bottom">
<div data-forms-clone="" data-label="Add Element" data-target="elements-section" data-first="1">
<div class="row responsive thin margin-bottom-tiny">
<div class="col span-11 margin-bottom-small">
<input type="text" class="full-width" name="elements" required autocomplete="off" maxlength="128" />
</div>
<div class="col span-1 margin-bottom-small">
<button type="button" data-remove class="dark danger small round pull-end" style="margin-top: 10px;"><i class="icon-cancel"></i></button>
</div>
</div>
</div>
</div>
<div class="margin-bottom">
<input name="required" type="hidden" data-forms-switch data-cast-to="boolean" /> &nbsp; Required <span class="tooltip" data-tooltip="Mark whether this is a required attribute"><i class="icon-info-circled"></i></span>
</div>
<div class="margin-bottom">
<input name="array" type="hidden" data-forms-switch data-cast-to="boolean" /> &nbsp; Array <span class="tooltip" data-tooltip="Mark whether this attribute should act as an array"><i class="icon-info-circled"></i></span>
</div>
<label for="enunm-default">Default Value</label>
<input id="enum-default" name="xdefault" type="text" class="margin-bottom-large" autocomplete="off">
<footer>
<button type="submit">Create</button> &nbsp; <button data-ui-modal-close="" type="button" class="reverse">Cancel</button>
</footer>
</form>
<script type="text/javascript">
(() => {
const form = document.getElementById("add-enum-attribute");
const fields = {
required: {
array: ["disable", "uncheck"],
required: ["enable"]
},
array: {
required: ["disable", "uncheck"],
array: ["enable"]
},
xdefault: {
oneOf: {
if: ["array", "required"],
then: {
xdefault: ["unvalue", "disable"]
},
else: {
required: ["enable"],
array: ["enable"],
xdefault: ["enable"]
}
}
}
};
form.addEventListener("change", event => {
formValidation(form, fields);
});
})();
</script>
</div>
<div data-ui-modal class="modal box close sticky-footer" data-button-alias=".new-index">
<button type="button" class="close pull-end" data-ui-modal-close=""><i class="icon-cancel"></i></button>
<h1>Add Index</h1>
<div data-ls-if="0 == {{project-collection.attributes.length}}">
<div class="info margin-top margin-bottom">
<h2>No Attributes Found</h2>
<p>Please add your first attribute before adding your first index.</p>
</div>
<button data-ui-modal-close="" type="button" class="reverse">Cancel</button>
</div>
<form
data-ls-if="0 < {{project-collection.attributes.length}}"
data-analytics
data-analytics-activity
data-analytics-event="submit"
data-analytics-category="console"
data-analytics-label="Create Collection Index"
data-service="database.createIndex"
data-scope="sdk"
data-event="submit"
data-success="alert,trigger,reset"
data-success-param-alert-text="Created new index successfully"
data-success-param-trigger-events="database.createIndex"
data-failure="alert"
data-failure-param-alert-text="Failed to create index"
data-failure-param-alert-classname="error">
<input type="hidden" name="projectId" data-ls-bind="{{router.params.project}}" />
<input type="hidden" name="collectionId" data-ls-bind="{{router.params.id}}" />
<label for="index-indexId">Index ID</label>
<input id="index-indexId" type="text" class="full-width" name="indexId" required autocomplete="off" maxlength="128" />
<label for="index-type">Type</label>
<select id="index-type" name="type">
<option value="key">Key</option>
<option value="unique">Unique</option>
<option value="fulltext">Fulltext</option>
</select>
<label>Attributes</label>
<div id="attributes-section"></div>
<div class="margin-bottom">
<div data-forms-clone="" data-label="Add Attribute" data-target="attributes-section" data-first="1">
<div class="row responsive thin margin-bottom-tiny">
<div class="col span-7 margin-bottom-small">
<select data-duplications data-ls-attrs="name=attributes" data-ls-loop="project-collection.attributes" data-ls-as="option" data-cast-to="array" class="margin-bottom-no">
<option data-ls-attrs="value={{option.key}}" data-ls-bind="{{option.key}}"></option>
</select>
</div>
<div class="col span-4 margin-bottom-small">
<select name="orders" data-cast-to="array" class="margin-bottom-no">
<option value="ASC">ASC</option>
<option value="DESC">DESC</option>
</select>
</div>
<div class="col span-1 margin-bottom-small">
<button type="button" data-remove class="dark danger small round pull-end" style="margin-top: 10px;"><i class="icon-cancel"></i></button>
</div>
</div>
</div>
</div>
<footer>
<button type="submit">Create</button> &nbsp; <button data-ui-modal-close="" type="button" class="reverse">Cancel</button>
</footer>
</form>
</div>
<div class="margin-top" data-service="database.listCollections" data-event="load,database.createCollection,database.updateCollection,database.deleteCollection" data-scope="sdk" data-param-limit="100" data-name="project-collections">
</div>
<script type="text/html" id="template-attribute-title-first">
<i data-ls-attrs="class=pull-end icon-key text-size-xs"></i>
<span class="text-bold">$id</span>
</script>
<script type="text/html" id="template-attribute-body-first">
<span class="text-fade" data-ls-bind="{{node.$id}}" data-general-copy data-class="icon-docs note copy text-fade pull-end"></span>
</script>