{"id":17482856,"url":"https://github.com/creationix/topcloud","last_synced_at":"2025-04-10T02:43:45.240Z","repository":{"id":641350,"uuid":"283264","full_name":"creationix/topcloud","owner":"creationix","description":"High level application framework for Javascript (built on top of jquery-haml and modeled somewhat after SproutCore)","archived":false,"fork":false,"pushed_at":"2009-10-13T22:40:37.000Z","size":210,"stargazers_count":20,"open_issues_count":0,"forks_count":1,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-03-24T04:14:03.522Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/creationix.png","metadata":{"files":{"readme":"README.markdown","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2009-08-20T17:47:59.000Z","updated_at":"2023-11-10T02:30:58.000Z","dependencies_parsed_at":"2022-07-07T14:31:11.344Z","dependency_job_id":null,"html_url":"https://github.com/creationix/topcloud","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/creationix%2Ftopcloud","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/creationix%2Ftopcloud/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/creationix%2Ftopcloud/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/creationix%2Ftopcloud/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/creationix","download_url":"https://codeload.github.com/creationix/topcloud/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248145393,"owners_count":21055118,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-18T23:46:16.005Z","updated_at":"2025-04-10T02:43:45.202Z","avatar_url":"https://github.com/creationix.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Top Cloud\n\nHigh level application framework for Javascript (built on top of haml-js and modeled somewhat after SproutCore)\n\nI gave a 30 minute presentation to my local Ruby users group about TopCloud and related technologies.  You can view it on [vimeo][]\n\nThis framework is very much a work in progress.  I'm giving a presentation on it at the local Dallas Ruby Group for October's meeting.  I'll post a recording of the presentation if possible.\n\nThe source code to my example site is at the node-topcloud-chat repo.\n\nTop Cloud is a MVC framework for the browser, much in spirit of SproutCore, but made to be embedded inside existing legacy apps.\n\nTop Cloud uses the haml-js project for the dom-building aspect.\n\n## Model\n\nTopCloud has databinding at the controller level.  The bound variables can optionally use proxy objects that can in turn proxy to model classes on the server side if desired.\n\n## View\n\nThis is an example View.  This is written in the TopCloud interface language.  There is a TextMate bundle for adding highlighting support included.\n\n    Dialog width: 400, height: 250\n    \tminWidth: 300\n    \tminHeight: 200\n    \ttitle: \"Code Samples\"\n\t\n    \tPanel left: 0, bottom: 0, right: 0, height: 40\n    \t\tborderTop: 1\n\t\n    \t\tButton left: 10, top: 10, width: 65, height: 20\n    \t\t\tvalue: \"Cancel\"\n    \t\t\ticon: \"cancel\"\n    \t\t\tclick: @cancel\n    \t\tButton right: 10, top: 10, width: 68, height: 20\n    \t\t\tvalue: \"Submit\"\n    \t\t\ticon: \"check\"\n    \t\t\tclick: @submit\n    \n    \tDropDown left: 10, top: 10, right: 10, height: 20\n    \t\tvalue: \"ruby\"\n    \t\toptions: {ruby: \"Ruby\", \"javascript\": \"Javascript\", \"python\": \"Python\"}\n    \n    \tTextEntry left: 10, top: 40, right: 10, bottom: 50\n    \t\tvalue: @remote_text\n    \t\tmultiline: true\n\n\n## Controller\n\nControllers are javascript objects that are run in the browser.  They provide the code behind the views and hold all interaction logic.\n\nHere is an example controller:\n\n    TC.defineController(\"Dialogs.CodeSamples\", function (lang) {\n    \n    \tthis.bindData(\"remote_text\", {\n    \t\tproxy: new TextSource()\n    \t});\n\t\n    \tthis.cancel = function (button) {\n    \t\tbutton.parent.parent.close();\n    \t};\n    \n    \tthis.submit = function (button) {\n    \t\talert(\"TODO: Do some action\");\n    \t\tbutton.parent.parent.close();\n    \t};\n\t\n    });\n\n[vimeo]: http://www.vimeo.com/6940290","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcreationix%2Ftopcloud","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcreationix%2Ftopcloud","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcreationix%2Ftopcloud/lists"}