Skip to content

Commit

Permalink
Merge pull request #41 from ctayl/in-app_cp
Browse files Browse the repository at this point in the history
In app webview: preview in CP
  • Loading branch information
ahabeb authored Nov 5, 2019
2 parents 45423d7 + ee5ee36 commit 80b21ee
Show file tree
Hide file tree
Showing 3 changed files with 220 additions and 125 deletions.
263 changes: 140 additions & 123 deletions src/control/content/app.js
Original file line number Diff line number Diff line change
@@ -1,137 +1,154 @@
var webviewPluginApp = angular.module('webviewPlugin', []);

webviewPluginApp.controller("webviewPluginCtrl", ["$scope", "$log", "$timeout", function ($scope, $log, $timeout) {
var dataChanged = false;
$scope.datastoreInitialized = false;
$scope.urlValid = false;
$scope.urlInValid = false;
$scope.viewType = {
NATIVE_IN_APP: 'Native In App',
IN_APP_POPUP: 'In app popup',
EXTERNAL_BROWSER: 'External browser'
};
/*
* Go pull any previously saved data
* */
buildfire.datastore.get(function (err, result) {
if (!err) {
$scope.datastoreInitialized = true;
} else {
console.error("Error: ", err);
return;
}
if (result && result.data && !angular.equals({}, result.data) && result.id) {
$scope.data = result.data;
$scope.id = result.id;
if (typeof result.data.content.openInApp != 'undefined' && typeof result.data.content.openInApp != 'object') {
if (result.data.content.openInApp)
$scope.data.content.view = $scope.viewType.NATIVE_IN_APP;
else
$scope.data.content.view = $scope.viewType.IN_APP_POPUP;
}
} else {
$scope.data = {
content: {
url: "",
view: $scope.viewType.NATIVE_IN_APP
}
};
}

/*
* watch for changes in data
* */
$scope.$watch('data', function (newObj, oldObj) {
if (angular.equals(newObj, oldObj) || newObj == undefined) {
dataChanged = false;
} else {
dataChanged = true;
}
}, true);

if (!$scope.$$phase && !$scope.$root.$$phase) {
$scope.$apply();
}
});

$scope.saveData = function () {
if (!$scope.datastoreInitialized) {
console.error("Error with datastore didn't get called");
return;
}
if (!dataChanged) {
console.warn("data didn't changed");
return;
}
var data = $scope.data;
// if the form has some invalid data do not save, in our case the user eneter invalid URL
if ($scope.frmMain.$invalid) {
$log.warn('invalid data, details will not be saved');
$scope.urlValid = false;
$scope.urlInValid = true;
$timeout(function () {
$scope.urlInValid = false;
}, 3000);
} else {
$scope.urlValid = true;
$scope.urlInValid = false;
$timeout(function () {
$scope.urlValid = false;
}, 3000);
dataChanged = false;
if (!/^https?\:\/\//.test(data.content.url)) {
data.content.url = "http://" + data.content.url;
(function(angular, buildfire) {
var webviewPluginApp = angular.module('webviewPlugin', []);

webviewPluginApp.controller('webviewPluginCtrl', ['$scope', '$log', '$timeout', controller]);

function controller($scope, $log, $timeout) {
var dataChanged = false;
$scope.datastoreInitialized = false;
$scope.urlValid = false;
$scope.urlInValid = false;
$scope.viewType = {
NATIVE_IN_APP: 'Native In App',
IN_APP_POPUP: 'In app popup',
EXTERNAL_BROWSER: 'External browser'
};

buildfire.datastore.get(function(err, result) {
if (err) return console.error('Error: ', err);

$scope.datastoreInitialized = true;

if (isValidResult(result)) {
$scope.data = result.data;
$scope.id = result.id;

var type = typeof result.data.content.openInApp;

if (type != 'undefined' && type != 'object') {
if (result.data.content.openInApp) {
$scope.data.content.view = $scope.viewType.NATIVE_IN_APP;
} else {
$scope.data.content.view = $scope.viewType.IN_APP_POPUP;
}
}
} else {
$scope.data = {
content: {
url: '',
view: $scope.viewType.NATIVE_IN_APP
}
};
}

$scope.$watch('data', watchFn, true);
function watchFn(newObj, oldObj) {
if (angular.equals(newObj, oldObj) || newObj == undefined) {
dataChanged = false;
} else {
dataChanged = true;
}
}

if (data.content.openInApp != undefined)
data.content.openInApp = null;
buildfire.datastore.save(data, function (err, result) {
if (err || !result) {
$log.error('Error saving the widget details: ', err);
}
else {
$log.info('Widget details saved');
}
});
}
};
if (!$scope.$$phase && !$scope.$root.$$phase) {
$scope.$apply();
}

function isValidResult(res) {
return res && res.data && !angular.equals({}, res.data) && res.id;
}
});

$scope.validateUrl = function () {
$scope.saveData();
};
buildfire.messaging.onReceivedMessage = function (message) {
buildfire.messaging.sendMessageToWidget(message);
};

$scope.saveData = function() {
if (!$scope.datastoreInitialized) {
return console.error("Error with datastore didn't get called");
}

if (!dataChanged) {
return console.warn("data didn't change");
}

if ($scope.frmMain.$invalid) return setDataInvalid();

var data = $scope.data;
dataChanged = false;

setDataValid();

if (!/^https?\:\/\//.test(data.content.url)) {
data.content.url = 'http://' + data.content.url;
}

if (data.content.openInApp != undefined) {
data.content.openInApp = null;
}

buildfire.datastore.save(data, function(err, result) {
if (err || !result) {
return $log.error('Error saving the widget details: ', err);
}

$log.info('Widget details saved');
});

function setDataInvalid() {
$log.warn('invalid data, details will not be saved');
$scope.urlValid = false;
$scope.urlInValid = true;
$timeout(function() {
$scope.urlInValid = false;
}, 3000);
}

function setDataValid() {
$scope.urlValid = true;
$scope.urlInValid = false;
$timeout(function() {
$scope.urlValid = false;
}, 3000);
}
};

$scope.validateUrl = function() {
$scope.saveData();
};

$scope.changeViewType = function() {
dataChanged = true;

if ($scope.frmMain.$invalid) return;

$scope.changeViewType = function () {
dataChanged = true;
if (!$scope.frmMain.$invalid) {
var data = $scope.data;
console.log("***********save", data.content.openInApp);

if (data.content.openInApp != undefined) {
data.content.openInApp = null;
}
buildfire.datastore.save(data, function (err, result) {
buildfire.datastore.save(data, function(err, result) {
if (err || !result) {
$log.error('Error saving the widget details: ', err);
}
else {
} else {
$log.info('Widget details saved');
}
});
}
};

$scope.openMethodChanged = function () {
dataChanged = true;
buildfire.datastore.save($scope.data, function (err, result) {
if (err || !result) {
$log.error('Error saving the widget details: ', err);
}
else {
$log.info('Widget details saved');
}
});
};
};

$scope.openMethodChanged = function() {
dataChanged = true;
buildfire.datastore.save($scope.data, function(err, result) {
if (err || !result) {
$log.error('Error saving the widget details: ', err);
} else {
$log.info('Widget details saved');
}
});
};

$scope.isUrlValid = function (url) {
return /[-a-zA-Z0-9@:%_\+.~#?&//=]{2,256}\.[a-z]{2,6}\b(\/[-a-zA-Z0-9@:%_\+.~#?!?\/?\w\/?&//=]*)?/.test(url);
};
}]);
$scope.isUrlValid = function(url) {
return /[-a-zA-Z0-9@:%_\+.~#?&//=]{2,256}\.[a-z]{2,6}\b(\/[-a-zA-Z0-9@:%_\+.~#?!?\/?\w\/?&//=]*)?/.test(url);
};
}
})(window.angular, window.buildfire);
16 changes: 16 additions & 0 deletions src/widget/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="../../../scripts/buildfire.js"></script>
<script src="../../../scripts/buildfire/components/notifications/notifications.js"></script>
<style>
.success-message{
text-align: center;
Expand All @@ -11,6 +12,18 @@
display: none;
margin-top: 50%;
}
#warning-message_wrapper {
pointer-events: none;
position: absolute;
width: 100vw;
height: 100vh;
display: flex;
align-items: center;
justify-content: center;
}
.modal-header, .cancel-confirmation {
display: none;
}
</style>
</head>
<body class="no-scroll">
Expand All @@ -21,5 +34,8 @@ <h2>Success!</h2>
web page now click <a id="targetUrl" href="#" target="_blank">here</a></p>
</div>

<div id="warning-message_wrapper">
<div id="warning-message"></div>
</div>
</body>
</html>
Loading

0 comments on commit 80b21ee

Please sign in to comment.