1.0.9 • Published 2 years ago

@startinblox/ontochain-directory v1.0.9

Weekly downloads
-
License
MIT
Repository
-
Last release
2 years ago

Disclaimer

This is for now a specialization of the ontochain-directory component to serve as demonstration for our ontochain-related scenario. It uses the same component name, only the import is different.

Ambition is to merge them in a near future, adding more features to ontochain-directory like wallet and NFT lists support.

Ontochain Directory

Ontochain Directory serves 3 components:

  • Solid Profile, to edit your own profile
  • Ontochain Directory itself, profile listing component
  • Solid Picture, widget for profile picture uploading

How to use

Once the package is installed, you can use the ontochain-directory component:

<html>
  <head>
    <!-- import the module in the head of the page -->
    <script
      type="module"
      src="https://cdn.skypack.dev/@startinblox/ontochain-directory"
    ></script>
  </head>

  <body>
    <!-- use the component -->
    <ontochain-directory
      data-src="http://mydatasrc"
      range-skills="http://myrangeskills"
      show-incomplete="true"
      show-skills="false"
      paginate-by="3"
    ></ontochain-directory>
  </body>
</html>

Parameters

NameDefaultDescription
data-srcundefinedData source of your user container
extra-context{}Custom extra context
range-skills?Data source of your skills container, if any
route-chatundefinedRoute for chat
paginate-byundefinedHow many cards per page
show-incompleteundefinedShow profile having no picture ?
show-skillsundefinedShow skills filters and property ?

Ontochain specialization

//TODO: complete this section

SIB Picture

SIB Picture is a standalone component that allows to upload picture on my profile.

You can use it as a standalone component this way:

<html>
<head>
  <!-- import the module in the head of the page -->
  <script type="module" src="https://cdn.skypack.dev/@startinblox/component-directory/ontochain-picture"></script>
</head>

<body>
  <!-- use the component -->
  <ontochain-picture
    data-src="http://mydatasrc"
    upload-src="http://mydatasrc/upload"
    upload-id="id-of-the-upload-field"
    nested-fields="nested-object-in-resource"
    fields="field-of-the-nested-resource"
    next="form-submit-redirect"
    additional='comma, seperated, additional, fields'
  ></ontochain-picture>
</body>
</html>

Parameters

NameDefaultDescription
data-srcundefinedData source of your resource container
upload-srcundefinedUpload source of your resource container
upload-idundefinedUpload ID
nested-fieldundefinedNested resource container
fieldsundefinedField of the nested resource
nextundefinedRedirect to after form submit
additionalundefinedAdditional fields of the nested resource ontainer

Developpers

Installation:

npm install

Build with:

npm run build

Watch files & rebuild on change with this command:

npm run watch