From b5439f436cac405c4bbf7e01ead9cee5dbc71a73 Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Wed, 16 May 2012 16:04:00 -0700 Subject: CSS Panel - Style sheets dirty flag added --- js/controllers/styles-controller.js | 5 +++ .../css-panel/style-sheet.reel/style-sheet.css | 5 +++ .../css-panel/style-sheet.reel/style-sheet.js | 21 +++++++++++ .../style-sheets-view.reel/style-sheets-view.js | 41 +++++++++++++++++++++- 4 files changed, 71 insertions(+), 1 deletion(-) (limited to 'js') diff --git a/js/controllers/styles-controller.js b/js/controllers/styles-controller.js index 60b2ca92..22f29bd8 100755 --- a/js/controllers/styles-controller.js +++ b/js/controllers/styles-controller.js @@ -1315,6 +1315,9 @@ var stylesController = exports.StylesController = Montage.create(Component, { return sheetObj.stylesheet === sheet; }); + ///// Dispatch modified event + NJevent('styleSheetModified', eventData); + ///// If the sheet doesn't already exist in the list of modified ///// sheets, dispatch dirty event and add the sheet to the list if(sheetSearch.length === 0) { @@ -1348,6 +1351,8 @@ var stylesController = exports.StylesController = Montage.create(Component, { this.dirtyStyleSheets = this.dirtyStyleSheets.filter(function(sheet) { return sheet.document !== doc; }); + } else { + this.dirtyStyleSheets = []; } diff --git a/js/panels/css-panel/style-sheet.reel/style-sheet.css b/js/panels/css-panel/style-sheet.reel/style-sheet.css index 1d26b041..2e72cd9c 100644 --- a/js/panels/css-panel/style-sheet.reel/style-sheet.css +++ b/js/panels/css-panel/style-sheet.reel/style-sheet.css @@ -131,6 +131,11 @@ font-weight: bold; } +.ss-dirty:after { + content: "*"; + color: #A33939; +} + .ss-invisible { display: none; } \ No newline at end of file diff --git a/js/panels/css-panel/style-sheet.reel/style-sheet.js b/js/panels/css-panel/style-sheet.reel/style-sheet.js index 3ddd8454..0ff195d5 100644 --- a/js/panels/css-panel/style-sheet.reel/style-sheet.js +++ b/js/panels/css-panel/style-sheet.reel/style-sheet.js @@ -57,6 +57,12 @@ exports.StyleSheet = Montage.create(Component, { this._element.classList.remove('default-style-sheet'); } + if(this.dirty) { + this.nameText.element.classList.add('ss-dirty'); + } else { + this.nameText.element.classList.remove('ss-dirty'); + } + } }, @@ -137,6 +143,21 @@ exports.StyleSheet = Montage.create(Component, { this._name = text; } }, + _dirty : { + value: null + }, + dirty : { + get: function() { + return this._dirty; + }, + set: function(value) { + if(value === this._dirty) { return false; } + + this._dirty = value; + this.needsDraw = true; + } + }, + _readOnly : { value: null }, readOnly : { get: function() { diff --git a/js/panels/css-panel/style-sheets-view.reel/style-sheets-view.js b/js/panels/css-panel/style-sheets-view.reel/style-sheets-view.js index b2d2c0fb..8131a619 100644 --- a/js/panels/css-panel/style-sheets-view.reel/style-sheets-view.js +++ b/js/panels/css-panel/style-sheets-view.reel/style-sheets-view.js @@ -17,6 +17,8 @@ exports.StyleSheetsView = Montage.create(Component, { documentNameLabel : { value: null }, noDocumentLabelClass : { value: "no-document" }, + dirtyStyleSheets: { value: null }, + _documentName : { value: null }, documentName : { get: function() { @@ -52,7 +54,21 @@ exports.StyleSheetsView = Montage.create(Component, { this.needsDraw = true; } }, - + + _dirtyStyleSheets : { value: null }, + dirtyStyleSheets : { + get: function() { + return this._dirtyStyleSheets; + }, + set: function(value) { + if(value === this._dirtyStyleSheets) { return false; } + + this._dirtyStyleSheets = value; + + this.needsDraw = true; + } + }, + /// Toolbar Button Actions /// -------------------------------- @@ -79,10 +95,22 @@ exports.StyleSheetsView = Montage.create(Component, { 'oneway': false }); + Object.defineBinding(this, 'dirtyStyleSheets', { + 'boundObject': this.stylesController, + 'boundObjectPropertyPath': 'dirtyStyleSheets', + 'oneway': true + }); + this._initView = this.needsDraw = true; } }, + handleStyleSheetModified : { + value: function(e) { + this.needsDraw = true; + } + }, + /// Draw cycle /// -------------------------------- @@ -94,6 +122,7 @@ exports.StyleSheetsView = Montage.create(Component, { prepareForDraw : { value: function() { this.eventManager.addEventListener("styleSheetsReady", this, false); + this.eventManager.addEventListener("styleSheetModified", this, false); } }, draw : { @@ -115,6 +144,16 @@ exports.StyleSheetsView = Montage.create(Component, { this.documentNameLabel.classList.add(this.noDocumentLabelClass); } + if(this.dirtyStyleSheets) { + var dirtySheets = this.dirtyStyleSheets.map(function(sheetDescriptor) { + return sheetDescriptor.stylesheet; + }); + + this.styleSheetList.childComponents.forEach(function(sheetComponent) { + sheetComponent.dirty = dirtySheets.indexOf(sheetComponent.source) !== -1; + }, this); + } + if(this._needsScroll) { setTimeout(function() { -- cgit v1.2.3