Help for the Stellar Social Network.

Contents:
Overview
Quick Tour
View Other Profiles
Select a Stellar Account
Edit and Save Your Profile
Delete Comments
Grouping Elements
Technical Explanation (how it works)



Overview:

The Stellar Social Network lets you save a Profile on the decentralized Stellar blockchain, and Comment on other Profiles. You may view Profiles without owning any XLM.

To Save a Profile, or post a Comment on other Profiles, you must have a Stellar account which contains at least 2.1 XLM. It only costs 0.00003 XLM ($0.000007) to save a Profile or to post a Comment, so you can post more than 1,385 transactions for less than one cent.

A Profile is created using an HTML5 Online Editor that is similar to Microsoft Visual Studio. You may drag-and-drop the 11 Element Types that are described below.

After you create your profile, you can distribute a URL which directly displays it, by adding your Stellar address after the "?id=" parameter. For example, the following URL directly displays the profile for President Biden:
https://www.tokenup.app/StellarSocial.php?id=GDNWQIN5JS6ASRDMZSFNNOW4WRD23CKJDTSCK4D4TYA6DTKTUYN73VNT



Quick Tour:

The following instructions will demonstrate the features in less than five minutes:
  1. At the top of the screen, in the dropdown box next to "Express your opinion! Add a comment to one of these profiles:", select President Biden. President Biden's Wikipedia and Twitter will be displayed in his Profile. When you select your Stellar Account, you will be able to add a Comment to this Profile.
  2. In the same dropdown box, choose the first option ("Select one.."), and the Default Profile will be displayed.
  3. Click [Delete All Elements]. Don't worry, you can click [Display the Default Profile] to return the form to its original state.
  4. Drag the blue [Element 1] downward, and drop it anywhere on the yellow canvas.
  5. With [Element 1] selected, in the Properties Frame (located in the top-middle of the page) change the Element Type to News, and click [Apply Changes]. The News gadget will be shown.
  6. Drag the new [Element 2] (that appears above the canvas), and drop it towards the top of the canvas.
  7. With [Element 2] selected, in the Properties Frame change the Element Type to Image, and click [Apply Changes]. The default image will be shown. You can change the Image URL in the Properties Frame, to display any image found on the internet.
  8. Experiment changing the Element Type in the Properties Frame, to see all 11 Element Types.



View Other Profiles:

You may view other users' Profiles without owning any XLM.

At the top of the screen, in the dropdown next to "Express your opinion! Add a comment to one of these profiles:", you may view the following three profiles:
  • Russia
  • President Biden
  • Donald Trump
If you Select a Stellar Account (as described below), you can add a Comment to those three Profiles.

To view any other user's Profile, enter their public Stellar address in the textbox next to "Other User's Profile Address:, and click [Display Other User's Profile].



Select a Stellar Account:

To Save a Profile, or to Comment on other Profiles, you must select a Stellar account which contains at least 2.1 XLM.

If you don't want to enter your Private Key, install the Rabet Chrome Extension or Freighter Chrome Extension to select your Stellar account. If you don't use Rabet or Freighter, then you can enter the Private Key of your Stellar Account, and click Select Stellar Account.

After you select a Stellar Account, the following buttons will be displayed:
  • [Display My Profile]: This will display your Profile as if you are a different user. You may not Edit or Save your Profile in this mode, but you may Add and Delete Comments (as described below).
  • [Edit My Profile]: This will allow you to Edit and Save your profile.



Edit and Save Your Profile:

  1. Before creating your own Profile, click [Delete All Elements] to remove the Elements that are in the Default Profile.
  2. Add New Element: On the left side of the screen (in the white section) drag the blue Element (by the edges) to the yellow canvas. A new Element will be shown in the white section, with an incremented ID number.
  3. Select an Element Type: With the Element selected, choose an Element Type in the Properties Frame (in the top-middle of the page).
  4. The Element Properties section below describes the Properties that may be set for each of the 11 Element Types.
  5. When your Profile is finished, click [Save Profile]. Your Profile will then be stored using the Stellar Account that you have selected.

Anyone can then view your Profile (and add Comments) by entering your public Stellar Address in the Other User's Profile Address: textbox, and clicking Display Other User's Profile.

Element Properties:
Select an element by clicking it on the edges; it will then have a wider border. When an element is selected, you may edit its Properties:
  • Text element: Text, Font Size, and Width. The Width property allows text to be displayed in a multi-line column.
  • Image element: Image URL, Width, and Height.
  • Button element: Button Text and Font Size. This will be used in a future version of the Stellar Social Network.
  • Input element: Input Text, Font Size, Width, and Height. This will be used in a future version of the Stellar Social Network.
  • News gadget: News Topic.
  • Twitter gadget: Twitter Username.
  • Crypto Quotes gadget: Crypto Symbol.
  • Stock Quotes gadget: Stock Symbol.
  • Wikipedia gadget: Wikipedia Title.
  • YouTube gadget: YouTube ID.
  • Loan Calculator gadget
You must click [Apply Changes] for the edits to take effect.



Delete Comments:

The user that Saved a Profile may Delete Comments that have been posted to their Profile.
(In this description, the buttons are located towards the top of the screen.)
  1. Select the Stellar account that the Profile was saved with.
  2. Click [Display My Profile], to see the Comments that have been posted to your Profile.
  3. Each Comment will have a checkbox. Check the boxes for the Comments that you want to Delete.
  4. Click [Delete Selected Comments].



Grouping Elements:

While editing a Profile:
To add an element to a Group, Ctrl-Click any element on the canvas (except the Selected element). That element will then have a red border. To remove an element from the Group, Ctrl-Click it again.

You may Move a Group of elements as a cohesive unit, by dragging the Selected element.

To Align a Group of elements to the Selected element, click the following two buttons:
  • [Horizontally Align Grouped Elements]
  • [Vertically Align Grouped Elements]



Technical Explanation (how it works):

When a Profile is Saved, or a Comment is added, a new zipped IPFS file is created containing the information. A Stellar Trade is also created, which exchanges .0000001 XML for .0000001 TKUP (which is a token created by this app).

This Trade uses a Transaction with a Data Field containing the IPFS ID. This Data Field is immediately deleted (to avoid the .5 XLM deposit requirement), but it still appears in the API results.

The most recently created IPFS file contains the current state of the Profile. Therefore, the app only has to use Horizon to retrieve the one most recent Trade record, whose Transaction contains the IPFS ID for the one file that contains the current state of the Profile.