diff --git a/example/contracts/SimpleStorage.sol b/contracts/SimpleStorage.sol
similarity index 100%
rename from example/contracts/SimpleStorage.sol
rename to contracts/SimpleStorage.sol
diff --git a/example/index.html b/example/index.html
deleted file mode 100644
index d0e2039..0000000
--- a/example/index.html
+++ /dev/null
@@ -1,159 +0,0 @@
-
-
-
-
- Simplest dApp example
-
-
-
-
-Simplest dApp example
-
-
-
-
-
-
-
-
-
-
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..2ee1be1
--- /dev/null
+++ b/index.html
@@ -0,0 +1,59 @@
+
+
+
+
+
+ Simplest dApp example
+
+
+
+
+
+
+ Simplest dApp example
+
+
+
+
+
+
+
+
+
+
diff --git a/index.js b/index.js
new file mode 100644
index 0000000..7d80c18
--- /dev/null
+++ b/index.js
@@ -0,0 +1,204 @@
+var baseUrl = window.location.protocol.indexOf('http') !== -1
+ ? window.location.protocol + '//' + window.location.hostname
+ : 'http://localhost'
+$('#login-form').submit(function (event) {
+ // Stop the default form submit flow
+ event.preventDefault();
+
+ var username = $('#username').val();
+ var password = $('#password').val();
+ var getAddressUrl = baseUrl + '/bloc/v2.2/users/' + username;
+ var errorWrapper = $('#error');
+ errorWrapper.text('');
+ $('.login-btn').prop('disabled', true);
+ $('.login-btn').val('Processing...');
+
+ $.get(getAddressUrl)
+ .done(function (response) {
+ if (!response[0]) {
+ errorWrapper.text('Invalid credentials.');
+ $('.login-btn').prop('disabled', false);
+ $('.login-btn').val('Submit');
+ } else {
+ var validateUrl = baseUrl + '/bloc/v2.2/users/' + username + '/' + response[0] +
+ '/send?resolve';
+ var validateBody = {
+ password: password,
+ toAddress: response[0],
+ value: 0
+ };
+
+ $.post({
+ url: validateUrl,
+ data: JSON.stringify(validateBody),
+ contentType: 'application/json',
+ dataType: 'json'
+ })
+ .done(function () {
+ $('.login-btn').prop('disabled', false);
+ $('.login-btn').val('Submit');
+ $('#user-address').val(response[0]);
+ $('#login-form').hide();
+ $('#dapp-form').show();
+ $('.back-icon').show();
+ })
+ .fail(function (error) {
+ $('.login-btn').prop('disabled', false);
+ $('.login-btn').val('Submit');
+ if (error.responseJSON === "incorrect password")
+ errorWrapper.text('Invalid credentials.');
+ else
+ errorWrapper.text('There was an error. Please try again after some time.');
+ });
+ }
+ })
+ .fail(function () {
+ $('.login-btn').prop('disabled', false);
+ $('.login-btn').val('Submit');
+ errorWrapper.text('There was an error. Please try again after some time.');
+ });
+});
+
+// Show/hide fields depending on the operation type
+$('#submit-type').change(function () {
+ $('#result-wrapper').text('');
+ var submitType = $(this).val();
+ switch (submitType) {
+ case 'deploy':
+ $('#contract-address, #set-value').hide().prop('required', false);
+ break;
+ case 'set':
+ $('#contract-address, #set-value').show().prop('required', true);
+ break;
+ case 'get':
+ $('#contract-address').show().prop('required', true);
+ $('#set-value').hide().prop('required', false);
+ break;
+ }
+});
+
+// On form submit
+$('#dapp-form').submit(function (event) {
+ // Stop the default form submit flow
+ event.preventDefault();
+
+ var resultWrapper = $('#result-wrapper');
+
+ $('.dapp-submit-btn').prop('disabled', true);
+ $('.dapp-submit-btn').val('Processing...');
+ resultWrapper.text('');
+
+ // Get values from the form:
+ var $form = $(this);
+ var username = $('#username').val();
+ var userAddress = $('#user-address').val();
+ var password = $('#password').val();
+ var submitType = $('#submit-type').val();
+
+ //The urls to bloc API's upload-contract and call-contract-method endpoints
+ var uploadContractUrl = baseUrl + '/bloc/v2.2/users/' + username + '/' + userAddress +
+ '/contract?resolve';
+ var callContractMethodUrl = baseUrl + '/bloc/v2.2/users/' + username + '/' + userAddress +
+ '/contract/SimpleStorage/' + $('#contract-address').val() + '/call?resolve';
+
+ switch (submitType) {
+
+ case 'deploy':
+ $.get('contracts/SimpleStorage.sol')
+ .done(function (contractContent) {
+
+ var uploadContractBody = {
+ password: password,
+ contract: 'SimpleStorage',
+ src: contractContent
+ };
+
+ $.post({
+ url: uploadContractUrl,
+ data: JSON.stringify(uploadContractBody),
+ contentType: 'application/json',
+ dataType: 'json'
+ })
+ .done(function (response) {
+ // Fill-in the contract-address field and show it
+ $('#contract-address').val(response['txResult']['contractsCreated']).show();
+ resultWrapper.text('Contract deployed successfully for the user');
+ $('.dapp-submit-btn').prop('disabled', false);
+ $('.dapp-submit-btn').val('Submit');
+ })
+ .fail(function (error) {
+ resultWrapper.text('Error: Bloc API is not reachable');
+ $('.dapp-submit-btn').prop('disabled', false);
+ $('.dapp-submit-btn').val('Submit');
+ })
+ })
+ .fail(function (error) {
+ resultWrapper.text('Error: Contract file not found');
+ $('.dapp-submit-btn').prop('disabled', false);
+ $('.dapp-submit-btn').val('Submit');
+ });
+ break;
+
+ case 'set':
+
+ var value = $form.find('#set-value').val();
+
+ var callSetBody = {
+ "args": {
+ x: value
+ },
+ "method": "set",
+ "password": password
+ };
+
+ $.post({
+ url: callContractMethodUrl,
+ data: JSON.stringify(callSetBody),
+ contentType: 'application/json',
+ dataType: 'json'
+ })
+ .done(function (response) {
+ resultWrapper.text('The value has been set. New Value: ' + value);
+ $('.dapp-submit-btn').prop('disabled', false);
+ $('.dapp-submit-btn').val('Submit');
+ })
+ .fail(function (error) {
+ resultWrapper.text('Error: wrong user credentials provided or Bloc API is not reachable');
+ $('.dapp-submit-btn').prop('disabled', false);
+ $('.dapp-submit-btn').val('Submit');
+ });
+ break;
+
+ case 'get':
+ var callSetBody = {
+ "args": {},
+ "method": "get",
+ "password": password
+ };
+
+ $.post({
+ url: callContractMethodUrl,
+ data: JSON.stringify(callSetBody),
+ contentType: 'application/json',
+ dataType: 'json'
+ })
+ .done(function (response) {
+ resultWrapper.text('The value in storage is: ' + response.data.contents[0]);
+ $('.dapp-submit-btn').prop('disabled', false);
+ $('.dapp-submit-btn').val('Submit');
+ })
+ .fail(function (error) {
+ resultWrapper.text('Error: wrong user credentials provided or Bloc API is not reachable');
+ $('.dapp-submit-btn').prop('disabled', false);
+ $('.dapp-submit-btn').val('Submit');
+ });
+ break;
+ }
+});
+
+$('.back-icon').click(function () {
+ $('#password').val('');
+ $('#dapp-form').hide();
+ $('.back-icon').hide();
+ $('#login-form').show();
+});
\ No newline at end of file
diff --git a/initfile.json b/initfile.json
new file mode 100644
index 0000000..02d4fd4
--- /dev/null
+++ b/initfile.json
@@ -0,0 +1,7 @@
+{
+ "SimpleStorage": {
+ "contractName": "SimpleStorage",
+ "contractFilename": "contracts/SimpleStorage.sol",
+ "args": {}
+ }
+}
\ No newline at end of file
diff --git a/example/metadata.json b/metadata.json
similarity index 100%
rename from example/metadata.json
rename to metadata.json
diff --git a/styles.css b/styles.css
new file mode 100644
index 0000000..ba4d06d
--- /dev/null
+++ b/styles.css
@@ -0,0 +1,102 @@
+html, body {
+ height: 100%;
+ text-align: center;
+ background-color: #F5F5F5;
+ margin: 0;
+}
+
+.form-wrapper {
+ background-color: white;
+ padding: 30px 15px;
+ width: 250px;
+ text-align: center;
+ margin: 48px auto;
+}
+
+form input {
+ border: #A1D9ED solid 2px;
+ padding: 3px;
+ margin: 3px 0px;
+ width: 200px;
+}
+
+form input[type="submit"] {
+ width: 210px;
+ padding: 6px 0;
+ margin-top: 20px;
+ margin-right: 5px;
+ background-color: #0060C7;
+ color: white;
+ border: 0;
+ cursor: pointer;
+}
+
+form input[type="submit"]:disabled {
+ background-color: #769cc5
+}
+
+form select {
+ width: 210px;
+ padding: 3px;
+ margin-top: 3px;
+ margin-bottom: 3px;
+ margin-right: 4px;
+ border: #A1D9ED solid 2px;
+ background-color: white;
+ text-align-last: center;
+}
+
+.form-wrapper, form input, form select {
+ border-radius: 3px;
+}
+
+#error {
+ font-size: 12px;
+ color: red;
+}
+
+#dapp-form {
+ display: none;
+}
+
+.select-types {
+ margin-right: 4px;
+}
+
+#result-wrapper {
+ font-size: 15px;
+ font-weight: 600;
+}
+
+.app-title {
+ margin: 0;
+ padding: 8px 0;
+ background-color: #0079D2;
+ color: white;
+ font-size: 22px;
+ font-weight: 400;
+ font-family: sans-serif;
+}
+
+.back-icon {
+ border: solid black;
+ border-width: 0 3px 3px 0;
+ padding: 3px;
+ transform: rotate(135deg);
+ -webkit-transform: rotate(135deg);
+ float: left;
+ margin: 25px 40px;
+ cursor: pointer;
+ height: 4px;
+ width: 4px;
+ display: none;
+}
+
+.back-icon:hover {
+ border: solid #0079D2;
+ border-width: 0 3px 3px 0;
+}
+
+#contract-address, #set-value {
+ display: none;
+}