From 36ac001cd00596e35e497ebd09b51cc1c93ce2bc Mon Sep 17 00:00:00 2001 From: Nathan Bingham Date: Wed, 29 Apr 2015 11:05:25 -0400 Subject: [PATCH 1/6] Saving progress --- app/components/generator-start.js | 4 + app/templates/components/generator-start.hbs | 15 ++ app/templates/generator-preview.hbs | 31 +++++ app/templates/generator-start.hbs | 11 ++ app/templates/generator-steps.hbs | 82 +++++++++++ app/templates/generator.hbs | 130 +----------------- tests/unit/components/generator-start-test.js | 21 +++ 7 files changed, 170 insertions(+), 124 deletions(-) create mode 100644 app/components/generator-start.js create mode 100644 app/templates/components/generator-start.hbs create mode 100644 app/templates/generator-preview.hbs create mode 100644 app/templates/generator-start.hbs create mode 100644 app/templates/generator-steps.hbs create mode 100644 tests/unit/components/generator-start-test.js diff --git a/app/components/generator-start.js b/app/components/generator-start.js new file mode 100644 index 000000000..926b61300 --- /dev/null +++ b/app/components/generator-start.js @@ -0,0 +1,4 @@ +import Ember from 'ember'; + +export default Ember.Component.extend({ +}); diff --git a/app/templates/components/generator-start.hbs b/app/templates/components/generator-start.hbs new file mode 100644 index 000000000..f0a0f0ee8 --- /dev/null +++ b/app/templates/components/generator-start.hbs @@ -0,0 +1,15 @@ +{{#generator-start data=model action="updateStep"}} +
+
+

Site Data

+
+
+ {{yield}} +
+ +
+
+
+{{/generator-start}} diff --git a/app/templates/generator-preview.hbs b/app/templates/generator-preview.hbs new file mode 100644 index 000000000..29fd51f2b --- /dev/null +++ b/app/templates/generator-preview.hbs @@ -0,0 +1,31 @@ +
+ {{formatted-manifest data=model}} +
+{{#if model.hasIssues}} +
+ {{#if model.errors}} +
+
Errors ({{model.errorsTotal}} {{pluralize-it "item" model.errorsTotal}})
+ {{#each member in model.errors}} + {{partial "issue-list"}} + {{/each}} +
+ {{/if}} + {{#if model.warnings}} +
+
Warnings ({{model.warningsTotal}} {{pluralize-it "item" model.warningsTotal}})
+ {{#each member in model.warnings}} + {{partial "issue-list"}} + {{/each}} +
+ {{/if}} + {{#if model.suggestions}} +
+
Suggestions ({{model.suggestionsTotal}} {{pluralize-it "item" model.suggestionsTotal}})
+ {{#each member in model.suggestions}} + {{partial "issue-list"}} + {{/each}} +
+ {{/if}} +
+{{/if}} diff --git a/app/templates/generator-start.hbs b/app/templates/generator-start.hbs new file mode 100644 index 000000000..ee58fa9a8 --- /dev/null +++ b/app/templates/generator-start.hbs @@ -0,0 +1,11 @@ +{{#generator-start action="updateStep"}} +

Provide your URL or upload your manifest and we'll help fill in the gaps if there are any.

+
+ + {{input name="siteUrl" type="url" value=model.siteUrl placeholder="Enter a URL"}} +
+ or +
+ {{#manifest-upload action="updateManifest"}}{{/manifest-upload}} +
+{{/generator-start}} diff --git a/app/templates/generator-steps.hbs b/app/templates/generator-steps.hbs new file mode 100644 index 000000000..1b8d5feed --- /dev/null +++ b/app/templates/generator-steps.hbs @@ -0,0 +1,82 @@ +
    + {{#generator-step step="2" nextStep="3" stepTitle="Site Data" isShowingBody=steps.step2.isCurrent data=model allowToggle=step1Complete action="updateStep"}} +

    Here are the values we picked up from your site. Update or add any details below.

    +
    + + {{input value=model.manifest.name focus-out="updateModel"}} +
    +
    + + {{input value=model.manifest.short_name focus-out="updateModel"}} +
    +
    + + {{logo-upload action="updateLogos" logos=model.manifest.icons}} +
    +
    + + {{input value=model.manifest.scope focus-out="updateModel"}} +
    +
    + + {{input value=model.manifest.start_url focus-out="updateModel"}} +
    +
    + + {{generator-select content=model.display.names modelProperty="manifest.display" value=model.manifest.display}} +
    +
    + + {{generator-select content=model.orientation.names modelProperty="manifest.orientation" value=model.manifest.orientation}} +
    + {{/generator-step}} + {{#generator-step step="3" nextStep="4" stepTitle="Custom Values" data=model action="updateStep" isShowingBody=steps.step3.isCurrent allowToggle=step1Complete}} +

    Specify custom members to be added to the manifest.

    +
    + {{#member-list action="manageMember" members=customMembers}}{{/member-list}} +
    + {{/generator-step}} + {{#generator-step step="4" stepTitle="App Store Details" data=model action="updateStep" isShowingBody=steps.step4.isCurrent allowToggle=step1Complete showNextStep=false}} +

    We need a bit more info to get your apps ready for the different stores. If you provide us with the details below, we’ll make sure your projects are ready for each of the stores.

    +
    + + {{input name="description" value=model.manifest.description focus-out="updateModel"}} + {{fa-icon "windows"}} + {{fa-icon "mobile-phone"}} + {{fa-icon "android"}} +
    +
    + + {{input name="version" value=model.manifest.version focus-out="updateModel"}} + {{fa-icon "windows"}} + {{fa-icon "mobile-phone"}} + {{fa-icon "android"}} + {{fa-icon "apple"}} +
    +
    + + {{input name="version_code" value=model.manifest.version_code focus-out="updateModel"}} + {{fa-icon "android"}} +
    +
    + + {{input name="build" value=model.manifest.build focus-out="updateModel"}} + {{fa-icon "apple"}} +
    +
    + + {{input name="publisher_display_name" value=model.manifest.publishername focus-out="updateModel"}} + {{fa-icon "windows"}} + {{fa-icon "mobile-phone"}} + {{fa-icon "apple"}} +
    +
    + + {{input name="organization_identifier" value=model.manifest.organizationid focus-out="updateModel"}} + {{fa-icon "apple"}} +
    + {{/generator-step}} + {{#download-archive class="button-holder download-archive" isBuilding=model.isBuilding isEnabled=step1Complete action="buildArchive" archiveLink=model.archiveLink}} +

    {{#link-to 'usage' class="usage-link"}}Now: Learn how to distribute this package across different platforms{{/link-to}}

    + {{/download-archive}} +
diff --git a/app/templates/generator.hbs b/app/templates/generator.hbs index 3f902b3db..253abd2db 100644 --- a/app/templates/generator.hbs +++ b/app/templates/generator.hbs @@ -4,99 +4,11 @@

Generate your App Manifest

ManifoldJS takes simple meta-data about your site and uses that to generate native "hosted" apps for Android, ChromeOS, FirefoxOS, iOS, and Windows.

-
    - {{#generator-step step="1" nextStep="2" stepTitle="Get Started" data=model isShowingBody=steps.step1.isCurrent allowToggle=true action="updateStep"}} -

    Provide your URL or upload your manifest and we'll help fill in the gaps if there are any.

    -
    - - {{input name="siteUrl" type="url" value=model.siteUrl placeholder="Enter a URL"}} -
    -  or -
    - {{#manifest-upload action="updateManifest"}}{{/manifest-upload}} -
    - {{/generator-step}} - {{#generator-step step="2" nextStep="3" stepTitle="Site Data" isShowingBody=steps.step2.isCurrent data=model allowToggle=step1Complete action="updateStep"}} -

    Here are the values we picked up from your site. Update or add any details below.

    -
    - - {{input value=model.manifest.name focus-out="updateModel"}} -
    -
    - - {{input value=model.manifest.short_name focus-out="updateModel"}} -
    -
    - - {{logo-upload action="updateLogos" logos=model.manifest.icons}} -
    -
    - - {{input value=model.manifest.scope focus-out="updateModel"}} -
    -
    - - {{input value=model.manifest.start_url focus-out="updateModel"}} -
    -
    - - {{generator-select content=model.display.names modelProperty="manifest.display" value=model.manifest.display}} -
    -
    - - {{generator-select content=model.orientation.names modelProperty="manifest.orientation" value=model.manifest.orientation}} -
    - {{/generator-step}} - {{#generator-step step="3" nextStep="4" stepTitle="Custom Values" data=model action="updateStep" isShowingBody=steps.step3.isCurrent allowToggle=step1Complete}} -

    Specify custom members to be added to the manifest.

    -
    - {{#member-list action="manageMember" members=customMembers}}{{/member-list}} -
    - {{/generator-step}} - {{#generator-step step="4" stepTitle="App Store Details" data=model action="updateStep" isShowingBody=steps.step4.isCurrent allowToggle=step1Complete showNextStep=false}} -

    We need a bit more info to get your apps ready for the different stores. If you provide us with the details below, we’ll make sure your projects are ready for each of the stores.

    -
    - - {{input name="description" value=model.manifest.description focus-out="updateModel"}} - {{fa-icon "windows"}} - {{fa-icon "mobile-phone"}} - {{fa-icon "android"}} -
    -
    - - {{input name="version" value=model.manifest.version focus-out="updateModel"}} - {{fa-icon "windows"}} - {{fa-icon "mobile-phone"}} - {{fa-icon "android"}} - {{fa-icon "apple"}} -
    -
    - - {{input name="version_code" value=model.manifest.version_code focus-out="updateModel"}} - {{fa-icon "android"}} -
    -
    - - {{input name="build" value=model.manifest.build focus-out="updateModel"}} - {{fa-icon "apple"}} -
    -
    - - {{input name="publisher_display_name" value=model.manifest.publishername focus-out="updateModel"}} - {{fa-icon "windows"}} - {{fa-icon "mobile-phone"}} - {{fa-icon "apple"}} -
    -
    - - {{input name="organization_identifier" value=model.manifest.organizationid focus-out="updateModel"}} - {{fa-icon "apple"}} -
    - {{/generator-step}} - {{#download-archive class="button-holder download-archive" isBuilding=model.isBuilding isEnabled=step1Complete action="buildArchive" archiveLink=model.archiveLink}} -

    {{#link-to 'usage' class="usage-link"}}Now: Learn how to distribute this package across different platforms{{/link-to}}

    - {{/download-archive}} -
+ {{#if step1Complete}} + {{partial "generator-steps"}} + {{else}} + {{partial "generator-start"}} + {{/if}}
@@ -107,36 +19,6 @@ {{#skip-link class="issues-title-suggestions" anchor="#suggestions_list"}}Suggestions ({{model.suggestionsTotal}}){{/skip-link}}

-
- {{formatted-manifest data=model}} -
- {{#if model.hasIssues}} -
- {{#if model.errors}} -
-
Errors ({{model.errorsTotal}} {{pluralize-it "item" model.errorsTotal}})
- {{#each member in model.errors}} - {{partial "issue-list"}} - {{/each}} -
- {{/if}} - {{#if model.warnings}} -
-
Warnings ({{model.warningsTotal}} {{pluralize-it "item" model.warningsTotal}})
- {{#each member in model.warnings}} - {{partial "issue-list"}} - {{/each}} -
- {{/if}} - {{#if model.suggestions}} -
-
Suggestions ({{model.suggestionsTotal}} {{pluralize-it "item" model.suggestionsTotal}})
- {{#each member in model.suggestions}} - {{partial "issue-list"}} - {{/each}} -
- {{/if}} -
- {{/if}} + {{partial "generator-preview"}}
diff --git a/tests/unit/components/generator-start-test.js b/tests/unit/components/generator-start-test.js new file mode 100644 index 000000000..9d3aca697 --- /dev/null +++ b/tests/unit/components/generator-start-test.js @@ -0,0 +1,21 @@ +import { + moduleForComponent, + test +} from 'ember-qunit'; + +moduleForComponent('generator-start', { + // Specify the other units that are required for this test + // needs: ['component:foo', 'helper:bar'] +}); + +test('it renders', function(assert) { + assert.expect(2); + + // Creates the component instance + var component = this.subject(); + assert.equal(component._state, 'preRender'); + + // Renders the component to the page + this.render(); + assert.equal(component._state, 'inDOM'); +}); From 7d31d6b035865cd45233e7c2d19ee8f2ddf508ba Mon Sep 17 00:00:00 2001 From: Jason Date: Wed, 29 Apr 2015 13:40:35 -0500 Subject: [PATCH 2/6] fp box responsiveness Cleaning up the .more-info box on the frontpage across responsive breakpoints. Fixed #124 --- app/styles/_layout/_l-mq.scss | 31 ++++++++++++++++++++++++++- app/styles/_modules/_m-more-info.scss | 4 ++++ 2 files changed, 34 insertions(+), 1 deletion(-) diff --git a/app/styles/_layout/_l-mq.scss b/app/styles/_layout/_l-mq.scss index 062eaac9d..7889aa788 100644 --- a/app/styles/_layout/_l-mq.scss +++ b/app/styles/_layout/_l-mq.scss @@ -80,12 +80,19 @@ .aboutfp h4 { line-height: 2rem; } + .more-info { + padding-bottom: 0; + } .more-info .copy { margin-bottom: 1rem; } - .more-info button { + .more-info .l-box { margin-bottom: 2rem; } + .more-info button, .more-info .btn { + display: inline-block; + margin-bottom: 1rem; + } .whoisusingmjs .sitelogo_yummly, .whoisusingmjs .sitelogo_22tracks, .whoisusingmjs .sitelogo_boostmedia, .whoisusingmjs .sitelogo_nickelodeon { display: block; width: 35%; @@ -157,6 +164,17 @@ font-size: .875rem; line-height: 1.375rem; } + .more-info { + padding: 2rem; + } + .more-info h4 { + font-size: 1.25rem; + line-height: 1.5rem; + } + .more-info .copy { + font-size: .85rem; + line-height: 1.25rem; + } } /* 850px to 899px */ @@ -198,6 +216,10 @@ font-size: .875rem; line-height: 1.375rem; } + .more-info h4 { + font-size: 1.375rem; + line-height: 1.75rem; + } } /* 900px to 1000px */ @@ -239,6 +261,10 @@ font-size: .875rem; line-height: 1.375rem; } + .more-info h4 { + font-size: 1.5rem; + line-height: 1.75rem; + } } /* 1000px to 1099px */ @@ -259,4 +285,7 @@ font-size: 3.125rem; line-height:1.2em; } + .more-info h4 { + line-height: 1.875rem; + } } \ No newline at end of file diff --git a/app/styles/_modules/_m-more-info.scss b/app/styles/_modules/_m-more-info.scss index ded037896..1724634bd 100644 --- a/app/styles/_modules/_m-more-info.scss +++ b/app/styles/_modules/_m-more-info.scss @@ -8,6 +8,10 @@ margin-bottom: 1rem; } +.more-info h4 { + line-height: 1.875rem; +} + .more-info .copy { color:#fff; margin-bottom: 2rem; From 792ab95196763c6970fb96b4a81f03db68919f4e Mon Sep 17 00:00:00 2001 From: Alex Porter Date: Wed, 29 Apr 2015 15:57:58 -0400 Subject: [PATCH 3/6] Cleaning up icon and custom value tables --- app/styles/_modules/_m-generator.scss | 5 +++++ app/templates/components/member-list.hbs | 2 -- 2 files changed, 5 insertions(+), 2 deletions(-) diff --git a/app/styles/_modules/_m-generator.scss b/app/styles/_modules/_m-generator.scss index e5a0af4ea..9c20d8852 100644 --- a/app/styles/_modules/_m-generator.scss +++ b/app/styles/_modules/_m-generator.scss @@ -202,6 +202,10 @@ $form-accent:#999999; margin-top:1.5rem; } +.generator .generator-members { + margin-top:1rem; +} + .generator table { width:66%; float:right; @@ -211,6 +215,7 @@ $form-accent:#999999; .generator th { font-family:$sans-stack-semibold; text-align: center; + border:none; } .generator td { diff --git a/app/templates/components/member-list.hbs b/app/templates/components/member-list.hbs index 2c33b34ea..773b09a23 100644 --- a/app/templates/components/member-list.hbs +++ b/app/templates/components/member-list.hbs @@ -16,7 +16,6 @@ Name - Value @@ -24,7 +23,6 @@ {{#each member in members}} {{member.member_name}} - {{json-stringify member.member_value}} {{/each}} From 51809410ee5c98fb5e41b41c2f027813046699e3 Mon Sep 17 00:00:00 2001 From: Nathan Bingham Date: Wed, 29 Apr 2015 16:15:43 -0400 Subject: [PATCH 4/6] Steps overhaul * Made original first step standalone. Fixes #117. * Added loading indicator to button and updated to read "Get Started" * Modified loading indicator in manifest preview to show during save and build * Add basic validation to Getting Started step. Fixes #126. * Moved logic for formatting from model to controller * Moved logic for uploading manifest from component to model * Updated siteURL input to trigger manifest create when user hits enter. Fixes #82. * Small reorganization to move logic into places that seemed appropriate. * Made alert message red. * Added Start Over button to first step that refreshes the model. --- app/components/download-archive.js | 2 +- app/components/generator-start.js | 22 ++++ app/components/generator-step.js | 2 +- app/components/manifest-upload.js | 1 - app/controllers/generator.js | 36 ++++-- app/models/generator.js | 106 +++++++++--------- app/routes/generator.js | 31 ++--- app/styles/_base/_b-elements.scss | 3 +- app/styles/_modules/_m-generator.scss | 35 +++--- app/templates/components/download-archive.hbs | 4 +- .../components/formatted-manifest.hbs | 2 +- app/templates/components/generator-start.hbs | 36 +++--- app/templates/components/member-list.hbs | 2 +- app/templates/generator-preview.hbs | 2 +- app/templates/generator-start.hbs | 11 -- app/templates/generator-steps.hbs | 9 +- app/templates/generator.hbs | 15 ++- 17 files changed, 177 insertions(+), 142 deletions(-) delete mode 100644 app/templates/generator-start.hbs diff --git a/app/components/download-archive.js b/app/components/download-archive.js index e33740b0c..f438d96d6 100644 --- a/app/components/download-archive.js +++ b/app/components/download-archive.js @@ -7,7 +7,7 @@ export default Ember.Component.extend({ archiveLink: '', initialMessage: 'Generate Package', buildingMessage: 'Building Package…', - tagName: 'li', + tagName: 'span', linkMessage: function() { var message = ''; if(this.isBuilding){ diff --git a/app/components/generator-start.js b/app/components/generator-start.js index 926b61300..d472ef6e9 100644 --- a/app/components/generator-start.js +++ b/app/components/generator-start.js @@ -1,4 +1,26 @@ import Ember from 'ember'; export default Ember.Component.extend({ + siteUrl: null, + file: null, + fileName: null, + message: '', + isSaving: false, + actions:{ + startComplete: function(){ + var siteUrl = this.get('siteUrl'); + var file = this.get('file'); + if(!siteUrl && !file){ + this.set('message', 'Please provide a URL or manifest file.'); + } else { + this.set('message', ''); + this.sendAction('action', siteUrl, file); + } + }, + uploadFile: function(file) { + this.set('file', file); + this.set('fileName', file.name); + this.sendAction('upload', file); + } + } }); diff --git a/app/components/generator-step.js b/app/components/generator-step.js index 47b86c27c..c301ea8af 100644 --- a/app/components/generator-step.js +++ b/app/components/generator-step.js @@ -5,7 +5,7 @@ export default Ember.Component.extend({ nextStep: null, isShowingBody: false, showNextStep: true, - allowToggle: false, + allowToggle: true, tagName: 'li', classNames: ['step'], classNameBindings: ['stepId', 'isEnabled'], diff --git a/app/components/manifest-upload.js b/app/components/manifest-upload.js index 7095032b7..f47876717 100644 --- a/app/components/manifest-upload.js +++ b/app/components/manifest-upload.js @@ -10,7 +10,6 @@ export default Ember.Component.extend({ }, actions:{ uploadManifest: function(file) { - console.log(file); var self = this; var data = this.generateFormData(file); this.$(".upload-file").attr("value", file.name); diff --git a/app/controllers/generator.js b/app/controllers/generator.js index 9c2e82485..b93b24345 100644 --- a/app/controllers/generator.js +++ b/app/controllers/generator.js @@ -2,7 +2,21 @@ import Ember from 'ember'; export default Ember.Controller.extend({ - step1Complete: false, + startReady: false, + startComplete: function(){ + var startReady = this.get('startReady'); + var manifestId = this.get('model.manifestId'); + return startReady && manifestId; + }.property('startReady','model.isSaving', 'model.manifestId'), + formattedManifest: function () { + var model = this.get('model'); + var code = model.get('manifest'); + return new Ember.Handlebars.SafeString('' + JSON.stringify(code, null, 2) + ''); + }.property('model.manifest'), + isProcessing: function() { + var model = this.get('model'); + return model.get('isBuilding') || model.get('isSaving'); + }.property('model.isBuilding', 'model.isSaving'), steps: Ember.Object.create({ step1: { name: 'step1', @@ -15,10 +29,6 @@ export default Ember.Controller.extend({ step3: { name: 'step3', isCurrent: false - }, - step4: { - name: 'step4', - isCurrent: false } }), selectedDisplay: null, @@ -48,23 +58,25 @@ export default Ember.Controller.extend({ }; return data; }); - return customProps; }.property('model'), actions: { updateStep: function(currentStep, nextStep) { if(currentStep) { this.set('steps.step'+currentStep+'.isCurrent', false); - if(currentStep === '1') { - this.set('step1Complete',true); - this.model.create(); - } else { - this.model.save(); - } + this.model.save(); } if(nextStep){ this.set('steps.step'+nextStep+'.isCurrent', true); } + }, + startOver: function(){ + this.set('startReady', false); + return true; + }, + startComplete: function() { + this.set('startReady', true); + return true; } } }); diff --git a/app/models/generator.js b/app/models/generator.js index 9c80a74c8..973ec1ac8 100644 --- a/app/models/generator.js +++ b/app/models/generator.js @@ -38,9 +38,6 @@ export default Ember.Object.extend({ orientation: { names: ['any', 'natural', 'landscape', 'portrait', 'portrait-primary', 'portrait-secondary', 'landscape-primary', 'landscape-secondary'] }, - formattedManifest: function () { - return new Ember.Handlebars.SafeString(""+JSON.stringify(this.get('manifest'), null, ' ')+""); - }.property('manifest'), save: function () { this.set('isSaving', true); if(!this.manifestId) { @@ -49,6 +46,24 @@ export default Ember.Object.extend({ this.update(); } }, + processResult: function(result){ + this.set('manifest', result.content); + this.set('manifestId', result.id); + this.set('manifest.display', 'fullscreen'); + this.set('manifest.orientation', 'any'); + if(!this.get('manifest.icons')) { + this.set('manifest.icons',[]); + } + if(result.suggestions) { + this.set('suggestions', result.suggestions); + } + if(result.warnings) { + this.set('warnings', result.warnings); + } + if(result.errors) { + this.set('errors', result.errors); + } + }, create: function(){ var self = this; ajax({ @@ -58,51 +73,23 @@ export default Ember.Object.extend({ dataType: 'json', contentType: 'application/json; charset=utf-8' }).then(function(result) { - self.set('manifest', result.content); - self.set('manifestId', result.id); - - //Set Defaults - self.set('manifest.display', 'fullscreen'); - self.set('manifest.orientation', 'any'); - - if(!self.get('manifest.icons')) { - self.set('manifest.icons',[]); - } - - if(result.suggestions) { - self.set('suggestions', result.suggestions); - } - - if(result.warnings) { - self.set('warnings', result.warnings); - } - - if(result.errors) { - self.set('errors', result.errors); - } - - self.save(); - + self.processResult(result); self.set('isSaving', false); - }).catch(function(){ self.set('isSaving', false); }); }, update: function(){ - var self = this, - manifest = self.get('manifest'); - + var self = this; + var manifest = self.get('manifest'); manifest = _.omit(manifest,function(prop){ - if(_.isString(prop)){ - return _.isEmpty(prop); - }else if(_.isObject(prop)){ - return _.isUndefined(prop); - } - - return false; + if(_.isString(prop)){ + return _.isEmpty(prop); + }else if(_.isObject(prop)){ + return _.isUndefined(prop); + } + return false; }); - ajax({ url: config.APP.API_URL + '/manifests/' + this.get('manifestId'), type: 'PUT', @@ -110,22 +97,8 @@ export default Ember.Object.extend({ dataType: 'json', contentType: 'application/json; charset=utf-8' }).then(function(result) { - self.set('manifest',result.content); - - if(result.suggestions){ - self.set('suggestions', result.suggestions); - } - - if(result.warnings){ - self.set('warnings', result.warnings); - } - - if(result.errors) { - self.set('errors', result.errors); - } - + self.processResult(result); self.set('isSaving', false); - }).catch(function(){ self.set('isSaving', false); }); @@ -142,5 +115,28 @@ export default Ember.Object.extend({ }).catch(function(){ self.set('isBuilding', false); }); + }, + generateFormData: function(file) { + var formData = new FormData(); + formData.append('file', file); + return formData; + }, + upload: function(file) { + var self = this; + var data = this.generateFormData(file); + this.set('isSaving', true); + ajax({ + url: config.APP.API_URL + '/manifests', + type: 'POST', + data: data, + contentType: false, + processData: false, + cache: false + }).then(function(result) { + self.processResult(result); + self.set('isSaving', false); + }).catch(function(){ + self.set('isSaving', false); + }); } }); diff --git a/app/routes/generator.js b/app/routes/generator.js index ea1364ca9..b9549d3ad 100644 --- a/app/routes/generator.js +++ b/app/routes/generator.js @@ -19,6 +19,15 @@ export default Ember.Route.extend({ Ember.$('footer').removeClass('is-small'); }, actions: { + startComplete: function(siteUrl, file) { + var model = this.modelFor('generator'); + if(siteUrl){ + model.set('siteUrl', siteUrl); + model.save(); + } else if (file) { + model.upload(file); + } + }, updateLogos: function(logos) { var model = this.modelFor('generator'); model.set('manifest.icons',logos); @@ -28,25 +37,6 @@ export default Ember.Route.extend({ var model = this.modelFor('generator'); model.build(); }, - updateManifest: function (result) { - var model = this.modelFor('generator'); - var controller = this.controllerFor('generator'); - controller.set('step1Complete', true); - model.set('manifestId', result.id); - model.set('manifest', result.content); - if(result.content.display === undefined) { - model.set('manifest.display', 'fullscreen'); - } - if(!result.content.orientation) { - model.set('manifest.orientation', 'any'); - } - - if(!model.get('manifest.icons')) { - model.set('manifest.icons',[]); - } - - model.save(); - }, updateModelProperty: function(name, value) { var model = this.modelFor('generator'); model.set('manifest.'+ name, value); @@ -68,6 +58,9 @@ export default Ember.Route.extend({ updateModel: function(){ var model = this.modelFor('generator'); model.save(); + }, + startOver: function(){ + this.refresh(); } } }); diff --git a/app/styles/_base/_b-elements.scss b/app/styles/_base/_b-elements.scss index a5675c9d0..aff42e180 100644 --- a/app/styles/_base/_b-elements.scss +++ b/app/styles/_base/_b-elements.scss @@ -44,6 +44,7 @@ button, .btn { background:$primary-accent; border:none; color:#fff; + margin: 0; padding: .5em 1.125em; border-radius: 5px; line-height:1.2em; @@ -173,4 +174,4 @@ hr { .hidden { display: none; -} \ No newline at end of file +} diff --git a/app/styles/_modules/_m-generator.scss b/app/styles/_modules/_m-generator.scss index e5a0af4ea..d92b419ad 100644 --- a/app/styles/_modules/_m-generator.scss +++ b/app/styles/_modules/_m-generator.scss @@ -263,38 +263,42 @@ $form-accent:#999999; cursor: not-allowed; } -.generator .step1 .url label { +.generator .generator-start { + padding: 0 1rem 1rem 0; +} + +.generator-start .url label { width:8%; text-align:left; } -.generator .step1 .url input { +.generator-start .url input { width:90%; } -.generator .step1 .manifest label { +.generator-start .manifest label { width:28%; text-align: left; } -.generator .step4 label { +.generator .step3 label { width:42%; } -.generator .step4 input { +.generator .step3 input { width:34%; float:left; margin-left:.5rem; } -.generator .step4 .fa { +.generator .step3 .fa { float:left; line-height:2.125rem; margin-left:.4rem; } .generator .fa { - font-size:1.3rem; + font-size:1rem; } .generator .fa-windows { @@ -317,16 +321,16 @@ $form-accent:#999999; color:$primary-accent; } +.alert { + color:$primary-accent; +} + .generator .usage-link { font-size:.8rem; padding:.5rem 0; display:block; } -.generator .step:last-child .next-step { - display:none; -} - //Manifest section .generator .manifest-holder { display: none; @@ -397,16 +401,19 @@ $form-accent:#999999; color: $primary-accent; } -.download-archive .btn { +.download-archive .btn, +.btn.highlighted { cursor: not-allowed; background-color: $secondary-accent - 90; } -.download-archive .btn:hover { +.download-archive .btn:hover, +.generator-start .btn:hover { color: #fff; } -.download-archive .btn.isEnabled { +.download-archive .btn.isEnabled, +.generator-start .btn { cursor: pointer; background-color: $secondary-accent; } diff --git a/app/templates/components/download-archive.hbs b/app/templates/components/download-archive.hbs index 175fc0237..068582f75 100644 --- a/app/templates/components/download-archive.hbs +++ b/app/templates/components/download-archive.hbs @@ -1,6 +1,6 @@ - + {{yield}} diff --git a/app/templates/components/formatted-manifest.hbs b/app/templates/components/formatted-manifest.hbs index 9fb9825fd..367d1bbb7 100644 --- a/app/templates/components/formatted-manifest.hbs +++ b/app/templates/components/formatted-manifest.hbs @@ -1 +1 @@ -{{data.formattedManifest}} \ No newline at end of file +{{data}} diff --git a/app/templates/components/generator-start.hbs b/app/templates/components/generator-start.hbs index f0a0f0ee8..3c88f74d1 100644 --- a/app/templates/components/generator-start.hbs +++ b/app/templates/components/generator-start.hbs @@ -1,15 +1,25 @@ -{{#generator-start data=model action="updateStep"}} -
-
-

Site Data

-
-
- {{yield}} -
- +
+

Provide a URL or manifest

+
+
+

Provide your URL or upload your manifest and we'll help fill in the gaps if there are any.

+ {{#if message}}

{{fa-icon "exclamation"}} {{message}}

{{/if}} +
+ + {{input name="siteUrl" type="url" value=siteUrl placeholder="Enter a URL" action="startComplete"}} +
+  or +
+ + +
+ Browse + {{file-input class="upload" action="uploadFile"}}
-
-{{/generator-start}} +
+ +
+
+

{{memberAlert}}

{{input id="member_name" name="member_name" value=member_name}} @@ -7,7 +8,6 @@ {{textarea id="member_value" name="member_value" value=member_value}}
-

{{memberAlert}}

diff --git a/app/templates/generator-preview.hbs b/app/templates/generator-preview.hbs index 29fd51f2b..c45c49d30 100644 --- a/app/templates/generator-preview.hbs +++ b/app/templates/generator-preview.hbs @@ -1,5 +1,5 @@
- {{formatted-manifest data=model}} + {{formatted-manifest data=formattedManifest}}
{{#if model.hasIssues}}
diff --git a/app/templates/generator-start.hbs b/app/templates/generator-start.hbs deleted file mode 100644 index ee58fa9a8..000000000 --- a/app/templates/generator-start.hbs +++ /dev/null @@ -1,11 +0,0 @@ -{{#generator-start action="updateStep"}} -

Provide your URL or upload your manifest and we'll help fill in the gaps if there are any.

-
- - {{input name="siteUrl" type="url" value=model.siteUrl placeholder="Enter a URL"}} -
- or -
- {{#manifest-upload action="updateManifest"}}{{/manifest-upload}} -
-{{/generator-start}} diff --git a/app/templates/generator-steps.hbs b/app/templates/generator-steps.hbs index 1b8d5feed..4075c1334 100644 --- a/app/templates/generator-steps.hbs +++ b/app/templates/generator-steps.hbs @@ -1,5 +1,5 @@
    - {{#generator-step step="2" nextStep="3" stepTitle="Site Data" isShowingBody=steps.step2.isCurrent data=model allowToggle=step1Complete action="updateStep"}} + {{#generator-step step="1" nextStep="2" stepTitle="Site Data" isShowingBody=steps.step1.isCurrent data=model action="updateStep"}}

    Here are the values we picked up from your site. Update or add any details below.

    @@ -30,13 +30,13 @@ {{generator-select content=model.orientation.names modelProperty="manifest.orientation" value=model.manifest.orientation}}
    {{/generator-step}} - {{#generator-step step="3" nextStep="4" stepTitle="Custom Values" data=model action="updateStep" isShowingBody=steps.step3.isCurrent allowToggle=step1Complete}} + {{#generator-step step="2" nextStep="3" stepTitle="Custom Values" data=model action="updateStep"isShowingBody=steps.step2.isCurrent }}

    Specify custom members to be added to the manifest.

    {{#member-list action="manageMember" members=customMembers}}{{/member-list}}
    {{/generator-step}} - {{#generator-step step="4" stepTitle="App Store Details" data=model action="updateStep" isShowingBody=steps.step4.isCurrent allowToggle=step1Complete showNextStep=false}} + {{#generator-step step="3" stepTitle="App Store Details" data=model action="updateStep" isShowingBody=steps.step3.isCurrent showNextStep=false}}

    We need a bit more info to get your apps ready for the different stores. If you provide us with the details below, we’ll make sure your projects are ready for each of the stores.

    @@ -76,7 +76,4 @@ {{fa-icon "apple"}}
    {{/generator-step}} - {{#download-archive class="button-holder download-archive" isBuilding=model.isBuilding isEnabled=step1Complete action="buildArchive" archiveLink=model.archiveLink}} -

    {{#link-to 'usage' class="usage-link"}}Now: Learn how to distribute this package across different platforms{{/link-to}}

    - {{/download-archive}}
diff --git a/app/templates/generator.hbs b/app/templates/generator.hbs index 253abd2db..d11152a08 100644 --- a/app/templates/generator.hbs +++ b/app/templates/generator.hbs @@ -4,15 +4,24 @@

Generate your App Manifest

ManifoldJS takes simple meta-data about your site and uses that to generate native "hosted" apps for Android, ChromeOS, FirefoxOS, iOS, and Windows.

- {{#if step1Complete}} + {{#if startComplete}} {{partial "generator-steps"}} +
+
+

+ {{#download-archive class="button-holder download-archive" isBuilding=model.isBuilding action="buildArchive" archiveLink=model.archiveLink}}{{/download-archive}} + +

+

{{#link-to 'usage' class="usage-link"}}Now: Learn how to distribute this package across different platforms{{/link-to}}

+
+
{{else}} - {{partial "generator-start"}} + {{#generator-start isSaving=model.isSaving action="startComplete" class="generator-start step-wrapper step"}}{{/generator-start}} {{/if}}
-

W3C Manifest{{#if model.isSaving}} {{fa-icon "circle-o-notch fa-spin"}}{{/if}}

+

W3C Manifest{{#if isProcessing}} {{fa-icon "circle-o-notch fa-spin"}}{{/if}}

{{#skip-link class="issues-title-errors" anchor="#errors_list"}}Errors ({{model.errorsTotal}}){{/skip-link}}, {{#skip-link class="issues-title-warnings" anchor="#warnings_list"}}Warnings ({{model.warningsTotal}}){{/skip-link}}, From c58da30ab096f7712068d0aeebe930135c4148ab Mon Sep 17 00:00:00 2001 From: Alex Porter Date: Wed, 29 Apr 2015 16:23:28 -0400 Subject: [PATCH 5/6] Removing console log from manifest-upload component, Making usage link at bottom of generator not show up until download is triggered and making it more prominant --- app/components/manifest-upload.js | 1 - app/controllers/generator.js | 1 + app/routes/generator.js | 2 ++ app/styles/_modules/_m-generator.scss | 12 +++++++++++- app/templates/generator.hbs | 2 +- 5 files changed, 15 insertions(+), 3 deletions(-) diff --git a/app/components/manifest-upload.js b/app/components/manifest-upload.js index 7095032b7..f47876717 100644 --- a/app/components/manifest-upload.js +++ b/app/components/manifest-upload.js @@ -10,7 +10,6 @@ export default Ember.Component.extend({ }, actions:{ uploadManifest: function(file) { - console.log(file); var self = this; var data = this.generateFormData(file); this.$(".upload-file").attr("value", file.name); diff --git a/app/controllers/generator.js b/app/controllers/generator.js index c411105c1..ddeae28bf 100644 --- a/app/controllers/generator.js +++ b/app/controllers/generator.js @@ -23,6 +23,7 @@ export default Ember.Controller.extend({ }), selectedDisplay: null, selectedOrientation: null, + buildReady: false, valueOrEmptyString: function (value) { if(value) { return value; diff --git a/app/routes/generator.js b/app/routes/generator.js index 900f5d976..e2dda9634 100644 --- a/app/routes/generator.js +++ b/app/routes/generator.js @@ -30,6 +30,8 @@ export default Ember.Route.extend({ model.build(); }, downloadArchive: function(archiveLink){ + var controller = this.controllerFor('generator'); + controller.set('buildReady', true); ga('send', 'event', 'item', 'click', 'generator-build-download'); window.location.href = archiveLink; }, diff --git a/app/styles/_modules/_m-generator.scss b/app/styles/_modules/_m-generator.scss index 9c20d8852..ff193eda1 100644 --- a/app/styles/_modules/_m-generator.scss +++ b/app/styles/_modules/_m-generator.scss @@ -322,10 +322,20 @@ $form-accent:#999999; color:$primary-accent; } -.generator .usage-link { +.generator .usage-link.btn { font-size:.8rem; padding:.5rem 0; display:block; + background:$tertiary-accent; + width:100%; + color:white; + text-align: center; + cursor:pointer; + display:none; +} + +.generator .usage-link.btn.show { + display:block; } .generator .step:last-child .next-step { diff --git a/app/templates/generator.hbs b/app/templates/generator.hbs index 798c82e7f..9ee3be327 100644 --- a/app/templates/generator.hbs +++ b/app/templates/generator.hbs @@ -94,7 +94,7 @@

{{/generator-step}} {{#download-archive class="button-holder download-archive" isBuilding=model.isBuilding isEnabled=step1Complete action="buildArchive" download="downloadArchive" archiveLink=model.archiveLink}} -

{{#link-to 'deploy' class="usage-link"}}Now: Learn how to distribute this package across different platforms{{/link-to}}

+

{{#link-to 'deploy' classNameBindings=":usage-link :btn buildReady:show"}}Now: Learn how to distribute this package across different platforms{{/link-to}}

{{/download-archive}}
From 3cc6a097d5c0d4f200bb95fa3e3fa4fe4879e9c1 Mon Sep 17 00:00:00 2001 From: ryanbillingsley Date: Wed, 29 Apr 2015 18:28:58 -0400 Subject: [PATCH 6/6] Adding pass back to prod --- web.prod.config | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/web.prod.config b/web.prod.config index e5493c384..8843403b5 100644 --- a/web.prod.config +++ b/web.prod.config @@ -1,6 +1,17 @@ + +
+ + + + + + + + + @@ -86,7 +97,7 @@ - +