Event details page

[chinnichaitanya]

This page will show the details of each event.

Put dummy data.

Actually the data will be got through $http calls. So need to make all things modular so that we can use ng-repeat and iterate.

Refer 12.jpg in the drive folder.

[chinnichaitanya]

Any updates ?

[sasivarnan619]

I am starting the work today. I was out of station.

[sasivarnan619]

finished with the left menu bar and the content part

[sasivarnan619]

so far what i did

[sasivarnan619]

is it fine. i did 12.jpg

On Wed, Jun 10, 2015 at 6:10 PM, Sasi Varnan sasivarnan619@gmail.com wrote:

so far what i did

On Wed, Jun 10, 2015 at 10:19 AM, Sasi Varnan sasivarnan619@gmail.com wrote:

I am starting the work today. I was out of station.

[sasivarnan619]

[chinnichaitanya]

Push it into your personal folder and I'll tell if any changes are to be made.

[sasivarnan619]

chinni i pushed it.

On Thu, Jun 11, 2015 at 7:39 PM, Chinni Chaitanya notifications@github.com wrote:

Push it into your personal folder and I'll tell if any changes are to be made.

— Reply to this email directly or view it on GitHub https://github.com/ShaastraWebops/Frontend-2016/issues/5#issuecomment-111148609 .

[sasivarnan619]

Chinni i pushed 12.jpg page in my personal file. Check it

[chinnichaitanya]

There are a few changes to be made.

• [x] Remove the top navbar you have made. It is a separate component and we need to import it into our html file.
• [x] Put all your styles in a separate css file.
• [x] Remove the CDN links for bootstrap and also the <meta> tags. Use the bootstrap files in the bower_components folder.
• [x] Make it responsive. Right now in smaller screens, it is not looking good. In small screens, hide the right navbar and put a small arrow button and on clicking it, you should open the navbar.
• [x] Don't use many divs for putting the content. You have to place the content in only one <div>. You should make it look good with that because the content is not static but dynamic.
• [x] Don't use inline styles. Put everything in css file.
• [ ] Integrate AngularJS to your code. Put a controller and put the raw data in it. That is the exact format you will get the data from the $http calls. Use the same data and populate the html file. Don't directly put the content in your html file. Remember you can't use bootstrap.min.js with AngularJS.
• [ ] Preferably don't use <br> tags.

After fixing those, push and comment here. Also tick those check boxes after you complete each one of them.

[sasivarnan619]

i have done changes for small screen. i gave link to bower_components decreased the divs for content(only one div) til i am not done with angularjs part i am going out till 18th so i will do it on 19th

[sasivarnan619]

just check the last update i seperated css from html

[chinnichaitanya]

Again,

• [x] Remove the top navbar. Remove that chinni and search
• [ ] Why are you adding a unique style class ( ef, ps, faq etc.,) to each tab ? We don't know before hand how many tabs will be there so we can't put unique class for each tab.
• [x] Regarding the AngularJS part, do something like below in the controller.

var tabs = [{ 'name': 'tab one name', 'data': 'tab one data' }, { 'name': 'tab two name', 'data': 'tab two data' }, ... ];

Then you can put have ng-repeat in your html file and repeat for all the tabs. On clicking each tab, show the corresponding data. Don't put static data in the html file.

• [x] You still didn't remove <meta> tag in the html file.

I'm writing these issues again. These are mentioned in the previous comment and you haven't completed them. Also I've told you to tick the check boxes after completing each one. You didn't do that also.

[sasivarnan619]

the classes for tabs are for the jqery effects on hover.

[chinnichaitanya]

Right but you cannot put specific unique class to each tab.

[sasivarnan619]

how to put the correct data on clicking the respective tab. check the last update.

[chinnichaitanya]

So in each object, you will have a field called _id which will be unique. So once you use ng-repeat, you need to run a function using ng-click and populate the respective content by having a search through that array using the _id field. For searching through that array with respect to _id, try to use plugins like lodash.

[sasivarnan619]

Ok i will check it out.

[sasivarnan619]

I put the correct data on clicking the respective tab

[chinnichaitanya]

Now what about those classes ef, ps, faq etc ?

[sasivarnan619]

Ya those are for jquery effects.

[chinnichaitanya]

Why do you need separate JQuery effects ? It is for page transition ?

[sasivarnan619]

For tabs. On hower effects

[sasivarnan619]

I will try without using many classes

[chinnichaitanya]

See the thing is you don't know how many tabs you have before hand. So you got to use ng-repeat. There you cannot put unique classes for each tab right ?

[sasivarnan619]

Ok

[sasivarnan619]

i used ng-repeat. Using that i gave jquery effects. till only the data part is left

[sasivarnan619]

chinni check the last update. Classes are given on index numbers.

On Sun, Jun 21, 2015 at 6:34 PM, Sasi Varnan sasivarnan619@gmail.com wrote:

Check the last update. I used ng repeat.

[chinnichaitanya]

@sasivarnan619 Put the JavaScript code in a separate js file. Don't mix it with the html file.

[sasivarnan619]

js code is in seperate files now.

[chinnichaitanya]

@sasivarnan619 Check (this)[https://github.com/ShaastraWebops/Frontend-2016/commit/e8ea72530f4d47dbcc1ad4cf151154684174fd4b] comment.

[sasivarnan619]

If we give a common class then the color will change for all tabs at same time if we are over any one of them.

[chinnichaitanya]

@sasivarnan619 No. It is not that way. Check once.

[chinnichaitanya]

@sasivarnan619 Where is the progress ??

[sasivarnan619]

completed. when is the meeting tomorrow.

[sasivarnan619]

it is done. i added the sponsers down.

On Mon, Jul 27, 2015 at 8:00 PM, Chinni Chaitanya notifications@github.com wrote:

@sasivarnan619 https://github.com/sasivarnan619 Where is the progress ??

— Reply to this email directly or view it on GitHub https://github.com/ShaastraWebops/Frontend-2016/issues/5#issuecomment-125225829 .