eee-c / ice-code-editor

Combination code editor (ACE) and Preview for quick feedback prototyping
Other
118 stars 31 forks source link

Refactor: Need a Project class #51

Open eee-c opened 11 years ago

eee-c commented 11 years ago

Currently Store returns a HashMap that includes: filename, code, lineNumber, updated_at, and created_at attributes. This means that updates need to be aware of each of these attributes, which is getting hard to do.

Known problem areas:

eee-c commented 11 years ago

Made a lame attempt at starting this in 62d5376

influx6 commented 11 years ago

Will have a crack at it

influx6 commented 11 years ago

Ya sorry, for ticket jumping, the suggestion for the reactor was on the idea that it was a problem of managing the changes of those items like number,i didnt think it was on the basis of storage, that said, what exactly is going on here,are you storing each changes of a code,in local storage for instant access and update as i am understanding it or is there something unique here

eee-c commented 11 years ago

Yup, every time a project is updated, it is auto-saved in in localStorage via lib/store.dart. There is no history stored, just the most recent version of the project.

influx6 commented 11 years ago

So where exactly does the major problem coming in: 1: in synching to localStorage? 2: syncing out of it?

influx6 commented 11 years ago

also am getting this when starting ice: Could not find asset ice_code_editor|web. On the log it complains cant find favicon

Am in master branch!

eee-c commented 11 years ago

I'm not sure what you mean by starting ICE: the web server or loading it in the browser? Either way, those seem ignorable.

The problem that this ticket needs to solve is storing projects (update or create). Currently any place in the code that needs to store project data needs to know the internal HashMap structure that is used in Store.dart. Instead, code that needs to update/create a project should instantiate a Project class which encapsulates the current fields. Given a Project class, the Store should be able to easily update & create records in localStorage.

influx6 commented 11 years ago

I meant when I start the server and load up ice does not load but gives me the error above in the log

eee-c commented 11 years ago

Ignore the favicon 404. That's definitely not a problem.

The ice_code_editor|web error would seem to indicate that there is no web directory. I am at a loss to explain how that could happen. Do you have the latest master branch from this repo? Is there a web directory in there?

That's really strange...

influx6 commented 11 years ago

Indeed there is a Web folder but still no luck On Sep 19, 2013 12:45 AM, "Chris Strom" notifications@github.com wrote:

Ignore the favicon 404. That's definitely not a problem.

The ice_code_editor|web error would seem to indicate that there is no webdirectory. I am at a loss to explain how that could happen. Do you have the latest master branch from this repo? Is there a web directory in there?

That's really strange...

— Reply to this email directly or view it on GitHubhttps://github.com/eee-c/ice-code-editor/issues/51#issuecomment-24708222 .

eee-c commented 11 years ago

Are you using the URL from the README (http://localhost:8080/full.html)?

influx6 commented 11 years ago

I tried it but i get a plain page,no ui loading,nothing just plain chrome white space

eee-c commented 11 years ago

You're loading it with Dartium, right (not Chrome)?

influx6 commented 11 years ago

ok i am officially a airhead!

influx6 commented 11 years ago

ok, still same plain state, even latest dartium is just blank.

Update: got it working!

influx6 commented 11 years ago

Hey bro,come to think of it,why are you using an array for the storage of the projects,wont it be better to have stored them in this format: { proj1: {} proj2:{} ..... }

But no problem i can work with the array,but might reduce alot of problems for ya if you use a map,but i guess you have your reasons

influx6 commented 11 years ago

Here his my idea towards solving the current problem,the current code is abit coupled, especially with the store,what i imagine,should be two things, which am experimenting with in alex branch on my fork of ice,is 3 added objects:

ProjectElement - a class that attaches the page(body,textarea) of the current edited file to it,when changes occurs it generates the necessary changes and sends them off to a stream,now to simplify the situation i figured why not delegate a few things to DOM like lineNumber,created_at details i.e we add this details to the element as attributes,eg ,so when we change lines,that gets updated. So as i said once the file changes with new code,a onchange is naturally made,which then propagates the lineNumber,createdAt,updatedAt(a date thats generated),code(from the element) as individual stream packets

Project - a class that basically attaches to the ProjectElement, attaches to the stream and handles the synchronisation between local storage and on page source. Has a stream pipe(a multi-broadcaster of events) which listens to all packages and sends off to all listeners but the listeners here individually handle a piece of that packet i.e one listener only handles updating the created_at packet,another the code packet, so incase any of the package is unnecessary,we simple unsubscribe and no one cares anymore,like the created_at packet which is created but never changes after.

ProjectManager - handles grabbing the source from localStorage,generating the appropriate project and project element for each files in the array.

influx6 commented 11 years ago

I unfortunately need to hit the hay,so please review the code,i know i made a few error in the dart:html usage,but even if u dont use the code,it should give you the idea of what am saying, that i.e

Project manager loads up the data from localstorage,generates the li for the item in the list,the render page for the element and create the project object,which then takes the json data,adds the necessity to the project element object,if projectelement changes in anyway each individual item gets update,so no more keeping track of all elements everytime,once updates reaches project,it updates project element and if project element changes it sends update to project i.e dom updates project, project updates dom in case of reloads or refresh. Now why project is set to update individual items when doing its own updating is because what if we wish like i said to not update an item anymore,if it was set to get the update n update the item appropriate we will have to fix that in code,but here all u need to do is get the project object,get the listener and close it and that particular item does not get updated even if it gets sent from the stream.

Note: i used a few of my personal library and a custom stream class i built,feel free to rewrite it if u dont like them..

Cheers Alex. God bless. Am out zzzZZZZ

influx6 commented 11 years ago

Code is here: https://github.com/influx6/ice-code-editor/blob/alex/lib/full/project.dart Diff: https://github.com/influx6/ice-code-editor/commit/6a4382211d6a9730a0a0a682ad44f0e66916a849

influx6 commented 11 years ago

Hello ,are we alive? Will need your help integrating the code if you sign off on it,cause Store or a few things might change and you are best to know how best you feel it should be added

eee-c commented 11 years ago

Yup, I'm alive. Sheesh, I sleep and work from time-to-time :P

But seriously, thanks for the code...

So I think I better understand where you're going with this. I'm not sure I'm quite sold on either the stream or the binding to elements, but I'm not diametrically opposed to either. I think it'd be best to see some tests next -- to make sure that the existing tests (and functionality described by them) still work and to give me a better idea how it would feel to use this API.

To answer an earlier question, the reason that the storage is a list of hashes is that the projects need to retain their order—last updated, first out and any time an older project is opened, it goes to the top of the list. Back in the JS days, the array kept the order. In the current implementation, the last_updated attribute can be used to sort. Eventually, the list can go away, but let's not change too much all at once.

Tests are the next step. I don't need 100% coverage, but it's got to be well-tested. And like I said, tests help me to understand how the API will work. I've got to run out again, but I should be around a little more often tomorrow.

Oh yeah, and thanks again for giving it a shot! I really appreciate it. Definite possibilities here :)

influx6 commented 11 years ago

OK , you welcome;) Also as to the streams ,have been going through the ideas and coming to understand flow based programming that concentrates on the data and how it flows, it sees data as small packets of streams which allows quite alot of flexibilty,and that is why i applied it here,it requires a generally more complicated code of keeping track of the changes,the type or element that change,but with streams of data/events we can just easily get the change,update the change without having to get the object, search for the element and apply the change,here its a stream of change that in themselves manage their own change event. which makes sense, consider for example if the older structure of maps where you get a new map on updating the change ,for example if its only the lineNumber that change, we would still need to grab the map in store for that project and then update line number but with streams that individually self managed by the project and element, you could say we create a 2way event bindig for the elements, that is line number, code, which allows just sinking down the changes to the stream and that automatically updates the individual elements , so that only when storing in localstorage will there be a need to get the map managed by a project object and store

The reason for the project element was to have a means of hooking up to the Dom so we can both watch and affect changes but more importantly it allows somewhat of a better management of each project file, from at least what I can see , when another project file is clicked , the previous project file is saved and then replaced in the Dom by the new/selected project file but this way we can have abit more self concrete structure for the project file which in a long run reduces abjt of complexity like we can implement the hide and show to the projectElement rather than the current method ,but this is my view it might not always be the best

also as to attaching the element to the project object is not necessary infact I plan on refactoring so that we only supply the stream object which generally gets the changes from the Dom element the project element is holding on to,this allows a flexibility of changing the views of a project without much hassle

also to the sorting since we indeed are in effect listening to streams we can have the project manager do two things firstly it binds into the individual project listeners or better yet only on the listener that's watching an element from a project object and second create an array for the updated at sorting and simply when a project gets the updated at event we get notified by the listener and then find the project if its in the array and move it up to top position or add it up to the top position ,though this idea is still a thought I need to test it out as a sorting method to see if its effective

as to the testing the only thing that forges me out is getting the code integrated into the Dom without any drastic change to existing code , but am sure it won't be much of a hassle

influx6 commented 11 years ago

we have a bug,dart complains it can not load dart:html, that is a problem if there is ever one,it occurs in tests/ice_test.dart

eee-c commented 11 years ago

The dart:html library is only available in a browser context, not the server-side script VM. In other words, you can't use the dart command to run a script that contains the dart:html library.

All is not lost, however, the content_shell command which comes with the SDK and dartium can create a browser context from the command line. Check out the test/test_runner.sh to see how that works.

influx6 commented 11 years ago

If I may it is abit moral breaking to find one can't run dart directly in the browser was shocked to see the js_interop being the means of communication. That said I think it will be pretty nice ifII could get a playground to work on, where I can see the code am working on take effect, and am abit unsure how to go about that, and the only ideaII have is if another route can be created where I Ican play around with the code visually atleast or maybe better yet I could spawn a independent project that uses the code visually and then you can look at that and see how best to integrate it because I have no clue out to do it. :)

influx6 commented 11 years ago

Hey bro,have not heard fromyou, hope you ok

influx6 commented 11 years ago

Hey bro, have not heard from you in a real while, i do hope all is well, sorry i haven't updated the code much,just moved my dev to a samsung galaxy tab 10.1 so taken abit to reset myself into it.

eee-c commented 11 years ago

I'm sorry -- I didn't realize you were waiting on a reply from me. Are you?

FWIW, js-interop is only used to allow the Dart code to talk to ace. You can run the code directly in Dartium, which is Chrome with the Dart VM built-in. You can run the tests either in Dartium or with the test/test_runner.sh command from the command-line. Does that help?

influx6 commented 11 years ago

In a way yes I was, oh ODD I TRIED calling the objects of the code but still no luck will try once again, sure it did help, take care then, thanks

influx6 commented 11 years ago

Hey man i don't know how much apology i need to give, Right now my laptop is on the frits, and i unfortunately gambled on the possibility of moving development to a tablet,so i bought the Samsung galaxy tab 10.1, only to realise after a few search there is no way to dev with dart on even a chrooted ubuntu and that sucks ,which is the reason i havne't gotten much code out to you,it hurts and sucks, and as it is ,i might end up porting most of my library's back to JS if i cant even get things working. Anyway hope you good, if i can't fully test most of the code will try and see what i can do. Thanks cheers.

influx6 commented 11 years ago

Also i tried getting my hands on the ProjectManager object in the browser console,but no luck,don't know if its possible to test it that way ?

eee-c commented 11 years ago

No worries. I'm still stuck on waiting for the updated KeyEvent object in core Dart before I can make significant progress on this myself.

AFAIK it is not possible to access ProjectManager or any other Dart code in the console. Sadly, the console is still just a JavaScript console—even in Dartium. It may be possible to hook that up with the Dart Editor, but I am unsure about that.

influx6 commented 11 years ago

Thanks man, indeed that's a real shame, am having to port some code back to js,since i cnt do much dart coding without my laptop, will contribute but will need you to test though,i do plan on providing notes and examples. Feels bad but need to keep dev'ing and dart is still limited, and i can't afford the bills to fix the apple laptop or the internet bills for constant online working since my last option was to get a online server or vps with ssh to do my dart work on. Anyway thanks.

influx6 commented 11 years ago

Thanks man, indeed that's a real shame, am having to port some code back to js,since i cnt do much dart coding without my laptop, will contribute but will need you to test though,i do plan on providing notes and examples. Feels bad but need to keep dev'ing and dart is still limited, and i can't afford the bills to fix the apple laptop or the internet bills for constant online working since my last option was to get a online server or vps with ssh to do my dart work on. Anyway thanks.