Skip to content

Commit

Permalink
Added settings for sidebar and font.
Browse files Browse the repository at this point in the history
  • Loading branch information
Michael Kleinhenz committed Apr 7, 2016
1 parent 348b0a2 commit 3fa48c5
Show file tree
Hide file tree
Showing 4 changed files with 180 additions and 31 deletions.
36 changes: 36 additions & 0 deletions editor/frontend/js/controllers/projects.js
Original file line number Diff line number Diff line change
Expand Up @@ -175,6 +175,41 @@ editorModule.controller("projectsCoreController", ["$scope", "$http", "Upload",
Pace.restart();
});
};

$scope.uploadSidebarImage = function() {
if ($scope.sidebarImageFile)
Upload.upload({
method: "PUT",
url: "/api/sidebarimage/" + $scope.selectedProject.id,
data: {
file: $scope.sidebarImageFile
}
}).then(function (resp) {
$(".projectsidebar").attr("src", $(".projectsidebar").attr("src") + "?date=" + new Date().getTime());
}, function (resp) {
modalError("Error uploading file. Please try again.");
}, function (evt) {
var progressPercentage = parseInt(100.0 * evt.loaded / evt.total);
Pace.restart();
});
};

$scope.uploadUiFont = function() {
if ($scope.uifontFile)
Upload.upload({
method: "PUT",
url: "/api/uifont/" + $scope.selectedProject.id,
data: {
file: $scope.uifontFile
}
}).then(function (resp) {
}, function (resp) {
modalError("Error uploading file. Please try again.");
}, function (evt) {
var progressPercentage = parseInt(100.0 * evt.loaded / evt.total);
Pace.restart();
});
};

$scope.uploadHelpImage = function() {
if ($scope.helpImageFile)
Expand Down Expand Up @@ -305,6 +340,7 @@ editorModule.controller("projectsCoreController", ["$scope", "$http", "Upload",
$(".projectcover").attr("src", "/api/coverimage/" + $scope.selectedProject.id);
$(".projectsplash").attr("src", "/api/splashimage/" + $scope.selectedProject.id);
$(".projectmenu").attr("src", "/api/menuimage/" + $scope.selectedProject.id);
$(".projectsidebar").attr("src", "/api/sidebarimage/" + $scope.selectedProject.id);
$(".projecthelp").attr("src", "/api/helpimage/" + $scope.selectedProject.id);
$(".projectcredits").attr("src", "/api/creditsimage/" + $scope.selectedProject.id);
$scope.keyPassword = undefined;
Expand Down
112 changes: 83 additions & 29 deletions editor/frontend/views/projects.html
Original file line number Diff line number Diff line change
Expand Up @@ -104,6 +104,7 @@
<li class="active"><a href="#projectsettings" data-toggle="tab" class="projectsettings">Basic Info</a></li>
<li><a href="#appsettings" data-toggle="tab" class="appsettings">App Settings</a></li>
<li><a href="#publishersettings" data-toggle="tab" class="publishersettings">Publisher Settings</a></li>
<li><a href="#keysettings" data-toggle="tab" class="keysettings">App Signing Key</a></li>
</ul>
<div class="tab-content project-content">
<div id="projectsettings" class="tab-pane active">
Expand Down Expand Up @@ -158,6 +159,34 @@
ng-model="settings.publisher" ng-disabled="!selectedProject"
class="form-control"/></div>
</div>
<div id="keysettings" class="tab-pane">
<div class="keystatusblock keystatusblock-positive" ng-hide="!settings.KEY_ALIAS">
<span class="keystatus"><i class="glyphicon glyphicon-ok-circle"></i>&nbsp;&nbsp;Key is available</span>&nbsp;&nbsp;
<span class="keydownload"><a class="btn btn-default btn-xs" href="/api/settings/key/{{selectedProject.id}}">Download Key</a></span>
</div>
<div class="keystatusblock keystatusblock-negative" ng-hide="settings.KEY_ALIAS">
<span class="keystatus"><i class="glyphicon glyphicon-alert"></i>&nbsp;&nbsp;Key is not available, please upload or create a key.</span>
</div>
<div class="form-group">
<label>Key Alias</label>
<input id="keyAlias" type="text" placeholder="No key alias available" ng-model="settings.KEY_ALIAS" class="disabled form-control"/>
</div>
<div class="form-group">
<label>Key Password</label>
<div class="inner-addon left-addon">
<button class="btn btn-default btn-xs" ng-click="showKeyPassword()">Show</button>
<input id="keyPassword" type="text" placeholder="Key password is hidden" ng-model="keyPassword" class="disabled form-control"/>
</div>
</div>
<div class="warning">
Please make sure you always keep a backup of your key, key alias and key password at a safe place, even when you created the key here. <em>If you loose your key or any of the noted data, you will not be able to upload app updates to Google Play anymore.</em>
</div>
<div class="pull-right">
<button class="btn btn-danger" ng-click="createKey()">Create New Key</button>
&nbsp;&nbsp;
<button class="btn btn-danger" ng-click="uploadKey()">Upload Key</button>
</div>
</div>
</div>
</div>
</div>
Expand All @@ -176,8 +205,8 @@
<li class="active"><a href="#iconandcover" data-toggle="tab" class="iconandcover">Icon and Cover Images</a></li>
<li><a href="#splashimages" data-toggle="tab" class="splashimages">Splash Images</a></li>
<li><a href="#menuimages" data-toggle="tab" class="menuimages">Menu Images</a></li>
<li><a href="#sidebarimages" data-toggle="tab" class="sidebarimages">Sidebar and UI Font</a></li>
<li><a href="#creditshelpimages" data-toggle="tab" class="creditshelpimages">Help & Credits Images</a></li>
<li><a href="#keysettings" data-toggle="tab" class="keysettings">App Signing Key</a></li>
</ul>
<div class="tab-content project-content">
<div id="iconandcover" class="tab-pane active">
Expand Down Expand Up @@ -346,6 +375,59 @@
</div>
</div>
</div>
<div id="sidebarimages" class="tab-pane">
<div class="projectimages imagestable">
<div class="imagesrow" style="height:10%">
<div class="imagescell">
Sidebar Background
</div>
<div class="imagescell">
UI Font
</div>
</div>
<div class="imagesrow" style="height:70%">
<div class="imagescell">
<img class="projectsidebar" style="max-height: 15%;">
</div>
<div class="imagescell">
<span class="keydownload"><a class="btn btn-default btn-xs" href="/api/uifont/{{selectedProject.id}}">Download Font</a></span>
</div>
</div>
<div class="imagesrow" style="height:10%">
<div class="imagescell">
837x1920px, JPG
</div>
<div class="imagescell">
TrueType Font
</div>
</div>
<div class="imagesrow" style="height:10%">
<div class="imagescell">
<form name="sidebarImageUploadForm">
<button name="file" id="sidebarimageupload" class="btn btn-primary btn-xs"
ng-model="sidebarImageFile" ngf-pattern="'*.jpg'"
ngf-accept="'*.jpg'" ngf-dimensions="$width==837 && $height==1920"
ngf-select="uploadSidebarImage()">
<span>&nbsp;Upload Sidbar Background</span>
</button>
<div ng-hide="!sidebarImageUploadForm.file.$error.dimensions" style="color:red;font-weight:bold;">
Your selected file does not have<br>the required resolution!
</div>
</form>
</div>
<div class="imagescell">
<form name="uifontUploadForm">
<button name="file" id="uifontupload" class="btn btn-primary btn-xs"
ng-model="uifontFile" ngf-pattern="'*.ttf'"
ngf-accept="'*.ttf'"
ngf-select="uploadUiFont()">
<span>&nbsp;Upload UI Font</span>
</button>
</form>
</div>
</div>
</div>
</div>
<div id="creditshelpimages" class="tab-pane">
<div class="projectimages imagestable">
<div class="imagesrow" style="height:10%">
Expand Down Expand Up @@ -402,34 +484,6 @@
</div>
</div>
</div>
<div id="keysettings" class="tab-pane">
<div class="keystatusblock keystatusblock-positive" ng-hide="!settings.KEY_ALIAS">
<span class="keystatus"><i class="glyphicon glyphicon-ok-circle"></i>&nbsp;&nbsp;Key is available</span>&nbsp;&nbsp;
<span class="keydownload"><a class="btn btn-default btn-xs" href="/api/settings/key/{{selectedProject.id}}">Download Key</a></span>
</div>
<div class="keystatusblock keystatusblock-negative" ng-hide="settings.KEY_ALIAS">
<span class="keystatus"><i class="glyphicon glyphicon-alert"></i>&nbsp;&nbsp;Key is not available, please upload or create a key.</span>
</div>
<div class="form-group">
<label>Key Alias</label>
<input id="keyAlias" type="text" placeholder="No key alias available" ng-model="settings.KEY_ALIAS" class="disabled form-control"/>
</div>
<div class="form-group">
<label>Key Password</label>
<div class="inner-addon left-addon">
<button class="btn btn-default btn-xs" ng-click="showKeyPassword()">Show</button>
<input id="keyPassword" type="text" placeholder="Key password is hidden" ng-model="keyPassword" class="disabled form-control"/>
</div>
</div>
<div class="warning">
Please make sure you always keep a backup of your key, key alias and key password at a safe place, even when you created the key here. <em>If you loose your key or any of the noted data, you will not be able to upload app updates to Google Play anymore.</em>
</div>
<div class="pull-right">
<button class="btn btn-danger" ng-click="createKey()">Create New Key</button>
&nbsp;&nbsp;
<button class="btn btn-danger" ng-click="uploadKey()">Upload Key</button>
</div>
</div>
</div>
</div>
</div>
Expand Down
3 changes: 1 addition & 2 deletions editor/projects/sampleproject/storyquest.json
Original file line number Diff line number Diff line change
@@ -1,2 +1 @@
{"id":"sqbookXX","name":"New Name","author":"New Author Name","publisher":"New Publisher","sequence":"graph",
"theme": "dark"}
{"id":"sqbookXX","name":"New Name","author":"New Author Name","publisher":"New Publisher","sequence":"graph","theme":"dark"}
60 changes: 60 additions & 0 deletions editor/service/routes/project.js
Original file line number Diff line number Diff line change
Expand Up @@ -55,6 +55,10 @@ exports.registerServices = function(appConfig, app) {
app.get("/api/menuimage/:projectId", global.authUser, global.authProject, this.getMenuImage);
app.put("/api/menuvideo/:projectId", global.authUser, global.authProject, this.updateMenuVideo);
app.get("/api/menuvideo/:projectId", global.authUser, global.authProject, this.getMenuVideo);
app.put("/api/sidebarimage/:projectId", global.authUser, global.authProject, this.updateSidebarImage);
app.get("/api/sidebarimage/:projectId", global.authUser, global.authProject, this.getSidebarImage);
app.put("/api/uifont/:projectId", global.authUser, global.authProject, this.updateUIFont);
app.get("/api/uifont/:projectId", global.authUser, global.authProject, this.getUIFont);
app.put("/api/helpimage/:projectId", global.authUser, global.authProject, this.updateHelpImage);
app.get("/api/helpimage/:projectId", global.authUser, global.authProject, this.getHelpImage);
app.put("/api/creditsimage/:projectId", global.authUser, global.authProject, this.updateCreditsImage);
Expand Down Expand Up @@ -444,6 +448,62 @@ exports.getMenuVideo = function(req, res) {
}
};

exports.updateSidebarImage = function(req, res){
var outputDir = Utils.getProjectDir(req.param("projectId"));
try {
if (req.files && req.files.file) {
var dimensions = imageSize(req.files.file.path);
if (dimensions.width===837 && dimensions.height===1920) {
// dont use rename here, because rename breaks when files are on different filesystems
fse.copySync(req.files.file.path, path.join(outputDir, "sidebar.jpg"));
fse.removeSync(req.files.file.path);
return res.json(200, {});
} else
return res.json(500, {type: "REQUEST_FAILED", "message": "Image does not have the right size."});
}
} catch(err) {
return res.json(500, {type: "REQUEST_FAILED", "message": err});
}
};

exports.getSidebarImage = function(req, res) {
var projectId = req.param("projectId");
var sidebarFile = path.join(Utils.getProjectDir(projectId), "sidebar.jpg");
if (fs.existsSync(sidebarFile)) {
res.writeHead(200, { "Content-Type": "image/jpeg" });
return res.end(fs.readFileSync(sidebarFile), "binary");
} else {
res.writeHead(200, { "Content-Type": "image/jpeg" });
return res.end(fs.readFileSync(path.join(Utils.getProjectDir(projectId), "..", "..", "template", "sidebar.jpg")), "binary");
}
};

exports.updateUIFont = function(req, res){
var outputDir = Utils.getProjectDir(req.param("projectId"));
try {
if (req.files && req.files.file) {
// dont use rename here, because rename breaks when files are on different filesystems
fse.copySync(req.files.file.path, path.join(outputDir, "uifont.ttf"));
fse.removeSync(req.files.file.path);
return res.json(200, {});
}
} catch(err) {
return res.json(500, {type: "REQUEST_FAILED", "message": err});
}
};

exports.getUIFont = function(req, res) {
var projectId = req.param("projectId");
var uiFontFile = path.join(Utils.getProjectDir(projectId), "uifont.ttf");
if (fs.existsSync(uiFontFile)) {
res.writeHead(200, { "Content-Type": "application/octet-stream" });
return res.end(fs.readFileSync(uiFontFile), "binary");
} else {
res.writeHead(200, { "Content-Type": "application/octet-stream" });
return res.end(fs.readFileSync(path.join(Utils.getProjectDir(projectId), "..", "..", "template", "uifont.ttf")), "binary");
}
};

exports.updateHelpImage = function(req, res){
var outputDir = Utils.getProjectDir(req.param("projectId"));
try {
Expand Down

0 comments on commit 3fa48c5

Please sign in to comment.