X-Git-Url: https://git.mdrn.pl/fnpeditor.git/blobdiff_plain/bb4f4e65b84c6df29088e2b3fdff09105e0154a9..2bb0e6a7d19dc695f82373e568e6959c6b995eca:/modules/rng/rng.js?ds=sidebyside diff --git a/modules/rng/rng.js b/modules/rng/rng.js index 4b9aecf..c42b985 100644 --- a/modules/rng/rng.js +++ b/modules/rng/rng.js @@ -1,44 +1,52 @@ define([ 'fnpjs/layout', +'fnpjs/vbox', 'views/tabs/tabs', -'libs/text!./mainLayout.html' -], function(layout, tabs, mainLayoutTemplate) { +'libs/text!./mainLayout.html', +'libs/text!./editingLayout.html', +], function(layout, vbox, tabs, mainLayoutTemplate, visualEditingLayoutTemplate) { return function(sandbox) { 'use strict'; - var mainTabs = (new tabs.View()).render(); - var mainLayout = new layout.Layout(mainLayoutTemplate); - sandbox.getDOM().append(mainLayout.getAsView()); + function addMainTab(title, slug, view) { + views.mainTabs.addTab(title, slug, view); + } - function addTab(title, slug, view) { - mainTabs.addTab(title, slug, view); + var views = { + mainLayout: new layout.Layout(mainLayoutTemplate), + mainTabs: (new tabs.View()).render(), + visualEditing: new layout.Layout(visualEditingLayoutTemplate), + visualEditingSidebar: (new tabs.View({stacked: true})).render(), + currentNodePaneLayout: new vbox.VBox() } + views.visualEditing.setView('rightColumn', views.visualEditingSidebar.getAsView()); + addMainTab('Edytor', 'editor', views.visualEditing.getAsView()); + + sandbox.getDOM().append(views.mainLayout.getAsView()); + + views.visualEditingSidebar.addTab({icon: 'pencil'}, 'edit', views.currentNodePaneLayout.getAsView()); + + + + /* Events handling */ var eventHandlers = {}; eventHandlers.sourceEditor = { ready: function() { - addTab(gettext('Source'), 'source', sandbox.getModule('sourceEditor').getView()); + addMainTab(gettext('Source'), 'source', sandbox.getModule('sourceEditor').getView()); sandbox.getModule('sourceEditor').setDocument(sandbox.getModule('data').getDocument()); } }; - eventHandlers.visualEditor = { - ready: function() { - sandbox.getModule('visualEditor').setDocument(sandbox.getModule('data').getDocument()); - addTab(gettext('Visual'), 'visual', sandbox.getModule('visualEditor').getView()); - - } - }; - eventHandlers.data = { ready: function() { - mainLayout.setView('mainView', mainTabs.getAsView()); + views.mainLayout.setView('mainView', views.mainTabs.getAsView()); - _.each(['visualEditor', 'sourceEditor', 'rng2', 'mainBar', 'indicator'], function(moduleName) { + _.each(['sourceEditor', 'documentCanvas', 'documentToolbar', 'nodePane', 'metadataEditor', 'nodeFamilyTree', 'nodeBreadCrumbs', 'mainBar', 'indicator'], function(moduleName) { sandbox.getModule(moduleName).start(); }); }, @@ -58,14 +66,14 @@ return function(sandbox) { eventHandlers.rng2 = { ready: function() { - addTab('rng2 test', 'rng2test', sandbox.getModule('rng2').getView()); + addMainTab('rng2 test', 'rng2test', sandbox.getModule('rng2').getView()); } } eventHandlers.mainBar = { ready: function() { - mainLayout.setView('topPanel', sandbox.getModule('mainBar').getView()); + views.mainLayout.setView('topPanel', sandbox.getModule('mainBar').getView()); }, 'cmd.save': function() { sandbox.getModule('data').fakeSave(); @@ -74,8 +82,103 @@ return function(sandbox) { eventHandlers.indicator = { ready: function() { - mainLayout.setView('messages', sandbox.getModule('indicator').getView()); + views.mainLayout.setView('messages', sandbox.getModule('indicator').getView()); + } + }; + + + + eventHandlers.documentCanvas = { + ready: function() { + sandbox.getModule('documentCanvas').setDocument(sandbox.getModule('data').getDocument()); + views.visualEditing.setView('leftColumn', sandbox.getModule('documentCanvas').getView()); + }, + + nodeSelected: function(node) { + sandbox.getModule('nodePane').setNode(node); + sandbox.getModule('nodeFamilyTree').setNode(node); + sandbox.getModule('nodeBreadCrumbs').setNode(node); + }, + + contentChanged: function() { + + }, + + nodeHovered: function(node) { + sandbox.getModule('documentCanvas').highlightNode(node.attr('id')); + sandbox.getModule('nodeFamilyTree').highlightNode(node.attr('id')); + sandbox.getModule('nodeBreadCrumbs').highlightNode(node.attr('id')); + + }, + + nodeBlured: function(node) { + sandbox.getModule('documentCanvas').dimNode(node.attr('id')); + sandbox.getModule('nodeFamilyTree').dimNode(node.attr('id')); + sandbox.getModule('nodeBreadCrumbs').dimNode(node.attr('id')); + } + }; + + eventHandlers.nodePane = { + ready: function() { + views.currentNodePaneLayout.appendView(sandbox.getModule('nodePane').getView()); + }, + + nodeChanged: function(attr, value) { + sandbox.getModule('documentCanvas').modifyCurrentNode(attr, value); + } + }; + + eventHandlers.metadataEditor = { + ready: function() { + sandbox.getModule('metadataEditor').setMetadata(sandbox.getModule('data').getDocument()); + views.visualEditingSidebar.addTab({icon: 'info-sign'}, 'metadataEditor', sandbox.getModule('metadataEditor').getView()); + } + }; + + eventHandlers.nodeFamilyTree = { + ready: function() { + views.currentNodePaneLayout.appendView(sandbox.getModule('nodeFamilyTree').getView()); + }, + nodeEntered: function(id) { + sandbox.getModule('documentCanvas').highlightNode(id); + }, + nodeLeft: function(id) { + sandbox.getModule('documentCanvas').dimNode(id); + }, + nodeSelected: function(id) { + sandbox.getModule('documentCanvas').selectNode(id); + } + }; + + eventHandlers.documentToolbar = { + ready: function() { + views.visualEditing.setView('toolbar', sandbox.getModule('documentToolbar').getView()); + }, + toggleGrid: function(toggle) { + sandbox.getModule('documentCanvas').toggleGrid(toggle); + }, + newNodeRequested: function(wlxmlTag, wlxmlClass) { + if(window.getSelection().isCollapsed) { + sandbox.getModule('documentCanvas').insertNewNode(wlxmlTag, wlxmlClass); + } else { + sandbox.getModule('documentCanvas').wrapSelectionWithNewNode(wlxmlTag, wlxmlClass); + } } + }; + + eventHandlers.nodeBreadCrumbs = { + ready: function() { + views.visualEditing.setView('statusBar', sandbox.getModule('nodeBreadCrumbs').getView()); + }, + nodeHighlighted: function(id) { + sandbox.getModule('documentCanvas').highlightNode(id); + }, + nodeDimmed: function(id) { + sandbox.getModule('documentCanvas').dimNode(id); + }, + nodeSelected: function(id) { + sandbox.getModule('documentCanvas').selectNode(id); + } } /* api */