Skip to content

GitLab

Commit 33b36dfa authored by Gero Müller's avatar Gero Müller
Browse files

use requirejs to load templates

parent f2746cc3
Hide whitespace changes
Inline Side-by-side
.hgignore
View file @ 33b36dfa
......@@ -28,3 +28,4 @@ docs/source/py
.vagrant
vagrant_ansible_inventory_default
vispa/extensions
node_modules
\ No newline at end of file
build.js 0 → 100644
View file @ 33b36dfa
{
appDir: 'vispa/static',
mainConfigFile: 'vispa/static/js/config.js',
dir: 'build',
baseUrl: '.',
urlPrefix: '/assets/',
modules: [
//First set up the common build layer.
{
//module names are relative to baseUrl
name: 'vispa/config',
//List common dependencies here. Only need to list
//top level dependencies, "include" will find
//nested dependencies.
include: ['jclass',
'vispa/common/url',
'vispa/common/dialog',
'jquery'
]
},
//Now set up a build layer for each main layer, but exclude
//the common one. "exclude" will exclude nested
//the nested, built dependencies from "common". Any
//"exclude" that includes built modules should be
//listed before the build layer that wants to exclude it.
//The "page1" and "page2" modules are **not** the targets of
//the optimization, because shim config is in play, and
//shimmed dependencies need to maintain their load order.
//In this example, common.js will hold jquery, so backbone
//needs to be delayed from loading until common.js finishes.
//That loading sequence is controlled in page1.html.
{
//module names are relative to baseUrl/paths config
name: 'vispa/password',
exclude: ['vispa/config']
},
{
//module names are relative to baseUrl
name: 'vispa/login',
exclude: ['vispa/config']
},
{
//module names are relative to baseUrl
name: 'vispa/vispa',
exclude: ['vispa/config']
}
]
}
\ No newline at end of file
package.json 0 → 100644
View file @ 33b36dfa
{
"devDependencies": {
"less": "^2.5",
"uglify-js": "^2.5",
"jshint": "^2.8",
"jade": "^1.11",
"clean-css": "^3.4",
"html-minifier": "^1.0",
"http-server": "^0.8",
"requirejs": "^2.1"
}
}
vispa/extensions/codeeditor/static/js/preview.js
View file @ 33b36dfa
define(["jquery", "emitter"], function($, Emitter) {
define(["jquery", "emitter", "text!../html/preview.html"], function($, Emitter, PreviewTmpl) {
var CodeEditorPreview = Emitter._extend({
......@@ -18,7 +18,6 @@ define(["jquery", "emitter"], function($, Emitter) {
this.inputFocused = false;
this.shadowTmpl = "inset {0}px 0px #428cba";
this.previewTmpl = null;
this.allowedExtensions = ["png", "jpg", "jpeg", "bmp", "root"];
this.pictureExtensions = ["png", "jpg", "jpeg", "bmp"]
......@@ -101,15 +100,11 @@ define(["jquery", "emitter"], function($, Emitter) {
this.thumbnailSize = this.giveThumbnailSize();
// load the preview template
this.view.getTemplate("html/preview.html", function(err, tmpl) {
self.previewTmpl = tmpl;
self.refresh();
self.loaderInterval = setInterval(function() {
self.refresh();
self.loaderInterval = setInterval(function() {
self.refresh();
}, 1000);
self.view.emit("stateChange", "previewPath");
});
}, 1000);
self.view.emit("stateChange", "previewPath");
return this;
......@@ -244,7 +239,7 @@ define(["jquery", "emitter"], function($, Emitter) {
_addPreviewNode: function(data) {
var self = this;
var node = $(this.previewTmpl).prependTo(this.previewArea);
var node = $(PreviewTmpl).prependTo(this.previewArea);
node.find("span").html(data.filePath.split("/").pop());
if (data.type == "picture") {
node.find("img").attr("src", data.src);
......@@ -342,4 +337,4 @@ define(["jquery", "emitter"], function($, Emitter) {
});
return CodeEditorPreview;
});
\ No newline at end of file
});
vispa/extensions/codeeditor/static/js/updateInfo.js
View file @ 33b36dfa
define(["jquery", "emitter"], function($, Emitter) {
define(["jquery", "emitter", "text!../html/updateInfo.html"], function($, Emitter, UpdateInfoTmpl) {
var UpdateInfo = Emitter._extend({
......@@ -22,58 +22,56 @@ define(["jquery", "emitter"], function($, Emitter) {
start: function() {
var self = this;
this.view.getTemplate("html/updateInfo.html", function(err, tmpl) {
var dialog = null;
var $all = $(tmpl);
var $body = $all.children().first();
var $footer = $all.children().last();
self.headerNode = $body.find("#header");
self.textNode = $body.find("#textfield");
self.pageCounterNode = $body.find("#pagecounter");
self.checkBoxNode = $body.find("input");
//make the page
self.checkBoxNode.prop("checked", !self.checkPreference());
var dialog = null;
var $all = $(UpdateInfoTmpl);
var $body = $all.children().first();
var $footer = $all.children().last();
self.headerNode = $body.find("#header");
self.textNode = $body.find("#textfield");
self.pageCounterNode = $body.find("#pagecounter");
self.checkBoxNode = $body.find("input");
//make the page
self.checkBoxNode.prop("checked", !self.checkPreference());
self.makePage(1);
//setup buttons
$footer.find("#start").click(function() {
self.makePage(1);
//setup buttons
$footer.find("#start").click(function() {
self.makePage(1);
});
$footer.find("#previous").click(function() {
self.makePage(self.pageCounter - 1);
});
$footer.find("#next").click(function() {
self.makePage(self.pageCounter + 1);
});
$footer.find("#end").click(function() {
self.makePage(self.totalPages);
});
$footer.find("#quit").click(function() {
dialog.close();
});
self.view.dialog({
header: "<i class='glyphicon glyphicon-info-sign'></i>" +
" 1.1 Update",
body: $body,
footer: $footer,
beforeClose: function(cb) {
self.setPreference(!self.checkBoxNode.prop("checked"));
self.highlightElement();
//code editor specific stuff
//*****
//must be triggered
//so the save button is correctly toggled
self.view.editor.actions.checkModifications();
//*****
cb(); //callback == close call
},
onRender: function() {
dialog = this;
}
});
});
$footer.find("#previous").click(function() {
self.makePage(self.pageCounter - 1);
});
$footer.find("#next").click(function() {
self.makePage(self.pageCounter + 1);
});
$footer.find("#end").click(function() {
self.makePage(self.totalPages);
});
$footer.find("#quit").click(function() {
dialog.close();
});
self.view.dialog({
header: "<i class='glyphicon glyphicon-info-sign'></i>" +
" 1.1 Update",
body: $body,
footer: $footer,
beforeClose: function(cb) {
self.setPreference(!self.checkBoxNode.prop("checked"));
self.highlightElement();
//code editor specific stuff
//*****
//must be triggered
//so the save button is correctly toggled
self.view.editor.actions.checkModifications();
//*****
cb(); //callback == close call
},
onRender: function() {
dialog = this;
}
});
},
......@@ -225,4 +223,4 @@ define(["jquery", "emitter"], function($, Emitter) {
return UpdateInfo;
});
\ No newline at end of file
});
vispa/extensions/codeeditor/static/js/view.js
View file @ 33b36dfa
......@@ -7,7 +7,8 @@ define([
"./preview",
"./ui",
"./commandline",
"./updateInfo"
"./updateInfo",
"text!../html/main.html"
], function(
$,
CenterView,
......@@ -17,7 +18,8 @@ define([
Preview,
UI,
CommandLine,
UpdateInfo
UpdateInfo,
MainTmpl
) {
var CodeEditorView = CenterView._extend({
......@@ -144,33 +146,31 @@ define([
var self = this;
this.setLoading(true);
this.getTemplate("html/main.html", function(err, tmpl) {
$(tmpl).appendTo(node);
$(MainTmpl).appendTo(node);
// setup the ace editor
self.editor.setup(node);
// setup the ace editor
self.editor.setup(node);
// setup the output
self.output.setup(node);
// setup the output
self.output.setup(node);
// setup the preview
self.preview.setup(node);
// setup the preview
self.preview.setup(node);
//setup the UI and the auto resizes
self.ui.setup();
//setup the UI and the auto resizes
self.ui.setup();
//setup the commandline
self.commandLine.setup(node);
//setup the commandline
self.commandLine.setup(node);
self.applyPreferences();
self._applyShortcuts();
//initially set the icon
self.setIcon("icon-default");
self.setLoading(false);
self.applyPreferences();
self._applyShortcuts();
//initially set the icon
self.setIcon("icon-default");
self.setLoading(false);
//setup/show the help dialog
//self.updateInfo.setup(node);
});
//setup/show the help dialog
//self.updateInfo.setup(node);
return this;
},
......@@ -298,4 +298,4 @@ define([
});
return CodeEditorView;
});
\ No newline at end of file
});
vispa/extensions/file/static/js/base/actions.js
View file @ 33b36dfa
define(["jquery", "jclass"], function($, JClass) {
define(["jquery", "jclass", "text!../../html/openDialog.html", "text!../../html/infodialog.html", "text!../../html/infodialogmore.html"], function($, JClass, openTmpl, infoTmpl, moreTmpl) {
var FileBaseActions = JClass._extend({
init: function(FileBase) {
......@@ -96,50 +96,49 @@ define(["jquery", "jclass"], function($, JClass) {
if (~self.FileBase.helper.isBrowserFile(path)) {
lb();
} else {
self.FileBase.instance.getTemplate("html/openDialog.html", function (err, tmpl) {
var $body = $(tmpl).children().first();
var $footer = $(tmpl).children().last();
var dialog = null;
var clicktype = vispa.device.hasTouch ? "tap" : "click";
var name = selectionElem.data().data.name;
var size = selectionElem.data().data.size;
var sizeFormat = self.FileBase.helper.convertSize(size);
size = sizeFormat.size + " " + sizeFormat.sizeSuffix;
// render body
$body.html("What do you want to do with \"" + name + " (" + size + ")\"?");
// footer clicks
// just close for cancel
$("#cancel", $footer).on(clicktype, function (event) {
event.stopPropagation();
dialog.close();
});
// open with code editor
$("#codeeditor", $footer).on(clicktype, function (event) {
event.stopPropagation();
self._openWithCodeEditor(path);
dialog.close();
});
// just close for cancel
$("#download", $footer).on(clicktype, function (event) {
event.stopPropagation();
self.download();
dialog.close();
});
var a = $(openTmpl)
var $body = a.children().first();
var $footer = a.children().last();
var dialog = null;
var clicktype = vispa.device.hasTouch ? "tap" : "click";
var name = selectionElem.data().data.name;
var size = selectionElem.data().data.size;
var sizeFormat = self.FileBase.helper.convertSize(size);
size = sizeFormat.size + " " + sizeFormat.sizeSuffix;
// render body
$body.html("What do you want to do with \"" + name + " (" + size + ")\"?");
// footer clicks
// just close for cancel
$("#cancel", $footer).on(clicktype, function (event) {
event.stopPropagation();
dialog.close();
});
// open with code editor
$("#codeeditor", $footer).on(clicktype, function (event) {
event.stopPropagation();
self._openWithCodeEditor(path);
dialog.close();
});
// just close for cancel
$("#download", $footer).on(clicktype, function (event) {
event.stopPropagation();
self.download();
dialog.close();
});
// create dialog
self.FileBase.instance.dialog({
"header": "Open file",
"body": $body,
"footer": $footer,
beforeClose: function (cb) {
cb();
},
onRender: function () {
dialog = this;
}
});
// create dialog
self.FileBase.instance.dialog({
"header": "Open file",
"body": $body,
"footer": $footer,
beforeClose: function (cb) {
cb();
},
onRender: function () {
dialog = this;
}
});
}
} else {
......@@ -384,26 +383,22 @@ define(["jquery", "jclass"], function($, JClass) {
totalSize = self.FileBase.helper.convertSize(totalSize).size;
// render when only one item is selected
if (numberOfSelectedItems == 1) {
self.FileBase.instance.getTemplate("html/infodialog.html", function(err, tmpl) {
self.FileBase.instance.alert($(tmpl).render(infoObject), {
self.FileBase.instance.alert($(infoTmpl).render(infoObject), {
header: "Info",
okLabel: "Close"
});
});
// render when more items are selected
} else {
self.FileBase.instance.getTemplate("html/infodialogmore.html", function(err, tmpl) {
var appendToRender = $(tmpl);
$("tbody", appendToRender).render(array);
$(".file-info-dialog-header", appendToRender).render({
"numberOfSelectedItems": numberOfSelectedItems,
"totalSize": totalSize,
"totalSizeSuffix": totalSizeSuffix
});
self.FileBase.instance.alert(appendToRender.html(), {
header: "Info",
okLabel: "Close"
});
var appendToRender = $(moteTmpl);
$("tbody", appendToRender).render(array);
$(".file-info-dialog-header", appendToRender).render({
"numberOfSelectedItems": numberOfSelectedItems,
"totalSize": totalSize,
"totalSizeSuffix": totalSizeSuffix
});
self.FileBase.instance.alert(appendToRender.html(), {
header: "Info",
okLabel: "Close"
});
}
}
......@@ -587,4 +582,4 @@ define(["jquery", "jclass"], function($, JClass) {
});
return FileBaseActions;
});
\ No newline at end of file
});
vispa/extensions/file/static/js/base/base.js
View file @ 33b36dfa
......@@ -10,7 +10,8 @@ define([
"./sort",
"./pathbar",
"./views/symbol",
"./views/table"
"./views/table",
"text!../../html/alert.html"
], function(
$,
JClass,
......@@ -23,7 +24,8 @@ define([
FileBaseSorting,
PathBar,
SymbolView,
TableView
TableView,
AlertTmpl
) {
var FileBase = JClass._extend({
......@@ -140,12 +142,9 @@ define([
self.instance.setLoading(false);
if (data.count < 0) {
self.instance.setLoading(true);
self.instance.getTemplate("html/alert.html",
function(err, tmpl) {
self.view.fileContentContainer.empty();
self.view.fileContentContainer.append(tmpl);
self.pathBar.render();
});
self.view.fileContentContainer.empty();
self.view.fileContentContainer.append(AlertTmpl);
self.pathBar.render();
self.workflow.updateState++;
self.instance.setLoading(false);
return;
......@@ -197,4 +196,4 @@ define([
});
return FileBase;
});
\ No newline at end of file
});
vispa/extensions/file/static/js/base/bookmark.js
View file @ 33b36dfa
define(["jquery", "jclass"], function ($, JClass) {
define(["jquery", "jclass", "text!../../html/bookmarkSymbolDialog.html"], function ($, JClass, dlgTmpl) {
var BookmarkContainer = JClass._extend({
......@@ -358,71 +358,70 @@ define(["jquery", "jclass"], function ($, JClass) {
var self = this;
$(".input-bookmarkname", self.container).blur();
self.instance.getTemplate("html/bookmarkSymbolDialog.html", function (err, tmpl) {
var $body = $(tmpl).children().first();
var $footer = $(tmpl).children().last();
var dialog = null;
var clicktype = vispa.device.hasTouch ? "tap" : "click";
var a = $(dlgTmpl);
var $body = a.children().first();
var $footer = a.children().last();
var dialog = null;
var clicktype = vispa.device.hasTouch ? "tap" : "click";
// render body
$body.render(self.allowedSymbols, {
"button": {
"title": function () {
return this.value;
}
},
"symbol": {
"class": function () {
return "glyphicon glyphicon-" + this.value;
}
// render body
$body.render(self.allowedSymbols, {
"button": {
"title": function () {
return this.value;
}
});
$(".glyphicon-" + $bookmark.data().symbol, $body).parent()
.toggleClass("btn-primary btn-default");
// clicks
$body.children().on(clicktype, function (event) {
event.stopPropagation();
$(".btn-primary", $body).toggleClass("btn-primary btn-default");
$(event.currentTarget).toggleClass("btn-primary btn-default");
});
// footer clicks
// just close for cancel
$("#cancel", $footer).on(clicktype, function (event) {
event.stopPropagation();
dialog.close();
});
// save new symbol for save
$("#save", $footer).on(clicktype, function (event) {
event.stopPropagation();
var oldsymbol = $bookmark.data().symbol;
$bookmark.data().symbol = $(".btn-primary", $body).children().first().prop("class").slice(20);
self.saveBookmarks(self.getBookmarksFromDOM(), function (err) {
if (err) {
self.instance.alert("Couldn't change symbol.");
$bookmark.data().symbol = oldsymbol;
}
// self.setContent();
});
dialog.close();
});
},
"symbol": {
"class": function () {
return "glyphicon glyphicon-" + this.value;
}
}
});
$(".glyphicon-" + $bookmark.data().symbol, $body).parent()
.toggleClass("btn-primary btn-default");
// clicks
$body.children().on(clicktype, function (event) {
event.stopPropagation();
$(".btn-primary", $body).toggleClass("btn-primary btn-default");
$(event.currentTarget).toggleClass("btn-primary btn-default");
});