Working with Garber-Irish in Rails: Streamlining Administration and Keeping Code DRY

I am currently implementing the innovative garber-irish technique to organize my JavaScript files.

Here's my issue: I have a Model (let's call it Item) with an init function located in app/assets/javascripts/item/item.js

For example:

MYAPP.items = {
  init: function() {
    alert("do something");
  };
};

Now, let's say I have an admin section in my application, and I prefer not to include the admin JavaScript in the main bundle. So, I have a separate system_administration.js file that requires the regular javascripts/item/item.js mentioned above, but also requires a javascripts/admin/item/item.js like this:

MYAPP.items = {
  init: function() {
    alert("also do this");
  };
};

I aim to load both the common JavaScript files and the administration-specific ones - essentially combining the two init functions and maintaining DRY (Don't Repeat Yourself) principles.

Queries:

  1. Is this a practical approach?
  2. Is it achievable?

Answer №1

Seeking feedback - I've made a temporary change to the init function by adding an "admin_" prefix:

UTIL.exec( "common" );
UTIL.exec( controller );
UTIL.exec( "admin_"+controller );
UTIL.exec( controller, action );
UTIL.exec( "admin_"+controller, action );

For the admin javascript files, I've added in the admin prefix as well:

MYAPP.admin_items = {
  init: function() {

....

It might not be the prettiest solution, but I believe it will suffice until a better suggestion comes along!

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Importing modules from another module in Node.js

I'm currently working on a nodejs app that consists of two files, index.js and ping.js. The main functionality is in index.js which handles routing and other tasks, while ping.js utilizes phantomJS. In my index.js file, I have the following line of co ...

Functionality not functioning within Shadow DOM

After creating and exporting an Angular Element as a single script tag (user-poll.js), using the element on a host site is simple. Just include the following two lines: <user-poll></user-poll> <script src="path/to/user-poll.js"></sc ...

Using Lodash library to iterate through a collection using the _.forEach method

Currently, I am attempting to implement the lodash forEach method within a structure where a nested function is being used to call a mongo database. var jobs = []; _.forEach(ids, function(id) { JobRequest.findByJobId(id, function(err, result) { ...

Enforce the splicing of the ng-repeat array with the utilization of track by

Our app incorporates a task list that can potentially grow to a substantial size. The main task list is accompanied by a sidebar, where selected tasks can be edited using a different controller (TasksSidebarCtrl instead of TasksCtrl which handles the list ...

Is there a way to use JavaScript to determine if GEARS is already installed on a system?

Does the existence of windows.gears not equal to undefined or what??? I am simply looking to use javascript to determine true or false based on whether the person has google Gears installed. ...

What could have caused the lack of output from the render function?

I've been working on generating my navigation drawer from JSON data and have everything functioning using components. Now, I'm in the process of refactoring to functions for better performance and to enhance my knowledge of React and JavaScript. ...

Ways to reach state / methods outside of a React component

Implementing the strategy design pattern to dynamically change how mouse events are handled in a react component is my current task. Here's what my component looks like: class PathfindingVisualizer extends React.Component { constructor(props) { ...

After the element has been inserted, dom.byId will give you an undefined response

I have encountered an issue with a function that adds a div as a child to a dijit/layout/contentpane. The problem arises when I attempt to reference this div using dom.byId after adding it to the content pane. The function is triggered by a click event on ...

Trouble with Mocha async hooks execution?

I keep encountering the issue of receiving 'undefined' for the page in this setup. It appears that none of Mocha's hooks are being executed. I've attempted adding async to the describe at the top level, used done statements, and even tr ...

Developing a feature to organize content by categories and implement a functionality to load more data efficiently using NodeJS routes

I am looking to develop a system that limits the number of displayed posts and includes a "load more" button to retrieve additional posts from where the limit was previously reached. Additionally, I want to implement the functionality to change the orderin ...

The request was blocked due to cross-origin restrictions as the CORS header 'Access-Control-Allow-Origin' was found to be missing

I encountered an error while working with AngularJS. The error message reads: Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at ... (Reason: CORS header 'Access-Control-Allow-Origin' missing). Below i ...

What steps should I take to ensure that this countdown is continuously updating every second?

I created a function that's functioning properly, but I'm looking to update the message every second. Previously, I attempted using setInterval(countdownTimer(), 1000), however, it was unsuccessful. Below is my code snippet! let x = await msg.c ...

"Error alert: The specified property 'Iscontains' cannot be read because it is undefined" appears in the script for this video

I am currently utilizing AJAX to interact with my backend code. I retrieve URLs from the database and then render them onto the DOM, displaying videos accordingly. However, I am encountering an issue where Uncaught TypeError: Cannot read property ' ...

The declaration file for module 'react-scroll-to-bottom' appears to be missing

I recently added react-scroll-to-bottom to my project and it is listed in my dependencies. However, I am encountering the following error: Could not find a declaration file for module 'react-scroll-to-bottom'. The path 'c:/Users/J/Desktop/w ...

The backend function of an aspx page is failing to execute when triggered by a $.ajax request

Currently, I am facing an issue with a web form IndexPage.aspx. The script in this front-end code makes an ajax call to a code-behind function. Take a look at the code snippet below: $.ajax({ type: "POST", url: &apos ...

Using `preventDefault()` will also block any text input from being entered

Note: I am looking for a way to clear the text box using the enter key after typing some text. My apologies for any confusion caused. Update 2: The missing event parameter was causing all the issues. I feel like a failure as a programmer. I am trying to ...

Exploring the Depths of React Routing: The Power

I'm currently diving into React and trying to figure out how to create dynamic routes similar to partial pages in Angular. Here is my main App component: import React from 'react'; import Header from '../common/Header'; export d ...

A guide on updating object values within an array using map in React

Is there a method to calculate the total sum of specific values from an array of objects? Example array: const exampleArray = [ {item_id: 1, quantity: "3"}, {item_id: 2, quantity: "5"}, {item_id: 3, quantity: "2"} ] In this case, I want to add up the qua ...

Change the local date and time to UTC in the format of yy:mm:dd H:M

I must change the date format from local time to UTC or ISO as yy:mm:dd H:M, or calculate the difference between local date times with 03:30 as yy:mm:dd H:M 2016-10-22T04:30:00.000Z convert this to 2016-10-22T01:00:00.000Z ...

Issue with scroll animation across multiple div elements

I am working on a project where I have two main divs, one with the id of "left-div" and the other with the id of "right-div". In the "left-div", there are multiple nested divs each with their own unique id. The overflow-y property of the "left-div" is set ...